/* Written by funksjoner.mjs from funk/*.css: do not edit by hand. */
/* ---- felles ---- */
/* The tools' own sizes. Colours, type and space are the Lys tokens
   (lys-tokens.css) and the site's (--s-*, lys.css); nothing here names a colour. */
:root {
  --fk-maks: min(100%, 72rem);        /* the widest a tool page's grid gets */
  --fk-kort: min(100%, 56rem);        /* a tool's card, the calculator's width */
  --fk-smal: min(100%, 40rem);        /* a card that holds one column */
  --fk-flis-ikon: 2.5rem;
  --fk-prikk: .625rem;
  --fk-dokk-b: min(calc(100vw - 2 * var(--l-s-4)), 21rem);
  --fk-dokk-bunn: var(--l-s-5);
  --fk-fast: 4.25rem;                 /* the phone's fixed «Bli med» bar and its air, which the dock stands above */
  --fk-framdrift: .1875rem;
  --fk-glass: rgba(255, 255, 255, .86);
}

/* ---- the hub's tiles and the «Prøv mer» row: the city links' card, with a drawn icon ---- */
.fk-hub, .fk-flere { width: var(--fk-maks); margin-inline: auto; }
.fk-hub { grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); }
.fk-flis { grid-template-columns: auto minmax(0, 1fr) auto; column-gap: var(--l-s-4); box-shadow: var(--l-sh-soft); }
.fk-flis .fk-flis__ikon { grid-column: 1; grid-row: 1 / span 2; width: var(--fk-flis-ikon); height: var(--fk-flis-ikon); }
.fk-flis b, .fk-flis span { grid-column: 2; }
.fk-flis .bylenke__pil { grid-column: 3; }
.fk-alle { margin-top: var(--l-s-5); text-align: center; font-weight: var(--l-w-semi); }
.fk-alle a { color: var(--l-purple-ink); }
@media (prefers-reduced-motion: no-preference) {
  .fk-flis .bylenke__pil { transition: translate var(--l-t-base) var(--l-ease); }
  .fk-flis:hover .bylenke__pil { translate: var(--l-nudge) calc(-1 * var(--l-nudge)); }
}

/* On a tool's own page the hero has said the heading: the tool stands closer to it. */
.fk--side { padding-top: var(--l-s-8); }

/* ---- a tool's card: the calculator's sheet ---- */
.fk-kort {
  display: grid; gap: var(--l-s-5); width: var(--fk-kort); margin-inline: auto; padding: var(--l-card-pad);
  border: var(--s-hair) solid var(--l-line); border-radius: var(--l-r-hero); background: var(--l-frame); box-shadow: var(--l-sh-card);
}
.fk-kort--smal { width: var(--fk-smal); }
.fk-kort > * { min-width: 0; }
.fk-skille { border: 0; border-top: var(--s-hair) solid var(--l-line); margin: 0; }

/* ---- a row of choices ---- */
.fk-valg { display: grid; gap: var(--l-s-3); margin: 0; padding: 0; border: 0; min-width: 0; }
.fk-valg legend { padding: 0; font-weight: var(--l-w-semi); color: var(--l-ink); }
.fk-valg__rad { display: flex; flex-wrap: wrap; gap: var(--l-s-2); }
.fk-pille { position: relative; display: inline-flex; cursor: pointer; }
.fk-pille input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.fk-pille span {
  display: inline-flex; align-items: center; min-height: var(--l-touch); padding-inline: var(--l-s-5);
  border-radius: var(--l-r-pill); background: var(--l-sunk); box-shadow: inset 0 0 0 var(--s-hair) var(--l-line-2);
  font-size: var(--l-t-md); font-weight: var(--l-w-semi); color: var(--l-ink-2); white-space: nowrap;
}
.fk-pille input:checked + span { background: var(--l-purple-soft); box-shadow: inset 0 0 0 var(--s-ring) var(--l-purple); color: var(--l-purple-ink); }
.fk-pille input:focus-visible + span { box-shadow: inset 0 0 0 var(--s-ring) var(--l-purple), var(--l-sh-focus); }
@media (prefers-reduced-motion: no-preference) {
  .fk-pille span { transition: background var(--l-t-fast) var(--l-ease), translate var(--l-t-fast) var(--l-ease), box-shadow var(--l-t-fast) var(--l-ease); }
  .fk-pille:hover span { translate: 0 var(--l-lift-sm); }
  .fk-pille:active span { scale: var(--l-press); }
}

/* ---- a text field ---- */
.fk-felt { display: grid; gap: var(--l-s-2); }
.fk-felt label { font-weight: var(--l-w-semi); color: var(--l-ink); }
.fk-felt input {
  width: 100%; min-height: var(--l-control); padding-inline: var(--l-s-4);
  border: var(--s-hair) solid var(--l-line-2); border-radius: var(--l-r-md); background: var(--l-panel);
  font: inherit; font-size: var(--l-t-body); color: var(--l-ink);
}
.fk-felt input::placeholder { color: var(--l-placeholder); }
.fk-felt input:focus-visible { outline: none; border-color: var(--l-purple); box-shadow: var(--l-sh-focus); }

/* ---- a quiet button that is not the page's one filled button ---- */
.fk-lett {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--l-s-2);
  min-height: var(--l-touch); padding-inline: var(--l-s-5); border: 0; border-radius: var(--l-r-pill);
  background: var(--l-frame); box-shadow: inset 0 0 0 var(--s-hair) var(--l-line-2), var(--l-sh-soft);
  font: inherit; font-size: var(--l-t-md); font-weight: var(--l-w-semi); color: var(--l-ink); text-decoration: none; cursor: pointer;
}
.fk-lett svg { width: var(--l-icon-sm); height: var(--l-icon-sm); flex: none; }
.fk-lett:focus-visible { outline: none; box-shadow: inset 0 0 0 var(--s-ring) var(--l-purple), var(--l-sh-focus); }
@media (prefers-reduced-motion: no-preference) {
  .fk-lett { transition: translate var(--l-t-fast) var(--l-ease), box-shadow var(--l-t-fast) var(--l-ease); }
  .fk-lett:hover { translate: 0 var(--l-lift-sm); box-shadow: inset 0 0 0 var(--s-hair) var(--l-line-2), var(--l-sh-active); }
  .fk-lett:active { scale: var(--l-press); }
}

/* ---- the message at the foot of the screen ---- */
.fk-toast {
  position: fixed; left: 50%; bottom: calc(var(--fk-dokk-bunn) + env(safe-area-inset-bottom, 0px)); z-index: var(--l-z-toast);
  display: flex; align-items: center; gap: var(--l-s-2); margin: 0; padding: var(--l-s-3) var(--l-s-5);
  border-radius: var(--l-r-pill); background: var(--l-frame); box-shadow: var(--l-sh-pop);
  font-size: var(--l-t-md); font-weight: var(--l-w-semi); color: var(--l-ink); white-space: nowrap;
  translate: -50% 0; opacity: 0; visibility: hidden; pointer-events: none;
}
.fk-toast.er-fremme { opacity: 1; visibility: visible; }
.fk-toast__segl { width: var(--l-icon); height: var(--l-icon); flex: none; color: var(--l-green-ink); }
@media (prefers-reduced-motion: no-preference) {
  .fk-toast { translate: -50% var(--l-s-3); transition: opacity var(--l-t-base) var(--l-ease), translate var(--l-t-base) var(--l-ease), visibility 0s linear var(--l-t-base); }
  .fk-toast.er-fremme { translate: -50% 0; transition: opacity var(--l-t-base) var(--l-ease), translate var(--l-t-base) var(--l-ease-fjaer), visibility 0s; }
}

