/* lages av build.mjs fra tokens.json. ikke rediger for hånd. */

@font-face {
  font-family: "Hanken Grotesk";
  src: url("assets/fonts/hanken-grotesk-400-600.woff2") format("woff2");
  font-weight: 400 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Noto Sans";
  src: url("assets/fonts/noto-sans-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  unicode-range: U+02C8, U+0254, U+202F;
  font-display: swap;
}
@font-face {
  font-family: "Cormorant Garamond";
  src: url("assets/fonts/cormorant-garamond-500-italic.woff2") format("woff2");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Iosevka";
  src: url("assets/fonts/iosevka-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Iosevka";
  src: url("assets/fonts/iosevka-700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --porpora-100: #3a1722;
  --porpora-75: #65474e;
  --porpora-50: #927b7e;
  --porpora-25: #c0b3b2;
  --calce-100: #f0eee9;
  --calce-97: #eae7e2;
  --calce-94: #e4e0dc;
  --calce-90: #ddd6d3;
  --argento-100: #66686d;
  --argento-75: #86888a;
  --argento-50: #a8a9a9;
  --argento-25: #cccbc8;
  --vermiglio-100: #e34234;
  --vermiglio-75: #ec7564;
  --vermiglio-50: #f29f90;
  --vermiglio-25: #f3c7bc;
  --oltremare-100: #422acc;
  --oltremare-75: #6366d8;
  --oltremare-50: #8d95e1;
  --oltremare-25: #bdc2e7;
  --lys-grunn: var(--calce-100);
  --lys-tekst: var(--porpora-100);
  --lys-dempet: var(--argento-100);
  --lys-linje: var(--argento-25);
  --lys-aksent: var(--vermiglio-100);
  --lys-det-ene: var(--oltremare-100);
  --mork-grunn: var(--porpora-100);
  --mork-tekst: var(--calce-100);
  --mork-dempet: var(--argento-50);
  --mork-linje: var(--porpora-75);
  --mork-aksent: var(--vermiglio-100);
  --mork-det-ene: var(--oltremare-50);
  --skrift-tekst: "Hanken Grotesk", "Noto Sans", system-ui, sans-serif;
  --vekt-tekst-1: 400;
  --vekt-tekst-2: 500;
  --vekt-tekst-3: 600;
  --stil-tekst: normal;
  --skrift-display: "Cormorant Garamond", Georgia, serif;
  --vekt-display-1: 500;
  --vekt-display-2: 500;
  --vekt-display-3: 500;
  --stil-display: italic;
  --skrift-mono: "Iosevka", ui-monospace, monospace;
  --vekt-mono-1: 400;
  --vekt-mono-2: 700;
  --vekt-mono-3: 700;
  --stil-mono: normal;
  --side-bredde: 1920;
  --side-hoyde: 1080;
  --kolonner: 12;
  --px: calc(100cqw / 1920);
  --marg: calc(96 * var(--px));
  --mellomrom: calc(24 * var(--px));
  --t-mikro: calc(16 * var(--px));
  --t-liten: calc(20 * var(--px));
  --t-brod: calc(26 * var(--px));
  --t-ingress: calc(36 * var(--px));
  --t-mellom: calc(44 * var(--px));
  --t-tittel: calc(56 * var(--px));
  --t-stor: calc(96 * var(--px));
  --t-tall: calc(160 * var(--px));
  --t-kapittel: calc(360 * var(--px));
  --display-minimum: calc(32 * var(--px));
  --ark-hoyde: 190.5mm;
}

@media screen and (max-width: 899.98px) {
  :root {
    --marg: 1.25rem;
    --mellomrom: 1rem;
    --t-mikro: 0.6875rem;
    --t-liten: 0.8125rem;
    --t-brod: 1rem;
    --t-ingress: 1.25rem;
    --t-mellom: 1.5rem;
    --t-tittel: 1.75rem;
    --t-stor: 2.5rem;
    --t-tall: 3.25rem;
    --t-kapittel: 4.5rem;
    --display-minimum: 2rem;
  }
}

.rolle-lys {
  --grunn: var(--lys-grunn);
  --tekst: var(--lys-tekst);
  --dempet: var(--lys-dempet);
  --linje: var(--lys-linje);
  --aksent: var(--lys-aksent);
  --det-ene: var(--lys-det-ene);
}

.rolle-mork {
  --grunn: var(--mork-grunn);
  --tekst: var(--mork-tekst);
  --dempet: var(--mork-dempet);
  --linje: var(--mork-linje);
  --aksent: var(--mork-aksent);
  --det-ene: var(--mork-det-ene);
}

@page {
  size: 338.67mm 190.5mm;
  margin: 0;
}