/* befaring.css - «Utforsk befaringsverktøyet»: én fast scene, appens mobilskjerm i midten, rullingen er tidslinjen.
   --t går 0..11,5 over ni steg (grensene står i data-grenser på scenen og gjentas her):
   I dag 0-1 · På vei 1-2,5 · Utfylt 2,5-3,5 · Målt 3,5-4,7 · Priset 4,7-6,4 · Ekstra 6,4-7,5 · Bilder 7,5-8,6 · Kladd 8,6-10,3 · Fullført 10,3-11,5.
   Hvert steg beveger seg i første del av enheten og hviler resten. Summen (Priset) og kladden (Kladd) har lengst strekning.
   Tre akter: kobber (før du er framme), før-bildet av loftsbadet bak skjermen (på stedet), sverte (ferdig). Skiftet følger rullingen.
   Bare transform og opacity, med ett unntak: kladden tegnes med stroke-dashoffset. Farger kun fra design-tokens.css.
   Uten .anim (redusert bevegelse / uten JS) vises stegene statisk under hverandre (.bf-fallback). */
@property --t{syntax:"<number>";inherits:true;initial-value:0}
@keyframes bf-t{from{--t:0}to{--t:11.5}}
@supports (animation-timeline: view()){
  .anim .bf-scene{animation:bf-t linear both;animation-timeline:view();animation-range:contain 0% contain 100%}
}
:root{--bf-enheter:11.5;--bf-stempel:clamp(56px,5.8vw,88px);--bf-stempel-mobil:44px;--bf-setning:24px;--bf-setning-mobil:17px;--bf-fakt:19px;--bf-tekst-bredde:30ch;--bf-fakt-bredde:26ch;--bf-skjerm-h:780px;--bf-skjerm-b:360px;--bf-foto-demp:.5}

/* Stegrekken på denne siden: ni steg */
.bf-steg ol{padding-left:var(--beffen-rom-5);padding-right:var(--beffen-rom-5)}
@media (max-width:759px){.bf-steg ol{padding-left:var(--beffen-rom-4);padding-right:var(--beffen-rom-4)}}

/* Innledning */
.bf-intro{padding:var(--ms-luft-seksjon) 0 var(--beffen-rom-7);background:var(--pd-bg)}
.bf-intro h1{margin:0 0 var(--beffen-rom-4);font-family:var(--font-display);font-weight:600;font-size:clamp(34px,4.5vw,56px);line-height:.96;letter-spacing:.01em;text-transform:uppercase;color:var(--pd-tekst);text-wrap:balance}
.bf-intro p{margin:0;max-width:60ch;font-size:var(--ms-skrift-ingress);line-height:1.5;color:var(--pd-demp)}
@media (max-width:759px){.bf-intro{padding:var(--ms-luft-seksjon-mobil) 0 var(--beffen-rom-6)}}

/* Scenen: 100svh stage + 1150vh tidslinje. Stagen står fast under stegrekken. */
.bf-scene{display:none;position:relative;height:calc(100vh + 100vh * var(--bf-enheter));height:calc(100svh + 100vh * var(--bf-enheter));background:var(--pd-tekst);color:var(--pd-petrol-tekst);--t:0;--luft:var(--ms-scene-luft)}
.anim .bf-scene{display:block}
.bf-fast{position:sticky;top:var(--ms-stegrekke-h);height:calc(100vh - var(--ms-stegrekke-h));height:calc(100svh - var(--ms-stegrekke-h));overflow:hidden;box-sizing:border-box;padding:var(--luft);display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);column-gap:var(--beffen-rom-8);align-items:center;background:var(--pd-tekst)}
.bf-bak-foto,.bf-bak-kobber{position:absolute;inset:0;pointer-events:none}
.bf-bak-foto img{display:block;width:100%;height:100%;object-fit:cover;opacity:calc(var(--bf-foto-demp) * var(--akt2) * (1 - var(--akt3)));transform:scale(calc(1.05 - .05 * var(--akt2)));will-change:transform,opacity}
.bf-bak-kobber{background:var(--pd-kobber);opacity:calc(1 - var(--akt2))}
.bf-tekst{position:relative;grid-column:1;justify-self:end;display:grid;grid-template-columns:minmax(0,1fr);width:100%;max-width:var(--bf-tekst-bredde)}
.bf-tekst .bf-ark{grid-area:1/1;min-width:0}
.bf-fast .tf{position:relative;grid-column:2;align-self:stretch;justify-self:center}
.bf-fakta{position:relative;grid-column:3;justify-self:start;display:grid;grid-template-columns:minmax(0,1fr);width:100%;max-width:var(--bf-fakt-bredde)}
.bf-fakta .bf-fakt{grid-area:1/1;margin:0;font-size:var(--bf-fakt);font-weight:600;line-height:1.35;text-wrap:pretty;will-change:transform,opacity}