/* ---- the dock ---- */
.fk-dokk {
  position: fixed; right: var(--l-s-5); bottom: calc(var(--fk-dokk-bunn) + env(safe-area-inset-bottom, 0px)); z-index: var(--l-z-pop);
  display: grid; justify-items: end; gap: var(--l-s-3);
  opacity: 0; visibility: hidden; pointer-events: none;
}
.fk-dokk.er-fremme { opacity: 1; visibility: visible; pointer-events: auto; }
.fk-dokk__knapp {
  display: inline-flex; align-items: center; gap: var(--l-s-2); min-height: var(--l-touch); padding-inline: var(--l-s-4) var(--l-s-5);
  border: 0; border-radius: var(--l-r-pill); background: var(--fk-glass); -webkit-backdrop-filter: blur(16px) saturate(1.4); backdrop-filter: blur(16px) saturate(1.4);
  box-shadow: inset 0 0 0 var(--s-hair) var(--l-line-2), var(--l-sh-pop);
  font: inherit; font-size: var(--l-t-sm); font-weight: var(--l-w-bold); color: var(--l-ink); cursor: pointer;
}
.fk-dokk__knapp svg { width: var(--l-icon-sm); height: var(--l-icon-sm); color: var(--l-purple-ink); }
.fk-dokk__knapp:focus-visible { outline: none; box-shadow: inset 0 0 0 var(--s-ring) var(--l-purple), var(--l-sh-focus); }
.fk-dokk__knapp[aria-expanded="true"] { background: var(--l-frame); }
.fk-dokk__panel {
  display: grid; gap: var(--l-s-5); width: var(--fk-dokk-b); max-height: min(calc(100vh - 7rem), 40rem); overflow-y: auto; overscroll-behavior: contain;
  padding: var(--l-s-5); border-radius: var(--l-r-hero); background: var(--l-frame);
  box-shadow: 0 0 0 var(--s-hair) var(--l-line), var(--l-sh-pop);
}
.fk-dokk__panel[hidden] { display: none; }
.fk-dokk__del { display: grid; gap: var(--l-s-3); min-width: 0; }
.fk-dokk__tittel { margin: 0; font-size: var(--l-t-xs); font-weight: var(--l-w-black); letter-spacing: var(--l-ls-caps); text-transform: uppercase; color: var(--l-mute); }
@media (max-width: 47.999rem) {
  /* above the phone's own fixed button, and a round button without the words */
  .fk-dokk { right: var(--l-s-4); bottom: calc(var(--fk-fast) + env(safe-area-inset-bottom, 0px)); }
  .fk-dokk__knapp { width: var(--l-touch); padding: 0; justify-content: center; }
  .fk-dokk__knapp span { position: absolute; width: var(--s-hair); height: var(--s-hair); overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}
@media (prefers-reduced-motion: no-preference) {
  .fk-dokk { translate: 0 var(--l-s-3); transition: opacity var(--l-t-base) var(--l-ease), translate var(--l-t-base) var(--l-ease), visibility 0s linear var(--l-t-base); }
  .fk-dokk.er-fremme { translate: 0 0; transition: opacity var(--l-t-base) var(--l-ease), translate var(--l-t-base) var(--l-ease), visibility 0s; }
  .fk-dokk__knapp { transition: translate var(--l-t-fast) var(--l-ease), box-shadow var(--l-t-fast) var(--l-ease); }
  .fk-dokk__knapp:hover { translate: 0 var(--l-lift-sm); }
  .fk-dokk__panel:not([hidden]) { animation: fk-opp var(--l-t-base) var(--l-ease-fjaer) backwards; transform-origin: 100% 100%; }
  @keyframes fk-opp { from { opacity: 0; scale: .96; translate: 0 var(--l-s-2); } }
}
/* What comes into view by a visitor's own press rises into place, like the page's sections. */
@media (prefers-reduced-motion: no-preference) {
  @keyframes fk-inn { from { opacity: 0; translate: 0 var(--s-rise); } }
}
@media print { .fk-dokk, .fk-toast, .fk-framdrift { display: none; } }

/* ---- gebyr ---- */
/* The card is the calculator's own (lys.css .regn). Its two small lines take the
   calculator's sizes, and a phone keeps the line that says what Pling takes:
   it is the answer the card was opened for. */
.fk-gebyr .regn__hva, .fk-gebyr .regn__jobber { font-size: clamp(1rem, .95rem + .3vw, 1.25rem); }
.fk-gebyr .regn__lite { font-size: clamp(.8125rem, .78rem + .15vw, .9375rem); }
.fk-gebyr .regn__jobber span { color: var(--l-purple-ink); font-weight: var(--l-w-black); }
@media (max-width: 47.999rem) {
  .regn.fk-gebyr .regn__jobber { display: block; }
}

/* ---- passer ---- */
.fk-passer__vent { margin: 0; font-size: var(--l-t-sm); font-weight: var(--l-w-bold); font-variant-numeric: tabular-nums; color: var(--l-mute); }
.fk-passer__vent[hidden] { display: none; }
.fk-passer__svar { display: grid; gap: var(--l-s-4); }
.fk-passer__svar[hidden] { display: none; }
.fk-passer__tittel { display: flex; align-items: center; gap: var(--l-s-2); margin: 0; font-size: var(--l-t-lg); font-weight: var(--l-w-black); letter-spacing: var(--l-ls-tight); color: var(--l-ink); }
.fk-passer__linjer { display: grid; gap: var(--l-s-3); }
.fk-passer__linjer li { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--l-s-4); padding: var(--l-s-4); border-radius: var(--l-r-card); background: var(--l-sunk); color: var(--l-ink-2); }
.fk-passer__linjer li[hidden] { display: none; }
.fk-passer__linjer .tegnet { width: var(--fk-flis-ikon); height: var(--fk-flis-ikon); }
.fk-passer__knapper { display: flex; flex-wrap: wrap; align-items: center; gap: var(--l-s-3); margin: 0; }
.fk-passer__knapper [hidden] { display: none; }
@media (prefers-reduced-motion: no-preference) {
  .fk-passer__svar:not([hidden]) .fk-passer__linjer li:not([hidden]) { animation: fk-inn var(--s-rise-time) var(--l-ease) backwards; }
  .fk-passer__svar:not([hidden]) .fk-passer__linjer li:not([hidden]) ~ li:not([hidden]) { animation-delay: var(--s-stagger); }
  .fk-passer__svar:not([hidden]) .fk-passer__linjer li:not([hidden]) ~ li:not([hidden]) ~ li:not([hidden]) { animation-delay: calc(2 * var(--s-stagger)); }
}

/* ---- akuttord ---- */
.fk-akutt__ord { display: flex; flex-wrap: wrap; gap: var(--l-s-2); }
.fk-akutt__ord[hidden] { display: none; }
.fk-akutt__knapp {
  min-height: var(--l-s-7); padding: var(--l-s-1) var(--l-s-3); border: 0; border-radius: var(--l-r-pill);
  background: var(--l-sunk); font: inherit; font-size: var(--l-t-sm); font-weight: var(--l-w-semi); color: var(--l-ink-2); cursor: pointer;
}
.fk-akutt__knapp.er-traff.fk-akutt__knapp--akutt { background: var(--l-red-soft); color: var(--l-red-ink); }
.fk-akutt__knapp.er-traff.fk-akutt__knapp--haster { background: var(--l-orange-soft); color: var(--l-orange-ink); }
.fk-akutt__knapp:focus-visible { outline: none; box-shadow: var(--l-sh-focus); }
@media (pointer: coarse) { .fk-akutt__knapp { min-height: var(--l-touch); padding-inline: var(--l-s-4); } }
.fk-akutt__svar { display: grid; gap: var(--l-s-3); padding: var(--l-card-pad); border-radius: var(--l-r-card); background: var(--l-sunk); }
.fk-akutt__svar[data-utfall="akutt"] { background: var(--l-red-soft); }
.fk-akutt__svar[data-utfall="haster"] { background: var(--l-orange-soft); }
.fk-akutt__niva { display: flex; flex-wrap: wrap; align-items: center; gap: var(--l-s-3); margin: 0; font-weight: var(--l-w-bold); color: var(--l-ink); }
.fk-akutt__niva .pill { background: var(--l-frame); color: var(--l-ink); }
.fk-akutt__svar[data-utfall="akutt"] .pill { color: var(--l-red-ink); }
.fk-akutt__svar[data-utfall="haster"] .pill { color: var(--l-orange-ink); }
.fk-akutt__rad { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--l-s-3); margin: 0; padding: var(--l-s-4); border-radius: var(--l-r-card); border-top-left-radius: var(--l-s-1); background: var(--l-frame); font-size: var(--l-t-lg); font-weight: var(--l-w-semi); line-height: var(--l-lh-snug); color: var(--l-ink); }
.fk-akutt__rad[hidden] { display: none; }
.fk-akutt__rad .tegnet { width: var(--l-icon-lg); height: var(--l-icon-lg); }
.fk-akutt__sa { margin: 0; color: var(--l-ink-2); }
@media (prefers-reduced-motion: no-preference) {
  .fk-akutt__svar { transition: background var(--l-t-slow) var(--l-ease); }
  .fk-akutt__knapp { transition: background var(--l-t-fast) var(--l-ease), translate var(--l-t-fast) var(--l-ease); }
  .fk-akutt__knapp:hover { translate: 0 var(--l-lift-sm); }
}

