/* ── styles.css ── */
/* Zervo Design System — global entry point.
   Consumers link THIS file. Import order only; no rules live here. */

/* ── tokens/fonts.css ── */
/* Zervo 2.1 — Webfonts. ONE family: Barlow.
   Barlow Condensed 600–800 — display/overskrifter (industriell, «verktøymerke»)
   Barlow 400–700          — brødtekst, UI, tall (tabular)
   Loaded from Google Fonts CDN. For self-hosting: download .woff2 and replace
   this @import with local @font-face rules. */



/* ── styles.css ── */

/* ── tokens/colors.css ── */
/* Zervo 2.0 — Color tokens. LIGHT ONLY — no dark mode exists.
   Zervo-blå #1877F2 (logo/brand), Koral #E8836A (CTA, dark ink on top),
   Bevisgul #F2A616 (stars/proof), warm neutrals. */

:root {
}

/* WCAG AA reference (against #FFFFFF unless noted):
   ink-900 15.5:1 · ink-700 7.5:1 · ink-500 3.5:1 (large only)
   blue-600 5.6:1 (links) · coral-700 5.0:1 · gold-700 5.9:1
   green-700 6.3:1 · red-700 6.1:1 · amber-700 5.6:1
   on-accent: ink-900 on coral-500 ≈ 6.9:1 */

/* ── styles.css ── */

/* ── tokens/typography.css ── */
/* Zervo 2.1 — Typography tokens. ONE family: Barlow.
   Display: Barlow Condensed 700/800 — tung, tett, industriell. Tåler «Slutt å tape jobber».
   Body:    Barlow 400–600 — samme DNA, lesbar, tåler æ/ø/å og lange sammensatte ord.
   Data:    Barlow 600 med tabular-nums — tall, tidsstempler, etiketter. (Ingen monospace.)
   Loaded from Google Fonts CDN (see fonts.css). */

:root {     /* uppercase labels */

  /* ---- Semantic roles ---- */
  --display-family: var(--font-display);   /* @kind other */

  --heading-family: var(--font-display);

  --body-family: var(--font-body);

  --label-family: var(--font-display);
  --eyebrow-family: var(--font-display);
}

/* ── styles.css ── */

/* ── tokens/spacing.css ── */
/* Zervo 2.0 — Spacing, radii, shadows, layout, motion. Light system. */

:root {   /* @kind other */
}

/* ── styles.css ── */

/* ── tokens/base.css ── */
/* Zervo 2.1 — base element styling. Light canvas, dark ink, arbeidsordre-DNA. */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text-body);
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: var(--body-leading);
  font-weight: var(--weight-regular);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5 {
  font-family: var(--font-display);
  color: var(--text-heading);
  font-weight: var(--weight-bold);
  letter-spacing: var(--tracking-tight);
  line-height: var(--leading-snug);
  margin: 0;
  text-wrap: balance;
  hyphens: manual; /* long Norwegian compounds: use ­ deliberately, never auto */
}
h1, h2 { font-weight: 650; line-height: var(--leading-tight); letter-spacing: -0.02em; }

p { margin: 0; text-wrap: pretty; }

a { color: var(--brand-text); text-decoration: none; }
a:hover { color: var(--blue-500); text-decoration: underline; }

::selection { background: var(--blaa-tint); color: var(--blekk); }

:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}

/* ---- Label / eyebrow — condensed caps, quiet ---- */
.zv-eyebrow, .zv-label {
  font-family: var(--font-display);
  font-weight: var(--weight-semibold);
  font-size: var(--text-sm);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--text-muted);
}

/* ---- Zervo-streken — coral rule (section marker) ---- */
.zv-strek { display: none; }
.zv-marker { background: none; }

/* ---- Stempel — the guarantee stamp (arbeidsordre-kultur) ---- */
.zv-stamp {
  /* Garantimerket: 3px grønn topp-linjal, stort tall, to linjer tekst. Ikke rotert, ingen boks. Maks ett per flate. */
  display: inline-flex; align-items: center; gap: 12px;
  padding-top: 10px; border-top: 3px solid var(--success); color: var(--text-heading); background: transparent;
}
.zv-stamp-num { font-family: var(--font-display); font-weight: var(--weight-extrabold); font-size: 48px; line-height: .82; color: var(--success-text); font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.zv-stamp-txt { display: flex; flex-direction: column; gap: 3px; }
.zv-stamp-txt b { font-family: var(--font-display); font-weight: var(--weight-extrabold); font-size: 16px; line-height: 1; letter-spacing: .04em; text-transform: uppercase; color: var(--text-heading); }
.zv-stamp-txt span { font-family: var(--font-body); font-weight: 600; font-size: 13px; line-height: 1.2; color: var(--text-muted); }

/* ---- Specimen-card helpers ---- */
.zv-card-pad { padding: var(--space-6); }
.zv-row { display: flex; gap: var(--space-3); align-items: center; flex-wrap: wrap; }
.zv-col { display: flex; flex-direction: column; gap: var(--space-2); }

/* ── styles.css ── */


/* ── tokens/fonts.css ── */

/* ── tokens/colors.css ── */

/* ── tokens/typography.css ── */

/* ── tokens/spacing.css ── */

/* ── tokens/base.css ── */