/* =====================================================================
   London Chauffeur · tokens
   Brand colours are locked (Abdullah, 13 Nov 2026: "I like the dark green,
   we will leave the same colours"): deep green #245C4D, dark green
   surfaces #101A16 / #15231E, soft green #EEF3EF. Font: Manrope.
   Spacing, motion and z-index follow the Flow Level house system (site surface).
   ===================================================================== */

/* Manrope (SIL Open Font License), served from this site. One variable file covers every weight. */
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("/fonts/manrope-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("/fonts/manrope-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* ---------- Brand ---------- */
  --green: #245C4D;          /* the accent: main actions, links, focus */
  --green-hover: #1B483C;
  --green-pressed: #123A2F;
  --night: #101A16;          /* dark surfaces: nav, hero panels, footer */
  --night-2: #15231E;        /* raised dark surface */
  --jet: #0A0A0A;            /* jet black: footer (Abdullah, 13 Nov 2026) */
  --mist: #EEF3EF;           /* soft green ground, used sparingly */
  --paper: #FAFBFA;          /* light page ground */
  --white: #FFFFFF;
  --ink: #0E1512;            /* text on light */

  /* ---------- Roles ---------- */
  --text: var(--ink);
  --text-2: #46534E;         /* secondary text on light (7.6:1 on white) */
  --on-dark: #F4F7F5;        /* text on dark green */
  --on-dark-2: #B7C4BE;      /* secondary text on dark (9:1 on --night) */
  --accent: var(--green);
  --on-accent: var(--white);

  --line: rgba(14, 21, 18, 0.12);
  --line-strong: rgba(14, 21, 18, 0.28);
  --line-on-dark: rgba(255, 255, 255, 0.18);
  --fill: rgba(14, 21, 18, 0.05);
  --fill-hover: rgba(14, 21, 18, 0.08);
  --fill-on-dark: rgba(255, 255, 255, 0.10);
  --soft: #F3F5F4;           /* quiet grey-green card ground in menus */

  /* ---------- Spacing (only these) ---------- */
  --space-1: 4px;   --space-2: 8px;   --space-3: 12px;  --space-4: 16px;
  --space-5: 20px;  --space-6: 24px;  --space-8: 32px;  --space-10: 40px;
  --space-12: 48px; --space-16: 64px; --space-20: 80px; --space-24: 96px;

  /* ---------- Type: Manrope, four weights ---------- */
  --font: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --w-regular: 400; --w-medium: 500; --w-semibold: 600; --w-bold: 700;

  --text-xs: 13px;  --lh-xs: 18px;
  --text-sm: 15px;  --lh-sm: 22px;
  --text-md: 17px;  --lh-md: 28px;
  --text-lg: 20px;  --lh-lg: 28px;
  --text-xl: 28px;  --lh-xl: 34px;
  --text-2xl: clamp(32px, 4vw, 44px); --lh-2xl: 1.1;
  --text-3xl: clamp(40px, 6vw, 64px); --lh-3xl: 1.04;

  /* ---------- Radius (site: 4 / 8 / 12 / 20) ---------- */
  --r-chip: 4px;
  --r-control: 8px;    /* buttons, inputs, nav pills */
  --r-card: 12px;
  --r-panel: 20px;     /* menus, sheets */

  /* ---------- Elevation ---------- */
  --shadow-menu: 0 2px 6px rgba(0, 0, 0, 0.06), 0 32px 64px -16px rgba(0, 0, 0, 0.32);
  --dim: rgba(8, 14, 11, 0.40);

  /* ---------- Motion ---------- */
  --dur-press: 100ms; --dur-fast: 140ms; --dur: 200ms; --dur-slow: 300ms;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  /* ---------- Layout ---------- */
  --wrap: 1240px;
  --gutter: clamp(16px, 4vw, 40px);
  --section-y: clamp(64px, 8vw, 112px);
  --control-h: 48px;
  --control-h-sm: 40px;
  --tap: 44px;

  /* z-index: base 0 · sticky 10 · dropdown 20 · overlay 30 · sheet 40 · toast 50 */
  --z-sticky: 10; --z-dropdown: 20; --z-overlay: 30; --z-sheet: 40; --z-toast: 50;

  --focus-ring: 0 0 0 2px var(--white), 0 0 0 4px var(--green);

  color-scheme: light;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
    scroll-behavior: auto !important;
  }
}
