@font-face{
  font-family:'Nippo';
  src:url('../assets/fonts/nippo-normal.woff2') format('woff2');
  font-weight:100 900;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Tanker';
  src:url('../assets/fonts/tanker-400-normal.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Balboa';
  src:url('../assets/fonts/balboa-400-normal.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Supreme';
  src:url('../assets/fonts/supreme-normal.woff2') format('woff2');
  font-weight:100 900;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Supreme';
  src:url('../assets/fonts/supreme-italic.woff2') format('woff2');
  font-weight:100 900;font-style:italic;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;
}
@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:'General Sans';
  src:url('../assets/fonts/general-sans-italic.woff2') format('woff2');
  font-weight:100 900;font-style:italic;font-display:swap;
}
@font-face{
  font-family:'Azeret Mono';
  src:url('../assets/fonts/azeret-mono-normal.woff2') format('woff2');
  font-weight:100 900;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Azeret Mono';
  src:url('../assets/fonts/azeret-mono-italic.woff2') format('woff2');
  font-weight:100 900;font-style:italic;font-display:swap;
}
/* ---------- Tokens (Design DNA: bpmarineconstruction.com + stabicraft.com, aksent fra fenderne på kundens foto) ---------- */
:root{
  --c-papir:#FFFFFF; --c-flate:#EEF2F4; --c-blekk:#0B1A2B; --c-dempa:#4A5866; --c-strek:rgba(11,26,43,.14);
  --c-dyp:#001837; --c-dyp-2:#0A2447; --c-paa-dyp:#F2F5F7; --c-dyp-dempa:#B4C0CC; --c-dyp-strek:rgba(242,245,247,.16);
  --c-aksent:#CC3024; --c-paa-aksent:#FFFFFF; --c-aksent-tekst:#CC3024; --c-aksent-mork:#F26452;
  --c-fokus:#CC3024; --c-fokus-mork:#F26452;
  --slor:0,24,55;

  --f-display:'Nippo','Arial Black',sans-serif; --w-display:700; --lh-display:1; --ls-display:-.01em;
  --f-brod:'Supreme',system-ui,sans-serif; --f-mono:'Azeret Mono',ui-monospace,monospace;
  --fs-h1:clamp(2.05rem,6.2vw,6rem); --fs-h1-stor:clamp(3rem,8.6vw,8.5rem);
  --fs-h2:clamp(1.75rem,3.4vw,3.25rem); --fs-h3:clamp(1.375rem,2.1vw,1.875rem);
  --fs-brod:1.0625rem; --fs-ingress:clamp(1.0625rem,1.3vw,1.25rem); --fs-liten:.8125rem;

  --side:clamp(16px,4vw,48px); --maks:1280px; --luft:clamp(72px,9vw,128px); --topp:64px;
  --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;
}
html[data-pal="2"]{
  --c-papir:#F7F9FA; --c-flate:#E3EBF0; --c-blekk:#0A1B2C; --c-dempa:#45566A; --c-strek:rgba(10,27,44,.14);
  --c-dyp:#0B2A45; --c-dyp-2:#12385A; --c-dyp-dempa:#BACAD8;
  --c-aksent:#00669D; --c-aksent-tekst:#00669D; --c-aksent-mork:#6CBBE8; --c-fokus:#00669D; --c-fokus-mork:#6CBBE8;
  --slor:11,42,69;
}
html[data-pal="3"]{
  --c-papir:#0B131D; --c-flate:#122030; --c-blekk:#EEF1F3; --c-dempa:#A7B3BF; --c-strek:rgba(238,241,243,.15);
  --c-dyp:#060C14; --c-dyp-2:#0E1926; --c-dyp-dempa:#A7B3BF;
  --c-aksent:#CC3024; --c-aksent-tekst:#F26452; --c-aksent-mork:#F26452; --c-fokus:#F26452; --c-fokus-mork:#F26452;
  --slor:6,12,20;
}
html[data-font="2"]{
  --f-display:'Tanker','Arial Narrow',sans-serif; --w-display:400; --lh-display:1.04; --ls-display:.005em; --f-brod:'Switzer',system-ui,sans-serif;
  --fs-h1:clamp(2.75rem,8.2vw,8rem); --fs-h1-stor:clamp(3.4rem,10vw,10rem); --fs-h2:clamp(2.1rem,4.4vw,4.25rem); --fs-h3:clamp(1.5rem,2vw,1.9rem);
}
html[data-font="3"]{
  --f-display:'Balboa','Arial Narrow',sans-serif; --w-display:400; --lh-display:1.02; --ls-display:0em; --f-brod:'General Sans',system-ui,sans-serif;
  --fs-h1:clamp(2.75rem,8.4vw,8.25rem); --fs-h1-stor:clamp(3.4rem,10.4vw,10.5rem); --fs-h2:clamp(2.1rem,4.4vw,4.25rem); --fs-h3:clamp(1.5rem,2vw,1.9rem);
}

/* ---------- Grunnlag ---------- */
*,*::before,*::after{box-sizing:border-box}
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-family:var(--f-brod);font-size:var(--fs-brod);line-height:1.6;-webkit-font-smoothing:antialiased}
img,video,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
h1,h2,h3,p,ul,dl,dd,figure{margin:0}
ul{padding:0;list-style:none}
h1,h2,h3{font-family:var(--f-display);font-weight:var(--w-display);line-height:var(--lh-display);letter-spacing:var(--ls-display);text-transform:uppercase}
h2{font-size:var(--fs-h2)}
h3{font-size:var(--fs-h3)}
[hidden]{display:none!important}
.vis-skjermleser{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--c-fokus);outline-offset:3px;border-radius:2px}
.hero :focus-visible,.topp :focus-visible,.tjenester__faner :focus-visible,.bunn :focus-visible{outline-color:var(--c-fokus-mork)}
.hopp{position:absolute;left:16px;top:-80px;z-index:var(--z-varsel);padding:12px 16px;background:var(--c-papir);color:var(--c-blekk)}
.hopp:focus{top:12px}
.ikon{width:1.25em;height:1.25em;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ingress{font-size:var(--fs-ingress);line-height:1.5;color:var(--c-dempa);max-width:34em}

/* Knapper: kvadratiske og versale (stabicraft.com) */
.knapp{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:14px 26px;border:1.5px solid transparent;border-radius:0;font:600 .9375rem/1.1 var(--f-brod);letter-spacing:.075em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background-color .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease),transform .16s var(--ease)}
.knapp:active{transform:scale(.97)}
.knapp--fylt{background:var(--c-aksent);color:var(--c-paa-aksent)}
.knapp--strek{border-color:currentColor;background:transparent;color:inherit}
.knapp--tekst{min-height:44px;padding:8px 4px;background:none;color:var(--c-dempa)}
@media (hover:hover) and (pointer:fine){
  .knapp--fylt:hover{background:var(--c-blekk);color:var(--c-papir)}
  .hero .knapp--fylt:hover,.akutt .knapp--fylt:hover{background:var(--c-paa-dyp);color:var(--c-dyp)}
  .knapp--strek:hover{background:var(--c-blekk);color:var(--c-papir);border-color:var(--c-blekk)}
  .hero .knapp--strek:hover{background:var(--c-paa-dyp);color:var(--c-dyp);border-color:var(--c-paa-dyp)}
  .knapp--tekst:hover{color:var(--c-blekk)}
}

