/* Mathisen Vinduspuss: utkast. Oppsett fra fenestra.do (delt hero, produktkort, mørk kontaktflate),
   hero 2 og tonede flater fra ecowindowcleaninglondon.co.uk. Alt gjennom tokens. */
/* ---------- 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:'Funnel Display';
  src:url('../assets/fonts/funnel-display-normal.woff2') format('woff2');
  font-weight:100 900;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Fraunces';
  src:url('../assets/fonts/fraunces-normal.woff2') format('woff2');
  font-weight:100 900;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Fraunces';
  src:url('../assets/fonts/fraunces-italic.woff2') format('woff2');
  font-weight:100 900;font-style:italic;font-display:swap;
}
@font-face{
  font-family:'GT Sectra';
  src:url('../assets/fonts/gt-sectra-400-normal.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'GT Sectra';
  src:url('../assets/fonts/gt-sectra-500-normal.woff2') format('woff2');
  font-weight:500;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Switzer';
  src:url('../assets/fonts/switzer-normal.woff2') format('woff2');
  font-weight:100 900;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Switzer';
  src:url('../assets/fonts/switzer-italic.woff2') format('woff2');
  font-weight:100 900;font-style:italic;font-display:swap;
}

/* ---------- Tokens ---------- */
:root{
  /* Palett 1: Fjord. Blått fra logoen (#2C74AD), blekk og papir fra fenestra.do (rgb 24 67 90 / 241 251 255). */
  --c-papir:#F1F7FB; --c-flate:#E1EEF7; --c-felt:#FBFDFE;
  --c-blekk:#0F2A40; --c-dempet:#46596A; --c-linje:rgba(15,42,64,.16); --c-linje-sterk:rgba(15,42,64,.42);
  --c-dyp:#12324A; --c-dyp-rgb:18,50,74; --c-dypere:#0B2236;
  --c-aksent:#2C74AD; --c-aksent-trykk:#1F5F92; --c-aksent-lys:#A9D2F0; --c-paa-aksent:#FFFFFF;
  --c-stjerne:#9A6A08; --c-stjerne-lys:#FFCB5C;
  --c-fokus:#2C74AD; --c-feil:#B3261E; --c-ok:#1E6B47;
  --f-display:'Funnel Display','Helvetica Neue',Arial,sans-serif; --f-tekst:'Switzer','Helvetica Neue',Arial,sans-serif;
  --w-display:500; --lh-display:1; --ls-display:-.03em;
  --fs-h1:clamp(2.5rem,4.7vw,4.25rem); --fs-h1-film:clamp(3.25rem,8.2vw,7.5rem); --fs-h2:clamp(2rem,3.4vw,3.25rem); --fs-h3:1.375rem;
  --fs-tekst:1.0625rem; --fs-liten:.9375rem; --lh-tekst:1.6;
  --s-1:8px; --s-2:16px; --s-3:24px; --s-4:48px; --s-5:100px;
  --ramme:1272px; --side:clamp(16px,4vw,48px); --topp-h:76px;
  --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: Skifer. Kjølig grå med blågrønn aksent. */
[data-pal="2"]{
  --c-papir:#F2F3F1; --c-flate:#E3E7E4; --c-felt:#FBFBFA;
  --c-blekk:#1A2422; --c-dempet:#4D5A57; --c-linje:rgba(26,36,34,.16); --c-linje-sterk:rgba(26,36,34,.42);
  --c-dyp:#1E3531; --c-dyp-rgb:30,53,49; --c-dypere:#142622;
  --c-aksent:#1D7566; --c-aksent-trykk:#155E52; --c-aksent-lys:#9ADFCF; --c-fokus:#1D7566;
}
/* Palett 3: Sand. Varmt papir med teglrød aksent. */
[data-pal="3"]{
  --c-papir:#F6F1E8; --c-flate:#ECE3D4; --c-felt:#FCFAF6;
  --c-blekk:#2B2118; --c-dempet:#5E5144; --c-linje:rgba(43,33,24,.16); --c-linje-sterk:rgba(43,33,24,.42);
  --c-dyp:#3A2A1E; --c-dyp-rgb:58,42,30; --c-dypere:#2A1E15;
  --c-aksent:#A3461F; --c-aksent-trykk:#86391A; --c-aksent-lys:#F4BFA2; --c-fokus:#A3461F; --c-stjerne:#8E5F05;
}
[data-font="2"]{--f-display:'Fraunces',Georgia,serif; --w-display:400; --lh-display:1.04; --ls-display:-.02em}
[data-font="3"]{--f-display:'GT Sectra',Georgia,serif; --w-display:500; --lh-display:1.04; --ls-display:-.015em}

/* ---------- Grunnlag ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--topp-h) + 8px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--c-papir);color:var(--c-blekk);font:400 var(--fs-tekst)/var(--lh-tekst) var(--f-tekst);-webkit-font-smoothing:antialiased}
img,video{display:block;max-width:100%;height:auto}
[hidden]{display:none!important}
h1,h2,h3,p,ul,figure,blockquote,fieldset{margin:0;padding:0}
ul{list-style:none}
fieldset{border:0;min-width:0}
a{color:inherit}
h1,h2{font-family:var(--f-display);font-weight:var(--w-display);line-height:var(--lh-display);letter-spacing:var(--ls-display)}
h2{font-size:var(--fs-h2)}
h3{font-family:var(--f-tekst);font-size:var(--fs-h3);font-weight:600;line-height:1.25;letter-spacing:-.01em}
:focus-visible{outline:2px solid var(--c-fokus);outline-offset:3px;border-radius:2px}
.ikon{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ramme{width:100%;max-width:calc(var(--ramme) + 2 * var(--side));margin-inline:auto;padding-inline:var(--side)}
.vis-skjermleser{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hopp{position:absolute;left:var(--side);top:-60px;z-index:var(--z-varsel);background:var(--c-blekk);color:var(--c-papir);padding:12px 16px}
.hopp:focus{top:8px}

/* ---------- Knapper og felt ---------- */
.knapp{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 28px;border:1px solid transparent;border-radius:0;font:500 var(--fs-tekst)/1 var(--f-tekst);text-decoration:none;cursor:pointer;transition:background-color .18s var(--ease),color .18s var(--ease),transform .16s var(--ease)}
.knapp:active{transform:scale(.97)}
.knapp--fylt{background:var(--c-aksent);color:var(--c-paa-aksent)}
.knapp--ramme{border-color:var(--c-linje-sterk);color:var(--c-blekk);background:transparent}
.knapp--tekst{background:none;color:inherit;padding:0 12px;text-decoration:underline;text-underline-offset:4px}
@media (hover:hover) and (pointer:fine){
  .knapp--fylt:hover{background:var(--c-aksent-trykk)}
  .knapp--ramme:hover{background:var(--c-flate)}
}
.felt{display:flex;flex-direction:column;gap:6px;min-width:0}
.felt__navn{font-size:var(--fs-liten);font-weight:500}
.felt input,.felt select{width:100%;min-height:52px;padding:0 14px;border:1px solid var(--c-linje-sterk);border-radius:0;background:var(--c-felt);color:var(--c-blekk);font:400 1rem/1.2 var(--f-tekst)}
.felt select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:36px}
.felt input[aria-invalid="true"]{border-color:var(--c-feil);box-shadow:inset 0 0 0 1px var(--c-feil)}
.skjema__rad{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:end}
.skjema__notis{margin-top:10px;font-size:var(--fs-liten);color:var(--c-dempet)}
.skjema__feil{margin-top:10px;font-size:var(--fs-liten);font-weight:500;color:var(--c-feil)}
.takk__tittel{font-family:var(--f-display);font-weight:var(--w-display);font-size:1.75rem;line-height:1.1;margin-bottom:6px}
.hero__skjema.er-sendt > :not(.hero__skjema-takk){display:none}
.hero__skjema-takk{padding:20px;background:var(--c-felt);border-left:0;outline:none}

