/* Designtokens: palett «Kalk og blekk», Satoshi, 4 px-base.
   Alle tekstpar er regnet ut mot WCAG 2.2 AA (se rapportens H3). */
:root {
  /* Flater */
  --bunn: #faf9f7;
  --flate: #f0ede8;
  --flate-2: #e9edf3;
  --hvit: #ffffff;
  --scene-vegg: #f0ede8;
  --scene-gulv: #dcd8d1;

  /* Tekst */
  --blekk: #1a2233;
  --tekst-2: #575f6e;
  --tekst-3: #878d99; /* bare dekor og store tall, aldri lesetekst */
  --tekst-paa-moerk: #e4e7ec;
  --tekst-paa-moerk-2: #aab2c0;

  /* Handling */
  --knapp: #1e2d4d;
  --knapp-hover: #16223b;
  --knapp-aktiv: #0f182b;
  --knapp-deaktivert: rgba(26, 34, 51, 0.1);
  --knapp-deaktivert-tekst: #878d99;

  /* Aksent: bare tilbud, stjerner, fokus */
  --aksent: #b8410e;
  --badge: #f3e3d3;
  --badge-tekst: #7a3a12;
  --dekor: #d8a47a;

  /* Rammer */
  --ramme: #d9d4cc;
  --ramme-lys: rgba(26, 34, 51, 0.1);
  --ramme-felt: #878d99;
  --ramme-paa-moerk: rgba(228, 231, 236, 0.18);

  /* Status */
  --suksess: #2e6b3f;
  --feil: #b42318;
  --varsel: #7a4b00;
  --varsel-flate: #fbf1dc;
  --status-lages: #1e2d4d;

  /* Mørkt bånd og footer */
  --moerk: #1a2233;

  /* Typografi */
  --font: 'Satoshi', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --bok: 450;
  --medium: 520;
  --fet: 700;
  --t-10: 0.625rem;
  --t-12: 0.75rem;
  --t-14: 0.875rem;
  --t-16: 1rem;
  --t-18: 1.125rem;
  --t-20: 1.25rem;
  --t-24: 1.5rem;
  --t-26: 1.625rem;
  --t-28: 1.75rem;
  --t-32: 2rem;
  --t-36: 2.25rem;
  --t-40: 2.5rem;
  --t-44: 2.75rem;
  --t-50: 3.125rem;
  --t-60: 3.75rem;

  /* Rom (4 px-base) */
  --r-1: 4px;
  --r-2: 8px;
  --r-3: 12px;
  --r-4: 16px;
  --r-5: 20px;
  --r-6: 24px;
  --r-8: 32px;
  --r-10: 40px;
  --r-12: 48px;
  --r-14: 56px;
  --r-16: 64px;
  --r-20: 80px;
  --r-24: 96px;

  /* Radius */
  --rad-felt: 4px;
  --rad-bilde: 4px; /* foto og renders: nesten rette hjørner */
  --rad-rad: 12px;
  --rad-liten: 16px;
  --rad-kort: 20px;
  --rad-ark: 30px;
  --rad-pille: 60px;

  /* Layout */
  --container: 1680px;
  --container-tynn: 1320px;
  --gutter: 20px;
  --header-h: 72px;
  --usp-h: 40px;
  --kjopskolonne: 414px;

  /* Bevegelse */
  --ease-ut: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-inn-ut: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-sving: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-skuff: cubic-bezier(0.32, 0.72, 0, 1);
  --tid-trykk: 160ms;
  --tid-rask: 200ms;
  --tid: 280ms;
  --tid-skuff: 450ms;
  --tid-skuff-ut: 300ms;
  --tid-forvandling: 650ms;
  --tid-toning: 600ms;

  /* Dybde: ingen skygger på flater; blur bare over foto */
  --skygge-flytende: 0 10px 40px rgba(26, 34, 51, 0.14);
  --skygge-opp: 0 -10px 50px rgba(26, 34, 51, 0.12);
}

@media (min-width: 1024px) {
  :root {
    --gutter: 40px;
    --header-h: 80px;
  }
}