/* ==========================================================================
   Arvebo – designsystem
   Håndskrevet CSS. Tokens, typografi og komponentmål er hentet fra
   referansedesignet (theme-color #f7f4ec). Ingen rammeverk, ingen build.
   Rekkefølge: tokens → fonter → basis → layout → typografi → komponenter
   → seksjoner → footer → banner → eldre sider.
   ========================================================================== */

:root{
  /* Flater */
  --papir:#f7f4ec;
  --sand:#e7dfcf;
  --sand-lys:#efe9dd;
  --hvit:#fff;
  /* Grønt og tekst */
  --skog:#18352b;
  --skog-dyp:#10261f;
  --blekk:#19211d;
  --stein:#5f605a;
  /* Linjer */
  --linje:#dcd4c3;
  --linje-myk:#e8e2d6;
  --felt-kant:#9a917f;
  --felt-kant-hover:#7d7566;
  /* På mørk bunn */
  --lys:#f7f4ec;
  --lys-dempet:#b9c4bb;
  --lys-linje:#36554a;
  /* Status */
  --feil:#9e2a1c;

  --radius-flate:1rem;
  --radius-felt:.625rem;

  --ramme:1200px;
  --marg:clamp(1.25rem, 4.5vw, 3rem);
  --topp:4rem;
  --seksjon:clamp(4.5rem, 2.75rem + 6.5vw, 8.5rem);

  --sans:"Hanken Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --serif:"Arvebo Serif", ui-serif, Georgia, "Times New Roman", serif;
}
@media (min-width:1024px){ :root{ --topp:5rem; } }

/* ---------- Fonter ---------- */
@font-face{
  font-family:"Arvebo Serif";
  src:url(/fonter/arvebo-serif.woff2) format("woff2");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Hanken Grotesk";
  src:url(/fonter/hanken-grotesk.woff2) format("woff2");
  font-weight:400 600; font-style:normal; font-display:swap;
}

/* ---------- Basis ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{
  background:var(--papir);
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--topp) + 1.25rem);
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation:none !important;transition:none !important;}
}
body{
  background:var(--papir);
  color:var(--blekk);
  font-family:var(--sans);
  font-size:1.0625rem;
  line-height:1.6;
  font-synthesis:none;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  -webkit-tap-highlight-color:transparent;
  display:flex;
  flex-direction:column;
  min-height:100dvh;
}
img,svg,picture{display:block;max-width:100%;}
img{height:auto;}
a{color:inherit;}
button,input,select,textarea{font:inherit;color:inherit;}
ul,ol{list-style:none;}
:focus-visible:not(.felt,.slider){
  outline:2.5px solid var(--skog);
  outline-offset:3px;
  border-radius:4px;
}
.pa-skog :focus-visible:not(.felt,.slider){outline-color:var(--lys);}
.sr-only{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip-path:inset(50%);white-space:nowrap;border-width:0;
}
.hopp-til:focus{
  position:fixed;left:1rem;top:1rem;z-index:60;
  width:auto;height:auto;margin:0;clip-path:none;
  background:var(--skog);color:var(--lys);
  padding:.75rem 1.25rem;border-radius:999px;font-weight:600;
}

/* ---------- Layout ---------- */
.ramme{
  width:100%;
  max-width:calc(var(--ramme) + var(--marg) * 2);
  margin-inline:auto;
  padding-inline:var(--marg);
}
.seksjon{padding-block:var(--seksjon);}
.seksjon-topp-0{padding-top:0;}
main{flex:1;}
.skille{border-top:1px solid var(--linje);}
.skille-topp{padding-top:var(--seksjon);}

