/* Prime Beton design system (tokens.json v1) applied to the plant's system.
   Monochrome like the logo: black/white/concrete, one rebar-orange signal, hairlines instead of shadows, square geometry.
   Manrope for text, Unbounded (wide, like the wordmark) for the name and headline figures only.
   Token names --azurite* are kept so older sheets keep working; they now carry the brand black (light) / white (dark). */
:root{
  --surface-100:#f1f2f3; --surface-200:#ffffff; --ink:#0f1012; --ink-muted:#565b61; --line:#d4d7da; --line-strong:#80858b;
  --azurite:#0f1012; --azurite-deep:#2a2d31; --azurite-tint:#e4e6e8; --on-azurite:#ffffff; --concrete:#9aa0a6;
  --rebar:#c2410c;
  --success:#1f7a4a; --warning:#8a5300; --danger:#b42318;
  --space-1:4px; --space-2:8px; --space-4:16px; --space-8:32px;
  --radius-sm:2px; --radius-md:4px; --radius-lg:6px;
  --hover-fill:#2a2d31; --on-hover-fill:#ffffff; --hero:#0f1012; --on-hero:#ffffff;
  --f-body:Manrope,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --f-display:Unbounded,"Arial Black",system-ui,sans-serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --surface-100:#0e0f11; --surface-200:#17191c; --ink:#eceef0; --ink-muted:#9aa0a7; --line:#2a2d31; --line-strong:#6f757c;
    --azurite:#f2f3f4; --azurite-deep:#c9ccd0; --azurite-tint:#24272b; --on-azurite:#0e0f11; --concrete:#5b6168;
    --rebar:#ff8a4c; --success:#5cc48a; --warning:#e0a43a; --danger:#f07a6e;
    --hover-fill:#c9ccd0; --on-hover-fill:#0e0f11; --hero:#24272b; color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --surface-100:#0e0f11; --surface-200:#17191c; --ink:#eceef0; --ink-muted:#9aa0a7; --line:#2a2d31; --line-strong:#6f757c;
  --azurite:#f2f3f4; --azurite-deep:#c9ccd0; --azurite-tint:#24272b; --on-azurite:#0e0f11; --concrete:#5b6168;
  --rebar:#ff8a4c; --success:#5cc48a; --warning:#e0a43a; --danger:#f07a6e;
  --hover-fill:#c9ccd0; --on-hover-fill:#0e0f11; --hero:#24272b; color-scheme:dark;
}
/* legacy names used by the older stylesheets */
:root{
  --bg:var(--surface-100); --surface:var(--surface-200); --field:var(--surface-200);
  --ink2:var(--ink-muted); --muted:var(--ink-muted); --line2:var(--line-strong);
  --brand:var(--azurite); --on-brand:var(--on-azurite); --brand-hover:var(--hover-fill);
  --accent:var(--azurite); --accent-soft:var(--azurite-tint); --on-accent:var(--on-azurite); --focus:var(--azurite);
  --s1:var(--azurite); --s2:var(--ink); --hl:color-mix(in srgb,var(--azurite) 7%,transparent);
  --good:var(--success); --bad:var(--danger); --warn:var(--warning);
  --side:var(--surface-200); --side-ink:var(--ink-muted); --side-dim:var(--ink-muted); --side-hl:var(--azurite-tint); --side-line:var(--line);
  --f-head:var(--f-body); --f-mono:var(--f-body);
  --r:var(--radius-md); --r2:var(--radius-md);
}
*{box-sizing:border-box}
body{margin:0;background:var(--surface-100);color:var(--ink);font:400 14px/20px var(--f-body);-webkit-font-smoothing:antialiased}
h1,h2,h3,p{margin:0}
h1,h2,h3{text-wrap:balance}
a{color:inherit}
.wrap{max-width:1180px;margin-inline:auto;padding-inline:20px}
.mono{font-variant-numeric:tabular-nums}
.eyebrow{font:600 12px/16px var(--f-body);color:var(--ink-muted)}
:focus-visible{outline:2px solid var(--azurite);outline-offset:2px;border-radius:var(--radius-sm)}
