/* ---------- Fonter (selvhostet, ingen tredjepart) ----------
   ITF Free Font License + OnlineWebFonts-konvertering (demo) – ikke lisensiert for kommersiell levering + SIL Open Font License 1.1. Se assets/fonts/lisenser/
   Variable filer: én per stil dekker hele vektaksen 100-900.
   ---------------------------------------------------------- */
@font-face{
  font-family:'Cabinet Grotesk';
  src:url('../assets/fonts/cabinet-grotesk-normal.woff2') format('woff2');
  font-weight:100 900;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Archivo';
  src:url('../assets/fonts/archivo-normal.woff2') format('woff2');
  font-weight:100 900;font-stretch:62% 125%;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Suisse Intl';
  src:url('../assets/fonts/suisse-intl-300-normal.woff2') format('woff2');
  font-weight:300;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Suisse Intl';
  src:url('../assets/fonts/suisse-intl-400-normal.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Suisse Intl';
  src:url('../assets/fonts/suisse-intl-600-normal.woff2') format('woff2');
  font-weight:600;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Suisse Intl';
  src:url('../assets/fonts/suisse-intl-700-normal.woff2') format('woff2');
  font-weight:700;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'General Sans';
  src:url('../assets/fonts/general-sans-normal.woff2') format('woff2');
  font-weight:100 900;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Geist Mono';
  src:url('../assets/fonts/geist-mono-normal.woff2') format('woff2');
  font-weight:100 900;font-style:normal;font-display:swap;
}

/* ---------- Tokens (Design DNA: apg.at + caeli-energie.com + Dateks egne farger) ---------- */
:root{
  /* palett 1: Datek. Blekk fra deres #012032, aksent fra logoen på genseren */
  --c-papir:#FBFCFC; --c-flis:#EDF1F3; --c-blekk:#0B1F33; --c-dempet:#4A5866; --c-linje:#D3DAE0; --c-felt:#6B7884;
  --c-aksent:#2F4FE0; --c-pa-aksent:#FFFFFF; --c-aksent-tekst:#2F4FE0; --c-versal:#2F4FE0;
  --c-dyp:#0B1F33; --rgb-dyp:11 31 51; --c-pa-dyp:#F3F6F8; --c-dempet-dyp:#A9B6C2; --c-aksent-dyp:#B9C6FF;
  --c-stjerne:#B7791F; --c-feil:#B3261E; --c-fokus:#2F4FE0; --c-fokus-dyp:#B9C6FF;

  --f-display:'Cabinet Grotesk',system-ui,sans-serif;
  --f-tekst:'General Sans',system-ui,sans-serif;
  --f-mono:'Geist Mono',ui-monospace,monospace;
  --w-display:500; --w-versal:800; --w-tekst:400;
  --lh-display:1; --lh-versal:.94; --spor-display:-.02em; --spor-versal:-.014em;
  --d-skala:1; --v-skala:1; --v-var:normal;

  --fs-tekst:18px; --fs-liten:15px;
  --kant:64px; --ramme:1220px; --seksjon:128px; --topp:72px;
  --r-flis:8px; --r-knapp:4px;
  --ease:cubic-bezier(.23,1,.32,1);
  --z-dekor:1; --z-sticky:100; --z-dokk:200; --z-overlay:300; --z-panel:400; --z-varsel:500;
}
/* palett 2: kobber, fra kobberlederen i tavla */
html[data-pal="2"]{
  --c-papir:#FBFAF8; --c-flis:#F0ECE7; --c-blekk:#17191C; --c-dempet:#57524C; --c-linje:#DDD6CE; --c-felt:#7A736B;
  --c-aksent:#A3521F; --c-pa-aksent:#FFFFFF; --c-aksent-tekst:#A3521F; --c-versal:#17191C;
  --c-dyp:#17191C; --rgb-dyp:23 25 28; --c-pa-dyp:#F5F2EE; --c-dempet-dyp:#B3ACA4; --c-aksent-dyp:#F0B48C;
  --c-stjerne:#A3521F; --c-fokus:#A3521F; --c-fokus-dyp:#F0B48C;
}
/* palett 3: signalgul, som merkingen på elskap */
html[data-pal="3"]{
  --c-papir:#FAFAF9; --c-flis:#EEEFF0; --c-blekk:#121417; --c-dempet:#52565C; --c-linje:#D6D8DB; --c-felt:#6E737A;
  --c-aksent:#F2C200; --c-pa-aksent:#121417; --c-aksent-tekst:#7A6200; --c-versal:#121417;
  --c-dyp:#121417; --rgb-dyp:18 20 23; --c-pa-dyp:#F4F4F2; --c-dempet-dyp:#AEB2B7; --c-aksent-dyp:#F2C200;
  --c-stjerne:#8A6D00; --c-fokus:#121417; --c-fokus-dyp:#F2C200;
}
html[data-font="2"]{
  --f-display:'Archivo',system-ui,sans-serif; --f-tekst:'Archivo',system-ui,sans-serif;
  --w-display:500; --w-versal:800; --spor-display:-.025em; --spor-versal:-.01em; --v-var:'wdth' 118; --d-skala:.94; --v-skala:.9;
}
html[data-font="3"]{
  --f-display:'Suisse Intl',system-ui,sans-serif; --f-tekst:'Suisse Intl',system-ui,sans-serif;
  --w-display:400; --w-versal:700; --spor-display:-.03em; --spor-versal:-.03em; --d-skala:.96; --v-skala:.92;
}

/* ---------- Grunnlag ---------- */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--topp) + 16px)}
body{margin:0;background:var(--c-papir);color:var(--c-blekk);font:var(--w-tekst) var(--fs-tekst)/1.5 var(--f-tekst);-webkit-font-smoothing:antialiased}
img,video{display:block;max-width:100%;height:auto}
h1,h2,h3,p,ul,figure,blockquote,fieldset,legend{margin:0;padding:0}
fieldset{border:0;min-width:0}
ul{list-style:none}
a{color:inherit}
button,input{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--c-fokus);outline-offset:3px;border-radius:2px}
.topp :focus-visible,.hero--film :focus-visible,.bunn :focus-visible,.dokk :focus-visible{outline-color:var(--c-fokus-dyp)}
.ikon{width:1.2em;height:1.2em;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none}
.vis-skjermleser{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.hopp{position:absolute;left:16px;top:-80px;z-index:var(--z-varsel);background:var(--c-blekk);color:var(--c-papir);padding:12px 16px;border-radius:var(--r-knapp)}
.hopp:focus{top:12px}
.ramme{width:min(100% - 2 * var(--kant),var(--ramme));margin-inline:auto}
.lenke{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--c-aksent-tekst);font-weight:500;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.lenke .ikon{width:1em;height:1em}

/* Knapper (apg: 4 px radius, 20 × 24 padding, 18 px vekt 500) */
.knapp{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 24px;border:1px solid transparent;border-radius:var(--r-knapp);background:transparent;font:500 17px/1.1 var(--f-tekst);text-decoration:none;cursor:pointer;transition:background-color .2s var(--ease),color .2s var(--ease),transform .16s var(--ease)}
.knapp:active{transform:scale(.98)}
.knapp .ikon{width:1.1em;height:1.1em}
.knapp--aksent{background:var(--c-aksent);color:var(--c-pa-aksent)}
.knapp--lys{background:var(--c-papir);color:var(--c-blekk)}
.knapp--strek{border-color:currentColor}
.knapp--blekk{background:var(--c-blekk);color:var(--c-papir)}
@media (hover:hover){
  .knapp--aksent:hover{background:var(--c-blekk);color:var(--c-papir)}
  .hero--film .knapp--aksent:hover{background:var(--c-papir);color:var(--c-blekk)}
  .knapp--lys:hover{background:var(--c-flis)}
  .knapp--strek:hover{background:var(--c-blekk);color:var(--c-papir);border-color:var(--c-blekk)}
  .knapp--blekk:hover{background:var(--c-aksent);color:var(--c-pa-aksent)}
}

/* ---------- Toppen ---------- */
.topp{position:sticky;top:0;z-index:var(--z-sticky);background:var(--c-dyp);color:var(--c-pa-dyp)}
.topp__rad{display:flex;align-items:center;gap:40px;height:var(--topp);width:min(100% - 2 * var(--kant),var(--ramme));margin-inline:auto}
.merke{display:flex;align-items:center;min-height:44px}
.merke img{height:44px;width:auto}
.topp__nav{display:flex;gap:4px;margin-left:auto}
.topp__nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;text-decoration:none;font-weight:500;font-size:16px;border-radius:var(--r-knapp);transition:background-color .2s var(--ease)}
.topp__tlf{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:var(--r-knapp);background:var(--c-aksent);color:var(--c-pa-aksent);text-decoration:none;font-weight:500;font-size:16px}
@media (hover:hover){.topp__nav a:hover{background:rgb(255 255 255 / .1)}}