/* ---------- Topp ---------- */
.topp{position:sticky;top:0;z-index:var(--z-sticky);display:flex;align-items:center;gap:24px;height:var(--topp);padding:0 var(--side);background:var(--c-dyp);color:var(--c-paa-dyp)}
.topp__merke{display:flex;align-items:center;gap:10px;min-height:44px;text-decoration:none;margin-right:auto}
.topp__symbol{width:40px;height:40px;fill:currentColor}
.topp__navn{font-family:var(--f-display);font-weight:var(--w-display);text-transform:uppercase;font-size:1rem;letter-spacing:.01em}
.topp__nav{display:flex;gap:4px}
.topp__nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;font-size:.875rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--c-dyp-dempa);transition:color .15s var(--ease)}
.topp__ring{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;min-width:44px;padding:0 16px;background:var(--c-aksent);color:var(--c-paa-aksent);font-weight:600;font-size:.875rem;letter-spacing:.06em;text-transform:uppercase;text-decoration:none}
@media (hover:hover) and (pointer:fine){.topp__nav a:hover{color:var(--c-paa-dyp)}}

/* ---------- Hero, felles ---------- */
.hero{position:relative;overflow:hidden;background:var(--c-dyp);color:var(--c-paa-dyp)}
html:not([data-hero="2"]) .hero--film,html[data-hero="2"] .hero--foto{display:none}
.hero__innhold{position:relative;z-index:var(--z-dekor);width:100%;max-width:var(--maks);margin:0 auto;padding:0 var(--side)}
.hero__sted{display:flex;align-items:center;gap:14px;margin-bottom:24px;font-family:var(--f-mono);font-size:var(--fs-liten);letter-spacing:.04em;color:var(--c-paa-dyp)}
.hero__strek{width:44px;height:2px;background:var(--c-aksent-mork)}
.hero h1{display:flex;flex-direction:column;font-size:var(--fs-h1)}
.hero h1 .hero__line{display:block;overflow:hidden;padding:.2em .25em .26em;margin:-.2em -.25em -.26em}
.hero h1 .hero__line-in{display:block}
.hero__sub{max-width:33em;margin-top:28px;font-size:var(--fs-ingress);line-height:1.5;color:var(--c-paa-dyp)}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.hero__brikker{display:flex;flex-wrap:wrap;gap:8px;margin-top:36px}
.hero__brikker li{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:6px 14px;border:1px solid var(--c-dyp-strek);background:rgba(var(--slor),.55);font-size:.875rem;font-weight:500}
.hero__brikker .ikon{color:var(--c-aksent-mork)}
.anim-hero .hero__line-in{transform:translateY(150%)}
.anim-hero :is(.hero__sted,.hero__sub,.hero__cta,.hero__brikker){opacity:0}

