/* ============================================================
   XIMEX OVERSEAS — Design Tokens
   Palette concept: "Night Freight" — a single committed dark
   world (not a light site with dark bands) lit end to end by
   Jodhpur blue. Blue is now the only accent — used on text,
   icons and controls the way gold once was, and still doubling
   as the atmospheric glow at section edges and component hovers.
   Rectilinear cargo language (cards/buttons) vs. circular seal
   language (badges, certifications, brand mark) still holds.
   ============================================================ */
:root{
  /* --- Brand: Black — the permanent canvas, not a theme variant.
     Pushed closer to true black so surfaces read as genuinely dark,
     not charcoal. --- */
  --black-950:#030304;
  --black-900:#08090b;
  --black-800:#101216;
  --black-700:#191b20;
  --black-600:#23262d;
  --black-500:#2e323b;

  /* --- Brand: Jodhpur Blue (fixed) — the only functional accent,
     used on text/icons/controls (former gold role) and as the
     atmospheric glow at section edges and component hovers. --- */
  --jodhpur-700:#2c6496;
  --jodhpur-600:#3684ca;
  --jodhpur-500:#6ba7db;
  --jodhpur-400:#92bfe8;
  --jodhpur-300:#b2d3f0;
  --jodhpur-100:rgba(107,167,219,.14);

  --jodhpur:#6ba7db;
  --jodhpur-rgb:107,167,219;

  /* --- Surfaces — one dark world, no theme reactivity --- */
  --paper:#030304;
  --paper-raised:#0d0f13;
  --paper-sunk:#060708;
  --ink:#f5f3ee;
  --slate:#9aa3b8;
  --slate-soft:#6b7385;
  --line: rgba(255,255,255,.10);
  --line-strong: rgba(255,255,255,.20);
  --shadow-color: 212 60% 1%;

  /* --- Sitewide grain — single fixed viewport tile, screen-blended. --- */
  --grain: url('/assets/images/grain.jpg');

  /* --- On-black text — kept as an alias so brand bands (hero,
     footer, CTA) and content sections resolve to the same ink --- */
  --on-black:#f5f3ee;
  --on-black-soft:#9aa3b8;
  --line-on-black: rgba(255,255,255,.10);
  --line-on-black-strong: rgba(255,255,255,.20);

  /* --- Semantic --- */
  --success:#3ab876;
  --warning:#c8862b;
  --error:#e0685c;

  /* --- Type families: one geometric grotesk for display/body/UI,
     a technical mono for specs and data. No serif, no italic —
     the editorial pairing is exactly what read as "magazine". --- */
  --font-display:'Space Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body:'Space Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

  /* --- Type scale --- */
  --fs-h1: clamp(2.5rem, 1.85rem + 2.9vw, 4.375rem);
  --fs-h2: clamp(1.875rem, 1.55rem + 1.5vw, 2.75rem);
  --fs-h3: clamp(1.3125rem, 1.2rem + 0.5vw, 1.625rem);
  --fs-h4: 1.125rem;
  --fs-lead: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem);
  --fs-body: 1rem;
  --fs-sm: 0.9375rem;
  --fs-xs: 0.8125rem;
  --fs-mono: 0.875rem;

  /* --- Spacing (8px base) --- */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px;
  --sp-6:32px; --sp-7:48px; --sp-8:64px; --sp-9:96px;
  --section-pad: clamp(64px, 8vw, 112px);
  --container-w: 1280px;
  --container-pad: clamp(20px, 4.5vw, 48px);

  /* --- Motion --- */
  --ease: cubic-bezier(.22,.68,0,1);
  --dur-fast: .18s;
  --dur-med: .32s;
  --dur-slow: .6s;

  /* --- Elevation — a dark drop shadow alone won't read against a
     dark page, so floating elements pair it with a hairline rim. --- */
  --shadow-float: 0 24px 64px -20px rgba(0,0,0,.7), 0 0 0 1px var(--line-strong);
  --shadow-card: 0 2px 0 hsl(var(--shadow-color) / .05);
}