/* ── TOKENS ─────────────────────────────────────────────────── */
:root {
  --fh:'Urbanist',system-ui,sans-serif;
  --fb:'DM Sans',system-ui,sans-serif;
  --or:#F47843; --or2:#d95e28; --or-bg:#fff4ee;
  --bl:#36ABE2; --bl-dk:#1f87bf; --bl-dp:#0d3f61; --bl-dpr:#07192a;
  --bl-lt:#e6f5fc; --bl-crd-2:#074f82; --bl-crd-3:#186399;
  --ink:#0e2d45;
  --warm:#F8F6F2; --off:#EEE9E3; --mid:#5a6d7b; --rule:#d4dde4;
  --err:#ff6b6b;
  --ease:cubic-bezier(.4,0,.2,1);
  --r:10px;
}

@media(prefers-color-scheme:dark){
  :root{
    --warm:#0f1d28; --off:#1a2e42; --ink:#e4eef5;
    --mid:#8aafc4; --rule:#1f3850;
    --or-bg:#1c1008; --bl-lt:#081c2c;
  }
  #nav{ background:rgba(15,29,40,.97) !important; }
  .work-card{ border-color:rgba(54,171,226,.2); }
  footer{ background:#050f18; }
  /* cards readable in dark mode */
  .pillar{ background:#1a2e42; }
  .aud-card{ background:#1a2e42; }
  .approach-panel{ background:#1a2e42; }
  /* hero "Clarify" stays cream regardless of color scheme */
  .hh-cr{ color:#F8F6F2 !important; }
  /* form placeholders: more contrast on dark bg */
  .fg input::placeholder,.fg textarea::placeholder{ color:rgba(255,255,255,.4); }
}

/* ── BASE ───────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
img,svg{display:block;max-width:100%}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--fb);font-weight:300;background:var(--warm);color:var(--ink);overflow-x:hidden;line-height:1.6;transition:background .3s,color .3s}
.sz80{font-size:80%;}
.dim80{opacity:.8;}