/* Tidslinjen: alt utledes av --t. sK = 0..1 i steg K. Jevnet med smoothstep der noe flytter seg. */
.bf-scene,.bf-fb-steg{
  --s0:clamp(0,calc(var(--t) / .6),1);
  --s1:clamp(0,calc((var(--t) - 1) / 1.5),1);
  --s2:clamp(0,calc((var(--t) - 2.5) / 1),1);
  --s3:clamp(0,calc((var(--t) - 3.5) / 1.2),1);
  --s4:clamp(0,calc((var(--t) - 4.7) / 1.7),1);
  --s5:clamp(0,calc((var(--t) - 6.4) / 1.1),1);
  --s6:clamp(0,calc((var(--t) - 7.5) / 1.1),1);
  --s7:clamp(0,calc((var(--t) - 8.6) / 1.7),1);
  --s8:clamp(0,calc((var(--t) - 10.3) / 1.2),1);
  /* Aktene */
  --akt2a:clamp(0,calc((var(--t) - 3.5) / .35),1);--akt2:calc(var(--akt2a) * var(--akt2a) * (3 - 2 * var(--akt2a)));
  --akt3a:clamp(0,calc((var(--t) - 10.3) / .3),1);--akt3:calc(var(--akt3a) * var(--akt3a) * (3 - 2 * var(--akt3a)));
  /* Tekstarkene: ut/inn over 30 % av en enhet, opacity i første tredel */
  --b1:clamp(0,calc((var(--t) - 1) / .3),1);--b1e:calc(var(--b1) * var(--b1) * (3 - 2 * var(--b1)));
  --b2:clamp(0,calc((var(--t) - 2.5) / .3),1);--b2e:calc(var(--b2) * var(--b2) * (3 - 2 * var(--b2)));
  --b3:clamp(0,calc((var(--t) - 3.5) / .3),1);--b3e:calc(var(--b3) * var(--b3) * (3 - 2 * var(--b3)));
  --b4:clamp(0,calc((var(--t) - 4.7) / .3),1);--b4e:calc(var(--b4) * var(--b4) * (3 - 2 * var(--b4)));
  --b5:clamp(0,calc((var(--t) - 6.4) / .3),1);--b5e:calc(var(--b5) * var(--b5) * (3 - 2 * var(--b5)));
  --b6:clamp(0,calc((var(--t) - 7.5) / .3),1);--b6e:calc(var(--b6) * var(--b6) * (3 - 2 * var(--b6)));
  --b7:clamp(0,calc((var(--t) - 8.6) / .3),1);--b7e:calc(var(--b7) * var(--b7) * (3 - 2 * var(--b7)));
  --b8:clamp(0,calc((var(--t) - 10.3) / .3),1);--b8e:calc(var(--b8) * var(--b8) * (3 - 2 * var(--b8)));
  /* I dag: kortets rader fylles 0-60 % */
  --r1:clamp(0,calc(var(--s0) / .3),1);--r2:clamp(0,calc((var(--s0) - .15) / .3),1);--r3:clamp(0,calc((var(--s0) - .3) / .3),1);--r4:clamp(0,calc((var(--s0) - .45) / .3),1);
  /* På vei: Kjør trykkes, kartet opp, nålen lander, kartet ned, SMS trykkes, meldingsarket opp */
  --trykkK:clamp(0,calc((var(--s1) - .02) / .06),1);
  --kart0:clamp(0,calc((var(--s1) - .08) / .22),1);--kart:calc(var(--kart0) * var(--kart0) * (3 - 2 * var(--kart0)));
  --naal:clamp(0,calc((var(--s1) - .26) / .1),1);
  --kartNed0:clamp(0,calc((var(--s1) - .5) / .12),1);--kartNed:calc(var(--kartNed0) * var(--kartNed0) * (3 - 2 * var(--kartNed0)));
  --trykkS:clamp(0,calc((var(--s1) - .62) / .06),1);
  --sms0:clamp(0,calc((var(--s1) - .68) / .24),1);--sms:calc(var(--sms0) * var(--sms0) * (3 - 2 * var(--sms0)));
  /* Utfylt: meldingsarket ned, kortet trykkes, skjemaet inn fra høyre, feltene fylles, toast */
  --smsNed0:clamp(0,calc(var(--s2) / .12),1);--smsNed:calc(var(--smsNed0) * var(--smsNed0) * (3 - 2 * var(--smsNed0)));
  --trykkKort:clamp(0,calc((var(--s2) - .12) / .08),1);
  --skjema0:clamp(0,calc((var(--s2) - .2) / .3),1);--skjema:calc(var(--skjema0) * var(--skjema0) * (3 - 2 * var(--skjema0)));
  --f1:clamp(0,calc((var(--s2) - .5) / .08),1);--f2:clamp(0,calc((var(--s2) - .56) / .08),1);--f3:clamp(0,calc((var(--s2) - .62) / .08),1);--f4:clamp(0,calc((var(--s2) - .68) / .08),1);
  --toast:clamp(0,calc((var(--s2) - .78) / .08),1);
  /* Målt: steg 2 inn, sumbaren opp, L og B skrives, fratrekk, flatene regnes */
  --rom0:clamp(0,calc(var(--s3) / .22),1);--romInn:calc(var(--rom0) * var(--rom0) * (3 - 2 * var(--rom0)));
  --sbInn:clamp(0,calc((var(--s3) - .05) / .15),1);
  --m1:clamp(0,calc((var(--s3) - .28) / .08),1);--m2:clamp(0,calc((var(--s3) - .38) / .08),1);--m3:clamp(0,calc((var(--s3) - .5) / .08),1);--m4:clamp(0,calc((var(--s3) - .6) / .08),1);
  /* Priset: kvm-pris gulv og vegg skrives, summen teller 30-85 % (JS skriver tallet) */
  --p1:clamp(0,calc((var(--s4) - .1) / .08),1);--p2:clamp(0,calc((var(--s4) - .2) / .08),1);--sum:clamp(0,calc((var(--s4) - .3) / .55),1);
  /* Ekstra: steg 3 inn, posten hukes av, raden flytter opp til Valgte arbeider, summen går til 86 800 */
  --steg3a:clamp(0,calc(var(--s5) / .22),1);--steg3Inn:calc(var(--steg3a) * var(--steg3a) * (3 - 2 * var(--steg3a)));
  --huk:clamp(0,calc((var(--s5) - .3) / .06),1);
  --flytt0:clamp(0,calc((var(--s5) - .36) / .18),1);--flytt:calc(var(--flytt0) * var(--flytt0) * (3 - 2 * var(--flytt0)));
  /* Bilder: rull til bildene, Ta bilde trykkes, kameraet opp, utløseren, kameraet ned, raden med status */
  --rull1a:clamp(0,calc(var(--s6) / .18),1);--rull1:calc(var(--rull1a) * var(--rull1a) * (3 - 2 * var(--rull1a)));
  --taTrykk:clamp(0,calc((var(--s6) - .2) / .06),1);
  --kam0:clamp(0,calc((var(--s6) - .26) / .14),1);--kam:calc(var(--kam0) * var(--kam0) * (3 - 2 * var(--kam0)));
  --utlos:clamp(0,calc((var(--s6) - .48) / .04),1);--blits:calc(var(--utlos) * (1 - clamp(0,calc((var(--s6) - .52) / .06),1)));
  --kamUt0:clamp(0,calc((var(--s6) - .58) / .12),1);--kamUt:calc(var(--kamUt0) * var(--kamUt0) * (3 - 2 * var(--kamUt0)));
  --rad:clamp(0,calc((var(--s6) - .64) / .1),1);
  --st1:calc(clamp(0,calc((var(--s6) - .64) / .04),1) * (1 - clamp(0,calc((var(--s6) - .74) / .04),1)));
  --st2:calc(clamp(0,calc((var(--s6) - .74) / .04),1) * (1 - clamp(0,calc((var(--s6) - .86) / .04),1)));
  --st3:clamp(0,calc((var(--s6) - .86) / .04),1);
  /* Kladd: rull til kladdetegning, Ny tegning trykkes, tegneflaten opp, seks strøk 36-90 %, Lagre trykkes */
  --rull2a:clamp(0,calc(var(--s7) / .15),1);--rull2:calc(var(--rull2a) * var(--rull2a) * (3 - 2 * var(--rull2a)));
  --nyTrykk:clamp(0,calc((var(--s7) - .17) / .06),1);
  --tegne0:clamp(0,calc((var(--s7) - .23) / .12),1);--tegneInn:calc(var(--tegne0) * var(--tegne0) * (3 - 2 * var(--tegne0)));
  --d1:clamp(0,calc((var(--s7) - .36) / .16),1);--d2:clamp(0,calc((var(--s7) - .52) / .06),1);--d3:clamp(0,calc((var(--s7) - .58) / .08),1);
  --d4:clamp(0,calc((var(--s7) - .66) / .08),1);--d5:clamp(0,calc((var(--s7) - .74) / .07),1);--d6:clamp(0,calc((var(--s7) - .81) / .09),1);
  --lagreTrykk:clamp(0,calc((var(--s7) - .93) / .05),1);
  /* Fullført: tegneflaten ned, steg 4 inn, Fullfør trykkes, dialogen, bekreft, kvitteringen, Oversikt */
  --tegneUt0:clamp(0,calc(var(--s8) / .1),1);--tegneUt:calc(var(--tegneUt0) * var(--tegneUt0) * (3 - 2 * var(--tegneUt0)));
  --steg4a:clamp(0,calc((var(--s8) - .08) / .18),1);--steg4Inn:calc(var(--steg4a) * var(--steg4a) * (3 - 2 * var(--steg4a)));
  --fullTrykk:clamp(0,calc((var(--s8) - .3) / .05),1);
  --dlg0:clamp(0,calc((var(--s8) - .35) / .1),1);--dlg:calc(var(--dlg0) * var(--dlg0) * (3 - 2 * var(--dlg0)));
  --bekreftTrykk:clamp(0,calc((var(--s8) - .5) / .05),1);
  --dlgUt:clamp(0,calc((var(--s8) - .55) / .06),1);
  --kvitt0:clamp(0,calc((var(--s8) - .58) / .1),1);--kvitt:calc(var(--kvitt0) * var(--kvitt0) * (3 - 2 * var(--kvitt0)));
  --ov0:clamp(0,calc((var(--s8) - .78) / .14),1);--ovInn:calc(var(--ov0) * var(--ov0) * (3 - 2 * var(--ov0)));
}
/* Tekstarket: stempelord + én setning, og faktalinjen til høyre. Glir forbi ved siden av skjermen. */
.bf-ark{will-change:transform,opacity}
.bf-stempel{margin:0 0 var(--beffen-rom-4);font-family:var(--font-display);font-weight:700;font-size:var(--bf-stempel);line-height:.9;letter-spacing:.01em;text-transform:uppercase;white-space:nowrap}
.bf-stempel .punktum{position:relative;color:var(--pd-tekst)}
.bf-stempel .punktum::after{content:".";position:absolute;left:0;top:0;color:var(--pd-kobber);opacity:var(--akt2)}
.bf-setning{margin:0;font-size:var(--bf-setning);line-height:1.35;font-weight:500;text-wrap:pretty}
.bf-ark.a0,.bf-fakt.a0{opacity:calc(1 - clamp(0,calc(var(--b1) * 3),1));transform:translateY(calc(-48px * var(--b1e)))}
.bf-ark.a1,.bf-fakt.a1{opacity:calc(clamp(0,calc(var(--b1) * 3),1) - clamp(0,calc(var(--b2) * 3),1));transform:translateY(calc(48px * (1 - var(--b1e)) - 48px * var(--b2e)))}
.bf-ark.a2,.bf-fakt.a2{opacity:calc(clamp(0,calc(var(--b2) * 3),1) - clamp(0,calc(var(--b3) * 3),1));transform:translateY(calc(48px * (1 - var(--b2e)) - 48px * var(--b3e)))}
.bf-ark.a3,.bf-fakt.a3{opacity:calc(clamp(0,calc(var(--b3) * 3),1) - clamp(0,calc(var(--b4) * 3),1));transform:translateY(calc(48px * (1 - var(--b3e)) - 48px * var(--b4e)))}
.bf-ark.a4,.bf-fakt.a4{opacity:calc(clamp(0,calc(var(--b4) * 3),1) - clamp(0,calc(var(--b5) * 3),1));transform:translateY(calc(48px * (1 - var(--b4e)) - 48px * var(--b5e)))}
.bf-ark.a5,.bf-fakt.a5{opacity:calc(clamp(0,calc(var(--b5) * 3),1) - clamp(0,calc(var(--b6) * 3),1));transform:translateY(calc(48px * (1 - var(--b5e)) - 48px * var(--b6e)))}
.bf-ark.a6,.bf-fakt.a6{opacity:calc(clamp(0,calc(var(--b6) * 3),1) - clamp(0,calc(var(--b7) * 3),1));transform:translateY(calc(48px * (1 - var(--b6e)) - 48px * var(--b7e)))}
.bf-ark.a7,.bf-fakt.a7{opacity:calc(clamp(0,calc(var(--b7) * 3),1) - clamp(0,calc(var(--b8) * 3),1));transform:translateY(calc(48px * (1 - var(--b7e)) - 48px * var(--b8e)))}
.bf-ark.a8,.bf-fakt.a8{opacity:clamp(0,calc(var(--b8) * 3),1);transform:translateY(calc(48px * (1 - var(--b8e))))}