/* ---------- Heroene: bare den valgte vises ---------- */
.hero{display:none;position:relative}
html[data-hero="1"] .hero[data-hero="1"],html[data-hero="2"] .hero[data-hero="2"]{display:block}
.hero__line{display:block;overflow:hidden;padding:.2em .25em .26em;margin:-.2em -.25em -.26em}
.hero__line-in{display:inline-block}
html.anim-hero .hero .hero__line-in{transform:translateY(150%)}
html.anim-hero .hero .hero__sub{opacity:0}

/* Hero 1 (apg.at): film i hele heroen, tekst nede til venstre, fanerad nederst */
.hero--film{min-height:min(calc(100svh - var(--topp)),880px);background:var(--c-dyp);color:var(--c-pa-dyp);overflow:hidden;isolation:isolate}
.hero__film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 40%;z-index:-2}
.hero__slor{position:absolute;inset:0;z-index:-1;background:
  linear-gradient(90deg,rgb(var(--rgb-dyp) / .92) 0%,rgb(var(--rgb-dyp) / .85) 40%,rgb(var(--rgb-dyp) / .62) 56%,rgb(var(--rgb-dyp) / .14) 74%,rgb(var(--rgb-dyp) / .04) 100%),
  linear-gradient(0deg,rgb(var(--rgb-dyp) / .92) 0%,rgb(var(--rgb-dyp) / .5) 22%,rgb(var(--rgb-dyp) / 0) 44%)}
