/* Hallmark · pre-emit critique: P4 H4 E4 S4 R4 V4
 * genre: modern-minimal · macrostructure: Long Document
 * design-system: design.md · designed-as-app */
@import url('https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&family=Nunito+Sans:wght@400;500;600;700;800;900&display=swap');
@import url("../tokens.css?v=20261006-round-6");
html,body { overflow-x: clip; }
body { font-family: var(--case-body); color: var(--ink); background: var(--bg); }
h1,h2,h3 { font-family: var(--case-display); font-style: normal; min-width: 0; overflow-wrap: anywhere; }
h1 i, h2 i { font-style: normal !important; color: var(--accent) !important; }
a.cta, a.btn, .links a { white-space: nowrap; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
:focus-visible { outline: 3px solid var(--case-focus); outline-offset: 4px; }
.nav { background: var(--bg); color: var(--ink); border-color: var(--line); backdrop-filter: none; }
.nav .brand, .nav .links { color: var(--ink); }
.nav .logo, .nav a.cta { background: var(--accent); color: var(--case-accent-ink); border-radius: 7px; }
.nav .links a:hover { color: var(--accent); }
.hero { background: var(--soft); color: var(--ink); padding-block: 72px; }
.hero h1 { max-width: 24ch; font-weight: 650; letter-spacing: -.035em; }
.hero p.sub, .tag { color: var(--muted); }
.tag { border-color: var(--line); background: var(--bg); border-radius: 6px; }
.kpi { background: var(--bg); border-color: var(--line); }
.kpi .l { color: var(--muted); }
.imp { background: var(--case-paper-2); color: var(--ink); }
.imp .l { color: var(--muted); }
.kw { background: var(--case-dark); color: var(--case-accent-ink); }
.ctaband { background: var(--accent); color: var(--case-accent-ink); }
.ctaband p, .ctaband h2 { color: var(--case-accent-ink); }
.ctaband .btn { color: var(--accent); background: var(--bg); border-radius: 7px; }
.card .num { background: var(--accent); color: var(--case-accent-ink); }
.step .ic { background: var(--case-paper-2); color: var(--accent); }
footer { background: var(--soft); color: var(--muted); }
@media(max-width:768px) {
  .nav .links { display: flex; gap: 12px; font-size: 12px; }
  .nav .links a:not(.cta) { display: none; }
  .kpis,.profile,.cards,.impact { grid-template-columns: minmax(0,1fr); }
  .hero { padding-block: 48px; }
  .hero h1 { font-size: 34px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } *,*::before,*::after { animation: none !important; transition: none !important; } }