/* ---- viderekobling ---- */
.fk-vk__svar { display: grid; gap: var(--l-s-4); padding: var(--l-card-pad); border-radius: var(--l-r-card); background: var(--l-sunk); }
.fk-vk__koder { display: grid; gap: var(--l-s-4); }
.fk-vk__koder[hidden], .fk-vk__av[hidden], .fk-vk__telefon[hidden] { display: none; }
.fk-vk__koder li { display: grid; gap: var(--l-s-2); justify-items: start; }
.fk-vk__koder li > span:first-child { font-size: var(--l-t-sm); font-weight: var(--l-w-semi); color: var(--l-ink-2); }
.fk-vk .kig-kode { font-size: var(--l-t-lg); overflow-wrap: anywhere; }
.fk-vk__koder .kig-kode { font-size: var(--l-t-title); font-weight: var(--l-w-bold); letter-spacing: .02em; }
.fk-vk__knapper { display: flex; flex-wrap: wrap; gap: var(--l-s-2); }
.fk-vk__av { margin: 0; font-weight: var(--l-w-semi); color: var(--l-ink-2); }
.fk-vk__telefon { display: grid; gap: var(--l-s-3); }
.fk-vk__telefon li { display: grid; gap: var(--l-s-1); padding: var(--l-s-4); border-radius: var(--l-r-md); background: var(--l-frame); }
.fk-vk__telefon b { color: var(--l-ink); }
.fk-vk__telefon span { color: var(--l-ink-2); }
.fk-vk__merk { display: grid; gap: var(--l-s-2); font-size: var(--l-t-md); color: var(--l-ink-2); }
.fk-vk__merk li { display: grid; grid-template-columns: var(--fk-prikk) minmax(0, 1fr); gap: var(--l-s-3); }
.fk-vk__merk li::before { content: ""; width: var(--fk-prikk); height: var(--fk-prikk); margin-top: .5em; border-radius: var(--l-r-pill); background: var(--l-purple-line); }
.fk-vk__test { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--l-s-3); margin: 0; color: var(--l-ink-2); }
.fk-vk__test svg { width: var(--l-icon); height: var(--l-icon); color: var(--l-purple-ink); }

/* ---- omrade ---- */
/* The map: a soft sheet with a dotted grid, and the four cities where they lie.
   Each city's place is its longitude and latitude over 4–12° E and 58–64° N. */
.fk-omrade { display: grid; gap: var(--l-gap); width: var(--fk-maks); margin-inline: auto; align-items: start; }
@media (min-width: 64rem) { .fk-omrade { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } }
.fk-kart {
  --fk-by-x: 50%; --fk-by-y: 50%;
  position: relative; aspect-ratio: 4 / 3; overflow: hidden;
  border: var(--s-hair) solid var(--l-line); border-radius: var(--l-r-hero); box-shadow: var(--l-sh-card);
  background:
    radial-gradient(circle at 20% 72%, var(--l-tint-cyan) 0 28%, transparent 46%),
    radial-gradient(circle at 82% 30%, var(--l-tint-lavender) 0 30%, transparent 50%),
    var(--l-frame);
}
@media (min-width: 64rem) { .fk-kart { aspect-ratio: 1; } }
.fk-kart__nett { position: absolute; inset: 0; width: 100%; height: 100%; color: var(--l-line-2); }
.fk-kart__by {
  position: absolute; left: var(--fk-by-x); top: var(--fk-by-y); translate: -50% -50%;
  display: inline-flex; align-items: center; gap: var(--l-s-2); min-height: var(--l-touch); padding-inline: var(--l-s-3) var(--l-s-4);
  border: 0; border-radius: var(--l-r-pill); background: var(--l-frame); box-shadow: inset 0 0 0 var(--s-hair) var(--l-line-2), var(--l-sh-soft);
  font: inherit; font-size: var(--l-t-md); font-weight: var(--l-w-bold); color: var(--l-ink); cursor: pointer; white-space: nowrap;
}
.fk-kart__by--oslo { --fk-by-x: 80%; --fk-by-y: 64%; }
.fk-kart__by--bergen { --fk-by-x: 22%; --fk-by-y: 54%; }
.fk-kart__by--trondheim { --fk-by-x: 74%; --fk-by-y: 14%; }
.fk-kart__by--stavanger { --fk-by-x: 26%; --fk-by-y: 80%; }
.fk-kart__prikk { width: var(--fk-prikk); height: var(--fk-prikk); border-radius: var(--l-r-pill); background: var(--l-purple-line); box-shadow: 0 0 0 var(--l-s-1) var(--l-purple-soft); }
.fk-kart__by[aria-pressed="true"] { background: var(--l-purple-soft); box-shadow: inset 0 0 0 var(--s-ring) var(--l-purple), var(--l-sh-card); color: var(--l-purple-ink); }
.fk-kart__by[aria-pressed="true"] .fk-kart__prikk { background: var(--l-purple); }
.fk-kart__by:focus-visible { outline: none; box-shadow: inset 0 0 0 var(--s-ring) var(--l-purple), var(--l-sh-focus); }
.fk-kart__hele { position: absolute; left: var(--l-s-5); top: var(--l-s-4); margin: 0; font-family: var(--s-hand); font-size: var(--l-t-lg); color: var(--l-purple-ink); rotate: -2deg; }
.fk-omrade__liste { grid-template-columns: minmax(0, 1fr); }
.fk-omrade__liste[hidden] { display: none; }
@media (prefers-reduced-motion: no-preference) {
  .fk-kart__by { transition: translate var(--l-t-base) var(--l-ease), box-shadow var(--l-t-base) var(--l-ease), background var(--l-t-base) var(--l-ease); }
  .fk-kart__by:hover { translate: -50% calc(-50% + var(--l-lift)); }
  .fk-kart__by[aria-pressed="true"] .fk-kart__prikk { animation: fk-puls var(--s-ring-time) var(--l-ease) infinite; }
  @keyframes fk-puls { 50% { box-shadow: 0 0 0 var(--l-s-2) var(--l-purple-soft); } }
  .fk-omrade__liste:not([hidden]) > li { animation: fk-inn var(--s-rise-time) var(--l-ease) backwards; }
  .fk-omrade__liste:not([hidden]) > li:nth-child(2) { animation-delay: var(--s-stagger); }
  .fk-omrade__liste:not([hidden]) > li:nth-child(3) { animation-delay: calc(2 * var(--s-stagger)); }
  .fk-omrade__liste:not([hidden]) > li:nth-child(4) { animation-delay: calc(3 * var(--s-stagger)); }
}