/* ---------- Typografi ---------- */
.serif{font-family:var(--serif);font-optical-sizing:auto;font-weight:400;}
.tall{font-variant-numeric:tabular-nums lining-nums;}
.tittel-hero{
  font-family:var(--serif);font-optical-sizing:auto;font-weight:400;
  font-size:clamp(2.5rem, 1.35rem + 4.2vw, 4.75rem);
  line-height:1.02;letter-spacing:-.022em;text-wrap:balance;
}
.tittel-stor{
  font-family:var(--serif);font-optical-sizing:auto;font-weight:400;
  font-size:clamp(2rem, 1.3rem + 2.6vw, 3.375rem);
  line-height:1.06;letter-spacing:-.018em;text-wrap:balance;
}
.tittel{
  font-family:var(--serif);font-optical-sizing:auto;font-weight:400;
  font-size:clamp(1.5rem, 1.2rem + 1.1vw, 2.125rem);
  line-height:1.12;letter-spacing:-.012em;text-wrap:balance;
}
.tittel-liten{
  font-family:var(--serif);font-optical-sizing:auto;font-weight:400;
  font-size:1.375rem;line-height:1.2;letter-spacing:-.006em;
}
.ingress{
  font-size:clamp(1.125rem, 1.02rem + .4vw, 1.3125rem);
  line-height:1.5;text-wrap:pretty;
}
.liten{font-size:.9375rem;line-height:1.55;}
.brodtekst p + p{margin-top:1em;}
.skog{color:var(--skog);}
.stein{color:var(--stein);}
.blekk{color:var(--blekk);}
.lenke{
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:.22em;
  transition:text-decoration-color .16s;
}
.lenke:hover{text-decoration-color:currentColor;}
.pil::after{content:"→";display:inline-block;margin-left:.4em;transition:transform .16s;}
.pil:hover::after{transform:translateX(3px);}

/* ---------- Knapper ---------- */
.knapp{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  min-height:3.375rem;padding:0 1.625rem;
  border:none;border-radius:999px;
  font-size:1.0625rem;font-weight:600;line-height:1.2;
  white-space:nowrap;cursor:pointer;text-decoration:none;
  transition:background-color .16s, color .16s, box-shadow .16s;
}
.knapp:disabled,.knapp[aria-disabled="true"]{opacity:.6;cursor:not-allowed;}
.knapp-primar{background:var(--skog);color:var(--lys);}
.knapp-primar:hover{background:var(--skog-dyp);}
.knapp-rolig{
  background:transparent;color:var(--skog);
  box-shadow:inset 0 0 0 1.5px rgba(24,53,43,.35);
}
.knapp-rolig:hover{box-shadow:inset 0 0 0 1.5px var(--skog);}
.pa-skog .knapp-rolig{color:var(--lys);box-shadow:inset 0 0 0 1.5px var(--lys-linje);}
.pa-skog .knapp-rolig:hover{box-shadow:inset 0 0 0 1.5px var(--lys-dempet);}
.knapp-liten{min-height:2.75rem;padding:0 1.125rem;font-size:.975rem;}
.knapp-bred{width:100%;}
@media (min-width:640px){ .knapp-bred{width:auto;} }

/* ---------- Skjemafelt ---------- */
.etikett{display:block;margin-bottom:.45rem;font-size:.975rem;font-weight:600;line-height:1.3;}
.hint{color:var(--stein);font-weight:400;}
.felt{
  display:block;width:100%;min-height:3.25rem;
  padding:.8rem .95rem;
  background:var(--hvit);color:var(--blekk);
  border:1.5px solid var(--felt-kant);
  border-radius:var(--radius-felt);
  font-size:1.0625rem;line-height:1.35;
  transition:border-color .14s;
}
.felt:hover{border-color:var(--felt-kant-hover);}
.felt:focus{border-color:var(--skog);outline:none;box-shadow:0 0 0 3px rgba(24,53,43,.14);}
.felt[aria-invalid="true"]{border-color:var(--feil);}
textarea.felt{min-height:auto;resize:vertical;}
.felt,.valg input,.valgflate input,fieldset[tabindex]{scroll-margin-top:calc(var(--topp) + 1rem);}
.feltfeil{
  display:block;margin-top:.4rem;
  font-size:.9375rem;line-height:1.4;color:var(--feil);font-weight:600;
}

/* Runde valg (radio/checkbox som piller) */
.valg{position:relative;display:inline-flex;}
.valg input{position:absolute;inset:0;opacity:0;cursor:pointer;}
.valg span{
  display:inline-flex;align-items:center;gap:.5rem;
  min-height:2.875rem;padding:0 1.05rem;
  background:var(--hvit);border-radius:999px;
  box-shadow:inset 0 0 0 1.5px var(--felt-kant);
  font-size:1rem;
  transition:background-color .14s, box-shadow .14s, color .14s;
}
.valg-fyll span{width:100%;}
.valg input:checked + span{background:var(--skog);color:var(--lys);box-shadow:none;}
.valg-hake span::before{
  content:"";width:.95rem;height:.95rem;margin-left:-.15rem;
  background:var(--hvit);border-radius:3px;
  box-shadow:inset 0 0 0 1.5px var(--felt-kant);
}
.valg-hake input:checked + span::before{
  background:var(--lys);
  box-shadow:inset 0 0 0 1.5px var(--lys);
}
.valggruppe{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;}
@media (min-width:640px){ .valggruppe{display:flex;flex-wrap:wrap;} }