/* Telefonen: lys ramme, 360 px bred skjerm skalert med --k (ren CSS: tan(atan2()) gir forholdet). Høyden følger plassen. */
.tf{--k:min(1,tan(atan2(100svh - var(--ms-stegrekke-h) - 2 * var(--luft),var(--bf-skjerm-h))));--trykk:0;position:relative;width:calc(var(--bf-skjerm-b) * var(--k));height:min(calc(var(--bf-skjerm-h) * var(--k)),100%);border:1px solid var(--pd-kant-sterk);border-radius:24px;background:var(--bg);overflow:hidden;color:var(--ink);font-family:var(--font-tekst);font-size:16px;line-height:1.4;box-sizing:border-box}
.tf-skjerm{position:relative;width:var(--bf-skjerm-b);height:calc(100% / var(--k));transform:scale(var(--k));transform-origin:0 0;overflow:hidden}
.tf-vis{position:absolute;inset:0;display:flex;flex-direction:column;background:var(--bg);will-change:transform}
.tf-topp{display:flex;align-items:center;gap:10px;height:52px;padding:0 16px;border-bottom:1px solid var(--pd-kant);background:var(--pd-bg);flex:none}
.tf-flis{position:relative;display:grid;place-items:center;width:26px;height:26px;border-radius:var(--pd-radius);background:var(--ink);color:var(--card);font-family:var(--font-display);font-weight:700;font-size:17px;line-height:1}
.tf-flis i{position:absolute;right:3px;bottom:3px;width:5px;height:5px;background:var(--pd-kobber)}
.tf-ord{font-family:var(--font-display);font-weight:600;font-size:18px;letter-spacing:.1em;text-transform:uppercase}
.tf-hode{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:20px 16px 12px;flex:none}
.tf-hode h1{margin:0;font-family:var(--font-display);font-weight:600;font-size:28px;line-height:1;letter-spacing:0}
.tf-under{margin-top:4px;font-size:14px;color:var(--grey)}
.tf-kn-omriss{display:inline-flex;align-items:center;height:40px;padding:0 14px;border:1px solid var(--ink);border-radius:var(--pd-radius);font-size:14px;font-weight:600;white-space:nowrap}
.tf-seksjon{padding:8px 16px 0}
.tf-seksjon h2{display:flex;align-items:center;gap:8px;margin:0;padding-bottom:8px;border-bottom:1px solid var(--ink);font-family:var(--font-display);font-weight:500;font-size:20px;line-height:1.2;letter-spacing:0}
.tf-antall{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border:1px solid var(--ink);border-radius:var(--pd-radius);font-family:var(--font-etikett);font-size:12px;font-weight:600}
.tf-hint{margin:8px 0 0;font-size:13px;line-height:1.4;color:var(--grey)}
.tf-kort{position:relative;margin-top:12px;padding:16px;background:var(--card);border-bottom:1px solid var(--line)}
.tf-kort::after{content:"";position:absolute;inset:0;background:var(--ink);opacity:calc(.08 * var(--trykkKort) * (1 - var(--skjema)));pointer-events:none}
.tf-skjelett{position:absolute;inset:16px;display:grid;gap:10px;align-content:start;opacity:calc(1 - clamp(0,calc(var(--r1) * 3),1))}
.tf-skjelett i{display:block;height:14px;border-radius:var(--pd-radius);background:var(--linje-svak)}
.tf-skjelett i:nth-child(2){width:70%}.tf-skjelett i:nth-child(3){width:45%}
.tf-tid{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:700}
.tf-merke{display:inline-flex;align-items:center;height:20px;padding:0 6px;border-radius:var(--pd-radius);background:var(--ink);color:var(--card);font-family:var(--font-etikett);font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;line-height:1}
.tf-adresse{margin-top:4px;font-size:16px}
.tf-kunde{margin-top:4px;font-size:14px;color:var(--grey)}
.tf-oppdrag{margin-top:4px;font-size:12px;color:var(--grey)}
.tf-kontakt{display:flex;gap:8px;margin-top:12px}
.tf-kn{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;flex:1 1 0;min-height:48px;border:1px solid var(--kant-kontroll);border-radius:var(--pd-radius);background:var(--card);font-size:11px;font-weight:600;line-height:1;--trykk:0;transform:scale(calc(1 - .04 * var(--trykk)))}
.tf-kn::after,.tf-kn-liten::after,.tf-kn-primar::after{content:"";position:absolute;inset:-1px;border-radius:var(--pd-radius);background:var(--ink);opacity:calc(.12 * var(--trykk));pointer-events:none}
.tf-kn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tf-kn.kjor{--trykk:calc(var(--trykkK) * (1 - var(--kartNed)))}
.tf-kn.sms{--trykk:calc(var(--trykkS) * (1 - var(--smsNed)))}
.inn{opacity:clamp(0,calc(var(--vis, 1) * 3),1);transform:translateY(calc(.4em * (1 - var(--vis, 1))))}
.r1{--vis:var(--r1)}.r2{--vis:var(--r2)}.r3{--vis:var(--r3)}.r4{--vis:var(--r4)}
.tf-bunn{margin-top:auto;display:grid;grid-template-columns:repeat(5,1fr);align-items:center;padding:8px 8px 14px;border-top:1px solid var(--pd-kant);background:var(--pd-bg);flex:none}
.tf-bunn span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:48px;font-family:var(--font-etikett);font-size:11px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--pd-demp)}
.tf-bunn span.aktiv{color:var(--ink);font-weight:600}
.tf-bunn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.tf-bunn span.ny{width:52px;height:52px;min-height:52px;margin:-20px auto 0;border-radius:var(--pd-radius);background:var(--pd-kobber-fyll);color:var(--pd-kobber-fyll-tekst)}
.tf-bunn span.ny svg{color:var(--pd-kobber-fyll-tekst)}
.tf-idag{transform:translateX(calc(-24% * var(--skjema)))}