/* ---- samtale ---- */
.fk-toutfall { display: grid; gap: var(--l-gap); width: var(--fk-kort); margin-inline: auto; }
.fk-toutfall__fag { justify-items: center; }
.fk-toutfall__fag legend { position: absolute; width: var(--s-hair); height: var(--s-hair); overflow: hidden; clip-path: inset(50%); }
.fk-toutfall__fag .fk-valg__rad { justify-content: center; }
.fk-toutfall__sitat { display: grid; gap: var(--l-s-1); justify-self: center; max-width: var(--s-measure); margin: 0; }
.fk-toutfall__hvem { font-size: var(--l-t-xs); font-weight: var(--l-w-black); letter-spacing: var(--l-ls-caps); text-transform: uppercase; color: var(--l-mute); }
.fk-toutfall__sitat p { margin: 0; padding: var(--l-s-4) var(--l-s-5); border-radius: var(--l-r-card); border-top-left-radius: var(--l-s-1); background: var(--l-purple-soft); font-size: var(--l-t-lg); font-weight: var(--l-w-semi); line-height: var(--l-lh-snug); color: var(--l-ink); }
.fk-toutfall__spor { display: grid; gap: var(--l-gap); }
@media (min-width: 48rem) { .fk-toutfall__spor { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.fk-spor { display: grid; grid-template-rows: auto 1fr auto; gap: var(--l-s-4); padding: var(--l-card-pad); border: var(--s-hair) solid var(--l-line); border-radius: var(--l-r-hero); background: var(--l-panel); }
.fk-spor--med { background: var(--l-frame); box-shadow: var(--l-sh-card); }
.fk-spor h3 { margin: 0; font-size: var(--s-h3); font-weight: var(--l-w-bold); color: var(--l-ink-2); }
.fk-spor--med h3 { color: var(--l-purple-ink); }
.fk-spor__steg { display: grid; gap: var(--l-s-4); align-content: start; }
.fk-spor__steg li { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--l-s-3); color: var(--l-ink-2); }
.fk-spor__steg .tegnet { width: var(--l-icon-lg); height: var(--l-icon-lg); }
.fk-spor--uten .tegnet { opacity: .55; }
.fk-spor__slutt { display: flex; align-items: center; gap: var(--l-s-2); margin: 0; padding: var(--l-s-3) var(--l-s-4); border-radius: var(--l-r-md); background: var(--l-sunk); font-weight: var(--l-w-bold); color: var(--l-ink-2); }
.fk-spor--med .fk-spor__slutt { background: var(--l-green); color: var(--l-green-ink); }
.fk-toutfall__spill { display: flex; justify-content: center; margin: 0; }
.fk-toutfall__spill[hidden] { display: none; }
/* While it plays, a step that has not come yet keeps its place and is not seen. */
@media (prefers-reduced-motion: no-preference) {
  .fk-toutfall [data-fk-steg] { transition: opacity var(--l-t-slow) var(--l-ease), translate var(--l-t-slow) var(--l-ease); }
  .fk-toutfall.spiller [data-fk-steg].er-skjult { opacity: 0; translate: 0 var(--s-rise); }
}

/* ---- sjekkliste ---- */
.fk-sjekk { --fk-boks: 1.75rem; --fk-spor-h: .5rem; }
.fk-sjekk__status { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--l-s-4); margin: 0; }
.fk-sjekk__tall { font-size: var(--l-t-md); font-weight: var(--l-w-semi); font-variant-numeric: tabular-nums; color: var(--l-ink-2); }
.fk-sjekk__tall b { font-size: var(--l-t-title); font-weight: var(--l-w-black); color: var(--l-purple-ink); }
.fk-sjekk__spor { height: var(--fk-spor-h); border-radius: var(--l-r-pill); background: var(--l-sunk); overflow: hidden; }
.fk-sjekk__spor span { display: block; height: 100%; border-radius: inherit; background: var(--l-purple); transform-origin: 0 50%; transform: scaleX(var(--fk-andel, 0)); }
.fk-sjekk__liste { display: grid; gap: var(--l-s-2); }
.fk-sjekk__liste li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--l-s-3); padding: var(--l-s-3) var(--l-s-4); border-radius: var(--l-r-card); background: var(--l-sunk); }
.fk-sjekk__rad { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--l-s-4); min-height: var(--l-touch); cursor: pointer; }
.fk-sjekk__rad input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.fk-sjekk__boks { display: grid; place-items: center; width: var(--fk-boks); height: var(--fk-boks); border-radius: var(--l-r-xs); background: var(--l-frame); box-shadow: inset 0 0 0 var(--s-ring) var(--l-line-2); color: var(--l-on-fill); }
.fk-sjekk__boks svg { width: var(--l-icon-sm); height: var(--l-icon-sm); opacity: 0; }
.fk-sjekk__rad input:checked + .fk-sjekk__boks { background: var(--l-purple); box-shadow: none; }
.fk-sjekk__rad input:checked + .fk-sjekk__boks svg { opacity: 1; }
.fk-sjekk__rad input:focus-visible + .fk-sjekk__boks { box-shadow: inset 0 0 0 var(--s-ring) var(--l-purple), var(--l-sh-focus); }
.fk-sjekk__tekst { display: grid; gap: var(--l-s-1); }
.fk-sjekk__tekst b { color: var(--l-ink); }
.fk-sjekk__tekst span { font-size: var(--l-t-md); color: var(--l-ink-2); }
.fk-sjekk__rad input:checked ~ .fk-sjekk__tekst b { color: var(--l-mute); text-decoration: line-through; text-decoration-thickness: var(--s-hair); }
.fk-sjekk__lenke { font-size: var(--l-t-sm); font-weight: var(--l-w-semi); white-space: nowrap; }
.fk-sjekk__lenke a { color: var(--l-purple-ink); }
.fk-sjekk__ferdig { display: flex; align-items: center; justify-content: center; gap: var(--l-s-2); margin: 0; padding: var(--l-s-4); border-radius: var(--l-r-card); background: var(--l-green); font-size: var(--l-t-lg); font-weight: var(--l-w-black); color: var(--l-green-ink); }
.fk-sjekk__ferdig[hidden] { display: none; }
@media (max-width: 29.999rem) {
  .fk-sjekk__liste li { grid-template-columns: minmax(0, 1fr); }
  .fk-sjekk__lenke { padding-left: calc(var(--fk-boks) + var(--l-s-4)); }
}
@media (prefers-reduced-motion: no-preference) {
  .fk-sjekk__spor span { transition: transform var(--l-t-slow) var(--l-ease); }
  .fk-sjekk__boks, .fk-sjekk__boks svg { transition: background var(--l-t-fast) var(--l-ease), opacity var(--l-t-fast) var(--l-ease), scale var(--l-t-base) var(--l-ease-fjaer); }
  .fk-sjekk__rad:active .fk-sjekk__boks { scale: var(--l-press); }
  .fk-sjekk__ferdig:not([hidden]) { animation: fk-inn var(--s-rise-time) var(--l-ease-fjaer) backwards; }
}

/* ---- vakt ---- */
/* The clock card: glass, like the price card (lys.css .prisstripe), tinted by the time of day. */
.fk-vakt {
  --fk-vakt-farge: var(--l-tint-lavender); --fk-vakt-pose: 5.5rem;
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--l-s-2) var(--l-s-5);
  width: var(--fk-smal); margin-inline: auto; padding: var(--l-card-pad) clamp(1.25rem, .9rem + 1.6vw, 2rem); overflow: hidden;
  border: var(--s-hair) solid var(--l-line); border-radius: var(--l-r-hero); box-shadow: var(--l-sh-card);
  background: radial-gradient(circle at 100% 0, var(--fk-vakt-farge), transparent 62%), var(--l-frame);
}
.fk-vakt[data-tid="dag"] { --fk-vakt-farge: var(--l-tint-peach); }
.fk-vakt[data-tid="kveld"] { --fk-vakt-farge: var(--l-tint-pink); }
.fk-vakt[data-tid="helg"] { --fk-vakt-farge: var(--l-tint-green); }
.fk-vakt[data-tid="natt"] { --fk-vakt-farge: var(--l-blue-soft); }
.fk-vakt__tid { grid-column: 1; margin: 0; font-size: var(--l-t-sm); font-weight: var(--l-w-black); letter-spacing: var(--l-ls-caps); text-transform: uppercase; font-variant-numeric: tabular-nums; color: var(--l-purple-ink); min-height: 1lh; }
.fk-vakt__tekst { grid-column: 1; display: grid; gap: var(--l-s-1); }
.fk-vakt h2 { margin: 0; font-size: var(--l-t-md); font-weight: var(--l-w-semi); color: var(--l-ink-2); }
.fk-vakt__tekst p { margin: 0; font-size: var(--l-t-display); font-weight: var(--l-w-black); line-height: var(--l-lh-tight); letter-spacing: -.02em; color: var(--l-ink); text-wrap: balance; }
.fk-vakt__pose { grid-column: 2; grid-row: 1 / span 2; width: auto; height: var(--fk-vakt-pose); }