/* Hero 1: fullbredde foto */
.hero--foto{display:flex;align-items:center;min-height:min(calc(100svh - var(--topp)),880px);padding:96px 0 88px}
.hero__bilde,.hero__bilde img{position:absolute;inset:0;width:100%;height:100%}
.hero__bilde img{object-fit:cover;object-position:62% 46%}
.hero--foto::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(var(--slor),.92) 0%,rgba(var(--slor),.86) 40%,rgba(var(--slor),.72) 60%,rgba(var(--slor),.3) 74%,rgba(var(--slor),0) 88%),linear-gradient(0deg,rgba(var(--slor),.6) 0%,rgba(var(--slor),0) 34%)}

/* Hero 2: mørk flate, typografien størst, stående film */
.hero--film{display:grid;grid-template-columns:1fr auto;align-items:center;min-height:min(calc(100svh - var(--topp)),880px)}
.hero--film .hero__innhold{grid-column:1;grid-row:1;max-width:none;padding:80px var(--side)}
.hero--film h1{font-size:var(--fs-h1-stor)}
.hero__film{grid-column:2;grid-row:1;align-self:stretch;position:relative;aspect-ratio:9/16;min-height:100%;background:var(--c-dyp-2)}
.hero__film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* ---------- Akutt ---------- */
.akutt{background:var(--c-flate)}
.akutt__inner{display:flex;align-items:center;gap:24px;max-width:var(--maks);margin:0 auto;padding:28px var(--side)}
.akutt__ikon{width:40px;height:40px;color:var(--c-aksent-tekst)}
.akutt__tekst{flex:1}
.akutt h2{font-size:clamp(1.125rem,1.6vw,1.5rem);line-height:1.15}
.akutt p{margin-top:6px;color:var(--c-dempa)}

/* ---------- Seksjoner ---------- */
.seksjon__hode{display:grid;gap:16px;max-width:var(--maks);margin:0 auto 48px;padding:0 var(--side)}
.seksjon__hode h2{max-width:16em}
.seksjon__hode--rad{grid-template-columns:1fr auto;align-items:end;gap:24px 48px}
.seksjon__hode--rad .ingress{margin-top:16px}

