/*
 * Designtokens for Appgarten, retning «Hentetid» (docs/design/forside/README.md).
 * Alle farger, skrifter og avstander står her og bare her. Resten av CSS-en,
 * også PDF-en, bruker variablene. Ingen mørk modus.
 *
 * Skriftene ligger på vår egen server (fonts/KILDER.txt). Ingenting hentes
 * fra Google Fonts eller andre vertsnavn.
 */
@font-face {
  font-family: "Bricolage Grotesque";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/bricolage-grotesque-latin-600.c5ddd78c6efc.woff2") format("woff2");
}
@font-face {
  font-family: "Bricolage Grotesque";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/bricolage-grotesque-latin-700.1fa451b93711.woff2") format("woff2");
}
@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/source-sans-3-latin-400.27ab01c4cb50.woff2") format("woff2");
}
@font-face {
  font-family: "Source Sans 3";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/source-sans-3-latin-400-italic.410bdda67c60.woff2") format("woff2");
}
@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/source-sans-3-latin-600.9a35cba76eda.woff2") format("woff2");
}
@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/source-sans-3-latin-700.9b13bd3653e3.woff2") format("woff2");
}

:root {
  /* Paletten fra mockupen */
  --farge-marine: #22324A;        /* tekst, logo, rammer */
  --farge-marine-mork: #0F1A2B;   /* hover på lenker */
  --farge-krem: #FBF7F0;          /* bakgrunn */
  --farge-lysbla: #E9EEF5;        /* flater, hylla */
  --farge-honerod: #C03B21;       /* hovedknapp */
  --farge-solgul: #F2C14E;        /* bare aksent og fokus på mørk bunn, aldri status */
  --farge-skifer: #3A4A61;        /* brødtekst */
  --farge-skifer-lys: #4A5870;    /* hjelpetekst */
  --farge-stiplet: #6B778C;       /* bare rammer og ikoner, ikke tekst */
  --farge-linje: #E3E0D8;         /* skillelinjer */
  --farge-linje-sterk: #CFCAC0;   /* skillelinjer, sterkere */
  --farge-hvit: #FFFFFF;

  /* Bruk av paletten */
  --farge-bakgrunn: var(--farge-krem);
  --farge-kort: var(--farge-hvit);
  --farge-flate: var(--farge-lysbla);
  --farge-tekst: var(--farge-marine);
  --farge-brodtekst: var(--farge-skifer);
  --farge-tekst-dempet: var(--farge-skifer-lys);
  --farge-lenke: var(--farge-marine);
  --farge-lenke-hover: var(--farge-marine-mork);
  --farge-knapp: var(--farge-honerod);
  --farge-knapp-tekst: var(--farge-hvit);
  --farge-knapp-sekundaer: var(--farge-marine);
  --farge-fokus: var(--farge-marine);
  --farge-fokus-mork-bunn: var(--farge-solgul);

  /* Statusfarger i rapporten. Alltid med ikon og ord, aldri farge alene.
     Teksten i merket er marine. */
  --status-rod-flate: #F8DDD6;
  --status-rod-ikon: #A8331B;
  --status-gul-flate: #FBEFC8;
  --status-gul-ikon: #8A6200;
  --status-gronn-flate: #DCEFDF;
  --status-gronn-ikon: #2E6B3A;
  --status-gra-flate: #E9EEF5;
  --status-gra-ikon: #6B778C;
  --status-tekst: var(--farge-marine);

  /* Skrift */
  --skrift-overskrift: "Bricolage Grotesque", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --skrift: "Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --skrift-str-mini: 0.8125rem;   /* 13 px, merker og meta */
  --skrift-str-liten: 0.9375rem;  /* 15 px, hjelpetekst */
  --skrift-str: 1.0625rem;        /* 17 px, brødtekst */
  --skrift-str-stor: 1.125rem;    /* 18 px, ingress */
  --skrift-str-h3: 1.375rem;      /* 22 px */
  --skrift-str-h2: 1.625rem;      /* 26 px */
  --skrift-str-h1: 2.125rem;      /* 34 px mobil */
  --skrift-str-h1-stor: 2.75rem;  /* 44 px PC */
  --skrift-str-hero: clamp(2.5rem, 6vw, 4.25rem);       /* 40–68 px, overskriften i hero */
  --skrift-str-seksjon: clamp(2.25rem, 5vw, 3.25rem);   /* 36–52 px, overskrift på seksjon */
  --skrift-str-hero-ingress: 1.3rem;                    /* ca. 21 px */
  --skrift-str-seksjon-ingress: 1.25rem;                /* 20 px */
  --skrift-vekt-overskrift: 700;
  --skrift-vekt-underoverskrift: 600;
  --linjehoyde: 1.55;
  --linjehoyde-overskrift: 1.1;
  --sporing-overskrift: -0.02em;

  /* Avstander og form */
  --rom-1: 0.25rem;   /* 4 px */
  --rom-2: 0.5rem;    /* 8 px */
  --rom-3: 1rem;      /* 16 px */
  --rom-4: 1.5rem;    /* 24 px */
  --rom-5: 2.5rem;    /* 40 px */
  --rom-6: 4rem;      /* 64 px */
  --rom-seksjon: clamp(4rem, 9vw, 6.5rem);   /* 64–104 px over og under seksjoner */
  --bredde-innhold: 46rem;
  --bredde-side: 77.5rem;     /* 1240 px, header og bunntekst */
  --kant-side: clamp(1rem, 4vw, 2rem);  /* 16–32 px sidemarg */
  --trykkflate: 2.75rem;     /* 44 px, minste trykkflate */
  --radius-liten: 6px;
  --radius: 14px;
  --radius-stor: 20px;
  --radius-pille: 999px;
  --strek: 1.5px;
  --skygge-kort: 0 20px 50px rgba(34, 50, 74, 0.14);
  --skygge-rapportkort: 0 18px 44px rgba(34, 50, 74, 0.18);
  --skygge-fast-knapp: 0 -10px 28px rgba(34, 50, 74, 0.12);  /* fast knapp på mobil, skygge oppover */
}