/* ---- hoppmeny ---- */
/* The reading line: a hair of purple along the top edge, as wide as what is read. */
.fk-framdrift { position: fixed; inset: 0 0 auto 0; z-index: var(--l-z-sticky); height: var(--fk-framdrift); pointer-events: none; }
.fk-framdrift span { display: block; height: 100%; border-radius: 0 var(--l-r-pill) var(--l-r-pill) 0; background: var(--l-grad-gauge); transform-origin: 0 50%; transform: scaleX(var(--fk-lest, 0)); }

/* «På denne siden»: the headings, one to a row, the one being read marked. */
.fk-hopp ol { display: grid; gap: var(--s-hair); }
.fk-hopp a {
  display: flex; align-items: center; min-height: var(--l-touch); padding: var(--l-s-2) var(--l-s-3); border-radius: var(--l-r-sm);
  font-size: var(--l-t-md); font-weight: var(--l-w-semi); line-height: var(--l-lh-snug); color: var(--l-ink-2); text-decoration: none;
}
.fk-hopp a:hover { background: var(--l-sunk); color: var(--l-ink); }
.fk-hopp a[aria-current] { background: var(--l-purple-soft); color: var(--l-purple-ink); }
.fk-hopp a:focus-visible { outline: none; box-shadow: var(--l-sh-focus); }
@media (pointer: fine) { .fk-hopp a { min-height: var(--l-s-8); } }
@media (prefers-reduced-motion: no-preference) {
  .fk-hopp a { transition: background var(--l-t-fast) var(--l-ease), translate var(--l-t-fast) var(--l-ease); }
  .fk-hopp a:hover { translate: var(--l-nudge) 0; }
}

/* ---- faqsok ---- */
/* The search field over the questions: the hero's firm search, smaller. As wide as the list under it. */
.fk-faqsok { width: min(100%, 48rem); margin: 0 auto var(--l-s-4); }
.fk-faqsok__felt {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--l-s-3); min-height: var(--l-control); padding-inline: var(--l-s-5);
  border-radius: var(--l-r-pill); background: var(--l-frame); box-shadow: inset 0 0 0 var(--s-hair) var(--l-line-2), var(--l-sh-soft); cursor: text;
}
.fk-faqsok__felt svg { width: var(--l-icon-sm); height: var(--l-icon-sm); color: var(--l-mute); }
.fk-faqsok__felt input { width: 100%; min-height: var(--l-touch); padding: 0; border: 0; background: none; font: inherit; font-size: var(--l-t-body); color: var(--l-ink); -webkit-appearance: none; appearance: none; }
.fk-faqsok__felt input::placeholder { color: var(--l-placeholder); }
.fk-faqsok__felt input:focus { outline: none; }
.fk-faqsok__felt:focus-within { box-shadow: inset 0 0 0 var(--s-ring) var(--l-purple), var(--l-sh-focus); }
.fk-faqsok__status { margin: 0; font-size: var(--l-t-sm); font-weight: var(--l-w-bold); font-variant-numeric: tabular-nums; color: var(--l-purple-ink); white-space: nowrap; }
.fk-faqsok__status[hidden], .fk-faqsok__tomt[hidden] { display: none; }
.fk-faqsok__tomt { margin: var(--l-s-4) 0 0; text-align: center; color: var(--l-ink-2); }
.fk-faqsok__tomt a { color: var(--l-purple-ink); font-weight: var(--l-w-semi); }
.faq > details[hidden] { display: none; }

/* ---- del ---- */
.fk-del__knapp { width: 100%; }

/* ---- fagvelger ---- */
.fk-fag { display: grid; gap: var(--l-s-3); }
.fk-fag .fk-pille span { min-height: var(--l-s-8); padding-inline: var(--l-s-4); font-size: var(--l-t-sm); }
@media (pointer: coarse) { .fk-fag .fk-pille span { min-height: var(--l-touch); } }
.fk-fag__lenke { font-size: var(--l-t-md); font-weight: var(--l-w-semi); color: var(--l-purple-ink); }
.fk-fag__lenke[hidden] { display: none; }

/* ---- sidesok ---- */
/* The dock's search: the field is the questions' search field (faqsok.css
   .fk-faqsok__felt, repeated here so the search stands without that feature). */
.fk-sok { display: grid; gap: var(--l-s-2); }
.fk-sok__felt {
  display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--l-s-3); min-height: var(--l-control); padding-inline: var(--l-s-4);
  border-radius: var(--l-r-pill); background: var(--l-sunk); box-shadow: inset 0 0 0 var(--s-hair) var(--l-line-2); cursor: text;
}
.fk-sok__felt svg { width: var(--l-icon-sm); height: var(--l-icon-sm); color: var(--l-mute); }
.fk-sok__felt input { width: 100%; min-height: var(--l-touch); padding: 0; border: 0; background: none; font: inherit; font-size: var(--l-t-body); color: var(--l-ink); -webkit-appearance: none; appearance: none; }
.fk-sok__felt input::placeholder { color: var(--l-placeholder); }
.fk-sok__felt input:focus { outline: none; }
.fk-sok__felt:focus-within { background: var(--l-frame); box-shadow: inset 0 0 0 var(--s-ring) var(--l-purple), var(--l-sh-focus); }
.fk-sok__treff { display: grid; gap: var(--s-hair); }
.fk-sok__treff:empty { display: none; }
.fk-sok__treff a { display: grid; gap: 0; padding: var(--l-s-2) var(--l-s-3); border-radius: var(--l-r-sm); color: var(--l-ink); text-decoration: none; }
.fk-sok__treff b { font-size: var(--l-t-md); font-weight: var(--l-w-semi); line-height: var(--l-lh-snug); }
.fk-sok__treff span { font-size: var(--l-t-xs); color: var(--l-mute); }
.fk-sok__treff a:hover, .fk-sok__treff a:focus-visible { outline: none; background: var(--l-purple-soft); color: var(--l-purple-ink); }
.fk-sok__tomt { margin: 0; padding-inline: var(--l-s-3); font-size: var(--l-t-sm); color: var(--l-mute); }
.fk-sok__tomt[hidden] { display: none; }

/* ---- delregn ---- */
.fk-delregn { display: flex; justify-content: center; margin: var(--l-s-5) 0 0; }

/* ---- nytt ---- */
/* /nytt/: a line down the left with a dot per day, and the day's cards beside it. */
.fk-nytt { --fk-linje: var(--l-s-5); display: grid; gap: var(--l-s-8); width: var(--fk-smal); margin-inline: auto; }
.fk-nytt__dag { position: relative; display: grid; gap: var(--l-s-4); padding-left: calc(var(--fk-linje) + var(--l-s-4)); }
.fk-nytt__dag::before { content: ""; position: absolute; left: calc(var(--fk-prikk) / 2 - var(--s-hair) / 2); top: var(--l-s-5); bottom: calc(-1 * var(--l-s-8)); width: var(--s-hair); background: var(--l-line-2); }
.fk-nytt__dag:last-child::before { bottom: 0; }
.fk-nytt__dag::after { content: ""; position: absolute; left: 0; top: .45em; width: var(--fk-prikk); height: var(--fk-prikk); border-radius: var(--l-r-pill); background: var(--l-purple); box-shadow: 0 0 0 var(--l-s-1) var(--l-purple-soft); }
.fk-nytt__dato { font-size: var(--l-t-sm); font-weight: var(--l-w-black); letter-spacing: var(--l-ls-caps); text-transform: uppercase; color: var(--l-purple-ink); }
.fk-nytt__kort { display: grid; gap: var(--l-s-4); }
.fk-nytt__sak { box-shadow: var(--l-sh-soft); }
.fk-nytt__sak h3 { margin: 0; }
.fk-nytt__lenke { font-weight: var(--l-w-semi); }
.fk-nytt__lenke a { color: var(--l-purple-ink); }
@media (prefers-reduced-motion: no-preference) {
  .fk-nytt__sak { transition: translate var(--l-t-base) var(--l-ease), box-shadow var(--l-t-base) var(--l-ease); }
  .fk-nytt__sak:hover { translate: 0 var(--l-lift); box-shadow: var(--l-sh-hover); }
}