.hero--film .hero__innhold{min-height:inherit;display:flex;flex-direction:column;justify-content:flex-end;gap:24px;padding-block:96px 176px}
.hero__kicker{font:500 13px/1.2 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--c-aksent-dyp)}
.hero__tittel{display:flex;flex-direction:column;font-family:var(--f-display);font-weight:var(--w-display);font-size:calc(clamp(46px,6vw,88px) * var(--d-skala));line-height:var(--lh-display);letter-spacing:var(--spor-display);max-width:13em}
.hero__ingress{max-width:34em;font-size:19px;color:var(--c-pa-dyp)}
.hero__knapper{display:flex;flex-wrap:wrap;gap:12px}
.faner{position:absolute;left:0;right:0;bottom:0;background:rgb(var(--rgb-dyp) / .72);border-top:1px solid rgb(255 255 255 / .16)}
.faner__rad{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.fane{display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center;padding:22px 24px;text-decoration:none;border-left:1px solid rgb(255 255 255 / .16);transition:background-color .2s var(--ease)}
.fane:last-child{border-right:1px solid rgb(255 255 255 / .16)}
.fane .ikon{grid-row:span 2;width:28px;height:28px;color:var(--c-aksent-dyp)}
.fane__navn{font:var(--w-display) 21px/1.2 var(--f-display)}
.fane__linje{font-size:14px;color:var(--c-dempet-dyp)}
@media (hover:hover){.fane:hover{background:rgb(255 255 255 / .08)}}

/* Hero 2 (caeli-energie.com): versal i full vekt, kundens foto står oppå tittelen */
.hero--versal{min-height:min(calc(100svh - var(--topp)),880px);background:var(--c-papir);overflow:hidden;padding-top:clamp(36px,6vh,72px)}
.versal{display:flex;flex-direction:column;align-items:center;text-align:center;font-family:var(--f-display);font-weight:var(--w-versal);font-variation-settings:var(--v-var);text-transform:uppercase;font-size:calc(clamp(64px,12.4vw,186px) * var(--v-skala));line-height:var(--lh-versal);letter-spacing:var(--spor-versal);color:var(--c-versal)}
.versal__foto{position:absolute;left:50%;bottom:0;width:clamp(240px,26vw,380px);aspect-ratio:.78;transform:translateX(-50%);border-radius:var(--r-flis) var(--r-flis) 0 0;overflow:hidden;z-index:var(--z-dekor)}
.versal__foto img{width:100%;height:100%;object-fit:cover;object-position:72% 30%}
.versal__sted{position:absolute;left:var(--kant);bottom:48px;display:flex;gap:10px;max-width:15em;font:500 14px/1.5 var(--f-mono);color:var(--c-dempet)}
.versal__sted .ikon{color:var(--c-aksent-tekst)}
.versal__tekst{position:absolute;right:var(--kant);bottom:48px;width:min(340px,27vw);display:flex;flex-direction:column;gap:20px;font-size:17px}
.versal__tekst .hero__knapper{flex-direction:column;align-items:stretch}

/* ---------- Seksjonshoder ---------- */
.hode{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 64px;align-items:end;margin-bottom:56px}
.hode h2,.befaring h2,.omtaler h2,.kontakt h2{font-family:var(--f-display);font-weight:var(--w-display);font-size:calc(clamp(36px,4.2vw,60px) * var(--d-skala));line-height:1;letter-spacing:var(--spor-display)}
.hode p{max-width:32em;color:var(--c-dempet);justify-self:end}

/* ---------- Oppdrag i tall (apg: grå fliser, store tall i bokvekt) ---------- */
.oppdrag{padding-block:var(--seksjon) calc(var(--seksjon) * .6)}
.fliser{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;grid-auto-flow:dense}
.flis{grid-column:span 1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:280px;padding:40px 28px;border-radius:var(--r-flis);background:var(--c-flis);text-align:center}
.flis--bred,.flis--halv{grid-column:span 2}
.flis__tall{white-space:nowrap;font-family:var(--f-display);font-weight:var(--w-display);font-size:calc(clamp(48px,5.4vw,80px) * var(--d-skala));line-height:1;letter-spacing:var(--spor-display);font-variant-numeric:tabular-nums}
.flis__enhet{font-size:.5em;letter-spacing:0}
.flis__hva{font-weight:600;font-size:16px;line-height:1.35;max-width:22em}
.flis__mer{font-size:var(--fs-liten);color:var(--c-dempet);max-width:30em}
.oppdrag__ogsa{margin-top:28px;color:var(--c-dempet);font-size:var(--fs-liten)}

/* ---------- Tjenester ---------- */
.tjenester{padding-block:calc(var(--seksjon) * .6) var(--seksjon)}
.kortrad{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 24px}
.kort{position:relative;display:flex;flex-direction:column;gap:10px}
.kort__bilde{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r-flis);margin-bottom:10px;transition:filter .3s var(--ease)}
.kort__navn{display:flex;align-items:center;gap:10px;font-family:var(--f-display);font-weight:var(--w-display);font-size:24px;line-height:1.15;letter-spacing:-.01em}
.kort__navn .ikon{width:26px;height:26px;color:var(--c-aksent-tekst)}
.kort__linje{color:var(--c-dempet);font-size:16px}
.kort__lenke{position:absolute;inset:0;border-radius:var(--r-flis)}
@media (hover:hover){
  .kort:hover .kort__bilde{filter:brightness(1.06) saturate(1.08)}
  .kort:hover .kort__navn span{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
}

/* ---------- Befaring (lead-modul) på aksentflaten ---------- */
.befaring{background:var(--c-aksent);color:var(--c-pa-aksent);padding-block:var(--seksjon)}
.befaring :focus-visible{outline-color:var(--c-pa-aksent)}
.befaring .velger__kort :focus-visible{outline-color:var(--c-fokus)}
.befaring__rad{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px;align-items:start}
.befaring__om{display:flex;flex-direction:column;gap:24px}
.befaring__om p{max-width:30em}
.befaring__foto{border-radius:var(--r-flis);overflow:hidden;aspect-ratio:4/3;margin-top:16px}
.befaring__foto img{width:100%;height:100%;object-fit:cover;object-position:68% 35%}
.velger__kort{background:var(--c-papir);color:var(--c-blekk);border-radius:var(--r-flis);padding:40px}
.velger__topp{display:flex;align-items:center;gap:20px;margin-bottom:28px}
.velger__steg{font:500 13px/1 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--c-dempet);white-space:nowrap}
.velger__fremdrift{flex:1;height:4px;border-radius:2px;background:var(--c-flis);overflow:hidden}
.velger__fremdrift span{display:block;height:100%;background:var(--c-aksent-tekst);transform:scaleX(.2);transform-origin:0 50%;transition:transform .35s var(--ease)}
.sp{display:flex;flex-direction:column;gap:10px}
.sp + .sp{margin-top:32px}
.velger--klar .sp{display:none}
.velger--klar .sp.er-aktiv{display:flex;margin-top:0}
.sp__spm{font-family:var(--f-display);font-weight:var(--w-display);font-size:28px;line-height:1.15;letter-spacing:-.01em;margin-bottom:10px;padding:0}
.val{position:relative;display:block}
.val input{position:absolute;opacity:0;width:1px;height:1px}
.val__rad{display:flex;align-items:center;gap:14px;min-height:56px;padding:12px 16px;border:1px solid var(--c-linje);border-radius:6px;cursor:pointer;transition:border-color .15s var(--ease),background-color .15s var(--ease)}
.val__bokstav{display:inline-grid;place-items:center;flex:none;width:28px;height:28px;border:1px solid var(--c-felt);border-radius:4px;font:500 13px/1 var(--f-mono)}
.val input:checked + .val__rad{border-color:var(--c-aksent-tekst);box-shadow:inset 0 0 0 1px var(--c-aksent-tekst);background:var(--c-flis)}
.val input:checked + .val__rad .val__bokstav{background:var(--c-aksent-tekst);border-color:var(--c-aksent-tekst);color:var(--c-papir)}
.val input:focus-visible + .val__rad{outline:2px solid var(--c-fokus);outline-offset:2px}
@media (hover:hover){.val__rad:hover{border-color:var(--c-blekk)}}
.sammendrag{font-size:var(--fs-liten);color:var(--c-dempet);margin-bottom:6px}
.sammendrag:empty{display:none}
.felt{display:flex;flex-direction:column;gap:6px}
.felt label{font-weight:500;font-size:16px}
.felt input{min-height:52px;padding:0 14px;border:1px solid var(--c-felt);border-radius:var(--r-knapp);background:var(--c-papir);font-size:17px}
.felt input[aria-invalid="true"]{border-color:var(--c-feil);box-shadow:inset 0 0 0 1px var(--c-feil)}
.felt__feil{color:var(--c-feil);font-size:var(--fs-liten);font-weight:500}
.samtykke{display:flex;align-items:flex-start;gap:12px;min-height:44px;padding-top:6px;font-size:var(--fs-liten);color:var(--c-dempet);cursor:pointer}
.samtykke input{width:22px;height:22px;margin:0;flex:none;accent-color:var(--c-aksent-tekst)}
.sp--kontakt .knapp{margin-top:8px;align-self:flex-start}
.velger__nav{display:flex;justify-content:space-between;gap:12px;margin-top:28px}
.velger__nav:has(.velger__tilbake[hidden]){justify-content:flex-end}
.kvittering{display:flex;align-items:flex-start;gap:16px;font-size:20px;line-height:1.4}
.kvittering:focus{outline:none}
.kvittering__ikon{width:44px;height:44px;padding:10px;border-radius:50%;background:var(--c-aksent-tekst);color:var(--c-papir);stroke-width:2}

