/* ---------- Fonter (selvhostet, ingen tredjepart) ----------
   GT Sectra Fine er DEMO-ONLY: kunden må kjøpe lisens hos Grilli Type før levering,
   ellers byttes standard til Sentient (slisse 2). Sentient og Switzer: ITF Free Font
   License. Schibsted Grotesk: SIL OFL 1.1. Lisenstekstene ligger i assets/fonts/.
   ---------------------------------------------------------- */
@font-face{font-family:'GT Sectra Fine';src:url('../assets/fonts/gt-sectra-fine-300-normal.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Sentient';src:url('../assets/fonts/sentient-normal.woff2') format('woff2');font-weight:100 900;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:'Schibsted Grotesk';src:url('../assets/fonts/schibsted-grotesk-normal.woff2') format('woff2');font-weight:400 900;font-style:normal;font-display:swap}

/* ---------- Design DNA ----------
   Papir og blekk fra Kampens egen side (#38332E målt), papiret varmet mot
   thamvidegard.se #F6F2EF og vardehaugen.no #F1EDE4. Aksent: massivtre-rav, prøvetatt
   i skyggesiden av treveggene i Emils egne foto (#734018) og løftet til #8A4A1E.
   Display 135 px / lh 0,93 / vekt 400 fra thamvidegard.se, målt 08.10.2026 ved 1440 px,
   her vekt 300 (universalRules). Radius 10 px på bilder fra vardehaugen.no. */
:root{
  --c-papir:#F3EFE8;
  --c-papir-2:#E8E2D8;
  --c-blekk:#38332E;            /* 10,9:1 på papir */
  --c-dempet:#635B53;           /* 5,4:1 på papir, 4,8:1 på papir-2 */
  --c-linje:rgba(56,51,46,.18);
  --c-aksent:#8A4A1E;           /* massivtre-rav */
  --c-paa-aksent:#F3EFE8;       /* 5,95:1 */
  --c-paa-aksent-dempet:#E9D3BC;/* 4,7:1 */
  --c-aksent-tekst:#8A4A1E;     /* 5,95:1 på papir */
  --c-mork:#2A2622;
  --c-paa-mork:#EDE6DA;         /* 12,1:1 */
  --c-mork-dempet:#B4AAA0;      /* 6,6:1 */
  --c-paa-foto:#F6F2EC;
  --c-fokus:#8A4A1E;
  --c-fokus-mork:#E9D3BC;
  --c-tegning:#F3EFE8;          /* tegningene har lys bunn i alle paletter */

  --f-display:'GT Sectra Fine', 'Iowan Old Style', Georgia, serif;
  --f-body:'Schibsted Grotesk', 'Helvetica Neue', Arial, sans-serif;
  --w-display:300;
  --spor-display:-.02em;
  --lh-display:.94;
  --skala-display:1;

  --t-hero:calc(clamp(2.75rem, 6.6vw, 6rem) * var(--skala-display));
  --t-hero2:calc(clamp(2.9rem, 9.4vw, 8.4375rem) * var(--skala-display));
  --t-navn:calc(clamp(1.9rem, 4.2vw, 3.75rem) * var(--skala-display));
  --t-h2:calc(clamp(2.1rem, 3.6vw, 3.25rem) * var(--skala-display));
  --t-h3:calc(clamp(1.35rem, 1.9vw, 1.75rem) * var(--skala-display));
  --t-ingress:clamp(1.2rem, 1.7vw, 1.5rem);
  --t-body:1.0625rem;
  --t-liten:.9375rem;
  --t-mikro:.8125rem;

  --maks:1360px;
  --kant:clamp(20px, 3.4vw, 48px);
  --seksjon:clamp(64px, 8.4vw, 128px);
  --radius:10px;

  --z-dekor:1; --z-sticky:100; --z-dokk:200; --z-overlay:300; --z-panel:400; --z-varsel:500;
  --ease:cubic-bezier(.22,1,.36,1);
}

/* 🎨 Palett 2: granskog, etter vardehaugen.no sin dype gran #202D21 på papir #F1EDE4 */
:root[data-palette="2"]{
  --c-papir:#F1EDE4; --c-papir-2:#E5E0D3; --c-blekk:#1F2A20; --c-dempet:#57624F;
  --c-linje:rgba(31,42,32,.18); --c-aksent:#4F6B3A; --c-paa-aksent:#F1EDE4; --c-paa-aksent-dempet:#DCE4D0;
  --c-aksent-tekst:#4F6B3A; --c-mork:#202D21; --c-paa-mork:#EAE4D6; --c-mork-dempet:#A9B39F;
  --c-fokus:#4F6B3A; --c-fokus-mork:#B9CFA0;
}
/* 🎨 Palett 3: kveld, mørk flate med lys furu som aksent */
:root[data-palette="3"]{
  --c-papir:#1C1A17; --c-papir-2:#25221E; --c-blekk:#EDE6DA; --c-dempet:#A79E92;
  --c-linje:rgba(237,230,218,.16); --c-aksent:#C9894E; --c-paa-aksent:#1C1A17; --c-paa-aksent-dempet:#3B2816;
  --c-aksent-tekst:#D9A06A; --c-mork:#100F0D; --c-paa-mork:#EDE6DA; --c-mork-dempet:#A79E92;
  --c-fokus:#D9A06A; --c-fokus-mork:#D9A06A;
}
/* 🅰️ Font 2: Sentient, smal boklig serif, fri lisens */
:root[data-font="2"]{--f-display:'Sentient', Georgia, serif;--w-display:300;--spor-display:-.025em;--skala-display:1}
/* 🅰️ Font 3: Switzer tynn, sveitsisk grotesk som på mange arkitektkontor */
:root[data-font="3"]{--f-display:'Switzer', 'Helvetica Neue', Arial, sans-serif;--w-display:300;--spor-display:-.035em;--skala-display:.94}

/* ---------- Grunnlag ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--c-papir);color:var(--c-blekk);font-family:var(--f-body);font-size:var(--t-body);line-height:1.5;font-weight:400;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{display:block;max-width:100%;height:auto}
h1,h2,h3{font-family:var(--f-display);font-weight:var(--w-display);letter-spacing:var(--spor-display);margin:0}
h2{font-size:var(--t-h2);line-height:1.02}
h3{font-size:var(--t-h3);line-height:1.1;letter-spacing:-.01em}
p{margin:0}
a{color:inherit}
ul,ol{list-style:none;margin:0;padding:0}
figure{margin:0}
:focus-visible{outline:2px solid var(--c-fokus);outline-offset:3px;border-radius:2px}
.kontakt :focus-visible,.bunn :focus-visible,.idunn :focus-visible,.hero--foto :focus-visible{outline-color:var(--c-fokus-mork)}
.hopp{position:absolute;left:var(--kant);top:-100px;z-index:var(--z-varsel);background:var(--c-blekk);color:var(--c-papir);padding:12px 16px}
.hopp:focus{top:12px}

.pil-lenke{display:inline-flex;align-items:center;gap:.5em;min-height:44px;font-size:var(--t-liten);font-weight:500;text-decoration:none;border-bottom:1px solid currentColor;padding-top:2px}
.pil-lenke::after{content:'→';transition:transform .2s var(--ease)}

/* ---------- Topp ---------- */
.topp{position:absolute;inset:0 0 auto;z-index:var(--z-sticky);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px var(--kant);color:var(--c-paa-foto)}
:root[data-hero-aktiv="2"] .topp{color:var(--c-blekk)}
.merke{display:inline-flex;align-items:center;gap:.35em;min-height:44px;font-size:.875rem;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;font-weight:400}
.merke b{font-weight:700}
.topp__nav{display:flex;gap:28px;font-size:var(--t-liten)}
.topp__nav a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none}