/* Store valgflater (befaringstype) */
.valgflate{position:relative;display:block;cursor:pointer;}
.valgflate input{position:absolute;inset:0;opacity:0;cursor:pointer;}
.valgflate > span{
  display:block;height:100%;
  padding:.95rem 1.1rem 1rem 3rem;
  background:var(--hvit);border-radius:var(--radius-felt);
  box-shadow:inset 0 0 0 1.5px var(--felt-kant);
  transition:box-shadow .14s;
}
.valgflate:hover > span{box-shadow:inset 0 0 0 1.5px var(--felt-kant-hover);}
.valgflate > span::before{
  content:"";position:absolute;left:1.1rem;top:1.15rem;
  width:1.15rem;height:1.15rem;border-radius:50%;
  background:var(--hvit);
  box-shadow:inset 0 0 0 1.5px var(--felt-kant);
  transition:box-shadow .14s;
}
.valgflate input:checked + span::before{box-shadow:inset 0 0 0 .35rem var(--skog);}
.valgflate input:checked + span{box-shadow:inset 0 0 0 1.5px var(--skog);}

/* Slider */
.slider{
  --andel:0%;
  -webkit-appearance:none;appearance:none;
  display:block;width:100%;height:3rem;margin:0;
  background:transparent;cursor:pointer;touch-action:pan-y;
}
.slider::-webkit-slider-runnable-track{
  height:6px;border-radius:999px;
  background:linear-gradient(to right, var(--skog) var(--andel), var(--sand) var(--andel));
}
.slider::-moz-range-track{height:6px;border-radius:999px;background:var(--sand);}
.slider::-moz-range-progress{height:6px;border-radius:999px;background:var(--skog);}
.slider::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;
  width:2rem;height:2rem;margin-top:calc(3px - 1rem);
  background:var(--skog);border:4px solid var(--hvit);border-radius:50%;
  box-shadow:0 0 0 1px rgba(24,53,43,.3), 0 2px 8px rgba(24,53,43,.25);
  transition:transform .12s;
}
.slider::-moz-range-thumb{
  width:2rem;height:2rem;
  background:var(--skog);border:4px solid var(--hvit);border-radius:50%;
  box-shadow:0 0 0 1px rgba(24,53,43,.3), 0 2px 8px rgba(24,53,43,.25);
}
.slider:active::-webkit-slider-thumb{transform:scale(1.08);}
.slider:focus-visible::-webkit-slider-thumb{outline:2.5px solid var(--skog);outline-offset:3px;}
.slider:focus-visible::-moz-range-thumb{outline:2.5px solid var(--skog);outline-offset:3px;}

/* ---------- Kort ---------- */
.kort{
  background:var(--hvit);
  border-radius:var(--radius-flate);
  padding:1.25rem;
  box-shadow:0 1px 2px rgba(25,33,29,.04), 0 8px 32px -12px rgba(25,33,29,.12);
}
@media (min-width:640px){ .kort{padding:2rem;} }
@media (min-width:1024px){ .kort{padding:2.5rem;} }