/* ---------- Omtaler og godkjenninger ---------- */
.tillit{padding-block:var(--seksjon)}
.tillit__rad{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:64px;align-items:start}
.omtaler__liste{margin-top:40px}
.omtale{padding-block:28px;border-top:1px solid var(--c-linje)}
.omtale:last-child{border-bottom:1px solid var(--c-linje)}
.stjerner{color:var(--c-stjerne);letter-spacing:.12em;font-size:18px;line-height:1}
.omtale blockquote{margin:14px 0 10px;font-family:var(--f-display);font-weight:var(--w-display);font-size:calc(clamp(22px,2.2vw,30px) * var(--d-skala));line-height:1.25;letter-spacing:-.01em}
.omtale__hvem{font-size:var(--fs-liten);color:var(--c-dempet)}
.godkjent{background:var(--c-flis);border-radius:var(--r-flis);padding:40px}
.godkjent__tittel{font:var(--w-display) 26px/1.15 var(--f-display);margin-bottom:16px}
.godkjent__liste li{display:flex;align-items:center;gap:12px;padding-block:14px;border-bottom:1px solid var(--c-linje)}
.godkjent__liste .ikon{width:24px;height:24px;color:var(--c-aksent-tekst)}
.godkjent__jobb{margin-top:24px;font-size:16px;color:var(--c-dempet)}

