/* ---------- Fonter (selvhostet, ingen tredjepart) ---------- */
@font-face{font-family:'IBM Plex Mono';src:url('../assets/fonts/ibm-plex-mono-normal.woff2') format('woff2');font-weight:100 700;font-style:normal;font-display:swap}
/* Balboa: KUN DEMO-lisens. Webfontlisens (MyFonts) må kjøpes før levering, se assets/fonts/lisenser/DEMO-ONLY-balboa.txt */
@font-face{font-family:'Balboa';src:url('../assets/fonts/balboa-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}

:root{
  --papir:#f3f2ef;
  --blekk:#151515;
  --dempet:#64635f;
  --lys:#ffffff;
  --c-fokus:#151515;
  --signal:#c4302b;
  --metall:#ecebe7;
  --hvit:#fbfbfa;
  --linje:rgba(21,21,21,.14);
  --ramme:#1a1a1a;
  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-drawer:cubic-bezier(.32,.72,0,1);
  --kant:2vw;
  --stripe:max(6.3vw,56px);
  --mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;
  --display:'Balboa','Arial Narrow',sans-serif;
  --z-stripe:90; --z-ui:100; --z-intro:300;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{background:var(--papir);color:var(--blekk);font:400 13px/1.45 var(--mono);-webkit-font-smoothing:antialiased}
html.spill-intro body{overflow:hidden}
a{color:inherit;text-decoration:none}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--c-fokus);outline-offset:3px;border-radius:2px}

/* ---------- Topp ---------- */
.topp{position:fixed;z-index:var(--z-ui);inset:0 0 auto 0;display:flex;justify-content:space-between;align-items:flex-start;padding:1.7vw var(--kant);color:var(--lys);--c-fokus:var(--lys);transition:color .3s var(--ease-out)}
html.forbi-hero .topp{color:var(--blekk);--c-fokus:var(--blekk)}
.logo{display:block;width:8.5vw;min-width:96px}
.navn{display:block;width:100%;height:auto;overflow:visible}
.navn path{fill:currentColor;stroke:currentColor;stroke-width:12;stroke-opacity:0}
.meny{display:flex;align-items:center;gap:1.6em;margin-top:-10px;font-size:12px;letter-spacing:.02em}
/* 44 px trykkflate, men streken ligger tett under teksten. */
.meny a,.meny__kurv{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline transparent;text-underline-offset:.4em;transition:text-decoration-color .2s var(--ease-out)}
.meny__kurv{gap:.45em;min-width:44px;justify-content:center;background:none;border:0;font:inherit;color:inherit;cursor:pointer;transition:transform 160ms var(--ease-out)}
.meny__kurv .ikon{width:18px;height:18px}
.meny__kurv:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){.meny a:hover{text-decoration-color:currentColor}.hero__lenke:hover{border-color:currentColor}}

/* ---------- Hero: ett verk over hele flaten ---------- */
.hero{position:relative;height:100vh;height:100svh;overflow:hidden;color:var(--lys);--c-fokus:var(--lys)}
.hero__ramme{position:absolute;inset:0;transform-origin:50% 50%}
.hero__bilde{display:block;width:100%;height:100%;object-fit:cover}
.hero__tekst{position:absolute;left:var(--kant);bottom:2vw}
.hero__linje{overflow:hidden}
.hero__linje span{display:block}
.hero__linje--stor{font:400 8vw/.9 var(--display);margin-bottom:.8vw}
.hero__lenke{position:absolute;right:var(--kant);bottom:2vw;padding:.4em 0;border-bottom:1px solid rgba(255,255,255,.6);transition:border-color .2s cubic-bezier(.23,1,.32,1)}