/* ---------- Hero, felles maske ---------- */
/* Masken skal romme blekket, ikke linjeboksen. Kopiert ordrett fra Phase 5. */
.hero__line{display:block;overflow:hidden;padding:.2em .25em .26em;margin:-.2em -.25em -.26em}
.hero__line-in{display:block}
.anim-hero :is(.hero__kicker, .hero__sub, .hero__lenke, .hero__bildetekst, .hero2__etikett, .hero2__fot){opacity:0}
.anim-hero .hero__line-in{transform:translateY(150%)}

.hero[hidden]{display:none}

/* ---------- Hero 1: foto ---------- */
.hero--foto{position:relative;min-height:max(560px, 100svh);display:flex;align-items:flex-end;color:var(--c-paa-foto);overflow:hidden;background:var(--c-mork)}
.hero__ramme{position:absolute;inset:0}
.hero__bilde{width:100%;height:100%;object-fit:cover;object-position:50% 55%}
.hero__ramme::after{content:'';position:absolute;inset:0;background:linear-gradient(to top, rgba(24,18,12,.84) 0%, rgba(24,18,12,.68) 40%, rgba(24,18,12,.5) 62%, rgba(24,18,12,.3) 82%, rgba(24,18,12,.42) 100%)}
.hero__innhold{position:relative;width:100%;max-width:var(--maks);margin:0 auto;padding:0 var(--kant) clamp(48px, 7vw, 96px)}
.hero__kicker{font-size:var(--t-liten);margin-bottom:clamp(14px, 1.6vw, 22px)}
.hero__tittel{font-size:var(--t-hero);line-height:var(--lh-display)}
.hero__sub{max-width:36rem;margin-top:clamp(18px, 2vw, 28px);font-size:var(--t-ingress);line-height:1.4}
.hero__lenke{margin-top:clamp(16px, 2vw, 28px)}
.hero__bildetekst{position:absolute;right:var(--kant);bottom:clamp(20px, 2.4vw, 32px);font-size:var(--t-mikro);opacity:.85}