/* ---------- Kontakt og kart ---------- */
.kontakt{padding-block:0 var(--seksjon)}
.kontakt__rad{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:64px;align-items:center}
.kontakt__info{display:flex;flex-direction:column;gap:20px}
.kontakt__info > p{color:var(--c-dempet)}
.kontaktliste li{display:flex;align-items:center;gap:14px;min-height:56px;border-bottom:1px solid var(--c-linje);font:var(--w-display) 21px/1.2 var(--f-display)}
.kontaktliste .ikon{width:24px;height:24px;color:var(--c-aksent-tekst)}
.kontaktliste a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none}
@media (hover:hover){.kontaktliste a:hover{text-decoration:underline;text-underline-offset:5px}}
.kart{position:relative}
.kart__bilde{width:100%;aspect-ratio:1440/640;object-fit:cover;border-radius:var(--r-flis)}
.kart__nal{position:absolute;left:50%;top:calc(50% - 7px);transform:translate(-50%,-100%);display:flex;align-items:center;gap:6px;padding:8px 14px 8px 10px;border-radius:999px;background:var(--c-aksent);color:var(--c-pa-aksent);font-weight:600;font-size:15px;white-space:nowrap}
.kart__nal::after{content:"";position:absolute;left:50%;bottom:-7px;width:14px;height:14px;background:inherit;transform:translateX(-50%) rotate(45deg);z-index:-1}
.kart__under{display:flex;flex-wrap:wrap;gap:4px 24px;align-items:center;margin-top:8px;font-size:var(--fs-liten)}
.kart__kreditt{margin-left:auto;color:var(--c-dempet)}
.kart__kreditt a{display:inline-flex;align-items:center;min-height:44px;color:inherit}