/* Kartappen: bare nål og adresse. Opp 8-30 %, nål 26-36 %, ned 50-62 % av På vei. */
.tf-kart{background:var(--bg);transform:translateY(calc((1 - var(--kart) + var(--kartNed)) * 100%))}
.tf-kart-hode{position:absolute;top:0;left:0;right:0;z-index:1;display:flex;align-items:center;justify-content:center;height:52px;font-size:16px;font-weight:600;background:var(--card);border-bottom:1px solid var(--line)}
.tf-gater{position:absolute;inset:0;width:100%;height:100%}
.tf-gater .gate{fill:none;stroke:var(--line);stroke-width:14}
.tf-gater .gate.tynn{stroke:var(--linje-svak);stroke-width:8}
.tf-gater .naal{fill:var(--pd-kobber);opacity:clamp(0,calc(var(--naal) * 3),1);transform:translateY(calc(-36px * (1 - var(--naal))))}
.tf-gater .naal circle{fill:var(--card)}
.tf-kart-ark{position:absolute;left:12px;right:12px;bottom:12px;padding:16px;border:1px solid var(--line);border-radius:var(--pd-radius);background:var(--card)}
.tf-kart-tittel{font-family:var(--font-display);font-weight:600;font-size:22px;line-height:1.1}
.tf-kart-under{margin-top:4px;font-size:14px;color:var(--grey)}

