/* ==========================================================================
   Jeydak Business Solution — brand tokens
   "Engineered Assurance": navy authority, gold credential, practice-line
   signals for safety / environment / quality.
   This file defines variables only. No component styles live here.
   ========================================================================== */

:root {
  /* Brand spine ---------------------------------------------------------- */
  --navy-900: #000F2B;
  --navy-800: #011C46;
  --navy-700: #0A2E6B;
  --navy-600: #14418D;
  --navy-300: #8FA0BC;
  --navy-100: #E8ECF4;
  --navy-050: #F3F6FB;

  --gold-700: #9A6F1F;
  --gold-600: #B0812A;
  --gold-500: #C79538;
  --gold-300: #E3BE74;
  --gold-100: #F4E4C4;
  --gold-050: #FBF5EA;

  /* Practice-line signals ------------------------------------------------ */
  --safety: #E07A1F;
  --safety-dark: #A6540F;
  --safety-soft: #FDF1E4;

  --environment: #1E7A5A;
  --environment-dark: #14563F;
  --environment-soft: #E7F3EE;

  --quality: #0E7490;
  --quality-dark: #0A5568;
  --quality-soft: #E4F1F5;

  /* Neutrals ------------------------------------------------------------- */
  --ink: #0B0F19;
  --slate: #3B4657;
  --muted: #6B7688;
  --line: #D9DEE7;
  --line-soft: #E9EDF3;
  --mist: #F5F7FA;
  --paper: #FFFFFF;

  /* Semantic ------------------------------------------------------------- */
  --success: #15803D;
  --success-soft: #E8F5EC;
  --warning: #B45309;
  --warning-soft: #FDF3E7;
  --danger: #B91C1C;
  --danger-soft: #FDECEC;
  --info: #0369A1;
  --info-soft: #E6F1F8;

  /* Applied roles -------------------------------------------------------- */
  --bg: var(--paper);
  --bg-alt: var(--mist);
  --bg-invert: var(--navy-900);
  --surface: var(--paper);
  --surface-raised: var(--paper);
  --text: var(--ink);
  --text-soft: var(--slate);
  --text-mute: var(--muted);
  --text-invert: #FFFFFF;
  --text-invert-soft: #B9C4D8;
  --border: var(--line);
  --border-soft: var(--line-soft);
  --accent: var(--gold-500);
  --accent-text: var(--gold-700);
  --brand: var(--navy-800);

  /* Typography ----------------------------------------------------------- */
  --font-display: 'Sora', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-body: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  --fs-xs: 0.75rem;
  --fs-sm: 0.8125rem;
  --fs-base: 1rem;
  --fs-md: 1.0625rem;
  --fs-lg: clamp(1.125rem, 0.4vw + 1.05rem, 1.25rem);
  --fs-h5: clamp(1.0625rem, 0.3vw + 1rem, 1.1875rem);
  --fs-h4: clamp(1.1875rem, 0.6vw + 1.05rem, 1.4375rem);
  --fs-h3: clamp(1.375rem, 1vw + 1.1rem, 1.75rem);
  --fs-h2: clamp(1.625rem, 1.8vw + 1.15rem, 2.375rem);
  --fs-h1: clamp(2rem, 3.4vw + 1.15rem, 3.5rem);
  --fs-hero: clamp(2.25rem, 4.6vw + 1.1rem, 4.25rem);

  --lh-tight: 1.15;
  --lh-snug: 1.3;
  --lh-base: 1.7;
  --lh-loose: 1.85;

  --tracking-tight: -0.02em;
  --tracking-wide: 0.02em;
  --tracking-eyebrow: 0.16em;

  /* Space ---------------------------------------------------------------- */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 2.5rem;
  --sp-8: 3rem;
  --sp-9: 4rem;
  --sp-10: 5rem;
  --sp-11: 6.5rem;
  --section-y: clamp(3.5rem, 7vw, 7rem);

  /* Layout --------------------------------------------------------------- */
  --container: 1280px;
  --container-wide: 1440px;
  --container-narrow: 820px;
  --gutter: clamp(1rem, 4vw, 2.5rem);

  /* Shape ---------------------------------------------------------------- */
  --radius-sm: 6px;
  --radius: 10px;
  --radius-lg: 14px;
  --radius-xl: 20px;
  --radius-pill: 999px;

  /* Elevation ------------------------------------------------------------ */
  --shadow-sm: 0 1px 2px rgba(1, 28, 70, 0.06);
  --shadow: 0 4px 16px rgba(1, 28, 70, 0.07);
  --shadow-lg: 0 18px 44px rgba(1, 28, 70, 0.12);
  --shadow-gold: 0 10px 30px rgba(199, 149, 56, 0.22);

  /* Motion --------------------------------------------------------------- */
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 160ms;
  --dur: 260ms;
  --dur-slow: 420ms;

  /* Chrome --------------------------------------------------------------- */
  --header-h: 76px;
  --topbar-h: 38px;
  --z-header: 900;
  --z-mega: 890;
  --z-overlay: 950;
  --z-modal: 1000;
  --z-toast: 1100;

  /* Signature grid motif ------------------------------------------------- */
  --grid-line: rgba(199, 149, 56, 0.08);
  --grid-size: 44px;
}

/* Dark mode ---------------------------------------------------------------
   Designed, not filtered: navy base, gold-300 accents, lifted surfaces.     */
:root[data-theme="dark"] {
  --bg: #04122E;
  --bg-alt: #061a3d;
  --bg-invert: #000B20;
  --surface: #0A2148;
  --surface-raised: #0D2954;
  --text: #F2F5FA;
  --text-soft: #C2CDE0;
  --text-mute: #8FA0BC;
  --text-invert: #041027;
  --text-invert-soft: #33456A;
  --border: #1B3765;
  --border-soft: #14294D;
  --accent: var(--gold-300);
  --accent-text: var(--gold-300);
  --brand: #F2F5FA;

  --mist: #061a3d;
  --paper: #0A2148;
  --navy-100: #12305C;
  --navy-050: #0D2954;
  --gold-050: rgba(199, 149, 56, 0.10);
  --safety-soft: rgba(224, 122, 31, 0.14);
  --environment-soft: rgba(30, 122, 90, 0.16);
  --quality-soft: rgba(14, 116, 144, 0.16);
  --success-soft: rgba(21, 128, 61, 0.16);
  --warning-soft: rgba(180, 83, 9, 0.16);
  --danger-soft: rgba(185, 28, 28, 0.16);
  --info-soft: rgba(3, 105, 161, 0.16);

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow: 0 4px 16px rgba(0, 0, 0, 0.42);
  --shadow-lg: 0 18px 44px rgba(0, 0, 0, 0.5);
  --grid-line: rgba(227, 190, 116, 0.09);
}

/* Practice-line theming: set data-practice on any container ---------------- */
[data-practice]               { --practice: var(--gold-500);    --practice-dark: var(--gold-700);         --practice-soft: var(--gold-050); }
[data-practice="safety"]      { --practice: var(--safety);      --practice-dark: var(--safety-dark);      --practice-soft: var(--safety-soft); }
[data-practice="environment"] { --practice: var(--environment); --practice-dark: var(--environment-dark); --practice-soft: var(--environment-soft); }
[data-practice="quality"]     { --practice: var(--quality);     --practice-dark: var(--quality-dark);     --practice-soft: var(--quality-soft); }