/* ---------- Toppen ---------- */
.topp{position:sticky;top:0;z-index:var(--z-sticky);background:var(--c-papir);border-bottom:1px solid var(--c-linje)}
.topp__rad{display:flex;align-items:center;gap:var(--s-3);height:var(--topp-h)}
.merke__logo{width:136px}
.topp__nav{display:flex;gap:var(--s-3);margin-left:auto}
.topp__nav a{font-size:var(--fs-liten);font-weight:500;text-decoration:none;padding:12px 2px}
@media (hover:hover) and (pointer:fine){.topp__nav a:hover{color:var(--c-aksent)}}
.topp__handling{display:flex;align-items:center;gap:8px}
.topp__ikon{display:grid;place-items:center;width:48px;height:48px;color:var(--c-blekk)}
.topp__tlf{min-height:48px;padding:0 18px}

/* ---------- Stjerner ---------- */
.stjerner{position:relative;display:inline-block;width:88px;height:16px;background:linear-gradient(90deg,currentColor 0 0) 0 0/0 0;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.9 6.6 7.1.6-5.4 4.7 1.6 7L12 17.3 5.8 20.9l1.6-7L2 9.2l7.1-.6z'/%3E%3C/svg%3E") 0 0/17.6px 16px repeat-x;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.9 6.6 7.1.6-5.4 4.7 1.6 7L12 17.3 5.8 20.9l1.6-7L2 9.2l7.1-.6z'/%3E%3C/svg%3E") 0 0/17.6px 16px repeat-x;
  background-color:var(--c-linje-sterk);color:var(--c-stjerne)}
