/* Renergi Infra: design tokens. Every colour, font and spacing value lives here. */

@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("/assets/fonts/archivo-latin-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("/assets/fonts/archivo-latin-ext-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
    U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* palette: the gradient in Renergi's R (yellow orange, orange, red), the near black of their type and their van,
     on light lime grey and stone */
  --kalk: #f4f4f1;
  --stein: #e8e7e2;
  --hvit: #ffffff;
  --natt: #0e151c;
  --natt-2: #141d26;
  --natt-3: #1e2a35;
  --skifer: #5a636d;
  --gul: #f2b841;             /* the R, bottom left */
  --oransje: #ed8049;         /* the R, middle */
  --rod: #e84351;             /* the R, top right */
  --rod-knapp: #cc3340;       /* the red as a button: white type on it is 5.1:1 */
  --rod-knapp-dyp: #b32c37;
  --rod-tekst: #c22f3c;       /* the red as small text: 5.1:1 on kalk */
  --energi: linear-gradient(90deg, var(--gul), var(--oransje) 52%, var(--rod));

  /* the hero: the shades on the photo and the night ground of the text panel */
  --hero-slor-topp: rgba(14, 21, 28, 0.5);
  --hero-slor-bunn: rgba(14, 21, 28, 0.86);
  --hero-slor-midt: rgba(14, 21, 28, 0.35);

  /* text on light ground */
  --tekst: var(--natt);
  --tekst-dempet: #4a5360;
  --linje: rgba(14, 21, 28, 0.14);
  --linje-sterk: rgba(14, 21, 28, 0.32);
  --linje-felt: #7a8089;        /* form field outlines: 3:1 or more on white, chalk and stone (WCAG 1.4.11) */

  /* text on dark ground */
  --tekst-lys: #f4f4f1;
  --tekst-lys-dempet: rgba(244, 244, 241, 0.78);
  --linje-lys: rgba(244, 244, 241, 0.18);

  /* veils, shadows and states */
  --skygge: rgba(14, 21, 28, 0.28);
  --feil: #a3341b;
  --meny-matt: rgba(244, 244, 241, 0.92);
  --hero-tekst-dempet: rgba(255, 255, 255, 0.84);
  --hero-kant: rgba(255, 255, 255, 0.6);
  --hero-knapp-flate: rgba(14, 21, 28, 0.3);
  --hero-linje: rgba(255, 255, 255, 0.22);
  --hero-skygge: rgba(6, 10, 14, 0.55);
  /* the hero's line drawing on the night ground: kalk at three strengths */
  --strek: rgba(244, 244, 241, 0.6);
  --strek-svak: rgba(244, 244, 241, 0.3);
  --strek-sterk: rgba(255, 255, 255, 0.9);
  --fokus: var(--rod-tekst);  /* focus ring on light grounds; dark grounds switch it to white */

  /* type */
  --font: "Archivo", "Helvetica Neue", Helvetica, sans-serif;
  --vekt-tittel: 300;
  --vekt-tekst: 400;
  --vekt-merke: 600;
  --sporing-tittel: -0.03em;
  --sporing-merke: 0.14em;
  --str-hero: clamp(2.3rem, 1.2rem + 3.4vw, 4.4rem);
  --str-h2: clamp(2.1rem, 1.2rem + 3vw, 4rem);
  --str-h3: clamp(1.3rem, 1.1rem + 0.6vw, 1.6rem);
  --str-ingress: clamp(1.125rem, 1.05rem + 0.35vw, 1.3rem);
  --str-tekst: 1.0625rem;
  --str-merke: 0.78rem;
  --linjehoyde: 1.55;

  /* space */
  --marg: clamp(1.25rem, 0.6rem + 3vw, 3.5rem);
  --maks: 1360px;
  --seksjon-luft: clamp(3.5rem, 2.2rem + 3.6vw, 6rem);
  --meny-h: 76px;
  --radius: 2px;

  /* motion */
  --mykt: cubic-bezier(0.22, 0.61, 0.36, 1);
  --hero-reise: 1.3;        /* scroll travel of the hero, in scene heights: the drawing, the power and the photo over it
                               (1 until 29.10.2026, when Sverre wanted the light slower; the extra travel all goes to the light) */
  --hero-naer: 0.06;        /* how much nearer the camera comes over that travel */
}

@media (min-width: 1024px) {
  :root { --str-tekst: 1.125rem; }
}
@media (max-width: 767px) {
  :root { --meny-h: 64px; }
}
@media (pointer: coarse) {
  :root { --hero-reise: 1.04; }
}
