/* ===========================================================================
   tokens.css — alle farger, fonter, radier, skygger og avstander.

   Designpakke v1 (brand/designpakke-v1/, regler i brand/02-designvurdering.md).
   Ingen andre filer skal ha hardkodede farger. Unntak: de frittstående SVG-filene
   (logo, symbol, merke, favicon) og site.webmanifest kan ikke lese CSS-variabler
   og har palettens HEX-verdier skrevet inn.

   Paletten, nøyaktige verdier:
     Skoggrønn #1F3A34 · Mosegrønn #5F746B · Lys salvie #A7B8A7 · Steinbeige #CBBFAF
     Varm off-white #F4F1EA · Kullsort #1A1A1A · (hvit #FFFFFF i tabeller og dokumentflater)
     Status: Må #B58B35 (rav) · Bør #7B817C (grå) · I orden #4F7A62 (grønn)
   Lyse flater og hover-farger er blandinger av paletten (oppgitt ved hver verdi).
   Ingen andre kulører. Ingen rødt noe sted.

   Kontrastgrenser (brand/02):
     - Brødtekst i kullsort. Sekundærtekst minst 4,5:1 mot alle flater.
     - Mosegrønn aldri som tekst under 18 px (4,4:1). Her brukes den ikke som tekst.
     - Salvie, steinbeige og statusfargene aldri som tekstfarge, bare flate, linje,
       strek eller prikk. Status bæres alltid av ordet; fargen er støtte.
   =========================================================================== */