.stjerner__fylt{position:absolute;inset:0 auto 0 0;background:var(--c-stjerne)}
.stjerner--stor{width:121px;height:22px;-webkit-mask-size:24.2px 22px;mask-size:24.2px 22px}

/* ---------- Hero, felles ---------- */
.hero{position:relative;display:none}
[data-hero="1"] .hero[data-hero="1"],[data-hero="2"] .hero--film[data-hero="2"]{display:block}
.hero__vurdering{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:var(--fs-liten);font-weight:500;text-decoration:none}
.hero__tittel{display:flex;flex-direction:column}
.hero__line{display:block;overflow:hidden;padding:.2em .25em .26em;margin:-.2em -.25em -.26em}
.hero__line-in{display:block}
.anim-hero .hero__line-in{transform:translateY(150%)}
.anim-hero .hero__sub{opacity:0}

/* ---------- Hero 1: delt ---------- */
.hero--delt{padding:var(--s-4) 0 var(--s-5)}
.hero__flate{position:absolute;left:0;top:0;bottom:var(--s-5);width:61%;background:var(--c-flate)}
.hero--delt .hero__rutenett{position:relative;display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--s-3);align-items:center}
.hero--delt .hero__tekst{grid-column:1 / span 6;padding-block:var(--s-2)}
.hero--delt .hero__tittel{font-size:var(--fs-h1);margin:var(--s-2) 0 var(--s-3)}
.hero__ingress{max-width:34em;font-size:1.125rem;color:var(--c-dempet)}
.hero--delt .hero__skjema{margin-top:var(--s-4);max-width:560px}
.hero--delt .skjema__rad .knapp{width:100%}
.hero__bilde{grid-column:8 / span 5;position:relative;margin:var(--s-4) 0 0}
.hero__bilde::before{content:"";position:absolute;inset:28px -28px -28px 28px;z-index:-1;background:repeating-linear-gradient(135deg,var(--c-linje-sterk) 0 1px,transparent 1px 9px)}
.hero__bilde > img{width:100%;height:min(640px,calc(100svh - var(--topp-h) - 120px));min-height:440px;object-fit:cover;object-position:50% 30%}
.hero__merke{position:absolute;left:-36px;bottom:32px;padding:14px 16px;background:var(--c-felt);box-shadow:0 1px 0 var(--c-linje)}
.hero__merke img{width:112px}

/* ---------- Hero 2: film i hele bakgrunnen ---------- */
.hero--film{min-height:calc(100svh - var(--topp-h));background:var(--c-dypere);color:#fff;overflow:hidden}
.hero__film{position:absolute;inset:0}
.hero__film video{width:100%;height:100%;object-fit:cover;object-position:60% 50%}
.hero__film::after{content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(var(--c-dyp-rgb),.93) 0%,rgba(var(--c-dyp-rgb),.86) 56%,rgba(var(--c-dyp-rgb),.45) 76%,rgba(var(--c-dyp-rgb),.25) 100%),
  linear-gradient(0deg,rgba(var(--c-dyp-rgb),.55) 0%,rgba(var(--c-dyp-rgb),0) 45%)}