/* ---------- Header ---------- */
.topp{
  position:sticky;top:0;z-index:50;
  background:var(--papir);
  transition:box-shadow .2s;
}
.topp.skygge{box-shadow:0 1px 0 rgba(24,53,43,.10), 0 8px 24px -18px rgba(24,53,43,.5);}
.topp-rad{
  display:flex;align-items:center;justify-content:space-between;
  gap:.75rem;height:var(--topp);
}
@media (min-width:360px){ .topp-rad{gap:1.5rem;} }
.merke{display:flex;align-items:center;min-height:2.75rem;margin:-.5rem;padding:.5rem;color:var(--skog);}
.merke img,.merke svg{height:1.45rem;width:auto;}
@media (min-width:360px){ .merke img,.merke svg{height:1.65rem;} }
@media (min-width:1024px){ .merke img,.merke svg{height:2rem;} }
.hovedmeny{display:none;}
@media (min-width:1024px){
  .hovedmeny{display:flex;align-items:center;gap:1.75rem;}
}
.hovedmeny a{
  font-size:.975rem;color:rgba(25,33,29,.8);text-decoration:none;
  transition:color .15s;
}
.hovedmeny a:hover{color:var(--skog);}
.hovedmeny a[aria-current="page"]{color:var(--skog);font-weight:600;}
.topp-handling{display:flex;align-items:center;gap:.375rem;}
@media (min-width:1024px){ .topp-handling{display:none;} }
.menyknapp{
  display:flex;align-items:center;justify-content:center;
  width:2.75rem;height:2.75rem;margin-right:-.625rem;
  background:none;border:none;cursor:pointer;color:var(--skog);
}
.menyknapp .strek{position:relative;display:block;width:22px;height:12px;}
.menyknapp .strek::before,.menyknapp .strek::after{
  content:"";position:absolute;left:0;display:block;
  width:100%;height:1.5px;background:currentColor;
  transition:transform .2s;
}
.menyknapp .strek::before{top:0;}
.menyknapp .strek::after{top:10px;}
.menyknapp[aria-expanded="true"] .strek::before{transform:translateY(5px) rotate(45deg);}
.menyknapp[aria-expanded="true"] .strek::after{transform:translateY(-5px) rotate(-45deg);}
.mobilmeny{display:none;border-top:1px solid var(--linje);background:var(--papir);}
.mobilmeny.apen{display:block;}
@media (min-width:1024px){ .mobilmeny,.mobilmeny.apen{display:none;} }
.mobilmeny ul{padding-block:.5rem 1.25rem;}
.mobilmeny a{
  display:flex;align-items:center;min-height:3.25rem;
  font-size:1.0625rem;text-decoration:none;color:var(--blekk);
  border-bottom:1px solid var(--linje-myk);
}
.mobilmeny li:last-child a{border-bottom:none;}