/* ---------- Intro ---------- */
.intro{position:fixed;inset:0;z-index:var(--z-intro);display:none;flex-direction:column;align-items:center;justify-content:center;gap:1.4vw;background:var(--papir)}
html.spill-intro .intro{display:flex}
.intro__navn{width:20vw;min-width:200px;color:var(--blekk)}
.intro__navn .navn path{fill-opacity:0}
.intro__ring{display:flex;gap:.9vw;list-style:none}
.intro__bilde{position:relative;width:6.2vw;height:6.2vw;min-width:44px;min-height:44px;overflow:hidden;background:#e4e3df}
.intro__bilde img{display:block;width:100%;height:100%;object-fit:cover}
.intro__under{color:var(--dempet);font-size:12px;letter-spacing:.04em}

/* ---------- Stripe bak logo og meny når heroen er rullet forbi ---------- */
.toppstripe{position:fixed;z-index:var(--z-stripe);inset:0 0 auto;height:var(--stripe);background:var(--papir);border-bottom:1px solid var(--linje);opacity:0;pointer-events:none;transition:opacity .3s var(--ease-out)}
html.forbi-hero .toppstripe{opacity:1}
[id]{scroll-margin-top:var(--stripe)}

/* ---------- Felles ---------- */
.ikon{display:block;flex:none;width:20px;height:20px}
.seksjonstopp{display:flex;align-items:baseline;justify-content:space-between;gap:2vw;padding-bottom:1.4vw;border-bottom:1px solid var(--linje)}
.seksjonstopp h2,.om h2{font:400 clamp(56px,8vw,132px)/.88 var(--display)}
.seksjonstopp p{max-width:26em;color:var(--dempet);text-align:right}
.knapp{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 1.8em;background:var(--blekk);color:var(--papir);border:1px solid var(--blekk);font:500 12px/1 var(--mono);letter-spacing:.04em;cursor:pointer;transition:transform 160ms var(--ease-out),background-color .2s var(--ease-out)}
.knapp--strek{background:none;color:var(--blekk)}
.knapp:active,.kort__kjop:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){.knapp:hover{background:#333}.knapp--strek:hover{background:var(--blekk);color:var(--papir)}}

/* ---------- Verk ---------- */
.butikk{padding:9vw var(--kant) 0}
.verkliste{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:5vw 3vw;margin-top:4vw}
.kort{display:flex;flex-direction:column}
.kort__tittel{font:400 13px/1.35 var(--mono)}
.kort__pris{color:var(--dempet);margin-top:.2em}
.kort__kjop{align-self:flex-start;display:inline-flex;align-items:center;min-height:44px;margin-top:.3em;padding:0;background:none;border:0;font:inherit;color:var(--blekk);text-decoration:underline;text-decoration-color:var(--linje);text-underline-offset:.4em;cursor:pointer;transition:transform 160ms var(--ease-out),text-decoration-color .2s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.kort__kjop:hover{text-decoration-color:currentColor}}
.vis-alle{display:none}
.skjult{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
html:not(.js) .kort__kjop,html:not(.js) .bok .knapp{display:none}

/* ---------- Rammene: farger og proporsjoner målt i produktbildene i butikken hans ----------
   Liste ca. 2 % av bredden, passepartout ca. 8 %. Flatene er kvadratiske containere, så cqmin virker på begge leder. */
.kort__flate{display:flex;align-items:center;justify-content:center;aspect-ratio:1;margin-bottom:1.4vw;container-type:size}
.ramme{--list:1.8cqmin;--pp:7cqmin;display:block;padding:var(--list);background:var(--tre);box-shadow:0 1.6cqmin 2.6cqmin -1.4cqmin rgba(0,0,0,.45),0 .2cqmin .5cqmin rgba(0,0,0,.12);transition:transform .35s var(--ease-out)}
.ramme__pp{display:block;height:100%;padding:var(--pp);background:#ecebef;box-shadow:inset 0 0 0 .12cqmin rgba(0,0,0,.14)}
.ramme__pp img{display:block;box-shadow:0 0 0 .15cqmin #d6d5da,.2cqmin .2cqmin 0 .15cqmin #c9c8cd}
.ramme--liggende{width:88cqmin}
.ramme--liggende img{width:100%;height:auto}
.ramme--staende{height:88cqmin}
.ramme--staende img{height:100%;width:auto}
[data-ramme="eik"]{--tre:linear-gradient(135deg,#efe6d0,#e3d6b9 40%,#ece3cd 60%,#dccfb0)}
[data-ramme="valnott"]{--tre:linear-gradient(135deg,#6a412d,#512a1c 40%,#764c38 62%,#4a2a1d)}
[data-ramme="svart"]{--tre:linear-gradient(135deg,#3b3738,#2a2728 50%,#333031)}
/* Uten ramme: selve trykket, med papirkant rundt bildet. */
.ramme[data-ramme="uten"]{--list:0;--pp:2.4cqmin;background:none;box-shadow:0 1.2cqmin 2.4cqmin -1.4cqmin rgba(0,0,0,.35)}
.ramme[data-ramme="uten"] .ramme__pp{background:#fbfbfa;box-shadow:none}
.ramme[data-ramme="uten"] .ramme__pp img{box-shadow:none}

/* ---------- Kortene: hele kortet er en lenke til verkssiden ---------- */
.kort__lenke{display:flex;flex-direction:column;color:inherit}
.kort__tittel{display:block;font:400 13px/1.35 var(--mono)}
.kort__pris{display:block;color:var(--dempet);margin-top:.2em}
@media (hover:hover) and (pointer:fine){
  .kort__lenke:hover .ramme{transform:translateY(-.8cqmin)}
  .kort__lenke:hover .kort__tittel{text-decoration:underline;text-underline-offset:.35em}
}

/* ---------- Prosjektknappene ---------- */
.filter{display:flex;flex-wrap:wrap;gap:10px;margin-top:3vw}
.filter button{min-height:56px;padding:.15em .9em 0;background:none;border:1px solid var(--blekk);color:var(--blekk);font:400 clamp(24px,2vw,32px)/1 var(--display);cursor:pointer;transition:background-color .2s var(--ease-out),color .2s var(--ease-out),transform 160ms var(--ease-out)}
.filter button[aria-pressed="true"]{background:var(--blekk);color:var(--papir)}
.filter button:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){.filter button[aria-pressed="false"]:hover{background:rgba(21,21,21,.06)}}
html:not(.js) .filter{display:none}
.uten-js{margin-top:2em}
.uten-js a{text-decoration:underline}

/* ---------- Verkssiden ---------- */
.verkside{padding:calc(var(--stripe) + 1.4vw) var(--kant) 0}
.tilbake{display:inline-flex;align-items:center;min-height:44px;font-size:12px}
.verk{display:grid;grid-template-columns:7fr 5fr;gap:5vw;align-items:start;margin-top:1vw}
/* Kvadratisk, men aldri høyere enn det som er igjen av skjermen under toppen, tilbake-lenken og visningsknappene,
   så hele verket synes når man kommer inn. */
.verk__bilde{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1;max-height:calc(100vh - var(--stripe) - 3.4vw - 98px - 2vw);max-height:calc(100svh - var(--stripe) - 3.4vw - 98px - 2vw);min-height:320px;container-type:size;background:#e9e8e4}
.verk__bilde .ramme--liggende{width:84cqmin}
.verk__bilde .ramme--staende{height:84cqmin}
.verk__prosjekt a{display:inline-flex;align-items:center;min-height:44px;font-size:12px;text-decoration:underline;text-decoration-color:var(--linje);text-underline-offset:.4em}
.verk h1{font:400 clamp(44px,5vw,84px)/.9 var(--display);margin:.05em 0 .25em}
.verk__pris{font-size:18px;margin-bottom:1.2em}
.rammevalg{border:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rammevalg legend{padding:0;margin-bottom:10px;font-size:12px;color:var(--dempet)}
.rammevalg__knapp{position:relative;display:flex;align-items:center;gap:12px;min-height:64px;padding:10px 14px;border:1px solid var(--linje);cursor:pointer;transition:border-color .2s var(--ease-out)}
.rammevalg__knapp input{position:absolute;inset:0;margin:0;opacity:0;cursor:pointer}
.rammevalg__knapp:has(input:checked){border-color:var(--blekk);box-shadow:inset 0 0 0 1px var(--blekk)}
.rammevalg__knapp:has(input:focus-visible){outline:2px solid var(--c-fokus);outline-offset:2px}
.rammevalg__prove{flex:none;width:30px;height:30px;padding:5px;background:var(--tre)}
.rammevalg__prove::after{content:'';display:block;width:100%;height:100%;background:#ecebef}
.rammevalg__prove[data-ramme="uten"]{padding:0;background:#fbfbfa;box-shadow:inset 0 0 0 1px var(--linje)}
.rammevalg__prove[data-ramme="uten"]::after{display:none}
.rammevalg__navn{font-size:13px;line-height:1.3}
.rammevalg__navn small{display:block;color:var(--dempet);font-size:11px;margin-top:2px}
@media (hover:hover) and (pointer:fine){.rammevalg__knapp:hover{border-color:var(--blekk)}}
.verk__valgt{margin:12px 0 18px;font-size:12px;color:var(--dempet)}
.verk__knapp{width:100%}
.fakta{display:grid;grid-template-columns:7em 1fr;gap:.45em 1em;margin:2.2em 0 0;padding-top:1.2em;border-top:1px solid var(--linje);font-size:12px}
.fakta dt{color:var(--dempet)}
.verk__om{margin-top:2.4em}
.verk__om h2{font:400 34px/1 var(--display);margin-bottom:.4em}
.verk__om p{font-size:13.5px;line-height:1.75;max-width:60ch}
.andre{padding:8vw var(--kant) 7vw}
.andre .seksjonstopp p a{text-decoration:underline;text-underline-offset:.4em}

/* ---------- Snittfarge og palett (som på Birgitta-siden) ---------- */
.kort__flate{background:color-mix(in srgb,var(--snitt,#e9e8e4) 18%,var(--papir))}
.kort__palett{display:flex;gap:5px;margin-top:9px}
.kort__palett i{width:12px;height:12px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}

/* ---------- Verkssiden: ramme eller på veggen ---------- */
.verk__venstre{position:sticky;top:calc(var(--stripe) + 1.4vw)}
.verk__bilde{position:relative;background:color-mix(in srgb,var(--snitt,#e9e8e4) 20%,#e9e8e4)}
.visning{display:flex;gap:8px;margin-bottom:10px}
.visning button{min-height:44px;padding:0 1.1em;background:none;border:1px solid var(--linje);color:var(--blekk);font:500 12px/1 var(--mono);cursor:pointer;transition:border-color .2s var(--ease-out),background-color .2s var(--ease-out)}
.visning button[aria-pressed="true"]{background:var(--blekk);border-color:var(--blekk);color:var(--papir)}
@media (hover:hover) and (pointer:fine){.visning button[aria-pressed="false"]:hover{border-color:var(--blekk)}}

/* Rommet: et kvadrat på 320 × 320 cm midt i flaten (100cqmin), så målestokken holder også når flaten er bredere enn høy.
   Veggen fyller hele flaten. Gulvet går fra bunnen og opp til 13 % av kvadratet. */
.vegg{position:absolute;inset:0;overflow:hidden;background:var(--vegg);transition:background-color .35s var(--ease-out)}
.vegg__gulv{position:absolute;inset:auto 0 0;height:calc(50cqh - 37cqmin);background:linear-gradient(#cdbfa6,#dccfb8);box-shadow:0 -.4cqmin 0 #f6f4ef}
.vegg__rom{position:absolute;left:50%;top:50%;width:100cqmin;height:100cqmin;transform:translate(-50%,-50%)}
.vegg__sofa{position:absolute;left:50%;bottom:13%;width:65.6%;height:auto;transform:translateX(-50%);filter:drop-shadow(0 .6cqmin .8cqmin rgba(0,0,0,.18))}
.vegg__verk{position:absolute;left:50%;bottom:45.5%;width:var(--bredde);transform:translateX(-50%);container-type:inline-size}
.vegg__verk .ramme,.vegg__verk .ramme[data-ramme]{--list:var(--l);--pp:var(--p);width:100%;height:auto;box-shadow:0 2cqw 4cqw -2cqw rgba(0,0,0,.45)}
.vegg__verk .ramme__pp{height:auto}
.vegg__verk .ramme img{width:100%;height:auto}

.veggvalg{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px;font-size:12px}
.veggvalg>span{color:var(--dempet);margin-right:4px}
.veggvalg button{width:44px;height:44px;border:1px solid var(--linje);cursor:pointer;transition:transform 160ms var(--ease-out)}
.veggvalg button[aria-pressed="true"]{box-shadow:0 0 0 2px var(--papir),0 0 0 3px var(--blekk)}
.veggvalg button:active{transform:scale(.95)}
.veggvalg__egen{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-left:6px;cursor:pointer}
.veggvalg__egen input{width:44px;height:44px;padding:0;border:1px solid var(--linje);background:none;cursor:pointer}
.veggvalg__skala{flex-basis:100%;margin-top:4px;color:var(--dempet);line-height:1.5}

/* ---------- Farger: palett, veggfarger og komplementærfarger ---------- */
.farger{margin-top:2.4em}
.farger h2{font:400 34px/1 var(--display);margin-bottom:.45em}
.farger h3{font:500 13px/1.3 var(--mono);margin-top:1.8em}
.farger__band{display:flex;height:16px;margin-bottom:12px}
.farger__liste{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;margin-top:8px}
.prove{display:flex;align-items:center;gap:10px;min-height:44px;width:100%;padding:0;background:none;border:0;font:inherit;color:inherit;text-align:left}
button.prove{cursor:pointer}
.prove i{flex:none;width:32px;height:32px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.prove b{display:block;font-weight:500;font-size:12px;line-height:1.3}
.prove small{display:block;color:var(--dempet);font-size:11px}
@media (hover:hover) and (pointer:fine){button.prove:hover b{text-decoration:underline;text-underline-offset:.3em}}
.farger__hjelp{margin-top:6px;color:var(--dempet);font-size:12px;line-height:1.55;max-width:46ch}

/* ---------- Fotobok ---------- */
.bok{display:grid;grid-template-columns:7fr 5fr;gap:4vw;align-items:center;margin-top:9vw;padding:4vw 0;border-top:1px solid var(--linje)}
.bok__bilde{display:block;width:100%;height:auto}
.bok h3{font:400 clamp(36px,4vw,64px)/.92 var(--display);margin-bottom:.5em}
.bok__tekst p{max-width:30em;line-height:1.7}
.bok__pris{margin:1.2em 0 1.4em;font-size:15px}

/* ---------- Om Lars Berg ---------- */
.om{display:grid;grid-template-columns:5fr 7fr;gap:4vw;align-items:start;padding:9vw var(--kant) 9vw;border-top:1px solid var(--linje)}
.om__portrett{display:block;width:100%;height:auto;position:sticky;top:calc(var(--stripe) + 2vw)}
.om__tekst{max-width:40em}
.om h2{margin-bottom:.45em}
.om p{font-size:14px;line-height:1.75;max-width:60ch}
.om p+p{margin-top:1em}
.om .om__ingress{font:500 clamp(16px,1.2vw,19px)/1.6 var(--mono);max-width:none;margin-bottom:1.2em}
.cv{margin-top:2.4em;border-top:1px solid var(--linje);border-bottom:1px solid var(--linje)}
.cv summary{display:flex;align-items:center;justify-content:space-between;min-height:48px;cursor:pointer;list-style:none}
.cv summary::-webkit-details-marker{display:none}
.cv summary::after{content:'+';font-size:16px}
.cv[open] summary::after{content:'\2212'}
.cv dl{display:grid;grid-template-columns:6em 1fr;gap:.55em 1.2em;padding:.4em 0 1.4em;font-size:12px;line-height:1.5}
.cv dt{color:var(--dempet)}
.kontaktliste{list-style:none;margin-top:2em}
.kontaktliste a{display:inline-flex;align-items:center;gap:.8em;min-height:44px}
.kontaktliste .ikon{width:18px;height:18px}
@media (hover:hover) and (pointer:fine){.kontaktliste a:hover{text-decoration:underline;text-underline-offset:.4em}}

/* ---------- Bunn ---------- */
.bunn{display:flex;justify-content:space-between;gap:1em;flex-wrap:wrap;padding:1.6vw var(--kant);border-top:1px solid var(--linje);font-size:12px;color:var(--dempet)}
.bunn a{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-decoration-color:var(--linje);text-underline-offset:.4em}
.bunn span{display:inline-flex;align-items:center;min-height:44px}

/* ---------- Handlekurven: native dialog, skuff fra høyre ---------- */
.kurv{margin:0 0 0 auto;width:min(440px,100vw);height:100%;max-height:none;max-width:none;border:0;padding:0;background:none;color:var(--blekk);overflow:visible}
.kurv::backdrop{background:rgba(21,21,21,.32)}
.kurv__panel{display:flex;flex-direction:column;height:100%;background:var(--papir);box-shadow:-1vw 0 3vw rgba(0,0,0,.12)}
.kurv__topp{display:flex;align-items:center;justify-content:space-between;padding:12px 12px 12px 24px;border-bottom:1px solid var(--linje)}
.kurv__topp h2{font:400 34px/1 var(--display)}
.kurv__lukk{display:grid;place-items:center;width:44px;height:44px;background:none;border:0;color:inherit;cursor:pointer}
.kurv__tom{padding:32px 24px;display:flex;flex-direction:column;align-items:flex-start;gap:1.4em}
.kurv__liste{flex:1;overflow-y:auto;list-style:none;padding:0 24px}
.vare{display:grid;grid-template-columns:80px 1fr auto;gap:16px;align-items:start;padding:20px 0;border-bottom:1px solid var(--linje)}
.vare img{width:80px;height:80px;object-fit:contain;background:var(--metall)}
.vare__tittel{line-height:1.35}
.vare__pris{color:var(--dempet);margin-top:.2em}
.vare__antall{display:inline-flex;align-items:center;margin-top:.6em;border:1px solid var(--linje)}
.vare__antall button{width:44px;height:44px;background:none;border:0;font:inherit;font-size:15px;color:inherit;cursor:pointer}
.vare__antall span{min-width:2em;text-align:center}
.vare__fjern{min-height:44px;padding:0 0 0 .5em;background:none;border:0;font:inherit;font-size:12px;color:var(--dempet);text-decoration:underline;text-underline-offset:.4em;cursor:pointer}
.kurv__bunn{padding:20px 24px 24px;border-top:1px solid var(--linje)}
.kurv__sum{display:flex;justify-content:space-between;margin-bottom:16px;font-size:15px}
.kurv__kasse{width:100%}
.kurv__melding{margin-top:12px;color:var(--dempet);line-height:1.5}
.kurv__melding:empty{display:none}
.kurv.er-tom .kurv__liste,.kurv.er-tom .kurv__bunn,.kurv:not(.er-tom) .kurv__tom{display:none}

/* Inn: 400 ms med skuff-kurven. Ut: samme vei, 240 ms (tidsbryteren i butikk.js).
   Transitions, ikke keyframes: lukkes eller åpnes den midtveis, snur den der den står. */
.kurv__panel{transition:transform 400ms var(--ease-drawer)}
.kurv::backdrop{transition:opacity 400ms var(--ease-out)}
@starting-style{
  .kurv[open] .kurv__panel{transform:translateX(100%)}
  .kurv[open]::backdrop{opacity:0}
}
.kurv.lukker .kurv__panel{transform:translateX(100%);transition-duration:240ms}
.kurv.lukker::backdrop{opacity:0;transition-duration:240ms}

/* ---------- Mobil: verkene ruter, de fire første og én knapp til resten ---------- */
@media (max-width:760px){
  :root{--kant:16px}
  .hero__tekst{left:var(--kant);right:var(--kant);bottom:76px}
  .hero__linje--stor{font-size:60px;margin-bottom:8px}
  .hero__lenke{left:var(--kant);right:auto;bottom:20px;min-height:44px;display:inline-flex;align-items:center}
  .butikk{padding-top:64px}
  .seksjonstopp{display:block;padding-bottom:12px}
  .seksjonstopp p{text-align:left;margin-top:10px}
  .verkliste{grid-template-columns:1fr 1fr;gap:32px 16px;margin-top:24px}
  .filter{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:20px}
  .filter button{font-size:22px;min-height:52px;padding:.15em .5em 0}
  .verkside{padding-top:calc(var(--stripe) + 8px)}
  .verk{grid-template-columns:1fr;gap:20px}
  .verk__venstre{position:static}
  .farger__liste{grid-template-columns:1fr}
  .verk h1{font-size:48px}
  .andre{padding:64px var(--kant)}
  .kort__flate{margin-bottom:10px}
  .kort__tittel{font-size:12px}
  html.js .verkliste.er-kort .kort:nth-child(n+5){display:none}
  html.js .verkliste.er-kort+.vis-alle{display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;margin-top:24px;background:none;border:1px solid var(--blekk);font:500 12px/1 var(--mono);color:var(--blekk);cursor:pointer}
  .bok{grid-template-columns:1fr;gap:20px;margin-top:56px;padding:28px 0 64px}
  .om{grid-template-columns:1fr;gap:24px;padding:64px var(--kant)}
  .om__portrett{position:static}
  .om .om__mer{display:none}
  .bunn{flex-direction:column;gap:0;padding:12px var(--kant)}
}

@media (prefers-reduced-motion: reduce){
  .meny a,.register a,.hint,.toppstripe{transition:none}
  /* Skuffen tones inn og ut i stedet for å gli. */
  .kurv__panel{transition:opacity 150ms var(--ease-out)}
  @starting-style{.kurv[open] .kurv__panel{transform:none;opacity:0}}
  .kurv.lukker .kurv__panel{transform:none;opacity:0;transition-duration:150ms}
  .knapp:active,.kort__kjop:active,.meny__kurv:active{transform:none}
}