/* ---- verv ---- */
.fk-verv__merke { display: inline-flex; align-items: center; gap: var(--l-s-2); justify-self: center; margin: 0 0 var(--l-s-3); padding: var(--l-s-2) var(--l-s-4); border-radius: var(--l-r-pill); background: var(--l-green); font-size: var(--l-t-sm); font-weight: var(--l-w-bold); color: var(--l-green-ink); }
.fk-verv__merke[hidden] { display: none; }
.fk-verv__pris { max-width: var(--s-measure); margin: var(--l-s-7) auto 0; text-align: center; color: var(--l-ink-2); text-wrap: pretty; }
@media (prefers-reduced-motion: no-preference) {
  .fk-verv__merke:not([hidden]) { animation: fk-inn var(--s-rise-time) var(--l-ease-fjaer) backwards; }
}

/* ---- enside ---- */
/* /pling-pa-en-side/: one sheet. On screen a card with the proportions of a
   page; in print, the sheet alone on one A4. */
.fk-ark-seksjon { --fk-ark-b: min(100%, 50rem); --fk-ark-qr: 6.5rem; --fk-ark-logo: 6.5rem; }
.fk-ark__knapper { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--l-s-3); margin: 0 0 var(--l-s-6); }
.fk-ark {
  display: grid; gap: var(--l-s-5); width: var(--fk-ark-b); margin-inline: auto; padding: clamp(1.25rem, .5rem + 3.5vw, 3rem);
  border: var(--s-hair) solid var(--l-line); border-radius: var(--l-r-hero); background: var(--l-frame); box-shadow: var(--l-sh-pop);
}
.fk-ark__topp { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--l-s-3); padding-bottom: var(--l-s-4); border-bottom: var(--s-hair) solid var(--l-line-2); }
.fk-ark__logo { width: var(--fk-ark-logo); height: auto; }
.fk-ark__topp p { margin: 0; font-family: var(--s-hand); font-size: var(--l-t-title); color: var(--l-purple-ink); }
.fk-ark h2 { margin: 0; font-size: var(--s-h2); font-weight: var(--l-w-black); line-height: var(--l-lh-tight); letter-spacing: -.03em; color: var(--l-ink); text-wrap: balance; }
.fk-ark__lead { margin: 0; font-size: var(--s-lead); color: var(--l-ink-2); }
.fk-ark__steg { display: grid; gap: var(--l-s-3); }
@media (min-width: 40rem) { .fk-ark__steg { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.fk-ark__steg li { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--l-s-3); padding: var(--l-s-4); border-radius: var(--l-r-card); background: var(--l-sunk); }
.fk-ark__steg .tegnet { width: var(--fk-flis-ikon); height: var(--fk-flis-ikon); }
.fk-ark__steg p { display: grid; gap: var(--l-s-1); margin: 0; }
.fk-ark__steg b { color: var(--l-ink); }
.fk-ark__steg span { font-size: var(--l-t-md); color: var(--l-ink-2); }
.fk-ark__to { display: grid; gap: var(--l-s-3); }
@media (min-width: 40rem) { .fk-ark__to { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.fk-ark__boks { display: grid; gap: var(--l-s-3); align-content: start; padding: var(--l-s-5); border: var(--s-hair) solid var(--l-line-2); border-radius: var(--l-r-card); }
.fk-ark__boks--pris { border-color: transparent; background: var(--l-tint-lavender); }
.fk-ark__boks h3 { margin: 0; font-size: var(--s-h3); font-weight: var(--l-w-bold); color: var(--l-ink); }
.fk-ark__boks p { margin: 0; color: var(--l-ink-2); }
.fk-ark__boks--pris p { font-weight: var(--l-w-semi); color: var(--l-ink); }
.fk-ark__boks ul { display: grid; gap: var(--l-s-2); }
.fk-ark__boks li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--l-s-2); font-size: var(--l-t-md); color: var(--l-ink-2); }
.fk-ark__boks li svg { width: var(--l-icon-sm); height: var(--l-icon-sm); margin-top: .2em; color: var(--l-green-ink); }
.fk-ark__bunn { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--l-s-5); padding-top: var(--l-s-4); border-top: var(--s-hair) solid var(--l-line-2); }
.fk-ark__bunn img { width: var(--fk-ark-qr); height: var(--fk-ark-qr); }
.fk-ark__bunn p { display: grid; gap: var(--l-s-1); margin: 0; }
.fk-ark__bunn b { font-size: var(--l-t-lg); color: var(--l-ink); }
.fk-ark__bunn span { font-size: var(--l-t-md); color: var(--l-ink-2); }
.fk-ark__juss { margin: 0; font-size: var(--l-t-xs); color: var(--l-mute); }

@media print {
  @page { size: A4; margin: 12mm; }
  .fk-ark-side { background: none; }
  .fk-ark-side .top, .fk-ark-side .sh-topp, .fk-ark-side .foot, .fk-ark-side .foot__ord, .fk-ark-side .skip, .fk-ark-side .fk-ark__knapper, .fk-ark-side .lapp-rad { display: none; }
  .fk-ark-side .frame { margin: 0; padding: 0; border-radius: 0; box-shadow: none; background: none; }
  .fk-ark-side .frame::before, .fk-ark-side .frame::after { content: none; }
  .fk-ark-side .section { padding: 0; }
  .fk-ark-side .wrap { width: 100%; }
  .fk-ark { width: 100%; padding: 0; border: 0; border-radius: 0; box-shadow: none; gap: 5mm; }
  .fk-ark__steg, .fk-ark__to { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fk-ark__steg li, .fk-ark__boks { break-inside: avoid; }
  .fk-ark, .fk-ark * { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}

/* ---- alt ---- */
/* /funksjoner/: the catalogue. Colours, type and space are the Lys tokens. */
.fu-filter, .fu-liste { width: var(--fk-maks); margin-inline: auto; }
.fu-filter { --fu-sok-b: 18rem; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--l-s-4); align-items: end; padding-top: var(--l-s-6); }
.fu-filter[hidden], .fu-gruppe[hidden], .fu-liste > li[hidden], .fu-filter__tomt[hidden] { display: none; }
.fu-filter__valg legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.fu-filter__sok {
  display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--l-s-3);
  min-height: var(--l-control); padding-inline: var(--l-s-4); border: var(--s-hair) solid var(--l-line-2); border-radius: var(--l-r-pill); background: var(--l-panel); color: var(--l-mute);
}
.fu-filter__sok svg { width: var(--l-icon-sm); height: var(--l-icon-sm); }
.fu-filter__sok input { width: 100%; min-width: 0; border: 0; background: none; font: inherit; font-size: var(--l-t-body); color: var(--l-ink); }
.fu-filter__sok input::placeholder { color: var(--l-placeholder); }
.fu-filter__sok input:focus { outline: none; }
.fu-filter__sok:focus-within { border-color: var(--l-purple); box-shadow: var(--l-sh-focus); }
.fu-filter__tur { justify-self: start; }
.fu-filter__tomt { margin: 0; font-weight: var(--l-w-semi); color: var(--l-ink-2); }
@media (min-width: 48rem) {
  .fu-filter { grid-template-columns: minmax(0, 1fr) var(--fu-sok-b) auto; }
  .fu-filter__tomt { grid-column: 1 / -1; }
}

