/* ==========================================================================
   VOYZ — Design tokens
   Committed palette: deep ink-navy authority + warm saffron "departure" accent
   + refined cool neutrals. Warmth is carried by the accent, marks and imagery,
   never by a tinted body background.
   Legacy --voyz-* names are kept as aliases (repointed) so the whole site
   re-skins from this one file.
   ========================================================================== */
:root {
  /* --- Brand: trust blue (identity preserved, refined) --- */
  --brand:        #0b57a4;
  --brand-600:    #0a4c90;   /* hover / pressed */
  --brand-700:    #0d3f74;
  --brand-bright: #2f86da;   /* accents on dark surfaces */
  --brand-050:    #eaf2fb;   /* soft chip / tint */
  --brand-100:    #d8e8f8;

  /* --- Signature accent: cyan-teal "altitude" ---
     Replaces the former saffron. Cool, high-altitude, modern; separates
     cleanly from the navy brand blue without warming the palette. */
  --accent:       #12b8cc;   /* fills, marks, the departure scene — 7.7:1 on ink-950 */
  --accent-600:   #0d94a6;   /* hover fills, stronger */
  --accent-700:   #0a7684;   /* pressed */
  --accent-ink:   #0a6270;   /* accent-COLOURED TEXT on light — 7.4:1 on white */
  --accent-050:   #e8f8fb;   /* soft accent wash */
  --accent-100:   #c5eef4;
  --on-accent:    #04252b;   /* text on an accent fill — 6.9:1 */

  /* --- Ink & neutrals (cool, faint brand tint) --- */
  --ink:          #101f30;   /* primary text ~13:1 on white */
  --ink-2:        #33455a;   /* strong secondary */
  --muted:        #51617a;   /* muted text — AA on white (>=4.5:1) */
  --bg:           #ffffff;   /* content surface */
  --surface:      #ffffff;
  --surface-2:    #f3f6fa;   /* alt sections / panels (cool) */
  --surface-3:    #e9eff5;
  --line:         #d7dfe8;   /* borders */
  --line-strong:  #c1ccd9;

  /* --- Dark surfaces (footer, sidebar, dark sections) --- */
  --ink-950:      #0a1524;
  --ink-900:      #0f2740;
  --ink-800:      #163654;
  --on-dark:      #f2f6fb;   /* primary text on dark */
  --on-dark-mut:  #a6bad2;   /* secondary text on dark (>=4.5:1 on ink-950) */
  --line-dark:    #274056;

  /* --- Semantic states (AA on white) --- */
  --success:      #0f7a54;  --success-050:#e7f5ee;
  --warning:      #8a5a06;  --warning-050:#fbf1dc;
  --danger:       #b3322c;  --danger-050: #fbecea;
  --info:         var(--brand);

  /* --- Typography ---
     One family, committed weight contrast: light at display sizes, semibold at
     label sizes. Archivo is a grotesque with true tabular figures — this product
     is numerals (prices, dates, durations, seats) on every surface.
     Arabic keeps IBM Plex Sans Arabic: a functional bilingual requirement. */
  --font-display: "Archivo", "IBM Plex Sans Arabic", system-ui, sans-serif;
  --font-sans:    "Archivo", "IBM Plex Sans Arabic", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --font-ar:      "IBM Plex Sans Arabic", "Archivo", system-ui, sans-serif;

  /* Weight roles. Display text runs light; anything small runs semibold so it
     stays legible. Never use --fw-display below 1.5rem. */
  --fw-display:   300;
  --fw-heading:   400;
  --fw-body:      400;
  --fw-medium:    500;
  --fw-label:     600;
  --fw-strong:    700;

  /* fluid display scale (brand surfaces only — product UI uses fixed rem) */
  --step-hero:  clamp(2.75rem, 1.6rem + 4.6vw, 5.25rem);
  --step-h1:    clamp(2.15rem, 1.5rem + 2.7vw, 3.5rem);
  --step-h2:    clamp(1.85rem, 1.35rem + 2.1vw, 3rem);
  --step-h3:    clamp(1.2rem, 1.06rem + 0.6vw, 1.5rem);

  /* Optical tracking. Light weights at display size need less negative
     tracking than bold ones; floor is -0.04em (letters touch below that). */
  --track-hero:   -0.028em;
  --track-h2:     -0.022em;
  --track-h3:     -0.012em;
  --track-label:   0.02em;

  /* --- Radii ---
     Softer geometry throughout: the smallest step is now 10px, so nothing
     reads as a sharp rectangle beside the rounded surfaces around it. */
  --r-xs: 10px;
  --r-sm: 12px;
  --r:    16px;
  --r-lg: 22px;
  --r-xl: 30px;
  --r-full: 999px;

  /* --- Elevation ---
     Diffuse and layered rather than a single hard drop: a wide soft ambient
     plus a tight contact shadow, which is what reads as "floating" instead
     of "outlined". Tinted with the ink hue, never neutral black. */
  --sh-xs: 0 1px 2px rgba(16,31,48,.05), 0 0 0 .5px rgba(16,31,48,.03);
  --sh-sm: 0 4px 12px -3px rgba(16,31,48,.09), 0 1px 3px rgba(16,31,48,.05);
  --sh-md: 0 14px 34px -14px rgba(16,31,48,.20), 0 3px 8px -2px rgba(16,31,48,.07);
  --sh-lg: 0 32px 70px -28px rgba(11,45,80,.32), 0 8px 24px -12px rgba(16,31,48,.12);
  --sh-inset: inset 0 1px 0 rgba(255,255,255,.85);
  --sh-accent: 0 12px 30px -10px rgba(18,184,204,.45);

  /* --- Spacing rhythm (4/8 based) --- */
  --sp-1:.25rem; --sp-2:.5rem; --sp-3:.75rem; --sp-4:1rem; --sp-5:1.5rem;
  --sp-6:2rem;   --sp-8:3rem;  --sp-10:4rem;  --sp-12:5.5rem; --sp-16:7rem;

  /* --- Motion ---
     iOS curves. --ease-ios is the curve UIKit uses for sheets and the
     segmented-control thumb: a long, flat deceleration with no overshoot.
     That "settles into place" quality is what reads as smooth on iOS —
     springy bounce reads as toy-like, so nothing here overshoots. */
  --ease-ios:      cubic-bezier(.32,.72,0,1);    /* travel: slides, thumbs, sheets */
  --ease-ios-soft: cubic-bezier(.4,.8,.2,1);     /* colour and opacity crossfades */
  --ease-ios-tap:  cubic-bezier(.25,.46,.45,.94);/* press / release */
  --ease-out: cubic-bezier(.22,.61,.36,1);       /* ease-out-quart-ish */
  --ease-out-expo: cubic-bezier(.16,1,.3,1);
  /* iOS timings: taps ~120ms, control travel ~340ms, sheets ~500ms. */
  --dur-tap: .12s;
  --dur-1: .16s; --dur-2: .24s; --dur-3: .34s; --dur-4: .5s;

  /* --- z-index scale --- */
  /* A backdrop dims what is behind the surface it belongs to, so it must sit
     BELOW that surface. Previously backdrop (1050) outranked drawer (1040)
     and the scrim painted over the open sidebar, dimming the menu itself. */
  --z-base:1; --z-dropdown:1000; --z-sticky:1020; --z-backdrop:1030;
  --z-drawer:1040; --z-modal:1060; --z-toast:1080; --z-tooltip:1090;

  --container: 1200px;

  /* ======================================================================
     LEGACY ALIASES — repointed to the new system (whole-site reskin)
     ====================================================================== */
  --voyz-navy-950: var(--ink-950);
  --voyz-navy-900: var(--ink-900);
  --voyz-navy-800: var(--ink-800);
  --voyz-blue-700: var(--brand);
  --voyz-blue-500: var(--brand-bright);
  --voyz-sky-100:  var(--brand-050);
  --voyz-ice-50:   var(--surface-2);
  --voyz-ice-100:  var(--surface-3);
  --voyz-white:    #ffffff;
  --voyz-ink:      var(--ink);
  --voyz-muted:    var(--muted);
  --voyz-line:     var(--line);
  --voyz-success:  var(--success);
  --voyz-warning:  var(--warning);
  --voyz-danger:   var(--danger);
}