/* Tjenester: faner til venstre, ett panel (bpmarineconstruction.com) */
.tjenester{padding:var(--luft) 0}
.tjenester__ramme{display:grid;grid-template-columns:minmax(280px,360px) 1fr;max-width:var(--maks);margin:0 auto;padding:0 var(--side)}
.tjenester__faner{display:flex;flex-direction:column;background:var(--c-dyp);color:var(--c-paa-dyp);padding:8px 0}
.tjenester__faner [role="tab"],.fane{display:grid;grid-template-columns:28px 1fr;align-items:center;gap:2px 14px;min-height:76px;padding:14px 24px;border:0;border-bottom:1px solid var(--c-dyp-strek);background:transparent;color:var(--c-dyp-dempa);text-align:left;text-decoration:none;font:inherit;cursor:pointer;transition:background-color .2s var(--ease),color .2s var(--ease)}
.tjenester__faner .ikon{grid-row:1/3;width:26px;height:26px}
.fane__navn{font-family:var(--f-display);font-weight:var(--w-display);text-transform:uppercase;font-size:1.0625rem;line-height:1.1;letter-spacing:var(--ls-display)}
.fane__dybde{font-family:var(--f-mono);font-size:.75rem;letter-spacing:.03em}
.tjenester__faner [aria-selected="true"]{background:var(--c-dyp-2);color:var(--c-paa-dyp)}
.tjenester__faner [aria-selected="true"] .ikon{color:var(--c-aksent-mork)}
.fane--ring{border-bottom:0;margin-top:auto;color:var(--c-paa-dyp)}
.fane--ring .ikon{color:var(--c-aksent-mork)}
@media (hover:hover) and (pointer:fine){.tjenester__faner [role="tab"]:hover,.fane--ring:hover{color:var(--c-paa-dyp);background:var(--c-dyp-2)}}
.tjenester__paneler{background:var(--c-flate)}
.panel{display:grid;grid-template-columns:1fr 1fr;min-height:540px;height:100%}
.panel__bilde{position:relative;overflow:hidden;background:var(--c-dyp-2)}
.panel__bilde img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.panel__tekst{display:flex;flex-direction:column;gap:18px;padding:clamp(32px,4vw,56px)}
.panel__dybde{font-family:var(--f-mono);font-size:var(--fs-liten);color:var(--c-aksent-tekst)}
.panel__tekst p:not(.panel__dybde){color:var(--c-dempa);max-width:30em}
.lenke{display:inline-flex;align-items:center;gap:10px;min-height:44px;margin-top:auto;font-weight:600;font-size:.9375rem;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--c-blekk)}
.lenke .ikon{color:var(--c-aksent-tekst);transition:transform .2s var(--ease)}
@media (hover:hover) and (pointer:fine){.lenke:hover .ikon{transform:translateX(4px)}}

