/* Austlid Drift — delt stilark. Løftet ut av designforslag B.
   Maks to fonter (Newsreader + Inter), én aksentfarge. */

:root{
  --bone:#f5f2ea;
  --ink:#22271f;
  --pine:#205a28;
  --pine-mork:#17431d;
  --muted:#6f7568;
  --line:#dcd8cc;
  --card:#fffdf8;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  background:var(--bone);color:var(--ink);
  line-height:1.65;font-size:16.5px;
  overflow-x:hidden;
}
/* Filmkorn — gir en trykt følelse i stedet for flat skjerm */
body::after{
  content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
a{color:inherit}
img{display:block;max-width:100%}
.serif{font-family:'Newsreader',Georgia,serif;font-weight:500;letter-spacing:-.01em}
.hp{position:absolute!important;left:-9999px!important}
.skip{position:absolute;left:-9999px;background:var(--pine);color:#fff;padding:12px 20px;z-index:300}
.skip:focus{left:12px;top:12px}
:focus-visible{outline:2px solid var(--pine);outline-offset:3px}

/* ── Topp ────────────────────────────────────────────────────────── */
header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;justify-content:space-between;align-items:center;
  padding:20px 32px;transition:background .3s,color .3s;color:#fff;
}
header.solid{background:rgba(245,242,234,.96);color:var(--ink);border-bottom:1px solid var(--line)}
/* Sider uten mørk hero starter solid */
header.alltid-solid{background:rgba(245,242,234,.96);color:var(--ink);border-bottom:1px solid var(--line)}
/* Merket arver fargen fra headeren — beinhvit over heltebildet, blekk
   når linja blir solid ved scroll. Derfor currentColor og ingen fast farge. */
/* Husets vegger slutter 9/64 over bunnen av merket (y=55 av 64). Merket står på
   tekstens grunnlinje og flyttes ned 9/64 av sin høyde, så husets bunn og bunnen
   av bokstavene ligger på samme linje (Rogers ønske 12.11.2026). */
.logo{display:flex;align-items:baseline;gap:11px;text-decoration:none;color:inherit}
.logo .merke{width:30px;height:30px;flex:none;display:block;position:relative;top:calc(30px * 9 / 64)}
.logo span{font-family:'Newsreader',Georgia,serif;font-size:22px;font-weight:500;
  letter-spacing:.02em;line-height:1}
@media(max-width:560px){
  .logo{gap:9px}
  .logo .merke{width:26px;height:26px;top:calc(26px * 9 / 64)}
  .logo span{font-size:19px}
}
header nav{display:flex;gap:26px;align-items:center}
header nav a{text-decoration:none;font-size:14.5px;font-weight:500;opacity:.9}
header nav a:hover{opacity:1}
header nav a[aria-current="page"]{opacity:1;text-decoration:underline;text-underline-offset:5px}
.tel{border:1px solid currentColor;padding:9px 18px;border-radius:99px;font-weight:600;white-space:nowrap}
header.solid .tel,header.alltid-solid .tel{border-color:var(--pine);color:var(--pine)}
.burger{display:none;background:none;border:none;color:currentColor;font-size:26px;cursor:pointer;line-height:1;padding:6px}
@media(max-width:900px){header nav{display:none}.burger{display:block}}

.mnav{display:none;position:fixed;inset:0;background:var(--bone);z-index:200;
  flex-direction:column;justify-content:center;align-items:center;gap:22px;padding:40px}
.mnav.open{display:flex}
.mnav a{font-family:'Newsreader',Georgia,serif;font-size:clamp(1.4rem,6vw,2rem);text-decoration:none;color:var(--ink)}
.mnav .x{position:absolute;top:16px;right:22px;font-size:36px;background:none;border:none;color:var(--ink);cursor:pointer;line-height:1}

/* ── Hero ────────────────────────────────────────────────────────── */
.hero{position:relative;min-height:92vh;display:flex;align-items:center;overflow:hidden;color:#fff}
.hero .bg{position:absolute;inset:0;background-size:cover;background-position:center;
  transform:scale(1.05);animation:slowzoom 20s ease-out forwards}
@keyframes slowzoom{to{transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.hero .bg{animation:none;transform:none}}
.hero::before{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(20,25,18,.38),rgba(20,25,18,.48));z-index:1}
.hero .inner{position:relative;z-index:2;max-width:1140px;margin:0 auto;padding:120px 32px 80px;width:100%}
.hero h1{font-family:'Newsreader',Georgia,serif;font-weight:500;
  font-size:clamp(2.5rem,6.5vw,5.4rem);line-height:1.06;max-width:820px;letter-spacing:-.015em}
.hero p.lede{max-width:560px;margin-top:22px;font-size:18px;color:#eceadd}
.kicker{font-size:13px;text-transform:uppercase;letter-spacing:.24em;font-weight:600;margin-bottom:18px;color:#e8e4d8}

/* Kortere hero på undersider */
.hero.liten{min-height:62vh}
.hero.liten .inner{padding:140px 32px 60px}
.hero.liten h1{font-size:clamp(2.1rem,5vw,3.8rem)}

/* ── Knapper ─────────────────────────────────────────────────────── */
.cta-row{display:flex;gap:14px;margin-top:32px;flex-wrap:wrap;align-items:center}
.btn{display:inline-block;padding:15px 32px;border-radius:99px;text-decoration:none;font-weight:600;font-size:15px;border:1.5px solid transparent;cursor:pointer}
.btn-fill{background:var(--pine);color:#fff}
.btn-fill:hover{background:var(--pine-mork)}
.btn-ghost{border-color:#fff;color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.14)}
.btn-linje{border-color:var(--pine);color:var(--pine)}
.btn-linje:hover{background:rgba(32,90,40,.08)}
.stille{text-decoration:none;font-weight:600;font-size:15px;color:var(--pine);
  border-bottom:1.5px solid var(--pine);padding-bottom:2px}

/* ── Seksjoner ───────────────────────────────────────────────────── */
section{padding:96px 32px}
section.tett{padding-top:0}
.wrap{max-width:1140px;margin:0 auto}
.sec-head{max-width:720px;margin-bottom:48px}
.over{font-size:13px;text-transform:uppercase;letter-spacing:.2em;color:var(--pine);font-weight:600;margin-bottom:12px}
.sec-head h2{font-family:'Newsreader',Georgia,serif;font-weight:500;
  font-size:clamp(1.9rem,4.5vw,3.1rem);line-height:1.12;letter-spacing:-.01em}
.sec-head p{margin-top:14px;color:var(--muted);font-size:16.5px}
h3{font-family:'Newsreader',Georgia,serif;font-weight:500}

/* Tillitsrad */
.tro{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:40px;
  border-top:1px solid var(--line);padding-top:44px}
.tro h3{font-size:22px;margin-bottom:8px}
.tro p{font-size:15px;color:var(--muted)}

/* Bildekort */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:26px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;
  text-decoration:none;transition:box-shadow .3s,transform .3s;display:flex;flex-direction:column}
.card:hover{box-shadow:0 18px 40px rgba(34,39,31,.12);transform:translateY(-3px)}
/* Tjenestekortene bruker bedriftens egne ikoner, ikke foto. Inline SVG
   slik at de arver grønnfargen — en <img> ville blitt liggende svart.
   Foto hører hjemme øverst på hver tjenesteside, der det skal overbevise;
   her skal det bare kjennes igjen. */
.card .ikon{padding:30px 24px 4px;color:var(--pine);line-height:0}
/* Bredde og høyde settes per ikon i markupen — motivene har ulik
   luft rundt seg, og lik høyde ville gjort dem optisk ulike. */
.card .ikon svg{display:block;transition:transform .35s ease}
.card:hover .ikon svg{transform:scale(1.06)}
@media(max-width:560px){.card .ikon{padding:24px 22px 2px}.card .ikon svg{transform:scale(.88);transform-origin:left center}}
.card .txt{padding:24px 24px 26px;display:flex;flex-direction:column;flex:1}
.card h3{font-size:21px;margin-bottom:8px}
.card p{font-size:15px;color:var(--muted)}
.card .mer{margin-top:auto;padding-top:14px;color:var(--pine);font-weight:600;font-size:14.5px}

/* Rammekort uten bilde */
.enkel{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:26px;margin-top:26px}
/* Bare direkte barn — ellers overstyrer denne .btn-knapper som ligger inni kortene */
.enkel > a,.enkel > div{background:transparent;border:1px solid var(--line);border-radius:14px;
  padding:26px;text-decoration:none;transition:border-color .25s}
.enkel > a:hover{border-color:var(--pine)}
.enkel h3{font-size:20px;margin-bottom:6px}
.enkel p{font-size:14.5px;color:var(--muted)}

/* Fullbreddes band — brukes til budskap som henvender seg til en annen målgruppe */
.band{position:relative;overflow:hidden;color:#fff;padding:0}
.band .bg{position:absolute;inset:0;background-size:cover;background-position:center}
.band::before{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(100deg,rgba(20,25,18,.88) 0%,rgba(20,25,18,.72) 55%,rgba(20,25,18,.45) 100%)}
.band .inner{position:relative;z-index:2;max-width:1140px;margin:0 auto;padding:88px 32px}
.band .over{color:#a9c4ae}
.band h2{font-family:'Newsreader',Georgia,serif;font-weight:500;
  font-size:clamp(1.8rem,4.2vw,2.9rem);line-height:1.12;max-width:640px;letter-spacing:-.01em}
.band p{max-width:560px;margin-top:16px;color:#e3e1d6;font-size:17px}
.band .btn-lys{background:var(--bone);color:var(--ink)}
.band .btn-lys:hover{background:#fff}
@media(max-width:700px){.band .inner{padding:64px 24px}}

/* Sitat */
.sitat{background:var(--ink);color:var(--bone);border-radius:20px;padding:70px 40px;text-align:center}
.sitat blockquote{font-family:'Newsreader',Georgia,serif;font-weight:400;
  font-size:clamp(1.4rem,3.4vw,2.2rem);line-height:1.32;max-width:820px;margin:0 auto;font-style:italic}
.sitat .hvem{margin-top:22px;color:#b9beac;font-size:15px}

/* Om — asymmetrisk */
.om{display:grid;grid-template-columns:.95fr 1.05fr;gap:60px;align-items:center}
@media(max-width:900px){.om{grid-template-columns:1fr;gap:32px}}
.om img{width:100%;height:520px;object-fit:cover;border-radius:16px}
.om h2{font-family:'Newsreader',Georgia,serif;font-weight:500;
  font-size:clamp(1.9rem,4.2vw,2.9rem);line-height:1.12;margin-bottom:18px}
.om p{color:#454b40;margin-bottom:14px}
figcaption{margin-top:10px;font-size:13.5px;color:var(--muted)}

/* Punktliste med hake */
.hake{list-style:none;display:grid;gap:11px;margin-top:18px}
.hake li{position:relative;padding-left:30px;font-size:16px}
.hake li::before{content:"";position:absolute;left:6px;top:9px;width:9px;height:5px;
  border-left:2px solid var(--pine);border-bottom:2px solid var(--pine);transform:rotate(-45deg)}

/* Steg med hengende serif-tall */
.steg{display:grid;grid-template-columns:repeat(3,1fr);gap:44px;margin-top:44px}
@media(max-width:820px){.steg{grid-template-columns:1fr;gap:28px}}
.steg .t{font-family:'Newsreader',Georgia,serif;font-style:italic;font-size:50px;color:var(--pine);
  line-height:1;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:14px}
.steg h3{font-size:20px;margin-bottom:6px}
.steg p{font-size:15px;color:#454b40}

/* Pakker (firmahytte) */
.pakker{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;align-items:stretch}
.pakke{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:28px;display:flex;flex-direction:column}
.pakke.anbefalt{border:2px solid var(--pine);box-shadow:0 14px 34px rgba(32,90,40,.12)}
.pakke .merke{display:inline-block;background:var(--pine);color:#fff;font-size:12px;font-weight:700;
  text-transform:uppercase;letter-spacing:.12em;padding:5px 12px;border-radius:99px;margin-bottom:14px;align-self:flex-start}
.pakke h3{font-size:22px;margin-bottom:4px}
.pakke .pris{font-family:'Newsreader',Georgia,serif;font-size:34px;color:var(--pine);font-weight:500;margin:10px 0 2px}
.pakke .pris span{font-family:'Inter',sans-serif;font-size:15px;color:var(--muted);font-weight:400}
.pakke .stikk{color:var(--muted);font-size:15px;font-style:italic}
.pakke .hake{margin-top:18px;flex:1}
.pakke .hake li{font-size:15px}
.pakke .btn{margin-top:22px;text-align:center}

/* Kontakt */
.kontakt .grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
@media(max-width:900px){.kontakt .grid{grid-template-columns:1fr;gap:36px}}
.kx{margin-bottom:24px}
.kx .lbl{font-size:12.5px;text-transform:uppercase;letter-spacing:.18em;color:var(--muted);font-weight:600;margin-bottom:4px}
.kx a{font-family:'Newsreader',Georgia,serif;font-size:clamp(1.4rem,3vw,2rem);text-decoration:none;font-weight:500}
.kx a:hover{color:var(--pine)}
.kx p{font-size:17px}
form[data-lead]{display:grid;gap:13px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:30px}
form[data-lead] label{font-size:13px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-weight:600;margin-bottom:-6px}
form[data-lead] input,form[data-lead] select,form[data-lead] textarea{
  width:100%;padding:14px 16px;border:1px solid var(--line);border-radius:10px;
  background:#fff;font:inherit;font-size:16px}
form[data-lead] textarea{min-height:110px;resize:vertical}
form[data-lead] button{background:var(--pine);color:#fff;border:none;padding:16px;
  font:inherit;font-weight:600;font-size:16px;border-radius:99px;cursor:pointer;margin-top:4px}
form[data-lead] button:hover{background:var(--pine-mork)}
form[data-lead] button:disabled{opacity:.6;cursor:default}
[data-feil]{display:none;background:#fbeceb;border:1px solid #e3bdb8;color:#96302a;
  border-radius:10px;padding:12px 14px;font-size:14.5px}
.valgfritt{text-transform:none;letter-spacing:0;font-weight:400;color:#a5a196}

/* Privat eller bedrift — to knapper i samme ramme */
.kundetype{display:grid;grid-template-columns:1fr 1fr;gap:6px;
  background:var(--bone);border:1px solid var(--line);border-radius:12px;padding:5px}
.kundetype .kt{background:none;border:none;border-radius:8px;padding:11px 10px;
  font:inherit;font-size:15px;font-weight:500;color:var(--muted);cursor:pointer;
  margin:0;text-transform:none;letter-spacing:0}
.kundetype .kt:hover{color:var(--ink)}
.kundetype .kt.valgt{background:#fff;color:var(--pine);font-weight:600;
  box-shadow:0 1px 3px rgba(34,39,31,.1)}
.bedriftfelt{display:grid;gap:13px}
.bedriftfelt[hidden]{display:none}

/* Oppslagsliste under firmanavn og hytteadresse */
.ac{position:relative}
.ac-liste{position:absolute;z-index:30;top:calc(100% + 4px);left:0;right:0;
  list-style:none;margin:0;padding:4px;max-height:264px;overflow-y:auto;
  background:#fff;border:1px solid var(--line);border-radius:10px;
  box-shadow:0 10px 26px rgba(34,39,31,.13)}
.ac-liste[hidden]{display:none}
.ac-rad{padding:10px 12px;border-radius:7px;cursor:pointer;line-height:1.35}
.ac-rad.valgt{background:var(--bone)}
.ac-navn{display:block;font-size:15.5px}
.ac-under{display:block;font-size:13px;color:var(--muted)}
.smaatt{font-size:13.5px;color:var(--muted)}

/* ── Bunn ────────────────────────────────────────────────────────── */
footer{border-top:1px solid var(--line);padding:52px 32px 40px;font-size:14.5px;background:var(--bone)}
footer .wrap{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:32px}
@media(max-width:760px){footer .wrap{grid-template-columns:1fr;gap:26px}}
footer .navn{font-family:'Newsreader',Georgia,serif;font-size:19px;font-weight:500;margin-bottom:8px}
footer p,footer li{color:var(--muted)}
footer ul{list-style:none;display:grid;gap:6px}
footer a{text-decoration:none}
footer a:hover{color:var(--pine)}
footer .bunnlinje{border-top:1px solid var(--line);margin-top:34px;padding-top:18px;
  color:var(--muted);font-size:13.5px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* ── Animasjon ───────────────────────────────────────────────────── */
.fade{opacity:0;transform:translateY(28px);transition:opacity .6s ease,transform .6s ease}
.fade.vis{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .fade{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
}

/* ── Trykkmål på mobil ─────────────────────────────────────────────────
   Målt på 375 px: lenkene i bunnen var 18 px høye, telefon og e-post 23,
   menyknappen 38. Under ~44 px bommer fingeren. Her utvides trefflata
   uten at noe flytter seg visuelt — bare luft over og under teksten. */
@media (max-width:900px){
  .burger{padding:9px 11px;font-size:28px}

  footer ul{gap:0}
  footer ul li a{display:inline-block;padding:11px 0;line-height:1.2}

  .kx a{display:inline-block;padding:6px 0}
}

/* Stablede knapper i samme bredde. Ulik bredde over hverandre ser
   tilfeldig ut, og den smaleste blir dessuten et mindre trykkmål. */
@media (max-width:560px){
  .cta-row{flex-direction:column;align-items:stretch;gap:12px}
  .cta-row .btn{text-align:center}
}


/* ── Tjenester-menyen ──────────────────────────────────────────────────
   Topplinja hadde plass til tre av seks tjenester. Nå ligger alle seks her.
   Panelet har egen bakgrunn, så det leses like godt over heltebildet som
   når linja er solid. */
.drop{position:relative}
.dropknapp{
  display:flex;align-items:center;gap:5px;background:none;border:0;padding:0;
  color:inherit;font:inherit;font-size:14.5px;font-weight:500;opacity:.9;cursor:pointer;
}
.dropknapp:hover,.dropknapp[aria-expanded="true"]{opacity:1}
.dropknapp.aktiv{opacity:1;text-decoration:underline;text-underline-offset:5px}
/* 10 px leste som en prikk, ikke som en pil. Litt opp, og dyttet ned
   et hakk så den sitter på linje med teksten. */
.dropknapp .pil{font-size:13px;line-height:1;transform:translateY(1px);transition:transform .2s}
.dropknapp[aria-expanded="true"] .pil{transform:translateY(1px) rotate(180deg)}
.dropmeny{
  position:absolute;top:calc(100% + 14px);left:-14px;z-index:120;
  background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:8px;min-width:232px;display:grid;gap:1px;
  box-shadow:0 14px 34px rgba(34,39,31,.16);
}
.dropmeny a{
  display:block;padding:9px 12px;border-radius:8px;color:var(--ink);
  font-size:14.5px;font-weight:500;opacity:1;text-decoration:none;white-space:nowrap;
}
.dropmeny a:hover{background:var(--bone);color:var(--pine)}

/* MÅ stå etter .dropmeny. Nettleserens egen [hidden]{display:none} taper mot
   en klasseselektor med display:grid — uten denne står menyen åpen for alltid. */
.dropmeny[hidden]{display:none}
.dropmeny a[aria-current="page"]{color:var(--pine);background:var(--bone);text-decoration:none}

/* Omtaler fra kunder — to kort side om side */
.omtaler{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:38px}
@media(max-width:820px){.omtaler{grid-template-columns:1fr;gap:20px}}
.omtale{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:30px 32px}
.omtale blockquote{margin:0;font-family:'Newsreader',Georgia,serif;font-size:19px;
  line-height:1.5;color:var(--ink)}
.omtale .hvem{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);
  font-size:14px;color:var(--muted)}
.omtale .hvem b{display:block;color:var(--ink);font-weight:600;font-size:15px}

/* ── Redaksjonell retning (nov. 2026) ──────────────────────────────────
   Siden leste som en mal fordi hver seksjon var bygget likt: liten versal
   etikett, serif-overskrift, ett avsnitt, kort i rad. Disse reglene bryter
   rytmen: større overskrifter, tjenester som liste, sitat uten mørk boks. */

.sec-head h2{font-size:clamp(2.2rem,6vw,4.1rem);line-height:1.04;letter-spacing:-.025em;max-width:16ch}
.sec-head p{font-size:18.5px;max-width:52ch;color:#4b5146}

/* Tjenester som redaksjonell liste */
.liste{margin-top:14px;border-top:1px solid var(--line)}
.liste a.card{display:grid;grid-template-columns:76px 1fr auto;gap:26px;align-items:start;
  background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;box-shadow:none;
  padding:30px 4px;text-decoration:none;color:inherit;transition:padding-left .25s}
.liste a.card:hover{padding-left:14px;background:none;border-color:var(--line);transform:none}
.liste .ikon{color:var(--pine);opacity:.75;margin-top:2px;background:none;padding:0;
  border-radius:0;width:auto;height:auto}
.liste h3{font-family:'Newsreader',Georgia,serif;font-weight:500;font-size:26px;margin-bottom:5px}
.liste p{color:var(--muted);font-size:16px;max-width:62ch;margin:0}
.liste .pil{font-size:22px;color:var(--line);align-self:center}
.liste a.card:hover .pil{color:var(--pine)}
@media(max-width:720px){
  .liste a.card{grid-template-columns:52px 1fr;gap:18px;padding:24px 2px}
  .liste .pil{display:none}
}

/* Sitat uten den mørke, midtstilte boksen */
.snakk{max-width:760px;margin:0;padding-left:26px;border-left:3px solid var(--pine)}
.snakk blockquote{font-family:'Newsreader',Georgia,serif;font-size:clamp(1.5rem,3.4vw,2.1rem);
  line-height:1.3;margin:0;color:var(--ink);font-style:normal}
.snakk .hvem{margin-top:16px;font-size:15px;color:var(--muted)}

/* Løpende tekst i stedet for nummererte steg */
.brod{max-width:620px;font-size:18.5px;line-height:1.72;color:#3d4339}
.brod p + p{margin-top:17px}

/* Kontaktseksjonen trenger ikke rope like hoeyt som en seksjonsoverskrift.
   Med 61 px ble linja brutt i to og etterlot et hull ned til telefonnummeret. */
.kontakt .sec-head h2{font-size:clamp(1.9rem,4.2vw,2.9rem);max-width:20ch}
.kontakt .sec-head{margin-bottom:30px}
.kontakt .sec-head p{margin-top:10px}

/* Overskriften staar naa i venstre kolonne sammen med kontaktopplysningene,
   slik at begge spaltene starter i samme hoyde. Smalere venstrespalte gjor
   at skjemaet faar plassen det trenger. */
.kontakt .grid{grid-template-columns:.9fr 1.1fr;gap:54px}
.kontakt .sec-head{margin-bottom:34px}
@media(max-width:900px){.kontakt .grid{grid-template-columns:1fr;gap:30px}}

/* Venstre spalte skal lese som en spalte, ikke som en kort stubb ved siden av
   et hoyt skjema. Den strekkes til samme hoyde, og den siste linja faller ned
   til bunnen slik at kolonnen faar en fot aa staa paa. */
.kontakt .grid{align-items:stretch}
.kontakt .grid > div:first-child{display:flex;flex-direction:column}
.kontakt .grid > div:first-child .smaatt{margin-top:auto;padding-top:24px}
@media(max-width:900px){
  .kontakt .grid > div:first-child .smaatt{margin-top:0;padding-top:0}
}

/* Navnet oeverst i kontaktspalten — du ringer en person, ikke et firma */
.kx .navn{font-family:'Newsreader',Georgia,serif;font-size:clamp(1.4rem,3vw,2rem);
  font-weight:500;line-height:1.2;color:var(--ink)}

/* Spørsmål og svar på tjenestesidene (12.11.2026) */
.faq{max-width:760px}
.faq > div{padding:22px 0;border-top:1px solid var(--line)}
.faq > div:last-child{border-bottom:1px solid var(--line)}
.faq h3{font-family:'Newsreader',Georgia,serif;font-weight:500;font-size:21px;line-height:1.3;margin-bottom:8px}
.faq p{color:var(--muted);font-size:15.5px}