/* ---------- Hero 2: typografisk prosjektliste (grepet fra thamvidegard.se) ---------- */
.hero--type{position:relative;min-height:max(620px, 100svh);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:120px var(--kant) 72px;isolation:isolate}
.hero2__etikett{font-size:var(--t-mikro);color:var(--c-dempet);margin-bottom:clamp(20px, 2.4vw, 36px)}
.hero2__navn{font-family:var(--f-display);font-weight:var(--w-display);letter-spacing:var(--spor-display);font-size:var(--t-navn);line-height:var(--lh-display);margin-bottom:clamp(36px, 5vw, 72px)}
.hero2__liste{font-family:var(--f-display);font-weight:var(--w-display);letter-spacing:var(--spor-display);font-size:var(--t-hero2);line-height:var(--lh-display)}
.hero2__liste li{position:relative}
.hero2__liste a{text-decoration:none;position:relative;z-index:2}
.hero2__liste img{position:absolute;left:50%;top:50%;width:min(30vw, 420px);height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:var(--radius);transform:translate(-50%, -50%) scale(.96);opacity:0;pointer-events:none;z-index:1;transition:opacity .25s var(--ease), transform .35s var(--ease)}
.hero2__fot{margin-top:clamp(36px, 5vw, 64px);font-size:var(--t-liten);color:var(--c-dempet);max-width:34rem}

/* ---------- Tjenester ---------- */
.tjenester{max-width:var(--maks);margin:0 auto;padding:var(--seksjon) var(--kant)}
.tjenester__hode{display:grid;grid-template-columns:5fr 7fr;gap:var(--kant);align-items:start;margin-bottom:clamp(40px, 5vw, 72px)}
.tjenester__ingress{font-size:var(--t-ingress);line-height:1.4;max-width:38rem}
.tjenester__liste{display:grid;grid-template-columns:repeat(3, 1fr);gap:var(--kant)}
.tjeneste{border-top:1px solid var(--c-linje);padding-top:20px}
.tjeneste p{margin-top:12px;color:var(--c-dempet);max-width:28rem}
.tjenester__merknad{margin-top:clamp(40px, 5vw, 64px);font-size:var(--t-liten);color:var(--c-dempet);max-width:44rem}
.tjenester__merknad a{text-underline-offset:3px}