/* ---------- Forespørsel ---------- */
.foresporsel{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:48px 72px;max-width:var(--maks);margin:0 auto;padding:var(--luft) var(--side);border-top:1px solid var(--c-strek)}
.foresporsel__hode{display:flex;flex-direction:column;gap:20px}
.foresporsel__akutt{display:flex;align-items:center;gap:10px;color:var(--c-dempa)}
.foresporsel__akutt .ikon{color:var(--c-aksent-tekst)}
.foresporsel__akutt a,.modul__ber a{display:inline-flex;align-items:center;min-height:44px;font-weight:600;color:var(--c-blekk)}
.modul{padding:clamp(24px,3vw,40px);background:var(--c-flate)}
.modul__topp{display:flex;align-items:center;gap:20px;margin-bottom:24px}
.modul__steg{font-family:var(--f-mono);font-size:var(--fs-liten);color:var(--c-dempa);white-space:nowrap}
.modul__fremdrift{flex:1;height:3px;background:var(--c-strek)}
.modul__fremdrift i{display:block;height:100%;background:var(--c-aksent);transform:scaleX(.2);transform-origin:0 50%;transition:transform .28s var(--ease)}
.modul__valg{display:grid}
.sp{display:none;margin:0;padding:0;border:0;min-width:0}
.sp.er-aktiv{display:grid;gap:8px}
.sp legend{margin-bottom:16px;padding:0;font-family:var(--f-display);font-weight:var(--w-display);text-transform:uppercase;font-size:var(--fs-h3);line-height:1.1}
.rad{position:relative;display:flex;align-items:center;gap:16px;min-height:56px;padding:10px 16px;border:1px solid var(--c-strek);background:var(--c-papir);cursor:pointer;transition:border-color .15s var(--ease),background-color .15s var(--ease)}
.rad input{position:absolute;opacity:0;pointer-events:none}
.rad__bokstav{display:grid;place-items:center;width:30px;height:30px;flex:none;border:1px solid var(--c-strek);font-family:var(--f-mono);font-size:.8125rem;font-weight:600}
.rad:has(input:checked){border-color:var(--c-aksent)}
.rad:has(input:checked) .rad__bokstav{background:var(--c-aksent);border-color:var(--c-aksent);color:var(--c-paa-aksent)}
.rad:has(input:focus-visible){outline:2px solid var(--c-fokus);outline-offset:2px}
@media (hover:hover) and (pointer:fine){.rad:hover{border-color:var(--c-blekk)}}
.modul__knapper{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:20px;min-height:52px}
.modul__neste{margin-left:auto}
.modul__oppsummering{font-family:var(--f-display);font-weight:var(--w-display);text-transform:uppercase;font-size:clamp(1.125rem,1.4vw,1.375rem);line-height:1.15}
.modul__oppsummering:focus{outline:none}
.modul__hjelp{margin-top:8px;color:var(--c-dempa)}
.modul__ber{display:flex;gap:10px;align-items:center;margin-top:16px;padding:12px 16px;background:var(--c-papir);border:1px solid var(--c-aksent)}
.modul__ber .ikon{color:var(--c-aksent-tekst)}
.modul__post{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:24px}
.felt{display:grid;gap:6px}
.felt--bred{grid-column:1/-1}
.felt label{font-size:.875rem;font-weight:600}
.felt__valgfri{font-weight:400;color:var(--c-dempa)}
.felt input,.felt textarea{width:100%;min-height:52px;padding:12px 14px;border:1px solid var(--c-strek);border-radius:0;background:var(--c-papir);color:var(--c-blekk);font:inherit}
.felt input[aria-invalid="true"]{border-color:var(--c-aksent-tekst)}
.felt__feil{font-size:.875rem;color:var(--c-aksent-tekst)}
.samtykke{display:flex;gap:12px;align-items:flex-start;min-height:44px;font-size:.9375rem;color:var(--c-dempa);cursor:pointer}
.samtykke input{width:22px;height:22px;margin:2px 0 0;flex:none;accent-color:var(--c-aksent)}
.kvittering{display:grid;gap:8px;margin-top:24px;padding:24px;background:var(--c-papir)}
.kvittering:focus{outline:none}
.kvittering__ikon{width:32px;height:32px;color:var(--c-aksent-tekst)}
.kvittering__tittel{font-family:var(--f-display);font-weight:var(--w-display);text-transform:uppercase;font-size:var(--fs-h3)}
.kvittering__tekst{color:var(--c-dempa)}
.modul__igjen{margin-top:12px}

/* ---------- Jobber ---------- */
.jobber{padding:var(--luft) 0;background:var(--c-flate)}
.knapp--mork{color:var(--c-blekk)}
.jobber__rad{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:var(--maks);margin:0 auto;padding:0 var(--side)}
.jobb img{width:100%;aspect-ratio:4/5;object-fit:cover;background:var(--c-dyp-2)}
.jobb__tekst{margin-top:12px;font-family:var(--f-mono);font-size:var(--fs-liten);color:var(--c-dempa)}