.ikkefunnet{display:flex;flex-direction:column;align-items:flex-start;gap:24px;padding-block:120px}
.ikkefunnet h1{font:var(--w-display) calc(clamp(40px,5vw,72px) * var(--d-skala))/1 var(--f-display);letter-spacing:var(--spor-display)}

/* ---------- Bunnen ---------- */
.bunn{background:var(--c-dyp);color:var(--c-pa-dyp);padding-block:72px 40px;font-size:var(--fs-liten)}
.bunn__rad{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap}
.bunn__merke{display:flex;flex-direction:column;gap:16px;color:var(--c-dempet-dyp)}
.bunn__merke img{width:110px;height:auto}
.bunn__lenker{display:grid;grid-template-columns:repeat(2,auto);gap:0 40px;align-content:start}
.bunn__lenker a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;color:var(--c-pa-dyp)}
@media (hover:hover){.bunn__lenker a:hover,.bunn__kreditt a:hover{text-decoration:underline;text-underline-offset:4px}}
.bunn__fot{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-top:48px;padding-top:24px;border-top:1px solid rgb(255 255 255 / .14);color:var(--c-dempet-dyp);font-size:13px}
.bunn__foto{max-width:60em}
.bunn__kreditt a{display:inline-flex;align-items:center;min-height:44px;color:var(--c-dempet-dyp);text-decoration:none}