/* Meldingsappen: delvis ark over I dag, opp 68-92 % av På vei, ned 0-12 % av Utfylt. Hele teksten synlig i hvile. */
.tf-sms-bak{position:absolute;inset:0;background:var(--ink);opacity:calc(.35 * (var(--sms) - var(--smsNed)));pointer-events:none}
.tf-sms{top:auto;height:auto;background:var(--card);border-top:1px solid var(--line);border-radius:var(--pd-radius) var(--pd-radius) 0 0;transform:translateY(calc((1 - var(--sms) + var(--smsNed)) * 100%))}
.tf-sms-hode{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:56px;padding:0 16px;border-bottom:1px solid var(--line);font-size:16px}
.tf-sms-avbryt{color:var(--ink);font-weight:500}
.tf-sms-tittel{font-weight:600}
.tf-sms-til{display:flex;gap:8px;padding:14px 16px;border-bottom:1px solid var(--linje-svak);font-size:16px;color:var(--grey)}
.tf-sms-til b{color:var(--ink);font-weight:600}
.tf-sms-felt{position:relative;margin:12px 12px 16px;padding:12px 56px 12px 14px;border:1px solid var(--line);border-radius:var(--pd-radius);background:var(--bg);font-size:16px;line-height:1.4}
.tf-sms-felt p{margin:0}
.tf-sms-send{position:absolute;right:8px;bottom:8px;display:grid;place-items:center;width:32px;height:32px;border-radius:var(--pd-radius);background:var(--ink);color:var(--card)}
.tf-sms-send svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* Skjemaet: felles deler. Steg 1 inn 20-50 % av Utfylt, feltene fylles 50-76 %, toast 78-86 %. */
.tf-skjema{transform:translateX(calc((1 - var(--skjema)) * 100% - 24% * var(--romInn)))}
.tf-card{margin:12px 16px 0;padding:14px 16px 16px;border:1px solid var(--line);border-radius:var(--pd-radius);background:var(--card);box-sizing:border-box;flex:none}
.tf-card label{display:block;margin:12px 0 4px;font-family:var(--font-etikett);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--grey)}
.tf-card label:first-child{margin-top:0}
.tf-sec{display:flex;align-items:center;justify-content:space-between;font-size:16px;font-weight:600}
.tf-sec i,.tf-felt.velger i,.tf-kat i{width:8px;height:8px;border-right:1.5px solid var(--grey);border-bottom:1.5px solid var(--grey);transform:rotate(45deg);margin:0 4px 4px 0;flex:none}
.tf-felt{position:relative;display:flex;align-items:center;min-height:44px;padding:0 12px;border:1px solid var(--kant-kontroll);border-radius:var(--pd-radius);background:var(--flate-input);font-size:16px;box-sizing:border-box}
.tf-felt.lav{min-height:40px}
.tf-felt.velger{justify-content:space-between}
.tf-felt span{display:inline-block;opacity:clamp(0,calc(var(--vis, 1) * 3),1);transform:translateY(calc(.3em * (1 - var(--vis, 1))))}
.tf-felt em{position:absolute;left:12px;font-style:normal;color:var(--grey);opacity:calc(1 - clamp(0,calc(var(--vis, 1) * 3),1))}
.tf-felt .tf-plassh{color:var(--grey);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.tf-felt.f1 span{--vis:var(--f1)}.tf-felt.f2 span{--vis:var(--f2)}.tf-felt.f3 span{--vis:var(--f3)}.tf-felt.f4 span{--vis:var(--f4)}
.tf-rad{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tf-rad.tre{grid-template-columns:1fr 1fr 1fr;gap:8px}
.tf-rad.tre label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tf-rom-rad{display:flex;align-items:center;justify-content:space-between;margin-top:12px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--pd-radius);font-weight:600}
.tf-maal{font-weight:500;color:var(--grey)}
.tf-toast{position:absolute;right:16px;bottom:16px;padding:12px 16px;border-radius:var(--pd-radius);background:var(--ok);color:var(--card);font-size:13px;font-weight:500;opacity:calc(clamp(0,calc(var(--toast) * 3),1) * (1 - var(--romInn)));transform:translateY(calc(8px * (1 - var(--toast))))}
.tf-kn-liten{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:0 12px;border:1px solid var(--kant-kontroll);border-radius:var(--pd-radius);background:var(--card);font-size:14px;font-weight:600;white-space:nowrap;--trykk:0;transform:scale(calc(1 - .04 * var(--trykk)))}
.tf-kn-liten.los{margin:12px 16px 0;align-self:flex-start}
.tf-kn-primar{position:relative;display:inline-grid;align-items:center;justify-items:center;min-height:40px;padding:0 16px;border-radius:var(--pd-radius);background:var(--pd-kobber-fyll);color:var(--pd-kobber-fyll-tekst);font-size:14px;font-weight:700;white-space:nowrap;--trykk:0;transform:scale(calc(1 - .04 * var(--trykk)))}
.tf-kn-primar b{grid-area:1/1;font-weight:700}
.tf-rom-dok{display:flex;align-items:center;gap:8px;margin-top:14px}
.tf-dempet{font-size:13px;color:var(--grey)}

/* Steg 2 Rom og flater: inn 0-22 % av Målt, L 28-36 %, B 38-46 %, fratrekk 50-58 %, flatene 60-68 %. Priset: pris gulv 10-18 %, vegg 20-28 %. */
.tf-rom{transform:translateX(calc((1 - var(--romInn)) * 100% - 24% * var(--steg3Inn)))}
.tf-felt.m1 span{--vis:var(--m1)}.tf-felt.m2 span{--vis:var(--m2)}.tf-felt.m3 span{--vis:var(--m3)}
.tf-felt.p1 span,.tf-felt.p1 em{--vis:var(--p1)}.tf-felt.p2 span,.tf-felt.p2 em{--vis:var(--p2)}
.tf-detaljer{margin-top:14px;padding-top:10px;border-top:1px solid var(--linje-svak)}
.tf-summary{display:block;margin-bottom:4px;font-size:14px;font-weight:600}
.tf-beregnet{margin-top:10px;font-size:13px;color:var(--grey)}
.tf-beregnet span{display:inline-block;opacity:clamp(0,calc(var(--m4) * 3),1);transform:translateY(calc(.3em * (1 - var(--m4))))}

/* Steg 3 Produkter og arbeid: inn 0-22 % av Ekstra. Kortene har fast høyde så rullingen (transform) treffer: Bilder 0-18 % av Bilder, Kladdetegning 0-15 % av Kladd. */
.tf-steg3{transform:translateX(calc((1 - var(--steg3Inn)) * 100%))}
.tf-rull{position:relative;transform:translateY(calc(-484px * var(--rull1) - 354px * var(--rull2)));will-change:transform}
.tf-card.h-ekstra{height:340px;overflow:hidden}.tf-card.h-notat{height:120px;overflow:hidden}.tf-card.h-bilder{height:230px;overflow:hidden}.tf-card.h-video{height:100px;overflow:hidden}.tf-card.h-tegning{height:180px;overflow:hidden}
.tf-rull-slutt{height:420px}
.tf-valgte{display:grid;margin-top:12px;padding:8px 12px 10px;border:1px solid var(--line);border-radius:var(--pd-radius);background:var(--bg)}
.tf-valgte-hode{font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--grey);margin-bottom:6px}
.tf-valgt-rad,.tf-valgte-tom{grid-area:2/1}
.tf-valgte-tom{font-size:13px;color:var(--grey);line-height:1.35;opacity:calc(1 - clamp(0,calc(var(--flytt) * 3),1))}
.tf-valgt-rad{opacity:clamp(0,calc(var(--flytt) * 3),1);transform:translateY(calc(24px * (1 - var(--flytt))))}
.tf-valgt-rad,.tf-ekstra-rad{display:flex;align-items:center;gap:8px;min-height:40px;font-size:14px}
.tf-ekstra-rad{padding:4px 0;border-bottom:1px solid var(--linje-svak)}
.tf-ekstra-rad.flytter{opacity:calc(1 - clamp(0,calc(var(--flytt) * 3),1));transform:translateY(calc(-24px * var(--flytt)))}
.tf-navn{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tf-mini{min-width:36px;padding:0 6px;border:1px solid var(--kant-kontroll);border-radius:var(--pd-radius);background:var(--flate-input);text-align:right;font-variant-numeric:tabular-nums;line-height:28px;flex:none}
.tf-enh{font-size:12px;color:var(--grey);flex:none}
.tf-huk{position:relative;width:20px;height:20px;border:2px solid var(--ink);border-radius:var(--pd-radius);background:var(--card);flex:none}
.tf-huk::after{content:"";position:absolute;inset:3px;background:var(--ink);border-radius:1px;opacity:var(--huk, 0);transform:scale(calc(.5 + .5 * var(--huk, 0)))}
.tf-huk.ja::after{opacity:1;transform:none}
.tf-ekstra-rad:not(.flytter) .tf-huk::after{opacity:0}
.tf-b-med .tf-huk::after{opacity:0}
.tf-sok{margin-top:12px;padding:0 12px;min-height:40px;display:flex;align-items:center;border:1px solid var(--kant-kontroll);border-radius:var(--pd-radius);background:var(--flate-input);font-size:14px;color:var(--grey)}
.tf-kat{display:flex;align-items:center;justify-content:space-between;margin-top:10px;padding:8px 0;border-bottom:1px solid var(--linje-svak);font-size:14px;font-weight:600}
.tf-kat i{transform:rotate(-135deg);margin:4px 4px 0 0}
.tf-plass{position:relative;display:flex;align-items:center;gap:8px;min-height:44px;margin-top:-48px;padding:4px 0;border-bottom:1px solid var(--linje-svak);font-size:13px;color:var(--grey);opacity:clamp(0,calc(var(--flytt) * 3),1);pointer-events:none}
.tf-plass b{color:var(--ink);font-weight:600}
.tf-plass-merke{color:var(--ok);font-weight:700}
.tf-kn-liten.ta{--trykk:calc(var(--taTrykk) * (1 - var(--kam)))}
.tf-kn-liten.ny-tegning{--trykk:calc(var(--nyTrykk) * (1 - var(--tegneInn)))}
.tf-bilderad{display:flex;gap:12px;margin-top:12px;opacity:clamp(0,calc(var(--rad) * 3),1);transform:translateY(calc(10px * (1 - var(--rad))))}
.tf-thumb{display:block;width:64px;height:80px;object-fit:cover;border-radius:var(--pd-radius);background:var(--linje-svak);flex:none}
.tf-bildefelt{flex:1 1 auto;min-width:0;display:grid;gap:6px}
.tf-b-med{display:flex;align-items:center;gap:8px;font-size:13px}
.tf-b-status{position:relative;display:grid;font-size:12px;color:var(--grey);min-height:16px}
.tf-b-status span{grid-area:1/1}
.tf-b-status .st1{opacity:var(--st1)}.tf-b-status .st2{opacity:var(--st2)}.tf-b-status .st3{opacity:var(--st3);color:var(--ok);font-weight:600}
.tf-tegn-grid{margin-top:12px;height:56px}
.tf-tegn-mini{display:block;width:60px;height:56px;border:1px solid var(--line);border-radius:var(--pd-radius);background:var(--card);color:var(--ink);opacity:var(--tegneUt)}
.tf-tegn-mini path{stroke-width:14}

/* Kameraet (telefonens): opp 26-40 % av Bilder, utløser 48-52 %, ned 58-70 % */
.tf-kamera{background:var(--ink);transform:translateY(calc((1 - var(--kam) + var(--kamUt)) * 100%))}
.tf-soker{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.9}
.tf-kamera-topp{position:relative;display:flex;align-items:center;justify-content:center;height:52px;color:var(--card);font-size:14px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.tf-kamera-bunn{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;height:120px;background:var(--ink)}
.tf-utloser{display:grid;place-items:center;width:68px;height:68px;border:3px solid var(--card);border-radius:50%;transform:scale(calc(1 - .1 * var(--utlos)))}
.tf-utloser i{width:54px;height:54px;border-radius:50%;background:var(--card)}
.tf-blits{position:absolute;inset:0;background:var(--card);opacity:var(--blits)}

/* Tegneflaten (tegneflate.js): opp 23-35 % av Kladd, ned 0-10 % av Fullført. Strøkene 36-90 %. */
.tf-tegne{background:var(--ink);transform:translateY(calc((1 - var(--tegneInn) + var(--tegneUt)) * 100%))}
.tf-verktoy{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:10px 12px}
.tf-penn,.tf-vkn{display:inline-flex;align-items:center;justify-content:center;min-width:40px;min-height:40px;padding:0 10px;border:1px solid var(--pd-petrol-demp);border-radius:var(--pd-radius);background:var(--pd-tekst);color:var(--card);font-size:13px;font-weight:600;white-space:nowrap}
.tf-penn.valgt{background:var(--card);color:var(--ink);border-color:var(--card)}
.tf-penn i{border-radius:50%;background:currentColor}
.tf-penn .p1{width:4px;height:4px}.tf-penn .p2{width:8px;height:8px}.tf-penn .p3{width:13px;height:13px}
.tf-vkn.hoyre{margin-left:auto}
.tf-vkn.lagre{position:relative;background:var(--ok);border-color:var(--ok);--trykk:var(--lagreTrykk);transform:scale(calc(1 - .04 * var(--trykk)))}
.tf-vkn.lagre::after{content:"";position:absolute;inset:-1px;background:var(--ink);opacity:calc(.2 * var(--trykk))}
.tf-flate{flex:1;margin:0 12px 12px;border-radius:var(--pd-radius);background:var(--card);overflow:hidden;color:var(--ink)}
.tf-kladd{display:block;width:100%;height:100%}
.tf-kladd path,.tf-tegn-mini path{stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--dd, 1))}
.tf-kladd .d1{--dd:var(--d1)}.tf-kladd .d2{--dd:var(--d2)}.tf-kladd .d3{--dd:var(--d3)}.tf-kladd .d4{--dd:var(--d4)}.tf-kladd .d5{--dd:var(--d5)}.tf-kladd .d6{--dd:var(--d6)}