.fu-liste { --fu-min: 9.25rem; --fu-zoom: 1.03; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--fu-min)), 1fr)); gap: var(--l-gap); }
.fu-liste--pc { --fu-min: 18rem; }
@media (min-width: 40rem) { .fu-liste { --fu-min: 13.5rem; } .fu-liste--pc { --fu-min: 19rem; } }
.fu-liste > li { display: grid; }
.fu-kort {
  display: grid; align-content: start; gap: var(--l-s-2); padding: var(--l-s-3); padding-bottom: var(--l-s-4);
  border: var(--s-hair) solid var(--l-line); border-radius: var(--l-r-card); background: var(--l-frame); box-shadow: var(--l-sh-soft);
  color: inherit; text-decoration: none; scroll-margin-top: var(--l-s-9);
}
.fu-kort__bilde { display: block; overflow: hidden; border-radius: var(--l-r-md); background: var(--l-sunk); aspect-ratio: 4 / 5; margin-bottom: var(--l-s-2); }
.fu-kort__bilde--pc { aspect-ratio: 8 / 5; }
.fu-kort__bilde img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 0; }
.fu-kort b { padding-inline: var(--l-s-1); font-size: var(--l-t-md); font-weight: var(--l-w-bold); line-height: var(--l-lh-snug); color: var(--l-ink); text-wrap: balance; }
.fu-kort > span:last-child { padding-inline: var(--l-s-1); font-size: var(--l-t-sm); line-height: var(--l-lh-body); color: var(--l-ink-2); text-wrap: pretty; }
.fu-kort:focus-visible { outline: none; box-shadow: var(--l-sh-focus); }
.fu-kort:target { border-color: var(--l-purple); box-shadow: var(--l-sh-focus); }
@media (min-width: 40rem) {
  .fu-kort b { font-size: var(--l-t-lg); }
  .fu-kort > span:last-child { font-size: var(--l-t-md); }
}
@media (prefers-reduced-motion: no-preference) {
  .fu-kort { transition: translate var(--l-t-base) var(--l-ease), box-shadow var(--l-t-base) var(--l-ease); }
  .fu-kort__bilde img { transition: scale var(--l-t-slow) var(--l-ease); }
  .fu-kort:hover { translate: 0 var(--l-lift); box-shadow: var(--l-sh-hover); }
  .fu-kort:hover .fu-kort__bilde img { scale: var(--fu-zoom); }
  .fu-kort:active { scale: var(--l-press); }
}

/* ---- omvisning ---- */
/* The tour's window on /funksjoner/. */
.fu-vis { --fu-vis-zoom: 1.08; --fu-vis-b: min(calc(100vw - 2 * var(--l-s-4)), 52rem); --fu-vis-bilde: min(52vh, 30rem); width: var(--fu-vis-b); max-width: none; max-height: calc(100dvh - 2 * var(--l-s-4)); margin: auto; padding: 0; border: 0; border-radius: var(--l-r-hero); background: var(--l-frame); color: var(--l-ink); box-shadow: var(--l-sh-pop); overflow: auto; }
.fu-vis::backdrop { background: var(--l-scrim); }
.fu-vis__ramme { display: grid; gap: var(--l-s-4); padding: var(--l-card-pad); }
.fu-vis__ramme > * { margin: 0; min-width: 0; }
.fu-vis__topp { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--l-s-3); }
.fu-vis__teller { font-size: var(--l-t-sm); font-weight: var(--l-w-semi); font-variant-numeric: tabular-nums; color: var(--l-mute); }
.fu-vis__lukk { display: grid; place-items: center; width: var(--l-touch); height: var(--l-touch); border: 0; border-radius: var(--l-r-pill); background: var(--l-sunk); color: var(--l-ink); cursor: pointer; }
.fu-vis__lukk svg { width: var(--l-icon-sm); height: var(--l-icon-sm); }
.fu-vis__lukk:focus-visible { outline: none; box-shadow: var(--l-sh-focus); }
.fu-vis__bilde { display: grid; place-items: center; border-radius: var(--l-r-card); background: var(--l-sunk); overflow: hidden; }
.fu-vis__bilde img { display: block; width: auto; max-width: 100%; height: auto; max-height: var(--fu-vis-bilde); }
.fu-vis__tekst { display: grid; gap: var(--l-s-2); }
.fu-vis__tekst h2 { margin: 0; font-size: var(--l-t-title); line-height: var(--l-lh-snug); }
.fu-vis__tekst p { margin: 0; font-size: var(--l-t-body); line-height: var(--l-lh-body); color: var(--l-ink-2); }
.fu-vis__knapper { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--l-s-3); }
/* A phone picture stands beside its text when there is room; a desk picture keeps the full width. */
@media (min-width: 48rem) {
  .fu-vis:not(.fu-vis--bred) { --fu-vis-bilde: min(68vh, 34rem); }
  .fu-vis:not(.fu-vis--bred) .fu-vis__ramme { grid-template-columns: auto minmax(0, 1fr); align-items: center; column-gap: var(--l-s-6); }
  .fu-vis:not(.fu-vis--bred) .fu-vis__topp, .fu-vis:not(.fu-vis--bred) .fu-vis__knapper { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: no-preference) {
  .fu-vis[open] { animation: fk-inn var(--s-rise-time) var(--l-ease-fjaer) backwards; }
  .fu-vis__lukk { transition: scale var(--l-t-fast) var(--l-ease); }
  .fu-vis__lukk:hover { scale: var(--fu-vis-zoom); }
  .fu-vis__lukk:active { scale: var(--l-press); }
}

/* ---- kundereise ---- */
/* /for-kunden/: four steps as radio buttons, and the picture of the ticked one (no script). */
.kr-reise { --kr-skjerm: 20rem; --kr-nr: 2.25rem; --kr-b: 52rem; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--l-gap); width: 100%; max-width: var(--kr-b); margin-inline: auto; align-items: center; }
.kr-steg { display: grid; gap: var(--l-s-3); margin: 0; padding: 0; border: 0; min-width: 0; }
.kr-steg legend { padding: 0; margin-bottom: var(--l-s-4); font-size: var(--l-t-title); font-weight: var(--l-w-bold); line-height: var(--l-lh-snug); color: var(--l-ink); }
.kr-valg { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--l-s-4); min-height: var(--l-touch); padding: var(--l-s-4); border-radius: var(--l-r-card); background: var(--l-frame); box-shadow: inset 0 0 0 var(--s-hair) var(--l-line-2), var(--l-sh-soft); cursor: pointer; }
.kr-valg input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.kr-valg__nr { display: grid; place-items: center; width: var(--kr-nr); height: var(--kr-nr); border-radius: var(--l-r-pill); background: var(--l-sunk); font-weight: var(--l-w-bold); font-variant-numeric: tabular-nums; color: var(--l-ink-2); }
.kr-valg__tekst { display: grid; gap: var(--l-s-1); }
.kr-valg__tekst b { font-size: var(--l-t-lg); line-height: var(--l-lh-snug); color: var(--l-ink); }
.kr-valg__tekst span { font-size: var(--l-t-md); line-height: var(--l-lh-body); color: var(--l-ink-2); text-wrap: pretty; }
.kr-valg:has(input:checked) { background: var(--l-purple-soft); box-shadow: inset 0 0 0 var(--s-ring) var(--l-purple); }
.kr-valg:has(input:checked) .kr-valg__nr { background: var(--l-purple); color: var(--l-on-fill); }
.kr-valg:has(input:focus-visible) { box-shadow: inset 0 0 0 var(--s-ring) var(--l-purple), var(--l-sh-focus); }
.kr-skjerm { justify-self: center; display: grid; width: 100%; max-width: var(--kr-skjerm); padding: var(--l-s-2); border-radius: var(--l-r-hero); background: var(--l-frame); border: var(--s-hair) solid var(--l-line); box-shadow: var(--l-sh-card); }
.kr-skjerm img { display: none; grid-area: 1 / 1; width: 100%; height: auto; border-radius: var(--l-r-card); }
.kr-reise:has(input[value="avtalt"]:checked) img[data-kr="avtalt"],
.kr-reise:has(input[value="pa-vei"]:checked) img[data-kr="pa-vei"],
.kr-reise:has(input[value="ferdig"]:checked) img[data-kr="ferdig"],
.kr-reise:has(input[value="kvittering"]:checked) img[data-kr="kvittering"] { display: block; }
/* A browser that cannot ask «which one is ticked» shows all four. */
@supports not selector(:has(*)) {
  .kr-skjerm { gap: var(--l-s-2); }
  .kr-skjerm img { display: block; grid-area: auto; }
}
.fu-liste.kr-svar { width: var(--fk-kort); grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--fu-min)), 1fr)); }
@media (min-width: 48rem) {
  .kr-reise { grid-template-columns: minmax(0, 1fr) var(--kr-skjerm); column-gap: var(--l-s-9); }
}
/* On a phone the picture stands over the steps, small enough that both are on the screen at once, and only the ticked step keeps its line. */
@media (max-width: 47.999rem) {
  .kr-reise { --kr-skjerm: 13.5rem; }
  .kr-skjerm { order: -1; }
  .kr-steg legend { text-align: center; width: 100%; }
  .kr-valg { padding-block: var(--l-s-3); }
  .kr-valg:not(:has(input:checked)) .kr-valg__tekst span { display: none; }
}
@media (prefers-reduced-motion: no-preference) {
  .kr-valg { transition: translate var(--l-t-fast) var(--l-ease), background var(--l-t-fast) var(--l-ease), box-shadow var(--l-t-fast) var(--l-ease); }
  .kr-valg:hover { translate: 0 var(--l-lift-sm); }
  .kr-valg:active { scale: var(--l-press); }
  .kr-reise:has(input:checked) .kr-skjerm img { animation: fk-inn var(--s-rise-time) var(--l-ease) backwards; }
}