@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/inter-latin.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif 4";
  src: url("/assets/fonts/source-serif-4-latin.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* --- Farger ------------------------------------------------------------ */
  --color-primary: #1F3A34;          /* skoggrønn: logo, overskrifter, knapper, mørke flater */
  --color-primary-hover: #1D2E2A;    /* 62 % skoggrønn + 38 % kullsort */
  --color-primary-tint: #DEE1D7;     /* 28 % salvie + off-white: hover og valgt tilstand */
  --color-on-primary: #F4F1EA;       /* off-white på skoggrønn, 10,9:1 */
  --color-on-primary-muted: #B8BEB7; /* 72 % off-white + skoggrønn, 6,5:1 på skoggrønn */

  --color-bg: #F4F1EA;               /* varm off-white, hovedbakgrunn */
  --color-bg-light: #FAF8F4;         /* 50 % off-white + hvit: toppen */
  --color-paper: #FFFFFF;            /* rapportkort, tabeller, skjema */
  --color-surface: #E8E2D8;          /* 30 % steinbeige + off-white: bånd og bokser */
  --color-surface-strong: #DDD6CA;   /* 55 % steinbeige + off-white */

  --color-ink: #1A1A1A;              /* kullsort: brødtekst og tabeller */
  --color-ink-muted: #4C5B54;        /* 72 % mosegrønn + kullsort: sekundærtekst, 5,0:1 eller mer */
  --color-line: #DBD2C5;             /* 62 % steinbeige + off-white: hårlinjer */
  --color-line-strong: #90968A;      /* 45 % steinbeige + mosegrønn: dekorative linjer */
  --color-stone: #CBBFAF;            /* steinbeige: linjen under tabellhoder, varme flater */
  --color-border-input: #5F746B;     /* mosegrønn: kant på skjemafelt, 5,0:1 mot hvitt */

  --color-accent: #4F7A62;           /* «I orden»-grønn: bekreftelser, brukes sparsomt */
  --color-highlight: #A7B8A7;        /* lys salvie: aksentstrek, aldri tekst */
  --color-focus: #1F3A34;

  /* Status (produkt/08): strek eller prikk i statusfargen + ordet i kullsort */
  --status-bar: 0.35rem;
  --status-must-line: #B58B35;       /* Må: rav */
  --status-should-line: #7B817C;     /* Bør: grå */
  --status-ok-line: #4F7A62;         /* I orden: grønn */
  --status-must-ink: #1A1A1A;        /* ordet står alltid i kullsort */
  --status-should-ink: #1A1A1A;
  --status-ok-ink: #1A1A1A;
  --status-must-bg: #F2EFEB;         /* 25 % steinbeige + hvit: feilboks og banner, med rav strek */
  --status-should-bg: #F2EFEB;
  --status-ok-bg: #E9EDE9;           /* 25 % salvie + hvit */

  /* Kravtype (produkt/12): holdes nøytrale, skilles med tekst og kant */
  --krav-law-bg: #E6EBE6;            /* lovkrav: 28 % salvie + hvit */
  --krav-law-ink: #1F3A34;
  --krav-ins-bg: #EAE5DF;            /* forsikringskrav: 40 % steinbeige + hvit */
  --krav-ins-ink: #1A1A1A;
  --krav-norm-bg: transparent;       /* bransjenorm: stiplet kant */
  --krav-norm-ink: #1A1A1A;
  --krav-line: #90968A;

  /* Plassholdere [[…]]: stiplet kant og skrivemaskinskrift, aldri rødt */
  --ph-bg: #EDF1ED;                  /* 20 % salvie + hvit */
  --ph-line: #5F746B;                /* mosegrønn */
  --ph-ink: #1F3A34;
  --ph-bg-dark: #3D544D;             /* 14 % off-white + skoggrønn, på mørk bunn */
  --ph-line-dark: #A7B8A7;
  --ph-ink-dark: #F4F1EA;

  /* --- Typografi (web: Source Serif 4 + Inter, selvhostet) ---------------- */
  --font-sans: "Inter", Arial, "Helvetica Neue", system-ui, sans-serif;
  --font-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --fs-xs: 0.8125rem;                /* 13px kildelinjer og etiketter */
  --fs-s: 0.9375rem;                 /* 15px */
  --fs-table: 0.9375rem;             /* 15px tabeller mobil, 16px desktop */
  --fs-base: 1.0625rem;              /* 17px brødtekst mobil */
  --fs-m: 1.1875rem;                 /* 19px ingress */
  --fs-l: 1.375rem;
  --fs-h3: 1.25rem;
  --fs-h2: clamp(1.625rem, 1.2rem + 1.6vw, 2.25rem);
  --fs-h2-article: clamp(1.4375rem, 1.2rem + 0.9vw, 1.875rem); /* 23–30px, overskriftene i artiklene */
  --fs-h1: clamp(2.25rem, 1.7rem + 2.2vw, 3.5rem);     /* 36–56px */
  --fs-display: clamp(2.25rem, 1.45rem + 3.3vw, 4rem); /* 36–64px, forsidens «Styrets egen controller» */
  --fs-figure: clamp(2.25rem, 1.6rem + 2.6vw, 3.5rem);

  --lh-tight: 1.12;
  --lh-snug: 1.3;
  --lh-body: 1.6;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-heading: 400;                 /* Source Serif 4 i vekt 400, som i manualen */

  --tracking-caps: 0.1em;

  /* --- Avstander ---------------------------------------------------------- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --section-y: clamp(3.5rem, 2.5rem + 4vw, 6.5rem);
  --gutter: clamp(1rem, 0.6rem + 1.8vw, 3rem);

  --container: 90rem;                /* 1440px: innhold 1344px på 1440, som i v1.1 */
  --measure: 40rem;                  /* lesebredde */
  --measure-wide: 48rem;
  --measure-table: 64rem;            /* brede tabeller i artiklene */

  /* --- Form -------------------------------------------------------------- */
  --radius-s: 2px;
  --radius-m: 2px;
  --radius-pill: 999px;
  --border-w: 1px;
  --border-w-strong: 2px;

  --shadow-paper: 0 1px 2px rgba(26, 26, 26, 0.04), 0 14px 36px -18px rgba(26, 26, 26, 0.2);
  --shadow-raised: 0 1px 2px rgba(26, 26, 26, 0.06), 0 16px 40px -18px rgba(26, 26, 26, 0.26);
  --shadow-menu: 0 18px 40px -20px rgba(26, 26, 26, 0.32);

  --focus-ring: 0 0 0 3px var(--color-bg), 0 0 0 5px var(--color-focus);
  --transition: 150ms ease;

  --header-h: 4.5rem;
  --logo-h: 1.75rem;                 /* høyden på logoen i toppen (rutene) */
}

@media (min-width: 48rem) {
  :root {
    --fs-base: 1.125rem;             /* 18px desktop */
    --fs-m: 1.25rem;
    --fs-table: 1rem;                /* 16px */
    --logo-h: 2rem;
  }
}