/* Steg 4 Sammendrag og fullføring: inn 8-26 % av Fullført, Fullfør trykkes 30 %, dialog 35-45 %, bekreft 50 %, kvittering 58-68 %, Oversikt 78-92 % */
.tf-steg4{transform:translateX(calc((1 - var(--steg4Inn)) * 100%))}
.tf-kontroll div{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--linje-svak);font-size:14px}
.tf-kontroll div:last-child{border-bottom:0}
.tf-kontroll span:last-child{color:var(--grey)}
.tf-ok{width:18px;height:18px;border-radius:50%;background:var(--ok);position:relative}
.tf-ok::after{content:"";position:absolute;left:6px;top:3px;width:4px;height:8px;border-right:2px solid var(--card);border-bottom:2px solid var(--card);transform:rotate(45deg)}
.tf-linjer div{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--linje-svak);font-size:14px}
.tf-linjer div b{font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}
.tf-linjer div.tot{border-top:2px solid var(--ink);border-bottom:0;margin-top:4px;padding-top:10px;font-size:16px}
.tf-linjer div.tot b{font-family:var(--font-display);font-size:24px;line-height:1}
.tf-linjer div.mva{border-bottom:0;padding-top:0;color:var(--grey);font-size:13px}
.tf-linjer div.mva b{font-weight:500}
/* Sumbaren: opp 5-20 % av Målt, borte når Oversikt tar over */
.tf-sumbar{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:12px;height:76px;padding:0 16px;background:var(--pd-flate);border-top:2px solid var(--pd-tekst);opacity:calc(var(--sbInn) * (1 - var(--ovInn)) * (1 - var(--kam) + var(--kamUt)) * (1 - var(--tegneInn) + var(--tegneUt)));transform:translateY(calc((1 - var(--sbInn)) * 100%))}
.tf-sumbar > div:first-child{display:flex;flex-direction:column;min-width:0}
.tf-total{font-family:var(--font-display);font-size:24px;font-weight:600;line-height:1.1;white-space:nowrap;font-variant-numeric:tabular-nums}
.tf-mva{font-size:11px;color:var(--grey);white-space:nowrap}
.tf-sb-kn{display:flex;gap:8px;flex:none}
.tf-sumbar .tf-kn-primar{--trykk:calc(var(--fullTrykk) * (1 - var(--dlg)))}
.tf-sumbar .neste{opacity:calc(1 - var(--steg4Inn))}.tf-sumbar .fullfor{opacity:var(--steg4Inn)}
.tf-dialog-bak{position:absolute;inset:0;background:var(--ink);opacity:calc(.45 * (var(--dlg) - var(--dlgUt) * var(--dlg)))}
.tf-dialog{position:absolute;left:16px;right:16px;top:50%;padding:20px 18px 16px;border-radius:var(--pd-radius);background:var(--card);opacity:calc(var(--dlg) * (1 - var(--dlgUt)));transform:translateY(-50%) scale(calc(.96 + .04 * var(--dlg)))}
.tf-dialog h3,.tf-kvitt h3{margin:0 0 12px;font-family:var(--font-display);font-weight:600;font-size:24px;line-height:1.1}
.tf-dialog p{margin:12px 0 0;font-size:14px;line-height:1.4;color:var(--grey)}
.tf-fakta div{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px solid var(--linje-svak);font-size:14px}
.tf-fakta div span{color:var(--grey)}
.tf-fakta div b{font-weight:600;text-align:right}
.tf-fakta div.stor b{font-family:var(--font-display);font-size:22px}
.tf-dialog-kn{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}
.tf-kn-primar.bekreft{--trykk:var(--bekreftTrykk)}
.tf-kvitt{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px;text-align:center;background:var(--bg);opacity:calc(var(--kvitt) * (1 - var(--ovInn)));transform:scale(calc(.98 + .02 * var(--kvitt)))}
.tf-kvitt-ok{width:48px;height:48px;border-radius:50%;background:var(--ok);position:relative}
.tf-kvitt-ok::after{content:"";position:absolute;left:17px;top:10px;width:10px;height:20px;border-right:3px solid var(--card);border-bottom:3px solid var(--card);transform:rotate(45deg)}
.tf-kvitt h3{margin:0}
.tf-kvitt-under{margin:0;font-size:14px;color:var(--grey)}
.tf-kvitt .tf-fakta{width:100%;text-align:left}
.tf-kvitt .tf-kn-primar{min-width:120px}
.tf-kvitt-fot{margin:0;font-size:12px;color:var(--grey)}
.tf-oversikt{transform:translateX(calc((1 - var(--ovInn)) * 100%))}
.tf-ov-rad{margin:0 16px;padding:14px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.tf-ov-topp{display:flex;align-items:center;justify-content:space-between}
.tf-ov-nr{font-family:var(--font-etikett);font-size:13px;letter-spacing:.04em;color:var(--grey)}
.tf-st{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:var(--pd-radius);font-family:var(--font-etikett);font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase}
.tf-st.klart{background:var(--pd-flate);border:1px solid var(--ink);color:var(--ink)}
.tf-ov-adr{margin-top:6px;font-size:18px;font-weight:600}
.tf-ov-kunde{margin-top:2px;font-size:14px;color:var(--grey)}
.tf-ov-sum{margin-top:10px;font-family:var(--font-display);font-size:28px;font-weight:600;line-height:1}
.tf-ov-kn{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}

/* Statisk reserve: ni steg under hverandre, hver skjerm i hvile. Vises uten .anim. Aktene følger --t der også. */
.bf-fallback{display:block}
.anim .bf-fallback{display:none}
.bf-fb-steg{--luft:var(--ms-scene-luft);position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);column-gap:var(--beffen-rom-8);align-items:center;padding:var(--luft);box-sizing:border-box;scroll-margin-top:var(--ms-stegrekke-h);background:var(--pd-tekst);color:var(--pd-petrol-tekst);overflow:hidden}
.bf-fb-steg > *{position:relative}
.bf-fb-steg .bf-bak-foto,.bf-fb-steg .bf-bak-kobber{position:absolute}
.bf-fb-steg .bf-ark{grid-column:1;justify-self:end;max-width:var(--bf-tekst-bredde);opacity:1;transform:none}
.bf-fb-steg .tf{grid-column:2;--k:1;height:calc(var(--bf-skjerm-h) * .82)}
.bf-fb-steg .bf-fakta{grid-column:3}
.bf-fb-steg .bf-fakt{opacity:1;transform:none}