/* ---- bytt ---- */
/* /bytt-til-pling/: the steps, one card each. */
.by-liste { --by-nr: 2rem; --by-ikon: 2.75rem; list-style: none; margin: 0 auto; padding: 0; display: grid; gap: var(--l-s-3); width: var(--fk-smal); }
.by-liste > li { display: grid; }
.by-steg { display: grid; grid-template-columns: auto auto minmax(0, 1fr); align-items: start; gap: var(--l-s-4); padding: var(--l-card-pad); border: var(--s-hair) solid var(--l-line); border-radius: var(--l-r-card); background: var(--l-frame); box-shadow: var(--l-sh-soft); color: inherit; text-decoration: none; }
.by-steg__nr { display: grid; place-items: center; width: var(--by-nr); height: var(--by-nr); border-radius: var(--l-r-pill); background: var(--l-purple-soft); font-size: var(--l-t-md); font-weight: var(--l-w-bold); font-variant-numeric: tabular-nums; color: var(--l-purple-ink); }
.by-steg .by-steg__ikon { width: var(--by-ikon); height: var(--by-ikon); }
.by-steg__tekst { display: grid; gap: var(--l-s-1); }
.by-steg__tekst b { font-size: var(--l-t-lg); line-height: var(--l-lh-snug); color: var(--l-ink); }
.by-steg__tekst > span { font-size: var(--l-t-md); line-height: var(--l-lh-body); color: var(--l-ink-2); text-wrap: pretty; }
.by-steg__tekst > .by-steg__lenke { display: inline-flex; align-items: center; gap: var(--l-s-1); margin-top: var(--l-s-1); font-weight: var(--l-w-semi); color: var(--l-purple-ink); }
.by-steg__lenke svg { width: var(--l-icon-sm); height: var(--l-icon-sm); }
.by-steg--lenke:focus-visible { outline: none; box-shadow: var(--l-sh-focus); }
@media (max-width: 29.999rem) {
  .by-steg { grid-template-columns: auto minmax(0, 1fr); }
  .by-steg .by-steg__ikon { display: none; }
}
@media (prefers-reduced-motion: no-preference) {
  .by-steg--lenke { transition: translate var(--l-t-base) var(--l-ease), box-shadow var(--l-t-base) var(--l-ease); }
  .by-steg__lenke svg { transition: translate var(--l-t-base) var(--l-ease); }
  .by-steg--lenke:hover { translate: 0 var(--l-lift); box-shadow: var(--l-sh-hover); }
  .by-steg--lenke:hover .by-steg__lenke svg { translate: var(--l-nudge) calc(-1 * var(--l-nudge)); }
  .by-steg--lenke:active { scale: var(--l-press); }
}

/* ---- sikkerhet ---- */
/* /sikkerhet/: the facts as the sub pages' cards, and the one line about the backup. */
.si-kort { width: var(--fk-maks); }
.si-kort .sh-kort a { color: var(--l-purple-ink); font-weight: var(--l-w-semi); }
.si-kopi { --si-ikon: 3rem; justify-items: center; text-align: center; gap: var(--l-s-3); }
.si-kopi .si-kopi__ikon { width: var(--si-ikon); height: var(--si-ikon); }
.si-kopi h2 { margin: 0; font-size: var(--l-t-title); }
.si-kopi p { margin: 0; color: var(--l-ink-2); max-width: var(--s-measure); text-wrap: pretty; }

/* ---- hurtigtaster ---- */
/* /funksjoner/hurtigtaster/: the sheet of keys; printed, the sheet alone. */
.ta-ark { --ta-tast: 2rem; width: var(--fk-smal); }
.ta-ark h2 { margin: 0; font-size: var(--l-t-title); }
.ta-grupper { display: grid; gap: var(--l-s-6); }
.ta-kolonne { display: grid; gap: var(--l-s-6); align-content: start; }
.ta-gruppe { display: grid; gap: var(--l-s-3); align-content: start; }
.ta-gruppe h3 { margin: 0; font-size: var(--l-t-sm); font-weight: var(--l-w-bold); letter-spacing: var(--l-ls-caps); text-transform: uppercase; color: var(--l-mute); }
.ta-gruppe ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--l-s-2); }
.ta-gruppe li { display: grid; grid-template-columns: calc(2 * var(--ta-tast) + var(--l-s-1)) minmax(0, 1fr); align-items: center; gap: var(--l-s-4); font-size: var(--l-t-body); color: var(--l-ink); }
.ta-taster { display: flex; gap: var(--l-s-1); }
.ta-ark kbd { display: grid; place-items: center; min-width: var(--ta-tast); height: var(--ta-tast); padding-inline: var(--l-s-2); border-radius: var(--l-r-sm); background: var(--l-sunk); box-shadow: inset 0 0 0 var(--s-hair) var(--l-line-2), 0 var(--s-hair) 0 var(--l-line-2); font: inherit; font-size: var(--l-t-md); font-weight: var(--l-w-bold); color: var(--l-ink); }
.ta-merk { margin: 0; font-size: var(--l-t-md); color: var(--l-ink-2); }
@media (min-width: 36rem) { .ta-grupper { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media print {
  .ta-side { background: none; }
  .ta-side .top, .ta-side .sh-topp, .ta-side .foot, .ta-side .foot__ord, .ta-side .skip, .ta-side .fk-ark__knapper, .ta-side .lapp-rad, .ta-side .sh-slutt, .ta-side .fk-flere, .ta-side .fk-dokk { display: none; }
  .ta-side .frame { margin: 0; padding: 0; border-radius: 0; box-shadow: none; background: none; }
  .ta-side .frame::before, .ta-side .frame::after { content: none; }
  .ta-side .section { padding: 0; }
  .ta-ark { width: 100%; border: 0; box-shadow: none; }
  .ta-grupper { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ta-ark, .ta-ark * { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}

/* ---- feil ---- */
/* The 404 page: the suggestions, the search field and the ways on. */
.feil__finn { display: grid; gap: var(--l-s-3); width: var(--fk-smal); text-align: left; }
.feil__finn[hidden] { display: none; }
.feil__finn h2 { margin: 0; font-size: var(--l-t-lg); text-align: center; }
.feil__finn .fk-sok__treff { list-style: none; margin: 0; padding: 0; }
.feil__finn .fk-sok__tomt { text-align: center; }
.feil .feil__videre { width: var(--fk-smal); grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); text-align: left; }
.feil__finn .fk-sok__treff a { background: var(--l-frame); box-shadow: inset 0 0 0 var(--s-hair) var(--l-line); padding: var(--l-s-3) var(--l-s-4); }
.feil__finn .fk-sok__treff { gap: var(--l-s-2); }
.feil .feil__videre .bylenke span { max-width: none; }