/* ---------- Idunns gate 2 på aksentflaten ---------- */
.idunn{background:var(--c-aksent);color:var(--c-paa-aksent);padding:var(--seksjon) var(--kant)}
.idunn > *{max-width:var(--maks);margin-left:auto;margin-right:auto}
.idunn__hode{display:grid;grid-template-columns:7fr 5fr;gap:var(--kant);align-items:end;margin-bottom:clamp(36px, 4.4vw, 64px)}
.idunn__etikett{font-size:var(--t-liten);color:var(--c-paa-aksent-dempet);margin-bottom:16px}
.idunn__ingress{font-size:var(--t-ingress);line-height:1.4}
.idunn__lop{display:grid;grid-template-columns:repeat(3, 1fr);gap:clamp(16px, 2vw, 28px)}
.steg__bilde{aspect-ratio:1/1;overflow:hidden;border-radius:var(--radius);background:var(--c-papir)}
.steg__bilde img{width:100%;height:100%;object-fit:cover}
.steg__bilde--tegning{background:var(--c-tegning)}
.steg__bilde--tegning img{object-fit:contain;padding:5%}
.steg__fase{margin-top:16px;font-size:var(--t-mikro);color:var(--c-paa-aksent-dempet)}
.steg__tekst{margin-top:6px;font-size:var(--t-liten);max-width:26rem}
.idunn__fot{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;margin-top:clamp(32px, 4vw, 56px);font-size:var(--t-liten)}
.idunn__partnere{color:var(--c-paa-aksent-dempet)}

/* ---------- Prosjekter (bilde, så navn og én linje, som vardehaugen.no) ---------- */
.prosjekter{max-width:var(--maks);margin:0 auto;padding:var(--seksjon) var(--kant)}
.prosjekter__hode{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:clamp(32px, 4vw, 56px)}
.prosjekter__hint{display:none}
.prosjekter__liste{display:grid;grid-template-columns:repeat(3, 1fr);gap:clamp(16px, 2vw, 28px)}
.prosjekt__bilde{aspect-ratio:4/3;overflow:hidden;border-radius:var(--radius);background:var(--c-papir-2)}
.prosjekt__bilde img{width:100%;height:100%;object-fit:cover;transition:transform .45s var(--ease)}
.prosjekt__tekst{padding-top:18px}
.prosjekt__tekst p{margin-top:8px;color:var(--c-dempet);font-size:var(--t-liten)}
.prosjekt__tekst .prosjekt__fakta{margin-top:10px;font-size:var(--t-mikro);color:var(--c-aksent-tekst)}

/* ---------- Om ---------- */
.om{max-width:var(--maks);margin:0 auto;padding:0 var(--kant) var(--seksjon);display:grid;grid-template-columns:4fr 1fr 7fr;align-items:center}
.om__bilde{grid-column:1;aspect-ratio:4/5;overflow:hidden;border-radius:var(--radius)}
.om__bilde img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.om__tekst{grid-column:3}
.om__ingress{margin-top:24px;font-size:var(--t-ingress);line-height:1.4;max-width:36rem}
.om__brod{margin-top:16px;color:var(--c-dempet);max-width:36rem}
.om__fakta{margin:32px 0 0;display:grid;gap:0;border-top:1px solid var(--c-linje)}
.om__fakta div{display:grid;grid-template-columns:9rem 1fr;gap:16px;padding:12px 0;border-bottom:1px solid var(--c-linje);font-size:var(--t-liten)}
.om__fakta dt{color:var(--c-dempet)}
.om__fakta dd{margin:0}

/* ---------- Kontakt og bunn (mørk flate) ---------- */
.kontakt{background:var(--c-mork);color:var(--c-paa-mork);padding:var(--seksjon) var(--kant) clamp(48px, 5vw, 72px)}
.kontakt > *{max-width:var(--maks);margin-left:auto;margin-right:auto}
.kontakt__innhold{display:grid;grid-template-columns:5fr 7fr;gap:var(--kant);align-items:end}
.kontakt__tittel{font-size:var(--t-hero);line-height:var(--lh-display)}
.kontakt__ingress{font-size:var(--t-ingress);line-height:1.4;max-width:34rem}
.kontakt__kanaler{display:grid;grid-template-columns:repeat(4, 1fr);gap:var(--kant);margin-top:clamp(48px, 6vw, 88px);border-top:1px solid rgba(237,230,218,.18);padding-top:24px}
.kanal{display:flex;flex-direction:column;gap:6px;min-height:44px;text-decoration:none;margin:0}
.kanal__etikett{font-size:var(--t-mikro);color:var(--c-mork-dempet)}
.kanal__verdi{font-size:var(--t-body);overflow-wrap:anywhere}
a.kanal .kanal__verdi{text-decoration:underline;text-decoration-color:rgba(237,230,218,.35);text-underline-offset:4px;transition:text-decoration-color .25s}