/* Avslutning */
.bf-slutt{padding:var(--ms-luft-seksjon) 0;background:var(--pd-bg)}
.bf-slutt-setning{margin:0 0 var(--beffen-rom-6);max-width:30ch;font-family:var(--font-display);font-weight:600;font-size:clamp(28px,3.6vw,44px);line-height:1.05;letter-spacing:0;color:var(--pd-tekst);text-wrap:balance}
.bf-slutt-knapper{display:flex;flex-wrap:wrap;gap:var(--beffen-rom-3)}

/* Mobil: teksten over skjermen, én kolonne, skjermen så høy som plassen tillater. Faktalinjen er desktop. */
@media (max-width:759px){
  .bf-scene,.bf-fb-steg{--luft:var(--ms-scene-luft-mobil)}
  .bf-fast,.bf-fb-steg{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);row-gap:var(--beffen-rom-4);align-items:start;justify-items:center;padding:var(--beffen-rom-4) var(--luft) var(--luft)}
  .bf-tekst,.bf-fb-steg .bf-ark{grid-column:1;grid-row:1;justify-self:stretch;max-width:none;min-height:8.6em}
  .bf-fast .tf,.bf-fb-steg .tf{grid-column:1;grid-row:2;justify-self:center;--k:min(1,tan(atan2(100vw - 2 * var(--luft),var(--bf-skjerm-b))))}
  .bf-fakta{display:none}
  .bf-stempel{margin-bottom:var(--beffen-rom-2);font-size:var(--bf-stempel-mobil)}
  .bf-setning{font-size:var(--bf-setning-mobil);font-weight:600;line-height:1.35}
  .bf-ark.a0{transform:translateY(calc(-16px * var(--b1e)))}
  .bf-ark.a1{transform:translateY(calc(16px * (1 - var(--b1e)) - 16px * var(--b2e)))}
  .bf-ark.a2{transform:translateY(calc(16px * (1 - var(--b2e)) - 16px * var(--b3e)))}
  .bf-ark.a3{transform:translateY(calc(16px * (1 - var(--b3e)) - 16px * var(--b4e)))}
  .bf-ark.a4{transform:translateY(calc(16px * (1 - var(--b4e)) - 16px * var(--b5e)))}
  .bf-ark.a5{transform:translateY(calc(16px * (1 - var(--b5e)) - 16px * var(--b6e)))}
  .bf-ark.a6{transform:translateY(calc(16px * (1 - var(--b6e)) - 16px * var(--b7e)))}
  .bf-ark.a7{transform:translateY(calc(16px * (1 - var(--b7e)) - 16px * var(--b8e)))}
  .bf-ark.a8{transform:translateY(calc(16px * (1 - var(--b8e))))}
  .bf-fb-steg{row-gap:var(--beffen-rom-4);padding:var(--beffen-rom-6) var(--luft)}
  .bf-fb-steg .bf-ark{min-height:0}
  .bf-fb-steg .tf{height:calc(var(--bf-skjerm-h) * var(--k) * .7)}
  .bf-slutt-knapper .ms-kn{flex:1 1 100%}
}
@media (max-width:759px) and (max-height:700px){
  .bf-scene{--luft:24px}
  .bf-fast{row-gap:var(--beffen-rom-2);padding-top:var(--beffen-rom-3)}
  .bf-stempel{font-size:36px}
  .bf-tekst{min-height:7.6em}
}