/* ---------- Dokken (mobil) ---------- */
.dokk{display:none}

/* ---------- Designvalg (Design Lab) ---------- */
.lab{position:fixed;right:12px;bottom:12px;z-index:var(--z-panel);display:flex;flex-direction:column-reverse;align-items:flex-end;gap:8px;font:500 14px/1.2 var(--f-tekst)}
.lab__veksle{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border:1px solid rgb(255 255 255 / .3);border-radius:999px;background:rgb(18 20 23 / .78);color:#fff;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);cursor:pointer}
.lab__panel{display:flex;flex-direction:column;gap:8px;padding:14px;border:1px solid rgb(255 255 255 / .22);border-radius:14px;background:rgb(18 20 23 / .82);color:#fff;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.lab__gruppe{display:flex;align-items:center;gap:6px}
.lab__merke{width:28px;text-align:center}
.lab__gruppe button{min-width:44px;min-height:44px;border:1px solid rgb(255 255 255 / .3);border-radius:8px;background:transparent;color:#fff;cursor:pointer}
.lab__gruppe button[aria-pressed="true"]{background:#fff;color:#121417}
.lab__signatur{margin-top:4px;font-size:12px;color:rgb(255 255 255 / .7)}
.lab__signatur a{color:#fff}
.lab :focus-visible{outline-color:#fff}

/* ---------- Nettbrett ---------- */
@media (max-width:1100px){
  :root{--kant:40px;--seksjon:104px}
  .topp__nav a{padding:0 10px}
  .befaring__rad,.tillit__rad,.kontakt__rad{gap:40px}
}

/* ---------- Mobil: ruter, ramser ikke opp ---------- */
@media (max-width:760px){
  :root{--kant:16px;--seksjon:64px;--topp:64px;--fs-tekst:17px}
  .topp__rad{gap:12px}
  .merke img{height:38px}
  .topp__nav{display:none}
  .topp__tlf{margin-left:auto;padding:0 14px}

  .hero--film{min-height:auto}
  .hero__film{height:min(46svh,380px);bottom:auto;object-position:62% 40%}
  .hero__slor{bottom:auto;height:min(46svh,380px);background:linear-gradient(0deg,var(--c-dyp) 0%,rgb(var(--rgb-dyp) / .86) 30%,rgb(var(--rgb-dyp) / .4) 60%,rgb(var(--rgb-dyp) / .06) 100%)}
  .hero--film .hero__innhold{padding-block:min(32svh,250px) 28px;gap:18px}
  .hero__tittel{font-size:calc(clamp(40px,11vw,54px) * var(--d-skala))}
  .hero__ingress{font-size:17px}
  .hero__knapper .knapp{flex:1 1 auto}
  .faner{position:static;background:transparent;border-top:1px solid rgb(255 255 255 / .16)}
  .faner__rad{width:100%}
  .fane{grid-template-columns:1fr;justify-items:center;row-gap:6px;padding:16px 6px;text-align:center}
  .fane:first-child{border-left:0}
  .fane:last-child{border-right:0}
  .fane .ikon{grid-row:auto;width:24px;height:24px}
  .fane__navn{font-size:16px}
  .fane__linje{display:none}

  .hero--versal{min-height:auto;padding:28px 0 0}
  .versal{font-size:calc(clamp(56px,18.5vw,84px) * var(--v-skala))}
  .versal__foto{position:relative;left:auto;bottom:auto;transform:none;width:62%;margin:-.22em auto 0;font-size:calc(clamp(56px,18.5vw,84px) * var(--v-skala));aspect-ratio:1/1;border-radius:var(--r-flis)}
  .versal__sted{position:static;margin:20px var(--kant) 0;max-width:none}
  .versal__tekst{position:static;width:auto;margin:14px var(--kant) 32px;gap:16px}
  .versal__tekst .hero__knapper{flex-direction:row}
  .versal__tekst .hero__knapper .knapp{flex:1 1 auto}

  .hode{grid-template-columns:1fr;margin-bottom:28px;gap:12px}
  .hode p{justify-self:start;font-size:16px}
  .fliser{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .flis{min-height:0;padding:22px 12px;gap:8px}
  .flis--bred{grid-column:span 2}
  .flis--halv{grid-column:span 1}
  .flis__tall{font-size:calc(38px * var(--d-skala))}
  .flis__hva{font-size:14px}
  .flis__mer{display:none}
  .oppdrag__ogsa{margin-top:16px}

  .kortrad{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 10px}
  .kort{gap:4px}
  .kort__bilde{margin-bottom:6px}
  .kort__navn{font-size:16px;gap:6px;align-items:flex-start}
  .kort__navn .ikon{width:18px;height:18px;margin-top:1px}
  .kort__linje{font-size:13px;line-height:1.35}

  .befaring__rad{grid-template-columns:1fr;gap:24px}
  .befaring__om{gap:12px}
  .befaring__foto{display:none}
  .velger__kort{padding:22px 16px}
  .velger__topp{margin-bottom:18px}
  .sp__spm{font-size:23px;margin-bottom:4px}
  .val__rad{min-height:52px;padding:10px 12px;font-size:16px}
  .sp--kontakt .knapp{align-self:stretch}

  .tillit__rad{grid-template-columns:1fr;gap:32px}
  .omtaler__liste{margin-top:20px}
  .omtale{padding-block:20px}
  .omtale--ekstra{display:none}
  .omtale:nth-last-child(2){border-bottom:1px solid var(--c-linje)}
  .godkjent{padding:22px 18px}
  .godkjent__liste li{padding-block:10px;font-size:16px}

  .kontakt__rad{grid-template-columns:1fr;gap:20px}
  .kontaktliste li{font-size:19px}
  .kart__bilde{aspect-ratio:16/10}
  .kart__kreditt{margin-left:0}

  .bunn{padding-block:48px 96px}
  .bunn__lenker{grid-template-columns:1fr 1fr;gap:0 16px}
  .bunn__fot{margin-top:28px}

  .dokk{display:grid;grid-template-columns:1fr 1.4fr;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:var(--z-dokk);padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:var(--c-dyp);transform:translateY(110%);transition:transform .3s var(--ease)}
  .dokk.er-synlig{transform:none}
  .dokk__knapp{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border:1px solid rgb(255 255 255 / .3);border-radius:var(--r-knapp);color:var(--c-pa-dyp);text-decoration:none;font-weight:500}
  .dokk__knapp--aksent{background:var(--c-aksent);border-color:var(--c-aksent);color:var(--c-pa-aksent)}
  html.dokk-ute .lab{bottom:80px}
  .lab__veksle-tekst{display:none}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}