/* ============================================================
   TRILLIOME — Shared brand tokens
   Authoritative palette + type from brand-guidelines.md
   Used by all homepage directions + the chooser.
   ============================================================ */
/* Self-hosted Montserrat (latin) — no third-party request (faster LCP + GDPR-clean) */
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 300; font-display: swap; src: url('../fonts/montserrat-300.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/montserrat-400.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/montserrat-500.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/montserrat-600.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/montserrat-700.woff2') format('woff2'); }

:root {
  /* --- Primary palette --- */
  --navy:      #2A5173;   /* headers, nav, dark sections, primary text */
  --navy-deep: #1E3C56;   /* deeper navy for large dark fields */
  --navy-700:  #234662;
  --teal:      #4DC0AC;   /* primary precision accent */
  --teal-ink:  #2E8C7B;   /* teal that passes AA on white for text */
  --cyan:      #44C8F5;   /* secondary accent, icons */
  --amber:     #FAA61A;   /* CTAs only, sparingly */
  --amber-ink: #B5740A;   /* amber that passes AA on white for text */
  --charcoal:  #4C4C4E;   /* body text */
  --ink:       #2B2B2D;   /* darker body / display on light */
  --white:     #FFFFFF;

  /* --- Secondary tints (restrained washes) --- */
  --mint:      #CAE7DC;
  --sage:      #C8E9F1;
  --pale-yellow:#FDE8B7;
  --gray-med:  #939597;   /* borders */
  --gray-light:#E6E7E8;   /* dividers */
  --paper:     #F7F8F8;   /* near-white page wash */
  --paper-warm:#F6F7F4;

  /* --- Gradient (subtle accents only) --- */
  --grad: linear-gradient(90deg, #47ADC5 0%, #67C4AB 100%);
  --grad-v: linear-gradient(180deg, #47ADC5 0%, #67C4AB 100%);

  /* --- Type --- */
  --font: 'Montserrat', Arial, Helvetica, sans-serif;

  /* --- Easing --- */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body { margin: 0; font-family: var(--font); color: var(--charcoal); }
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3, h4, h5, p, figure, dl, dd { margin: 0; }
ul { margin: 0; }
button { font-family: inherit; }
::selection { background: var(--teal); color: #fff; }