.hero--film .hero__rutenett{position:relative;display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--s-3);align-items:end;min-height:calc(100svh - var(--topp-h));padding-block:var(--s-4) var(--s-4)}
.hero--film .hero__tekst{grid-column:1 / span 8;padding-bottom:var(--s-2)}
.hero--film .hero__tittel{font-size:var(--fs-h1-film);line-height:calc(var(--lh-display) - .06);margin:var(--s-2) 0 var(--s-3)}
.hero--film .hero__ingress{color:rgba(255,255,255,.88);max-width:30em}
.hero--film .hero__vurdering{color:#fff}
.hero--film .stjerner,.hero--film .stjerner__fylt{background-color:var(--c-stjerne-lys)}
.hero--film .stjerner{background-color:rgba(255,255,255,.35)}
.hero__skjema--panel{grid-column:9 / span 4;display:flex;flex-direction:column;gap:12px;padding:var(--s-3);background:var(--c-felt);color:var(--c-blekk)}
.panel__tittel{font-family:var(--f-display);font-weight:var(--w-display);font-size:1.625rem;line-height:1.1;letter-spacing:var(--ls-display)}
.hero__skjema--panel .knapp{width:100%;margin-top:4px}
.hero__skjema--panel .skjema__notis,.hero__skjema--panel .skjema__feil{margin-top:0}

/* ---------- Områder ---------- */
.omrader{background:var(--c-dyp);color:#fff}
.omrader__rad{display:flex;align-items:center;gap:12px;min-height:60px;font-size:var(--fs-liten);font-weight:500}
.omrader .ikon{color:var(--c-aksent-lys)}

/* ---------- Seksjoner ---------- */
.tjenester,.om,.omtaler{padding-block:var(--s-5)}
.seksjon__hode{display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--s-3);align-items:end;margin-bottom:var(--s-4)}
.seksjon__hode h2{grid-column:1 / span 6}
.seksjon__hode p{grid-column:8 / span 5;color:var(--c-dempet)}

.tjenester__liste{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s-4) var(--s-3)}
.kort{display:flex;flex-direction:column;background:var(--c-felt);border:1px solid var(--c-linje)}
.kort__bilde{width:100%;aspect-ratio:16/9;object-fit:cover}
.kort__tekst{display:flex;flex-direction:column;gap:12px;padding:var(--s-3) var(--s-3) var(--s-3)}
.kort h3{display:flex;align-items:center;gap:10px}
.kort h3 .ikon{color:var(--c-aksent);width:24px;height:24px}
.kort p{color:var(--c-dempet)}
.kort__lenke{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;min-height:44px;margin-top:4px;font-weight:500;color:var(--c-aksent-trykk);text-decoration:none;border-bottom:1px solid currentColor}
@media (hover:hover) and (pointer:fine){.kort__lenke:hover .ikon{transform:translateX(3px)}}
.kort__lenke .ikon{transition:transform .2s var(--ease)}

.om{background:var(--c-flate)}
.om__rutenett{display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--s-3);align-items:center}
.om__bilde{grid-column:1 / span 6}
.om__bilde img{width:100%;aspect-ratio:5/4;object-fit:cover;object-position:60% 40%}
.om__tekst{grid-column:8 / span 5}
.om__ingress{margin:var(--s-3) 0 var(--s-4);font-size:1.125rem}
.fakta{display:flex;flex-direction:column;gap:var(--s-3)}
.fakta li{display:flex;gap:14px}
.fakta .ikon{width:24px;height:24px;color:var(--c-aksent);margin-top:2px}
.fakta h3{font-size:1.0625rem;margin-bottom:2px}
.fakta p{color:var(--c-dempet);font-size:var(--fs-liten)}

