/* SMT design tokens. Single source of truth for the whole theme. */

:root{
  /* ---- brand ---- */
  --smt-blue-900:#0B3A61;
  --smt-blue-700:#14568C;
  --smt-blue-500:#1A6FB5;
  --smt-blue-300:#7FB2D9;
  --smt-blue-100:#D6E7F4;
  --smt-blue-50:#EAF2F9;

  --smt-green-700:#2E7D28;
  --smt-green-500:#3FA535;
  --smt-green-300:#8ACB84;
  --smt-green-50:#ECF7EB;

  /* ---- neutrals ---- */
  --smt-navy-900:#071A2B;
  --smt-navy-800:#0E2A42;
  --smt-navy-700:#16405F;
  --smt-ink:#344054;
  --smt-ink-muted:#5A6B85;
  --smt-border:#DCE6ED;
  --smt-border-strong:#BFD1DE;
  --smt-bg:#F5F9FC;
  --smt-white:#FFFFFF;

  /* ---- status ---- */
  --smt-success:#2E7D28;
  --smt-warning:#B45309;
  --smt-error:#B42318;
  --smt-error-bg:#FEF3F2;

  /* ---- semantic aliases: components use ONLY these ---- */
  --c-text:var(--smt-ink);
  --c-text-muted:var(--smt-ink-muted);
  --c-heading:var(--smt-navy-900);
  --c-link:var(--smt-blue-700);
  --c-link-hover:var(--smt-blue-900);
  --c-surface:var(--smt-white);
  --c-surface-alt:var(--smt-bg);
  --c-border:var(--smt-border);
  --c-accent:var(--smt-blue-500);
  --c-accent-2:var(--smt-green-500);
  --c-focus:#0B3A61;

  /* ---- gradients ---- */
  --grad-brand:linear-gradient(135deg,#1A6FB5 0%,#3FA535 100%);
  --grad-brand-soft:linear-gradient(135deg,#EAF2F9 0%,#ECF7EB 100%);
  --grad-dark:linear-gradient(160deg,#071A2B 0%,#14405F 100%);

  /* ---- type ---- */
  --f-display:'Sora',system-ui,sans-serif;
  --f-body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;

  --t-xs:clamp(.75rem,.73rem + .1vw,.8125rem);
  --t-sm:clamp(.875rem,.85rem + .12vw,.9375rem);
  --t-base:clamp(1rem,.96rem + .2vw,1.0625rem);
  --t-lg:clamp(1.125rem,1.06rem + .3vw,1.25rem);
  --t-xl:clamp(1.375rem,1.25rem + .55vw,1.625rem);
  --t-2xl:clamp(1.625rem,1.4rem + .95vw,2.125rem);
  --t-3xl:clamp(2rem,1.65rem + 1.5vw,2.875rem);
  --t-4xl:clamp(2.375rem,1.8rem + 2.5vw,3.75rem);
  --t-5xl:clamp(2.75rem,1.9rem + 3.6vw,4.5rem);

  --lh-tight:1.12;
  --lh-snug:1.25;
  --lh-normal:1.65;
  --ls-tight:-.02em;
  --ls-wide:.08em;

  /* ---- space ---- */
  --s-1:.25rem; --s-2:.5rem;  --s-3:.75rem; --s-4:1rem;
  --s-5:1.5rem; --s-6:2rem;   --s-7:2.5rem; --s-8:3rem;
  --s-9:4rem;   --s-10:5rem;  --s-11:6rem;  --s-12:8rem;

  --section-y:clamp(3.5rem,2rem + 6vw,7rem);
  --gutter:clamp(1rem,4vw,2.5rem);
  --w-narrow:720px;
  --w-default:1200px;
  --w-wide:1440px;

  /* ---- shape ---- */
  --r-sm:6px; --r-md:12px; --r-lg:20px; --r-xl:28px; --r-pill:999px;

  --sh-1:0 1px 2px rgba(7,26,43,.06);
  --sh-2:0 4px 12px rgba(7,26,43,.08);
  --sh-3:0 12px 32px rgba(7,26,43,.10);
  --sh-4:0 24px 64px rgba(7,26,43,.14);
  --sh-focus:0 0 0 3px rgba(26,111,181,.35);

  /* ---- motion ---- */
  --dur-fast:150ms;
  --dur-base:240ms;
  --dur-slow:420ms;
  --ease-out:cubic-bezier(.2,.8,.2,1);
  --ease-spring:cubic-bezier(.34,1.4,.64,1);

  /* ---- chrome ---- */
  --header-h:76px;
  --z-header:100;
  --z-mega:110;
  --z-overlay:120;
  --z-drawer:130;
}

/* Dark bands. Any component dropped inside inherits the right colours. */
.smt-dark{
  --c-text:#C7D6E4;
  --c-text-muted:#9DB2C6;
  --c-heading:#FFFFFF;
  --c-link:#7FB2D9;
  --c-link-hover:#FFFFFF;
  --c-surface:var(--smt-navy-800);
  --c-surface-alt:var(--smt-navy-900);
  --c-border:rgba(255,255,255,.12);
  --c-focus:#FFFFFF;
  background:var(--grad-dark);
  color:var(--c-text);
}