.bunn{background:var(--c-mork);color:var(--c-mork-dempet);padding:0 var(--kant) 28px;font-size:var(--t-mikro)}
.bunn__rad{max-width:var(--maks);margin:0 auto;display:flex;gap:32px;align-items:center;flex-wrap:wrap;padding-top:28px;border-top:1px solid rgba(237,230,218,.18)}
.merke--bunn{color:var(--c-paa-mork);margin-right:auto;min-height:0}
.footer__credit{max-width:var(--maks);margin:24px auto 0;display:flex;justify-content:center;align-items:center;gap:.4em;flex-wrap:wrap}
.footer__credit-logo{display:inline-flex;align-items:center;min-height:44px;color:var(--c-paa-mork);text-decoration:none;transition:opacity .25s}

/* ---------- Mobil hurtigkontakt ---------- */
.hurtig{display:none}

/* ---------- Design Lab ---------- */
.lab{position:fixed;left:16px;bottom:16px;z-index:var(--z-panel);font-family:var(--f-body);color:#1D1D1D}
.lab__knapp,.lab__panel{background:rgba(255,255,255,.35);-webkit-backdrop-filter:blur(30px) saturate(210%);backdrop-filter:blur(30px) saturate(210%);border:.5px solid rgba(255,255,255,.4);box-shadow:0 8px 32px 0 rgba(0,0,0,.08),inset 0 1.5px .5px rgba(255,255,255,.65),inset 0 -1px 2px rgba(0,0,0,.05),inset 0 10px 20px rgba(255,255,255,.3)}
.lab__knapp{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:100px;font:500 .875rem var(--f-body);color:inherit;cursor:pointer;transition:transform .2s cubic-bezier(.16,1,.3,1)}
.lab__knapp:active{transform:scale(.97)}
.lab__panel{position:absolute;left:0;bottom:56px;width:268px;padding:14px 14px 10px;border-radius:24px;background:rgba(255,255,255,.74)}
.lab__rad{display:flex;align-items:center;gap:6px;padding:4px 0}
.lab__navn{flex:1;font-size:.8125rem}
.lab__rad button{width:34px;height:34px;border-radius:100px;border:.5px solid rgba(0,0,0,.14);background:rgba(255,255,255,.5);font:600 .8125rem var(--f-body);color:#1D1D1D;cursor:pointer;transition:transform .2s cubic-bezier(.16,1,.3,1), background-color .2s ease-out, color .2s ease-out}
.lab__rad button:active{transform:scale(.94)}
.lab__rad button[aria-pressed="true"]{background:#38332E;color:#FFFFFF;border-color:#38332E}
.design-lab__credit{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:8px;padding-top:8px;border-top:.5px solid rgba(0,0,0,.12);font-size:.75rem;color:#4A4743}
.design-lab__credit-logo{display:inline-flex;align-items:center;gap:1px;font-weight:600;color:#1D1D1D;text-decoration:none;transition:transform .2s cubic-bezier(.16,1,.3,1)}
.design-lab__credit-dot{color:#8A4A1E}
.design-lab__credit-spark{width:.8em;height:.8em;color:#8A4A1E;margin-left:2px;transition:transform .3s cubic-bezier(.16,1,.3,1)}

/* ---------- Hover bare der pekeren faktisk svever ---------- */
@media (hover:hover) and (pointer:fine){
  .pil-lenke:hover::after{transform:translateX(4px)}
  .topp__nav a:hover{text-decoration:underline;text-underline-offset:5px}
  .hero2__liste li:hover img,.hero2__liste a:focus-visible + img{opacity:1;transform:translate(-50%, -50%) scale(1)}
  .prosjekt:hover .prosjekt__bilde img{transform:scale(1.03)}
  a.kanal:hover .kanal__verdi{text-decoration-color:currentColor}
  .footer__credit-logo:hover{opacity:.8}
  .lab__knapp:hover{transform:scale(1.03)}
  .lab__rad button:hover{transform:translateY(-1px)}
  .design-lab__credit-logo:hover{transform:scale(1.04)}
  .design-lab__credit-logo:hover .design-lab__credit-spark{transform:rotate(90deg) scale(1.25)}
}
@media (prefers-reduced-motion:reduce){
  .hero2__liste img,.prosjekt__bilde img,.pil-lenke::after{transition:none}
}

/* ---------- Nettbrett ---------- */
@media (max-width:1024px){
  .om{grid-template-columns:5fr 1fr 6fr}
  .kontakt__kanaler{grid-template-columns:repeat(2, 1fr);row-gap:28px}
}

/* ---------- Mobil: ruter, ikke ramse opp (regel 2) ---------- */
@media (max-width:760px){
  :root{--t-body:1rem}
  .topp{padding-top:10px}
  .topp__nav a:not(.topp__kontakt){display:none}
  .merke{font-size:.75rem}

  .hero--foto{min-height:min(84svh, 720px)}
  .hero__bilde{object-position:42% 50%}
  .hero__innhold{padding-bottom:40px}
  .hero__tittel{max-width:none}
  .hero__bildetekst{display:none}

  .hero--type{min-height:0;padding:104px var(--kant) 56px}
  .hero2__liste img{display:none}

  .tjenester__hode,.idunn__hode,.kontakt__innhold{grid-template-columns:1fr;gap:16px}
  .tjenester__hode{margin-bottom:28px}
  .tjenester__liste{grid-template-columns:1fr;gap:0}
  .tjeneste{display:grid;grid-template-columns:8.5rem 1fr;gap:12px;padding:16px 0}
  .tjeneste h3{font-size:1.25rem}
  .tjeneste p{margin-top:2px;font-size:var(--t-liten)}
  .tjenester__merknad{margin-top:24px}

  /* Tre steg og tre prosjekter blir en sveipbar rad i stedet for en stabel */
  .idunn__lop,.prosjekter__liste{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin:0 calc(var(--kant) * -1);padding:0 var(--kant) 6px;scrollbar-width:none}
  .idunn__lop::-webkit-scrollbar,.prosjekter__liste::-webkit-scrollbar{display:none}
  .steg,.prosjekt{flex:0 0 72%;scroll-snap-align:start}
  .idunn__fot{flex-direction:column;align-items:flex-start;gap:8px}
  .prosjekter__hint{display:block;font-size:var(--t-mikro);color:var(--c-dempet)}
  .prosjekter__hint::after{content:' →'}

  .om{grid-template-columns:7.5rem 1fr;gap:16px 18px;align-items:start}
  .om__bilde{grid-column:1;grid-row:1}
  .om__tekst{display:contents}
  .om__tekst h2{grid-column:2;grid-row:1;align-self:end}
  .om__ingress,.om__brod,.om__fakta{grid-column:1 / -1}
  .om__ingress{margin-top:4px}
  .om__fakta{margin-top:12px}
  .om__fakta div{grid-template-columns:7rem 1fr}

  .kontakt__kanaler{grid-template-columns:1fr 1fr;gap:20px 16px;margin-top:32px}
  .kontakt__kanaler .kanal:nth-child(1),.kontakt__kanaler .kanal:nth-child(3){grid-column:1 / -1}
  .kontakt__kanaler .kanal:nth-child(3){order:3}
  .bunn{padding-bottom:88px}
  .bunn__rad{gap:6px 20px}
  .merke--bunn{width:100%}

  .hurtig{display:flex;position:fixed;right:16px;bottom:16px;z-index:var(--z-dokk);gap:8px}
  .hurtig a{display:grid;place-items:center;width:48px;height:48px;border-radius:100px;background:var(--c-aksent);color:var(--c-paa-aksent)}
  .hurtig svg{width:20px;height:20px;fill:currentColor}
  .hurtig a:last-child svg{fill:none}
}