.omtaler__snitt{grid-column:8 / span 5;display:flex;align-items:center;gap:12px;font-weight:500;justify-self:start}
.omtaler__liste{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-3)}
.omtale{display:flex;flex-direction:column;justify-content:space-between;gap:var(--s-3);padding:var(--s-3);border-top:2px solid var(--c-blekk)}
.omtale blockquote{font-family:var(--f-display);font-weight:var(--w-display);font-size:1.3125rem;line-height:1.35;letter-spacing:-.01em}
.omtale__navn{font-size:var(--fs-liten);color:var(--c-dempet)}
.lenke-pil{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-top:var(--s-3);font-weight:500;color:var(--c-aksent-trykk);text-decoration:none;border-bottom:1px solid currentColor}

/* ---------- Gratis tilbud (lead-modul) ---------- */
.tilbud{padding-block:var(--s-5);background:var(--c-dyp);color:#fff;--c-fokus:var(--c-aksent-lys);--c-dempet:rgba(255,255,255,.8);--c-linje:rgba(255,255,255,.2);--c-linje-sterk:rgba(255,255,255,.5)}
.tilbud__rutenett{display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--s-3);align-items:start}
.tilbud__intro{grid-column:1 / span 5}
.tilbud__intro > p{margin:var(--s-3) 0 var(--s-4);color:var(--c-dempet)}
.kontakt{display:flex;flex-direction:column;gap:4px}
.kontakt a,.kontakt__linje{display:inline-flex;align-items:center;gap:12px;min-height:44px;text-decoration:none}
.kontakt .ikon{color:var(--c-aksent-lys)}
@media (hover:hover) and (pointer:fine){.kontakt a:hover{text-decoration:underline;text-underline-offset:4px}}
.sjekk{grid-column:7 / span 6;padding:var(--s-4);background:var(--c-felt);color:var(--c-blekk);--c-dempet:#46596A;--c-linje:rgba(15,42,64,.16);--c-linje-sterk:rgba(15,42,64,.42);--c-fokus:var(--c-aksent)}
[data-pal="2"] .sjekk{--c-dempet:#4D5A57;--c-linje-sterk:rgba(26,36,34,.42)}
[data-pal="3"] .sjekk{--c-dempet:#5E5144;--c-linje-sterk:rgba(43,33,24,.42)}
.sjekk__topp{display:flex;flex-direction:column;gap:10px;margin-bottom:var(--s-3)}
.sjekk__steg{font-size:var(--fs-liten);color:var(--c-dempet)}
.sjekk__bar{height:3px;background:var(--c-linje)}
.sjekk__bar span{display:block;height:100%;width:100%;background:var(--c-aksent);transform:scaleX(.2);transform-origin:0 50%;transition:transform .3s var(--ease)}
.sjekk legend{font-family:var(--f-display);font-weight:var(--w-display);font-size:1.75rem;line-height:1.15;letter-spacing:var(--ls-display);margin-bottom:var(--s-2);outline:none}
.valg{display:flex;align-items:center;gap:14px;min-height:56px;padding:8px 14px;margin-top:8px;border:1px solid var(--c-linje-sterk);cursor:pointer;transition:background-color .15s var(--ease),border-color .15s var(--ease)}
.valg input{position:absolute;opacity:0;pointer-events:none}
.valg__bokstav{display:grid;place-items:center;width:30px;height:30px;flex:none;border:1px solid var(--c-linje-sterk);font-size:.875rem;font-weight:600}
.valg:has(input:checked){border-color:var(--c-aksent);background:var(--c-flate)}
.valg:has(input:focus-visible){outline:2px solid var(--c-fokus);outline-offset:2px}
@media (hover:hover) and (pointer:fine){.valg:hover{border-color:var(--c-aksent)}}
.sjekk__resultat{padding:var(--s-3);background:var(--c-flate);margin-bottom:var(--s-3)}
.sjekk__etikett{font-size:var(--fs-liten);color:var(--c-dempet)}
.sjekk__sammendrag{font-family:var(--f-display);font-weight:var(--w-display);font-size:1.5rem;line-height:1.15;margin:4px 0 8px}
.sjekk__forklaring{font-size:var(--fs-liten)}
.samtykke{display:flex;gap:12px;align-items:flex-start;margin-top:var(--s-2);font-size:var(--fs-liten);cursor:pointer}
.samtykke input{width:22px;height:22px;flex:none;margin:1px 0 0;accent-color:var(--c-aksent)}
.sjekk__knapper{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:var(--s-3)}
.sjekk__knapper .knapp--fylt{margin-left:auto}
.sjekk__takk{outline:none}

/* ---------- Bunn ---------- */
.bunn{background:var(--c-dypere);color:rgba(255,255,255,.82);padding-block:var(--s-4);font-size:var(--fs-liten)}
.bunn__rad{display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--s-3);align-items:end}
.bunn__logo{grid-column:1 / span 3;width:150px}
.bunn__info{grid-column:4 / span 6}
.bunn__kilder{margin-top:8px;font-size:.8125rem;color:rgba(255,255,255,.72)}
.bunn__kreditt{grid-column:10 / span 3;justify-self:end;text-align:right}
.bunn__kreditt a{display:inline-block;padding:12px 0;color:#fff}

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

/* ---------- Design Lab ---------- */
.lab{position:fixed;left:16px;bottom:16px;z-index:var(--z-panel);display:flex;flex-direction:column-reverse;align-items:flex-start;font-family:var(--f-tekst);color:#14202B}
.lab__veksle{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:100px;border:.5px solid rgba(255,255,255,.45);background:rgba(255,255,255,.7);-webkit-backdrop-filter:blur(30px) saturate(200%);backdrop-filter:blur(30px) saturate(200%);color:#14202B;font:600 .9375rem/1 var(--f-tekst);cursor:pointer;box-shadow:0 8px 32px rgba(0,0,0,.16),inset 0 1.5px .5px rgba(255,255,255,.65);transition:transform .16s var(--ease)}
.lab__panel{margin-bottom:10px;padding:14px;border-radius:24px;border:.5px solid rgba(255,255,255,.45);background:rgba(255,255,255,.82);-webkit-backdrop-filter:blur(30px) saturate(200%);backdrop-filter:blur(30px) saturate(200%);box-shadow:0 8px 32px rgba(0,0,0,.16),inset 0 1.5px .5px rgba(255,255,255,.65)}
.lab__gruppe{display:flex;align-items:center;gap:6px;margin-bottom:6px}
.lab__merke{width:28px;text-align:center}
.lab__gruppe button{width:44px;height:44px;border-radius:100px;border:1px solid rgba(20,32,43,.18);background:rgba(255,255,255,.55);color:#14202B;font:600 1rem/1 var(--f-tekst);cursor:pointer;transition:transform .16s var(--ease),background-color .15s var(--ease)}
.lab__gruppe button[aria-pressed="true"]{background:#14202B;color:#fff}
.lab__gruppe button:active,.lab__veksle:active{transform:scale(.96)}
.design-lab__credit{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:.75rem;color:#46515C}
.design-lab__credit-logo{display:inline-flex;align-items:center;gap:2px;font-weight:700;color:#14202B;text-decoration:none}
.design-lab__credit-dot,.design-lab__credit-spark{color:#B4471A}
.design-lab__credit-spark{width:12px;height:12px}

/* ---------- Nettbrett ---------- */
@media (max-width:1024px){
  .topp__nav{display:none}
  .topp__handling{margin-left:auto}
  .hero--delt .hero__tekst{grid-column:1 / span 7}
  .hero__bilde{grid-column:8 / span 5}
  .hero--film .hero__tekst{grid-column:1 / -1}
  .hero__skjema--panel{grid-column:1 / span 7;margin-top:var(--s-3)}
  .omtaler__liste{grid-template-columns:1fr 1fr}
  .omtale:nth-child(3){display:none}
  .sjekk,.tilbud__intro{grid-column:1 / -1}
  .tilbud__intro{margin-bottom:var(--s-4)}
}

/* ---------- Mobil: rute, ikke ramse opp ---------- */
@media (max-width:640px){
  :root{--topp-h:64px;--s-4:32px;--s-5:56px;--fs-h3:1.1875rem}
  .merke__logo{width:112px}
  .topp__ikon{display:none}
  .topp__tlf{padding:0 14px;min-height:44px}
  /* Hero 1: lavt foto øverst, så tekst og skjema. */
  .hero--delt{padding:0 0 var(--s-4)}
  .hero__flate{display:none}
  .hero--delt .hero__rutenett{display:flex;flex-direction:column-reverse;padding-inline:0}
  .hero__bilde{margin:0;width:100%}
  .hero__bilde::before{display:none}
  .hero__bilde > img{height:26svh;min-height:180px;max-height:220px;object-position:50% 25%}
  .hero__merke{left:auto;right:12px;bottom:12px;padding:8px 10px}
  .hero__merke img{width:76px}
  .hero--delt .hero__tekst{padding:var(--s-2) var(--side) 0}
  .hero--delt .hero__tittel{font-size:2.375rem;margin:4px 0 12px}
  .hero__ingress{font-size:1rem}
  .hero--delt .hero__skjema{margin-top:var(--s-3)}
  .skjema__rad{gap:10px}
  .skjema__rad .felt:nth-child(3){grid-column:1 / -1}
  .hero--delt .skjema__rad .knapp{grid-column:1 / -1}
  /* Hero 2: filmen i øvre halvdel, teksten under. */
  .hero--film{min-height:0}
  .hero__film{bottom:auto;height:min(50svh,420px)}
  .hero__film::after{background:linear-gradient(0deg,var(--c-dypere) 0%,rgba(var(--c-dyp-rgb),.6) 30%,rgba(var(--c-dyp-rgb),.15) 70%)}
  .hero--film .hero__rutenett{display:block;min-height:0;padding-top:min(36svh,300px);padding-bottom:var(--s-4)}
  .hero--film .hero__tittel{font-size:3.25rem}
  .hero__skjema--panel{padding:var(--s-2)}
  .omrader__rad{min-height:52px;font-size:.875rem;line-height:1.4;padding-block:10px}
  .seksjon__hode{display:block;margin-bottom:var(--s-3)}
  .seksjon__hode p{margin-top:8px}
  /* Tjenester: én rad man sveiper. */
  .tjenester__liste{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--side);margin-inline:calc(-1 * var(--side));padding-inline:var(--side);padding-bottom:8px;scrollbar-width:none}
  .kort{flex:0 0 78%;scroll-snap-align:start}
  .kort__tekst{padding:var(--s-2)}
  .kort p{font-size:var(--fs-liten);line-height:1.5}
  .om__rutenett{display:block}
  .om__bilde img{aspect-ratio:16/10}
  .om__tekst{margin-top:var(--s-3)}
  .om__ingress{margin:12px 0 var(--s-3);font-size:1rem}
  .fakta{gap:14px}
  .fakta p{display:none}
  .omtaler__liste{grid-template-columns:1fr;gap:0}
  .omtale{padding:var(--s-2) 0;gap:10px}
  .omtale blockquote{font-size:1.125rem}
  .omtaler__snitt{margin-top:12px}
  .sjekk{padding:var(--s-2);margin-inline:calc(-1 * var(--side) + 8px)}
  .sjekk legend{font-size:1.4rem}
  .valg{min-height:52px;margin-top:6px}
  .skjema__rad--to{grid-template-columns:1fr}
  .tilbud__intro > p{margin:12px 0 var(--s-2)}
  .bunn{padding-bottom:96px}
  .bunn__rad{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-2)}
  .bunn__kreditt{justify-self:start;text-align:left}
  .dokk{position:fixed;left:0;right:0;bottom:0;z-index:var(--z-dokk);display:grid;grid-template-columns:1fr 1.4fr;gap:8px;padding:8px var(--side) calc(8px + env(safe-area-inset-bottom));background:var(--c-papir);border-top:1px solid var(--c-linje);transform:translateY(110%);transition:transform .3s var(--ease)}
  .dokk.er-synlig{transform:none}
  .lab{left:auto;right:12px;bottom:auto;top:calc(var(--topp-h) + 12px);flex-direction:column;align-items:flex-end}
  .lab__veksle-tekst{display:none}
  .lab__panel{margin:10px 0 0}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}