/* ---------- Hero ---------- */
.hero{padding-block:1.5rem 3.5rem;}
@media (min-width:1024px){ .hero{padding-block:3rem 5rem;} }
.hero-rutenett{display:grid;gap:2.25rem;align-items:center;}
@media (min-width:1024px){
  .hero-rutenett{grid-template-columns:minmax(0,1fr) minmax(0,1.18fr);gap:4rem;}
}
.hero-tekst{max-width:34rem;}
.hero-knapper{display:flex;flex-direction:column;gap:.75rem;margin-top:1.75rem;}
@media (min-width:640px){ .hero-knapper{flex-direction:row;} }
@media (min-width:1024px){ .hero-knapper{margin-top:2.25rem;} }
.hero-bilde{margin-inline:calc(var(--marg) * -1);}
@media (min-width:640px){ .hero-bilde{margin-inline:0;} }
.hero-bilde img{width:100%;aspect-ratio:4/3;object-fit:cover;}
@media (min-width:640px){ .hero-bilde img{border-radius:var(--radius-flate);} }
.stikkord{
  display:flex;flex-wrap:wrap;justify-content:center;
  gap:.375rem 1.25rem;
  padding-top:1.25rem;border-top:1px solid var(--linje);
  font-family:var(--serif);font-size:1.125rem;color:var(--skog);
}
@media (min-width:1024px){ .stikkord{gap:.375rem 1.75rem;font-size:1.3rem;} }
.stikkord .prikk{display:none;color:#b7ad98;}
@media (min-width:640px){ .stikkord .prikk{display:inline;} }

/* ---------- To-kolonne med smal venstrespalte ---------- */
.par{display:grid;gap:2rem;}
@media (min-width:1024px){
  .par{grid-template-columns:minmax(0,.78fr) minmax(0,1.4fr);gap:4rem;}
}
.par-likt{display:grid;gap:3rem;align-items:start;}
@media (min-width:1024px){
  .par-likt{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:5rem;}
}
.klistre{position:sticky;top:calc(var(--topp) + 2rem);align-self:start;}
@media (max-width:1023px){ .klistre{position:static;} }

/* ---------- Prisberegner ---------- */
.pris-rad{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;}
.pris-tall{
  font-family:var(--serif);font-variant-numeric:tabular-nums lining-nums;
  margin-top:.25rem;font-size:2.25rem;line-height:1;
}
@media (min-width:640px){ .pris-tall{font-size:2.75rem;} }
.pris-tall .enhet{
  margin-left:.375rem;font-family:var(--sans);
  font-size:.45em;color:var(--stein);
}
.skala{display:flex;justify-content:space-between;margin-top:-.25rem;}
.pnr-rad{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;}
.pnr-felt{
  width:7.5rem;text-align:center;
  font-size:1.25rem;letter-spacing:.12em;
}
.pnr-status{
  flex:1 1 12rem;min-height:1.5rem;
  font-size:.975rem;line-height:1.375;
}
.pnr-status .sted{font-weight:600;}
.pnr-status.utenfor .sted,.pnr-status.dekket .sted{color:var(--blekk);}

/* ---------- Stegliste ---------- */
.steg{margin-top:3rem;}
@media (min-width:1024px){
  .steg{display:grid;grid-template-columns:repeat(4,1fr);gap:2.5rem;margin-top:4rem;}
}
.steg li{position:relative;padding:0 0 2.25rem 2.25rem;}
.steg li:last-child{padding-bottom:0;}
.steg li::before{
  content:"";position:absolute;left:5px;top:.5rem;bottom:0;
  width:1px;background:var(--linje);
}
.steg li:last-child::before{display:none;}
.steg li::after{
  content:"";position:absolute;left:0;top:.45rem;
  width:11px;height:11px;border-radius:50%;background:var(--skog);
}
@media (min-width:1024px){
  .steg li{padding:2.25rem 0 0 0;}
  .steg li::before{
    left:0;top:5px;bottom:auto;
    width:calc(100% + 2.5rem);height:1px;
  }
  .steg li:last-child::before{display:block;width:100%;}
  .steg li::after{top:0;}
}
.steg p{margin-top:.5rem;max-width:22rem;color:var(--stein);}
.sitatlinje{
  margin-top:3.5rem;max-width:46rem;
  padding-left:1.25rem;border-left:2px solid var(--sand);
  color:var(--stein);
}
@media (min-width:1024px){ .sitatlinje{margin-top:5rem;} }

/* ---------- Definisjonslister ---------- */
.liste-linjer{margin-top:2rem;border-top:1px solid var(--linje);}
.liste-linjer > div{
  display:grid;gap:.25rem;
  padding-block:1rem;border-bottom:1px solid var(--linje);
}
@media (min-width:640px){
  .liste-linjer > div{grid-template-columns:12.5rem minmax(0,1fr);gap:1.5rem;}
}
.liste-linjer dt{font-family:var(--serif);font-size:1.1875rem;color:var(--skog);}
.liste-linjer dd{color:var(--stein);}

/* ---------- Mørk seksjon ---------- */
.bunn-skog{background:var(--skog);color:var(--lys);}
.bunn-skog .stein,.bunn-skog .dempet{color:var(--lys-dempet);}
.boks-lys{border:1px solid var(--lys-linje);border-radius:var(--radius-flate);}
.boks-lys > div{padding:1.5rem;}
@media (min-width:640px){ .boks-lys > div{padding:1.75rem;} }
.boks-lys > div + div{border-top:1px solid var(--lys-linje);}
.boks-lys dt{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;}
.boks-lys dd{margin-top:.5rem;color:var(--lys-dempet);}

/* ---------- Ferdigmelding ---------- */
.melding{
  width:100%;max-width:30rem;margin-inline:auto;
  background:var(--hvit);
  border:1px solid var(--linje);border-radius:.75rem;
  padding:1.5rem;
  box-shadow:0 1px 2px rgba(25,33,29,.04), 0 12px 40px -16px rgba(25,33,29,.18);
}
@media (min-width:640px){ .melding{padding:2rem;} }
@media (min-width:1024px){ .melding{margin-right:0;} }
.melding-topp{display:flex;align-items:center;justify-content:space-between;}
.melding-topp svg{height:1.25rem;width:auto;color:var(--skog);}
.merkelapp{
  background:var(--sand-lys);border-radius:999px;
  padding:.125rem .625rem;font-size:.8125rem;color:var(--stein);
}
.hakeliste li{display:flex;gap:.625rem;margin-top:.375rem;font-size:.9375rem;}
.hakeliste svg{flex:none;width:.875rem;height:.875rem;margin-top:.3rem;color:var(--skog);}

/* ---------- Spørsmål og svar ---------- */
.sporsmal{border-bottom:1px solid var(--linje);}
.sporsmal summary{
  display:flex;align-items:flex-start;justify-content:space-between;gap:1.5rem;
  padding-block:1.25rem;cursor:pointer;list-style:none;
  font-size:1.125rem;line-height:1.375;
}
@media (min-width:640px){ .sporsmal summary{font-size:1.1875rem;} }
.sporsmal summary::-webkit-details-marker{display:none;}
.sporsmal summary:hover{color:var(--skog);}
.sporsmal summary h3{font-family:var(--serif);font-weight:400;font-size:inherit;text-wrap:pretty;}
.sporsmal .tegn{
  position:relative;flex:none;width:1rem;height:1rem;margin-top:.45rem;color:var(--skog);
}
.sporsmal .tegn::before,.sporsmal .tegn::after{
  content:"";position:absolute;left:0;top:calc(50% - .75px);
  width:100%;height:1.5px;background:currentColor;transition:transform .18s;
}
.sporsmal .tegn::after{transform:rotate(90deg);}
.sporsmal[open] .tegn::after{transform:rotate(0);}
.sporsmal > p{max-width:40rem;padding:0 2.5rem 1.5rem 0;color:var(--stein);}

/* ---------- Footer ---------- */
.bunn{background:var(--skog);color:var(--lys);}
.bunn-rutenett{display:grid;gap:3rem;}
@media (min-width:640px){ .bunn-rutenett{grid-template-columns:1fr 1fr;} }
@media (min-width:1024px){ .bunn-rutenett{grid-template-columns:1.3fr 1fr 1fr;gap:4rem;} }
.bunn-merke{grid-column:1/-1;}
@media (min-width:1024px){ .bunn-merke{grid-column:auto;} }
.bunn-merke img,.bunn-merke svg{height:2rem;width:auto;}
.bunn h2{font-weight:600;font-size:1.0625rem;}
.bunn ul{margin-top:.75rem;color:var(--lys-dempet);}
.bunn li + li{margin-top:.375rem;}
.bunn-rad{
  display:flex;flex-direction:column;gap:1.25rem;
  margin-top:3.5rem;padding-top:1.75rem;border-top:1px solid var(--lys-linje);
}
@media (min-width:1024px){
  .bunn-rad{flex-direction:row;align-items:center;justify-content:space-between;}
}
.bunn-lenker{display:flex;flex-wrap:wrap;gap:0 1.5rem;color:var(--lys-dempet);}
.bunn-lenker a,.bunn-lenker span,.bunn-lenker button{
  display:inline-flex;align-items:center;min-height:2.75rem;
}
.bunn-lenker button{
  background:none;border:none;color:inherit;cursor:pointer;
  text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em;
}

/* ---------- Informasjonskapsel-banner ---------- */
/* Ligger nederst, over den festede ringe-linjen. Knappene er like store og
   like tydelige – ingen forhåndsvalg. Store trykkflater for 65+. */
.kapsler{
  position:fixed;left:0;right:0;bottom:0;z-index:70;
  background:var(--hvit);
  border-top:2px solid var(--skog);
  box-shadow:0 -8px 28px rgba(25,33,29,.18);
  padding:1rem var(--marg) calc(1rem + env(safe-area-inset-bottom));
}
.kapsler-inn{
  max-width:calc(var(--ramme) + var(--marg) * 2);margin-inline:auto;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 1.75rem;
}
.kapsler p{flex:1 1 20rem;margin:0;font-size:1rem;line-height:1.45;}
.kapsler-valg{display:flex;flex:0 0 auto;gap:.75rem;}
.kapsler-valg .knapp{flex:1 1 0;min-width:8.5rem;}
@media (max-width:640px){
  .kapsler{padding:.875rem var(--marg) 1rem;}
  .kapsler p{flex:1 1 100%;font-size:.975rem;}
  .kapsler-valg{width:100%;}
  .kapsler-valg .knapp{min-width:0;min-height:3.125rem;}
}

/* ---------- Festet ringe-linje på mobil ---------- */
.ringelinje{
  display:none;
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  gap:.625rem;
  background:var(--skog-dyp);
  padding:.625rem .75rem calc(.625rem + env(safe-area-inset-bottom));
  box-shadow:0 -6px 20px rgba(16,38,31,.25);
}
.ringelinje a{
  flex:1;display:flex;align-items:center;justify-content:center;gap:.5rem;
  min-height:3.25rem;border-radius:999px;
  font-weight:600;font-size:1.0625rem;text-decoration:none;
}
.ringelinje .ring{background:var(--lys);color:var(--skog);}
.ringelinje .bestill{
  background:transparent;color:var(--lys);
  box-shadow:inset 0 0 0 1.5px var(--lys-linje);
}
@media (max-width:1023px){
  .ringelinje{display:flex;}
  body{padding-bottom:4.75rem;}
}

/* ---------- Feiloppsummering i skjema ---------- */
.feilboks{
  margin-top:1.75rem;padding:1rem 1.15rem;
  background:#fdf3f1;border:1.5px solid var(--feil);border-radius:var(--radius-felt);
}
.feilboks p{font-weight:600;color:var(--feil);}
.feilboks ul{margin-top:.5rem;}
.feilboks li{margin-top:.25rem;}
.feilboks a{color:var(--feil);}
.skjult-felt{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden;opacity:0;}

/* Bildeliste i skjemaet */
.bildeliste{display:flex;flex-wrap:wrap;gap:.625rem;margin-top:.875rem;}
.bildeliste li{position:relative;}
.bildeliste img{
  width:5rem;height:5rem;object-fit:cover;
  border-radius:.5rem;border:1px solid var(--linje);
}
.bildeliste button{
  position:absolute;top:-.4rem;right:-.4rem;
  width:1.75rem;height:1.75rem;border-radius:50%;
  background:var(--skog);color:var(--lys);border:2px solid var(--hvit);
  font-size:1rem;line-height:1;cursor:pointer;
}

/* ---------- Hjelpeklasser ---------- */
.mt-1{margin-top:.25rem;} .mt-2{margin-top:.5rem;} .mt-3{margin-top:.75rem;}
.mt-4{margin-top:1rem;} .mt-5{margin-top:1.25rem;} .mt-6{margin-top:1.5rem;}
.mt-7{margin-top:1.75rem;} .mt-8{margin-top:2rem;} .mt-10{margin-top:2.5rem;}
.mt-12{margin-top:3rem;} .mt-14{margin-top:3.5rem;}
.maks-22{max-width:22rem;} .maks-26{max-width:26rem;} .maks-30{max-width:30rem;}
.maks-34{max-width:34rem;} .maks-36{max-width:36rem;} .maks-46{max-width:46rem;}
.midtstilt{text-align:center;} .hoyre{text-align:right;}
.felt-par{display:grid;gap:1.25rem;}
@media (min-width:640px){
  .felt-par{grid-template-columns:1fr 1fr;}
  .felt-par .bred{grid-column:1/-1;}
}

/* ==========================================================================
   Eldre undersider (veiledere og lokalsider)
   Sidene bruker fortsatt gammel markup. Her mappes de gamle klassene til
   det nye designsystemet, slik at de ser like ut uten å skrives om.
   ========================================================================== */
.wrap{
  width:100%;max-width:calc(var(--ramme) + var(--marg) * 2);
  margin-inline:auto;padding-inline:var(--marg);
}
.brodsmuler{padding-top:1.25rem;font-size:.9375rem;color:var(--stein);}
.brodsmuler a{color:var(--stein);}
.brodsmuler span[aria-current]{color:var(--blekk);}
.article-hero{padding-block:3rem 2.25rem;border-bottom:1px solid var(--linje);}
.article-hero .wrap{max-width:52rem;}
.article-hero h1{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(2rem, 1.3rem + 2.6vw, 3.375rem);
  line-height:1.06;letter-spacing:-.018em;text-wrap:balance;color:var(--skog);
}
.article-hero p.lede{
  margin-top:1rem;max-width:44rem;
  font-size:clamp(1.125rem, 1.02rem + .4vw, 1.3125rem);line-height:1.5;color:var(--stein);
}
.article-body{max-width:44rem;margin-inline:auto;padding:3rem var(--marg) 4rem;}
.article-body h2{
  font-family:var(--serif);font-weight:400;font-size:1.875rem;line-height:1.12;
  color:var(--skog);margin-top:2em;margin-bottom:.5em;
}
.article-body h2:first-of-type{margin-top:0;}
.article-body h3{
  font-family:var(--serif);font-weight:400;font-size:1.375rem;
  color:var(--skog);margin-top:1.6em;margin-bottom:.3em;
}
.article-body p{margin-bottom:1em;}
.article-body ul,.article-body ol{margin:0 0 1.2em 1.3rem;list-style:disc;}
.article-body ol{list-style:decimal;}
.article-body li{margin-bottom:.5em;}
.article-body a{color:var(--skog);text-decoration:underline;text-underline-offset:.22em;}
.article-related{margin-top:2rem;font-size:.9375rem;color:var(--stein);}
.article-cta{
  margin-top:2.5rem;padding:1.75rem;
  background:var(--skog);color:var(--lys);border-radius:var(--radius-flate);
}
.article-cta a{color:var(--lys);}
.article-cta .btn{margin-top:1rem;}
.lp-body{max-width:55rem;margin-inline:auto;padding-inline:var(--marg);}
.lp-body section{padding-block:3rem;}
.lp-body section + section{border-top:1px solid var(--linje);}
.lp-body h2{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(1.75rem,1.2rem + 1.8vw,2.5rem);line-height:1.1;color:var(--skog);
  margin-bottom:.6em;
}
.lp-body p{margin-bottom:1em;}
.lp-body a{color:var(--skog);text-decoration:underline;text-underline-offset:.22em;}
.lp-liste{margin:0 0 1em 1.3rem;list-style:disc;}
.lp-liste li{margin-bottom:.55em;}
.tillit{display:grid;gap:1rem 1.875rem;}
@media (min-width:640px){ .tillit{grid-template-columns:1fr 1fr;} }
.tillit li{display:flex;gap:.625rem;align-items:flex-start;}
.tillit svg{flex:none;margin-top:.3rem;}
.lp-innbo{
  background:var(--sand-lys);border:1px solid var(--linje);
  border-radius:var(--radius-flate);padding:1.4rem 1.5rem;
}
.lp-innbo p{margin:0;}
.lp-innbo p + p{margin-top:.6em;}
/* Gamle knapper → nye */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  min-height:3.375rem;padding:0 1.625rem;
  background:var(--skog);color:var(--lys);
  border:none;border-radius:999px;
  font-size:1.0625rem;font-weight:600;line-height:1.2;
  text-decoration:none;white-space:nowrap;cursor:pointer;
  transition:background-color .16s, box-shadow .16s;
}
.btn:hover{background:var(--skog-dyp);}
.btn.brass{background:var(--skog);}
.btn.ghost{
  background:transparent;color:var(--skog);
  box-shadow:inset 0 0 0 1.5px rgba(24,53,43,.35);
}
.btn.ghost:hover{background:transparent;box-shadow:inset 0 0 0 1.5px var(--skog);}
.article-cta .btn{background:var(--lys);color:var(--skog);}
.article-cta .btn.ghost{background:transparent;color:var(--lys);box-shadow:inset 0 0 0 1.5px var(--lys-linje);}
.steps{margin-top:2rem;}
.steps li{position:relative;padding:0 0 1.75rem 2.25rem;}
.steps li::after{
  content:"";position:absolute;left:0;top:.45rem;
  width:11px;height:11px;border-radius:50%;background:var(--skog);
}
.steps li::before{
  content:"";position:absolute;left:5px;top:.5rem;bottom:0;width:1px;background:var(--linje);
}
.steps li:last-child::before{display:none;}
.steps h3{font-family:var(--serif);font-weight:400;font-size:1.25rem;color:var(--skog);}
.steps p{margin-top:.35rem;color:var(--stein);}
@media (min-width:1024px){
  .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;}
  .steps li{padding:2rem 0 0 0;}
  .steps li::before{left:0;top:5px;bottom:auto;width:100%;height:1px;}
  .steps li::after{top:0;}
}