/* ---------- Om oss: kort over foto (stabicraft.com) ---------- */
.om{position:relative;display:grid;grid-template-columns:repeat(12,1fr);max-width:var(--maks);margin:0 auto;padding:var(--luft) var(--side)}
.om__bilde{grid-column:1/9;grid-row:1;position:relative;min-height:620px;overflow:hidden;background:var(--c-dyp-2)}
.om__bilde img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 35%}
.om__kort{grid-column:7/13;grid-row:1;align-self:center;position:relative;z-index:var(--z-dekor);display:grid;gap:20px;padding:clamp(28px,3.4vw,52px);background:var(--c-papir);border:1px solid var(--c-strek)}
.om__logo{width:88px;height:88px}
.om__kort > p{color:var(--c-dempa)}
.om__fakta{display:grid;margin-top:8px;border-top:1px solid var(--c-strek)}
.om__fakta div{display:grid;grid-template-columns:110px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--c-strek)}
.om__fakta dt{font-family:var(--f-mono);font-size:var(--fs-liten);color:var(--c-dempa);padding-top:2px}
.om__fakta dd{font-weight:500}

/* ---------- Kontakt ---------- */
.kontakt{display:grid;grid-template-columns:1fr 1fr;gap:32px 72px;max-width:var(--maks);margin:0 auto;padding:var(--luft) var(--side);border-top:1px solid var(--c-strek)}
.kontakt__venstre{display:grid;gap:20px;align-content:start}
.kontakt__linjer{display:grid;align-content:start;border-top:1px solid var(--c-strek)}
.kontakt__linjer li{border-bottom:1px solid var(--c-strek)}
.kontaktlinje{display:flex;align-items:center;gap:14px;min-height:60px;padding:8px 0;text-decoration:none;font-size:1.125rem}
.kontaktlinje .ikon{color:var(--c-aksent-tekst)}
.kontaktlinje--stor{font-family:var(--f-display);font-weight:var(--w-display);font-size:clamp(1.75rem,3vw,2.75rem);letter-spacing:var(--ls-display)}
.kontakt__sosiale{grid-column:2;display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px;color:var(--c-dempa)}
.kontakt__sosiale a{display:inline-flex;align-items:center;min-height:44px;font-weight:600;color:var(--c-blekk)}

/* ---------- Bunn ---------- */
.bunn{display:grid;gap:12px;padding:56px var(--side) 40px;background:var(--c-dyp);color:var(--c-dyp-dempa);font-size:.875rem;text-align:center}
.bunn__slagord{font-family:var(--f-display);font-weight:var(--w-display);text-transform:uppercase;font-size:clamp(1.75rem,4vw,3.5rem);line-height:1;color:var(--c-paa-dyp)}
.bunn__kreditt a{display:inline-flex;align-items:center;min-height:44px;color:var(--c-dyp-dempa)}

