/* Léo Buso webfonts.
   SUBSTITUTION NOTICE: the source mockups use a light geometric sans (Sofia Pro / Object
   Sans family). No font binaries were provided, so the nearest Google Fonts pairing is
   loaded here: Outfit 300 (display) + DM Sans 400 (text/UI). Replace with real @font-face
   rules + woff2 files in assets/fonts/ when licensed files are available. */
@import url("https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;1,9..40,400&display=swap");

:root{
  /* --- Brand blue, sampled from the Léo Buso logo --- */
  --blue-950:#050F1E;
  --blue-900:#071A31;
  --blue-800:#0C2340;
  --blue-700:#123458;
  --blue-600:#174B8C;
  --blue-500:#1A63C4;
  --blue-400:#3C86DE;
  --blue-300:#7FB2EC;
  --blue-200:#B6D2F5;
  --blue-100:#DDE9F8;
  --blue-50:#EFF5FC;

  /* --- Cream / warm neutrals (carried from the source mockups) --- */
  --cream-50:#FFFCF6;
  --cream-100:#FFFAF1;
  --cream-200:#F8F1E4;
  --cream-300:#EDE4D3;
  --cream-400:#DCD2BE;

  /* --- Champagne gold: accent for elegance. Text on light surfaces uses gold-700 only (AA 4.8:1 on cream) --- */
  --gold-100:#F7EDD2;
  --gold-200:#F1DFA8;
  --gold-300:#E2C27A;
  --gold-400:#D4AF62;
  --gold-500:#C9A24E;
  --gold-600:#A8843A;
  --gold-700:#8C6A2B;

  --ink-900:#0A1526;
  --ink-700:#233248;
  --ink-500:#4C5B71;
  --ink-300:#8593A6;
  --ink-100:#C8D1DC;
  --white:#FFFFFF;

  /* --- Semantic surfaces --- */
  --surface-page:var(--cream-100);
  --surface-raised:var(--cream-50);
  --surface-card:var(--cream-50);
  --surface-inverse:var(--blue-800);
  --surface-inverse-card:#0F2B4D;
  --surface-accent:var(--blue-500);
  --surface-subtle:var(--blue-50);
  --surface-glass:rgba(255,252,246,.10);
  --surface-glass-strong:rgba(10,21,38,.38);

  /* --- Semantic text --- */
  --text-display:var(--blue-800);
  --text-body:var(--ink-700);
  --text-muted:var(--ink-500);
  --text-faint:var(--ink-300);
  --text-on-inverse:var(--cream-100);
  --text-on-inverse-muted:rgba(255,250,241,.72);
  --text-on-accent:var(--white);
  --text-link:var(--blue-500);
  --text-link-hover:var(--blue-700);

  /* --- Borders & lines --- */
  --border-hairline:rgba(10,21,38,.10);
  --border-strong:rgba(10,21,38,.18);
  --border-on-inverse:rgba(255,250,241,.14);
  --border-accent:var(--blue-500);

  /* --- Semantic status --- */
  --status-crisis-bg:var(--blue-500);
  --status-crisis-text:var(--white);
  --status-positive:#2E7D5B;
  --status-warning:#B7791F;
  --status-danger:#A63232;

  /* --- Gradients / washes --- */
  --wash-hero:linear-gradient(180deg,rgba(7,26,49,.72) 0%,rgba(7,26,49,.18) 42%,rgba(7,26,49,.80) 100%); /* @kind color */
  --wash-protect-top:linear-gradient(180deg,rgba(7,26,49,.65),rgba(7,26,49,0)); /* @kind color */
  --wash-protect-bottom:linear-gradient(0deg,rgba(7,26,49,.78),rgba(7,26,49,0)); /* @kind color */
  --wash-brand:linear-gradient(135deg,var(--blue-800) 0%,var(--blue-500) 100%); /* @kind color */
  --wash-cta:radial-gradient(120% 140% at 20% 20%,var(--blue-600) 0%,var(--blue-800) 55%,var(--blue-950) 100%); /* @kind color */
  --wash-gold:linear-gradient(120deg,var(--gold-200) 0%,var(--gold-400) 45%,var(--gold-600) 100%); /* @kind color */
  --wash-gold-line:linear-gradient(90deg,transparent,var(--gold-400),transparent); /* @kind color */
  --wash-deep:radial-gradient(90% 120% at 85% 20%,#0E3A7A 0%,var(--blue-900) 45%,var(--blue-950) 100%); /* @kind color */
  --wash-glow:radial-gradient(closest-side,rgba(60,134,222,.45),rgba(26,99,196,0)); /* @kind color */
  --border-gold:rgba(212,175,98,.38);
  --logo-gradient:linear-gradient(120deg,#071A31 0%,#1A63C4 65%,#0C2340 100%); /* @kind color */
}

:root{
  --font-display:"Outfit","Sofia Pro",system-ui,sans-serif;
  --font-text:"DM Sans","Sofia Pro",system-ui,sans-serif;
  --font-wordmark:"Outfit",system-ui,sans-serif;

  /* Display is set at 300; body copy at 400 */
  --weight-light:300; /* @kind font */
  --weight-regular:400; /* @kind font */
  --weight-medium:500; /* @kind font */
  --weight-display:300; /* @kind font */
  --weight-body:400; /* @kind font */

  /* Display — headlines set light, tight, with generous optical size */
  --size-display-1:76px; --lh-display-1:1.02; /* @kind font */ --ls-display-1:-.02em; /* @kind font */
  --size-display-2:56px; --lh-display-2:1.06; /* @kind font */ --ls-display-2:-.018em; /* @kind font */
  --size-h1:44px;        --lh-h1:1.12; /* @kind font */        --ls-h1:-.015em; /* @kind font */
  --size-h2:34px;        --lh-h2:1.18; /* @kind font */        --ls-h2:-.012em; /* @kind font */
  --size-h3:24px;        --lh-h3:1.25; /* @kind font */        --ls-h3:-.008em; /* @kind font */
  --size-h4:19px;        --lh-h4:1.35; /* @kind font */        --ls-h4:-.004em; /* @kind font */

  /* Text */
  --size-body-lg:18px;   --lh-body-lg:1.55; /* @kind font */
  --size-body:15px;      --lh-body:1.6; /* @kind font */
  --size-body-sm:13.5px; --lh-body-sm:1.55; /* @kind font */
  --size-caption:12px;   --lh-caption:1.45; /* @kind font */

  /* Eyebrow / chip label — always uppercase, wide tracking */
  --size-eyebrow:11px;   --ls-eyebrow:.14em; /* @kind font */
  --ls-wordmark:.18em; /* @kind font */

  --size-stat:52px;      --lh-stat:1; /* @kind font */         --ls-stat:-.02em; /* @kind font */
}

:root{
  --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;
  --space-32:128px;--space-40:160px;

  --section-y:112px;
  --section-y-compact:72px;
  --container-max:1280px;
  --container-pad:40px;
  --container-pad-sm:20px;
  --grid-gap:24px;
  --stack-gap:16px;
}

:root{
  --radius-xs:6px;
  --radius-sm:10px;
  --radius-md:14px;
  --radius-lg:20px;
  --radius-xl:28px;
  --radius-pill:999px;
  --radius-card:16px;
  --radius-media:12px;
  --border-width:1px;
}

:root{
  --shadow-none:none;
  --shadow-hairline:0 0 0 1px var(--border-hairline);
  --shadow-sm:0 1px 2px rgba(10,21,38,.05);
  --shadow-card:0 1px 3px rgba(10,21,38,.05),0 12px 28px -18px rgba(10,21,38,.18);
  --shadow-float:0 18px 48px -24px rgba(10,21,38,.35);
  --shadow-inset-hairline:inset 0 0 0 1px var(--border-hairline);
  --shadow-inset-on-inverse:inset 0 0 0 1px var(--border-on-inverse);
  --blur-glass:14px; /* @kind other */
  --blur-glass-soft:8px; /* @kind other */
}

:root{
  --ease-standard:cubic-bezier(.22,.61,.36,1); /* @kind other */
  --ease-out-soft:cubic-bezier(.16,.84,.44,1); /* @kind other */
  --ease-in-out-calm:cubic-bezier(.45,.05,.55,.95); /* @kind other */
  --dur-fast:140ms; /* @kind other */
  --dur-base:240ms; /* @kind other */
  --dur-slow:420ms; /* @kind other */
  --dur-reveal:640ms; /* @kind other */
  --press-scale:.985; /* @kind other */
  --hover-lift:-2px; /* @kind other */
}

*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--surface-page);color:var(--text-body);font-family:var(--font-text);font-size:var(--size-body);line-height:var(--lh-body);font-weight:var(--weight-body);-webkit-font-smoothing:antialiased;text-wrap:pretty}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:var(--weight-display);color:var(--text-display);margin:0}
h1{font-size:var(--size-h1);line-height:var(--lh-h1);letter-spacing:var(--ls-h1)}
h2{font-size:var(--size-h2);line-height:var(--lh-h2);letter-spacing:var(--ls-h2)}
h3{font-size:var(--size-h3);line-height:var(--lh-h3);letter-spacing:var(--ls-h3)}
h4{font-size:var(--size-h4);line-height:var(--lh-h4);letter-spacing:var(--ls-h4)}
p{margin:0}
a{color:var(--text-link);text-decoration:none;transition:color var(--dur-fast) var(--ease-standard)}
a:hover{color:var(--text-link-hover)}
button{font-family:inherit}
::selection{background:var(--blue-200);color:var(--blue-900)}