/* ---------- Design Lab ---------- */
.lab{position:fixed;left:16px;bottom:16px;z-index:var(--z-panel);font-family:var(--f-mono);font-size:.8125rem;color:#F4F5F3}
.lab__veksle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;min-width:44px;padding:0 16px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(0,16,36,.74);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);cursor:pointer;color:inherit;font:inherit}
.lab__panel{position:absolute;left:0;bottom:calc(100% + 10px);display:grid;gap:10px;padding:16px;min-width:236px;border-radius:14px;border:1px solid rgba(255,255,255,.16);background:rgba(0,16,36,.84);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 12px 40px rgba(0,0,0,.35)}
.lab__gruppe{display:flex;align-items:center;gap:6px}
.lab__merke{width:28px;font-size:1rem}
.lab__gruppe button{width:44px;height:44px;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:transparent;cursor:pointer;color:inherit;font:inherit;transition:background-color .15s var(--ease)}
.lab__gruppe button[aria-pressed="true"]{background:#F4F5F3;color:#001837}
.design-lab__credit{display:flex;align-items:center;gap:6px;padding-top:8px;border-top:1px solid rgba(255,255,255,.12);font-size:.7rem;color:rgba(244,245,243,.75)}
.design-lab__credit-logo{display:inline-flex;align-items:center;gap:1px;min-height:44px;text-decoration:none;font-weight:600;color:#F4F5F3}
.design-lab__credit-dot{color:#F26452}
.design-lab__credit-spark{width:10px;height:10px;margin-left:2px;color:#F26452}

/* ---------- Nettbrett ---------- */
@media (max-width:1100px){
  .topp__nav{display:none}
  .tjenester__ramme{grid-template-columns:280px 1fr}
  .panel{grid-template-columns:1fr}
  .panel__bilde{min-height:300px}
  .om__bilde{grid-column:1/10}
  .om__kort{grid-column:5/13}
}

/* ---------- Mobil: rute, ikke ramse opp ---------- */
@media (max-width:760px){
  :root{--topp:56px}
  .topp{gap:12px}
  .topp__symbol{width:34px;height:34px}
  .topp__navn{font-size:.875rem}
  .topp__ring{padding:0 12px}
  .topp__ring-tekst{display:none}

  .hero--foto,.hero--film{display:block;min-height:0;padding:min(41svh,330px) 0 40px}
  html[data-hero="2"] .hero--film{display:block}
  .hero__bilde,.hero__film{position:absolute;inset:0 0 auto 0;height:min(50svh,400px);aspect-ratio:auto;min-height:0}
  .hero__bilde img{object-position:50% 30%}
  .hero--foto::after,.hero__film::after{content:"";position:absolute;inset:0 0 auto 0;height:min(50svh,400px);background:linear-gradient(0deg,rgb(var(--slor)) 0%,rgba(var(--slor),.78) 24%,rgba(var(--slor),.15) 60%,rgba(var(--slor),0) 80%)}
  .hero--film .hero__innhold{padding:0 var(--side)}
  .hero__sted{margin-bottom:16px}
  .hero__sub{margin-top:18px}
  .hero__cta{margin-top:24px}
  .hero__cta .knapp{flex:1 1 auto}
  .hero__brikker{margin-top:24px;gap:6px}
  .hero__brikker li{font-size:.8125rem;padding:4px 10px}

  .akutt__inner{flex-wrap:wrap;gap:14px;padding:22px var(--side)}
  .akutt__ikon{width:32px;height:32px}
  .akutt__tekst{flex:1 1 calc(100% - 50px)}
  .akutt .knapp{width:100%}

  .seksjon__hode{margin-bottom:28px}
  .seksjon__hode--rad{grid-template-columns:1fr}
  .tjenester__ramme{grid-template-columns:1fr}
  .tjenester__faner{display:grid;grid-template-columns:repeat(3,1fr);padding:0;background:var(--c-dyp)}
  .tjenester__faner [role="tab"],.fane{grid-template-columns:1fr;justify-items:center;align-content:center;gap:6px;min-height:92px;padding:12px 6px;border-bottom:1px solid var(--c-dyp-strek);border-right:1px solid var(--c-dyp-strek);text-align:center}
  .tjenester__faner .ikon{grid-row:auto}
  .fane__navn{font-size:.75rem;letter-spacing:.01em;hyphens:auto}
  .fane__dybde{display:none}
  .fane--ring{margin-top:0}
  .panel{grid-template-columns:120px 1fr;min-height:0}
  .panel__bilde{min-height:0}
  .panel__tekst{gap:10px;padding:18px 16px}
  .panel h3{font-size:1.25rem}
  .panel__tekst p:not(.panel__dybde){font-size:.9375rem;line-height:1.5}
  .lenke{font-size:.8125rem}

  .foresporsel{grid-template-columns:1fr;gap:24px}
  .modul{margin:0 calc(var(--side) * -1);padding:24px var(--side)}
  .rad{min-height:52px;padding:8px 12px}
  .modul__post{grid-template-columns:1fr}

  .jobber__rad{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--side);-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .jobber__rad::-webkit-scrollbar{display:none}
  .jobb{flex:0 0 72%;scroll-snap-align:start}
  .jobb img{aspect-ratio:1/1}

  .om{grid-template-columns:1fr}
  .om__bilde{display:none}
  .om__kort{grid-column:1;gap:14px;padding:24px 20px}
  .om__logo{width:64px;height:64px}
  .om__fakta div{grid-template-columns:84px 1fr;padding:10px 0}

  .kontakt{grid-template-columns:1fr;gap:24px}
  .kontaktlinje{min-height:52px}
  .bunn{padding:40px var(--side) 32px;gap:8px}
  .kontakt__sosiale{grid-column:1}

  .lab{left:auto;right:64px;bottom:auto;top:6px}
  .lab__veksle{padding:0 12px}
  .lab__veksle-tekst{display:none}
  .lab__panel{bottom:auto;top:calc(100% + 10px);left:auto;right:-52px}
}

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