/* Bevr v2 — komponentlag: chat-løkke, feature-kort, ROI-kort, kunder,
   kontaktskjema og subside-blokker. Alt token-drevet så begge tema virker. */

:root{
  --ease:cubic-bezier(.22,.61,.21,1);
  --hv-frame:#10152E;
  --hv-card:#1A2142;
  --hv-line:rgba(237,238,243,.12);
  --hv-mute:#9BA1B5;
  --accent-faint:rgba(248,210,140,.1);
  /* Ytterkanten på et kort trenger mer enn hårstrekene inni det. På mørk
     grunn gjør skyggen mesteparten av jobben; på hvit grunn finnes det ingen
     skygge å se, så der er det kanten som holder kortet fra å flyte ut. */
  --hv-frame-line:rgba(237,238,243,.15);
  --hv-frame-shadow:0 24px 80px rgba(0,0,0,.3);
}
[data-theme="lys"]{
  --hv-frame:#F4F5F7;
  --hv-card:#FFFFFF;
  --hv-line:#E8E9ED;
  --hv-mute:#5E6472;
  --accent-faint:#FDF6EA;
  --hv-frame-line:#DFE3EB;
  --hv-frame-shadow:0 20px 56px rgba(11,16,35,.10), 0 2px 8px rgba(11,16,35,.05);
}

/* ================= hero: app-vindu rundt chat-løkka ================= */
.hv-frame{
  width:min(880px,84vw);
  margin:0 auto;
  background:var(--hv-frame);
  border:1px solid var(--hv-line);
  border-radius:20px;
  box-shadow:0 24px 80px rgba(0,0,0,.35);
  overflow:hidden;
}
[data-theme="lys"] .hv-frame{box-shadow:0 24px 80px rgba(11,16,35,.14)}
.hv-chrome{
  display:flex;align-items:center;gap:6px;
  padding:13px 18px;border-bottom:1px solid var(--hv-line);
}
.hv-chrome span{width:10px;height:10px;border-radius:50%;background:var(--hv-line)}
.hv-chrome b{
  margin-left:10px;font-family:'IBM Plex Mono',monospace;font-weight:400;
  font-size:11px;letter-spacing:.06em;color:var(--hv-mute);
}
.hv-body{padding:34px 30px;display:flex;justify-content:center}
.hv-frame--phone{width:min(360px,90vw)}
.hv-frame--phone .hv-body{padding:24px 18px}

/* ================= chat-løkka (portert fra v1, token-farger) ================= */
.hv{position:relative;width:min(404px,100%);height:430px}
.hv-el{
  position:absolute;left:0;right:0;
  opacity:0;transform:translateY(16px);
  transition:opacity .55s var(--ease),transform .55s var(--ease);
  will-change:opacity,transform;
}
.hv-stack{position:absolute;left:0;right:0;top:0;display:flex;flex-direction:column;gap:20px}
.hv-stack>.hv-el{position:static}
.hv-el.show{opacity:1;transform:translateY(0)}
.hv-el.gone{opacity:0;transform:translateY(-16px);pointer-events:none}
.hv-el.right{display:flex;flex-direction:column;align-items:flex-end}

.hv-label{font-size:13.5px;color:var(--hv-mute);margin-bottom:8px}
.bubble{
  display:inline-flex;align-items:center;gap:11px;
  background:var(--hv-card);border-radius:10px;
  box-shadow:0 4px 18px rgba(0,0,0,.18);
  padding:15px 18px;font-size:15px;color:var(--contrast);
  width:max-content;max-width:100%;
}
.bubble .avatar{
  width:28px;height:28px;border-radius:50%;flex:none;
  display:grid;place-items:center;overflow:hidden;
  background:var(--contrast);color:var(--ground);
  font-family:'Schibsted Grotesk',sans-serif;font-weight:600;font-size:12.5px;
}
.bubble .avatar.foto{background:none;box-shadow:0 0 0 1.5px var(--hv-line)}
.bubble .avatar.foto img{width:100%;height:100%;object-fit:cover;display:block}
.bubble.accent{background:var(--accent);color:var(--on-accent);box-shadow:0 10px 26px var(--accent-shadow)}
.bubble.accent .avatar{background:var(--on-accent);color:var(--accent)}
.bubble .txt{min-height:1.4em}
.caret-blink::after{content:'';display:inline-block;width:1.5px;height:1em;background:currentColor;margin-left:2px;vertical-align:-2px;animation:hvBlink .9s steps(1) infinite}
@keyframes hvBlink{50%{opacity:0}}

.qcard{background:var(--hv-card);border-radius:10px;box-shadow:0 4px 18px rgba(0,0,0,.18);padding:18px 20px;color:var(--contrast)}
.qcard-head{display:flex;align-items:center;justify-content:space-between;font-weight:550;font-size:15px}
.spin{
  width:16px;height:16px;border-radius:50%;flex:none;
  border:2px solid var(--hv-line);border-top-color:var(--contrast);
  animation:hvSpin 1s linear infinite;
}
@keyframes hvSpin{to{transform:rotate(360deg)}}
.checks{list-style:none;margin-top:6px}
.checks li{
  display:flex;align-items:center;gap:10px;
  padding:9px 2px;font-size:14px;color:var(--hv-mute);
  opacity:0;transform:translateY(6px);
  transition:opacity .4s var(--ease),transform .4s var(--ease);
}
.checks li.on{opacity:1;transform:translateY(0)}
.checks .ck{width:18px;height:18px;border-radius:50%;flex:none;background:var(--accent);display:grid;place-items:center}
.checks .ck svg{width:9px;height:9px;stroke:var(--on-accent)}

.fcard{background:var(--hv-card);border-radius:10px;box-shadow:0 10px 34px rgba(0,0,0,.22);padding:24px;color:var(--contrast)}
.fcard h4{font-size:16px;margin-bottom:16px;font-weight:600}
.fld{margin-bottom:12px}
.fld label{display:block;font-size:11px;color:var(--hv-mute);margin-bottom:5px;font-family:'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.07em}
.fld .box{border:1px solid var(--hv-line);border-radius:7px;padding:9px 12px;font-size:14px;min-height:38px;transition:border-color .3s}
.fld.active .box{border-color:var(--contrast)}
.fcard .send{
  width:100%;margin-top:8px;background:var(--accent);color:var(--on-accent);
  border:none;border-radius:999px;padding:12px;display:flex;justify-content:center;align-items:center;
  overflow:hidden;cursor:pointer;transition:background .25s var(--ease);
}
.fcard .send:hover{background:var(--accent-2)}
.fcard .send svg{transition:transform .35s var(--ease),opacity .35s}
.fcard .send.go svg{transform:translateX(160px);opacity:0}

.rcard{background:var(--hv-card);border-radius:10px;box-shadow:0 10px 34px rgba(0,0,0,.22);padding:24px;color:var(--contrast)}
.rcard-top{display:flex;align-items:center;gap:12px;margin-bottom:6px}
.rcard-top .logo{
  width:34px;height:34px;border-radius:9px;background:var(--accent);color:var(--on-accent);
  display:grid;place-items:center;flex:none;
  font-family:'Schibsted Grotesk',sans-serif;font-weight:600;font-size:15px;letter-spacing:-.04em;
}
.rcard-top b{display:block;font-size:15px}
.rcard-top span{font-size:12.5px;color:var(--hv-mute)}
.rcard .desc{font-size:14px;color:var(--hv-mute);margin:8px 0 14px}
.rgraf{background:var(--accent-faint);border-radius:10px;padding:16px;display:flex;align-items:center;gap:16px}
.rgraf svg{flex:1;min-width:0}
.rgraf .pct{font-family:'Schibsted Grotesk',sans-serif;font-weight:600;font-size:26px;letter-spacing:-.03em}
.rgraf .pct small{display:block;font-size:11.5px;color:var(--hv-mute);font-weight:400;font-family:'Inter',sans-serif;letter-spacing:0}
.rcard .accept{width:100%;margin-top:14px;background:var(--contrast);color:var(--ground);border:none;border-radius:999px;padding:12px;font-size:14.5px;font-weight:500;cursor:pointer}
.rcard .accept:hover{opacity:.9}
.spark-line{fill:none;stroke:var(--accent-line);stroke-width:2.5;stroke-linecap:round}
.spark-fill{opacity:0}
.spark-line.draw{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);animation:hvDraw 1.4s var(--ease) forwards}
.spark-line.draw+.spark-fill{animation:hvFadein .8s .8s var(--ease) forwards}
@keyframes hvDraw{to{stroke-dashoffset:0}}
@keyframes hvFadein{to{opacity:1}}

/* ================= verdi-bånd: klientnavn i stedet for logoer ================= */
.bv-clients{flex-wrap:wrap;max-width:1000px;margin-left:auto!important;margin-right:auto!important}
.bv-clients span{
  font-family:'Schibsted Grotesk',sans-serif;font-weight:600;font-size:19px;
  letter-spacing:-.02em;opacity:.45;white-space:nowrap;
}

/* ================= feature-kort (erstatter videoene) =================
   Hentet direkte fra originalens egen regel (capital/css/main.css), ikke
   gjettet fram: rammen bor på det STICKY SKALLET (.features_sticky__1_L9P)
   akkurat som i Capital, med POSITIVT `margin-bottom:12.5vh` — ikke en delt
   ::before-ramme med negativ margin. Den forrige runden fant på en delt
   ramme for å løse ghosting, og en negativ bunnmarg (-87.5vh) for å gi den
   null flythøyde. Det var feil på to vis:
   1) Ghosting løses allerede av at inaktive `.features_main` får
      `visibility:hidden` fra JS (`applyStyles`) — de fire skallene ligger
      allerede oppå hverandre (samme geometri, se under), og bare det synlige
      skallet har innhold. En delt ramme var overflødig.
   2) En sticky-boks med ~0 i margin-boks-høyde (fra den negative marginen)
      gir en udefinert/for sen slippe-grense i nettlesere: kortet fortsatte å
      henge igjen langt inn i NESTE seksjon når man scrollet forbi siste kort.
      Med ORIGINALENS positive marg blir slippet definert av ekte geometri:
      hvert kort er sticky innenfor sin egen `.features_main` (som er
      `position:absolute;inset:0` og dermed like høy som HELE stack-seksjonen,
      identisk for alle fire kort — det er derfor stacking i det hele tatt
      fungerer: alle fire skall deler nøyaktig samme rektangel). Med
      margin-boks 100vh (7.5+80+12.5) slipper og fullfører kortet å gli ut av
      syne godt innenfor seksjonens egen høyde (250vh), uten å blø inn i det
      som kommer etter. */
.features_main__xNgmA .features_sticky__1_L9P{
  background-color:var(--hv-frame);
  border:1px solid var(--hv-frame-line);border-radius:1rem;
  box-shadow:var(--hv-frame-shadow);
}
@media (min-width:769px){
  .features_main__xNgmA .features_sticky__1_L9P{margin:7.5vh 0 12.5vh}
}
@media (max-width:768px){
  /* Capital låste skallene til videohøyder (250px/320px per posisjon) fordi
     innholdet var video. Kortene våre er tekst og trenger ~460px, så alt
     under grafen falt utenfor rammen. Her vokser kortet med innholdet i
     stedet — og da må skall og innmat ut av den absolutte plasseringen.
     Selektorene trenger tre klasser for å slå templatens :nth-child-regler. */
  .features_stack__HY1Kb .features_main__xNgmA .features_sticky__1_L9P{height:auto}
  .features_stack__HY1Kb .features_sticky__1_L9P .features_video__Gtgf4,
  .features_stack__HY1Kb .features_sticky__1_L9P>.feature-card{
    position:relative;height:auto;
  }
  .features_stack__HY1Kb .fc-inner{position:relative;inset:auto}
}
/* selve videoerstatningen (feature-card/features_video__Gtgf4) fyller
   skallet og skal ikke ha egen bakgrunn — rammen bor på skallet, ikke her */
.features_sticky__1_L9P .features_video__Gtgf4{background:none;border:0;box-shadow:none}
.fc-inner{
  position:absolute;inset:0;
  /* Innholdet skifter som ÉN blokk. Blur under skiftet er nøkkelen: uten den
     ser man to distinkte kort overlappe i krysfaden, og hjernen leser det som
     at et nytt bilde lastes. Blur binder tilstandene sammen til én bevegelse.
     Ut går raskere enn inn (systemet svarer raskt, brukeren venter kort). */
  opacity:0;transform:translateY(14px);filter:blur(6px);
  transition:opacity 140ms cubic-bezier(.23,1,.32,1),
             transform 140ms cubic-bezier(.23,1,.32,1),
             filter 140ms cubic-bezier(.23,1,.32,1);
}
.fc-inner.fc-on{
  opacity:1;transform:none;filter:blur(0);
  transition:opacity 280ms cubic-bezier(.23,1,.32,1) 120ms,
             transform 340ms cubic-bezier(.23,1,.32,1) 120ms,
             filter 240ms cubic-bezier(.23,1,.32,1) 120ms;
}
@media (prefers-reduced-motion:reduce){
  .fc-inner{transition:opacity 120ms linear!important;transform:none!important;filter:none!important}
}
/* Kort utenfor en stack (undersidenes sub-hero) styres ikke av initStack, så
   de får aldri .fc-on og må nulle ut HELE utgangstilstanden selv. Blur-en kom
   til etter dette unntaket ble skrevet, og sto igjen: kortet lå 6px uskarpt
   på alle fire undersidene. Legger du en ny egenskap i .fc-inner må den
   nulles her også. */
.bv-sub-hero-media .fc-inner,
.bv-sub-hero-media .fc-inner>*{opacity:1;transform:none;filter:none}
/* ================= kunder: editorial sitatkolonner (ikke kort) ================= */
.bv-tcard{
  border-top:1px solid var(--glow-20);
  padding:28px 4px 0;
  display:flex;flex-direction:column;gap:20px;
  min-height:340px;
  text-align:left;
}
.founders_content__g_5EX .bv-tcard .bv-fig b{
  display:block;
  font-family:'Schibsted Grotesk',sans-serif;font-weight:500;
  font-size:clamp(40px,4.4vw,64px);letter-spacing:-.03em;line-height:1;
  color:var(--contrast)!important; /* founders.css setter grå tekst i gridet */
}
.founders_content__g_5EX .bv-tcard .bv-fig span{
  display:block;margin-top:8px;
  font-family:'IBM Plex Mono',monospace;font-size:11px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);
}
.bv-tcard blockquote{
  margin:0;flex:1;
  font-family:'Schibsted Grotesk',sans-serif;font-weight:500;
  font-size:20px;line-height:1.42;letter-spacing:-.01em;
  color:var(--contrast);
}
.bv-tcard .bv-who{border-top:1px solid var(--glow-10);padding-top:14px}
.founders_content__g_5EX .bv-tcard .bv-who b{display:block;font-size:14.5px;color:var(--contrast)!important}
.founders_content__g_5EX .bv-tcard .bv-who span{display:block;font-size:12px;color:var(--text-3);margin-top:2px;font-family:'IBM Plex Mono',monospace}

/* ================= kontakt ================= */
.bv-kontakt{padding:8rem 2rem;display:flex;justify-content:center}
.bv-kontakt-inner{
  width:100%;max-width:1160px;
  display:grid;grid-template-columns:1.35fr 1fr;gap:56px;align-items:start;
}
.bv-kicker-mono{
  display:block;font-family:'IBM Plex Mono',monospace;font-weight:400;
  font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-3);
  margin-bottom:18px;
}
.bv-kontakt-form h3{font-size:clamp(32px,4vw,52px);font-weight:500;letter-spacing:-.022em;line-height:1.1}
.bv-lead{color:var(--text-2);margin:18px 0 34px;max-width:52ch;line-height:1.6}
.bv-fgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.bv-inp.full{grid-column:1/-1}
.bv-inp label{
  display:block;font-family:'IBM Plex Mono',monospace;font-size:11px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);margin-bottom:7px;
}
.bv-inp input,.bv-inp select,.bv-inp textarea{
  width:100%;background:var(--surface-2);color:var(--contrast);
  border:1px solid var(--line-strong);border-radius:10px;
  padding:12px 14px;font-size:15px;font-family:Inter,sans-serif;
  transition:border-color .25s var(--ease);
}
.bv-inp input:focus,.bv-inp select:focus,.bv-inp textarea:focus{outline:none;border-color:var(--accent-line)}
.bv-inp textarea{min-height:120px;resize:vertical}
.bv-submit{margin-top:26px}
.bv-submit .glow_container__QRnt1{padding:14px 26px}
.bv-fine{display:block;margin-top:16px;font-size:12.5px;color:var(--text-3);font-family:Inter,sans-serif;line-height:1.5;max-width:52ch}

.bv-kontakt-side{position:sticky;top:110px}
.bv-deliver{list-style:none;margin-top:8px;display:flex;flex-direction:column}
.bv-deliver li{
  display:flex;gap:14px;align-items:flex-start;
  font-size:15px;color:var(--text-2);line-height:1.5;
  border-top:1px solid var(--glow-10);padding:14px 0;
}
.bv-deliver li:first-child{border-top:none;padding-top:0}
.bv-deliver .dk{
  width:18px;height:18px;border-radius:50%;flex:none;margin-top:2px;
  background:var(--accent);display:grid;place-items:center;
}
.bv-deliver .dk svg{width:9px;height:9px;stroke:var(--on-accent)}
.bv-note{margin-top:24px;border-top:1px solid var(--line-strong);padding-top:18px;font-size:13px;color:var(--text-3)}
.bv-note a{color:var(--text-2)}
.bv-note a:hover{color:var(--contrast)}

@media only screen and (max-width:900px){
  .bv-kontakt{padding:5rem 1.25rem}
  .bv-kontakt-inner{grid-template-columns:1fr;gap:36px}
  .bv-kontakt-side{position:static}
  .bv-fgrid{grid-template-columns:1fr}
}

/* ================= subsider ================= */
.bv-sub-hero{
  margin-bottom:0!important;   /* forsidens -40vh-overlapp gjelder ikke her */
  padding:40px 0 90px;
}
.bv-sub-hero h1{font-size:clamp(44px,6.5vw,96px)}
.bv-sub-lead{
  display:block;text-align:center;color:var(--text-2);
  max-width:62ch;margin:6px auto 0;padding:0 24px;
  font-size:clamp(15.5px,1.8vw,18.5px);line-height:1.6;
}
.bv-sub-cta{display:flex;justify-content:center;margin-top:10px}
@media only screen and (max-width:600px){
  .bv-sub-hero .intro_subscribe___gfBH .glow_text___Rtyx{font-size:10px;letter-spacing:.04em}
  .bv-sub-hero h1{font-size:clamp(34px,10vw,44px)}
}

.bv-cta-head{
  font-size:clamp(26px,3.4vw,44px);font-weight:500;letter-spacing:-.02em;
  text-align:center;max-width:20ch;margin:0 auto 3rem;line-height:1.15;
}

.bv-sub-hero-media{margin-top:48px}
.bv-sub-hero-media .feature-card{
  position:relative;width:min(880px,86vw);height:520px;
  margin:0 auto;border-radius:20px;overflow:hidden;
  background-color:var(--hv-frame);
  border:1px solid var(--hv-frame-line);
  box-shadow:var(--hv-frame-shadow);
}
@media only screen and (max-width:768px){
  .bv-sub-hero-media .feature-card{height:420px}
}
/* Sub-heroen viser det samme kortet i liggende format (878x518 mot stakkens
   576x720). Den stående komposisjonen renner over her — og lar høyre halvdel
   stå tom. Samme innhold, to kolonner: påstanden til venstre (etikett, tall,
   fotnote), beviset til høyre (graf, rader). */
@media only screen and (min-width:769px){
  .bv-sub-hero-media .fc-inner{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    grid-template-rows:auto minmax(0,1fr) auto;
    column-gap:clamp(32px,5vw,72px);
    padding:clamp(34px,3.4vw,46px);
  }
  .bv-sub-hero-media .fc-kicker{grid-area:1/1}
  .bv-sub-hero-media .fc-hero{grid-area:2/1;align-self:start;margin-top:clamp(20px,3vh,32px)}
  .bv-sub-hero-media .fc-note{grid-area:3/1;align-self:end;margin:0}
  .bv-sub-hero-media .fc-graf{
    grid-area:2/2;align-self:end;flex:none;
    height:clamp(88px,15vh,136px);margin:0 0 clamp(18px,2.4vh,28px);
  }
  .bv-sub-hero-media .fc-rows{grid-area:3/2;margin:0}
}

.bv-band{padding:9rem 2rem;text-align:center}
.bv-band h2{font-size:clamp(44px,6.5vw,84px);line-height:1.05}
.bv-band h4{
  font-size:clamp(18px,2.4vw,24px);font-weight:400;color:var(--text-2);
  max-width:56ch;margin:26px auto 0;line-height:1.5;
}
.bv-band .bv-kicker-mono{margin-bottom:24px}

.bv-cards{padding:6rem 2rem;display:flex;flex-direction:column;align-items:center;gap:48px}
.bv-cards-head{text-align:center;max-width:820px}
.bv-cards-head h3{font-size:clamp(34px,4.6vw,60px);line-height:1.08}
.bv-cards-head p{color:var(--text-2);margin-top:18px;line-height:1.6;max-width:60ch;margin-left:auto;margin-right:auto}
.bv-cardgrid{
  width:100%;max-width:1160px;
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
}
.bv-cardgrid.three{grid-template-columns:repeat(3,1fr);max-width:1000px}
.bv-card{
  background:var(--surface-1);border:1px solid var(--glow-10);
  border-radius:16px;padding:26px;
  display:flex;flex-direction:column;gap:12px;min-height:210px;
}
.bv-card .bv-num{
  font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--text-3);letter-spacing:.08em;
}
.bv-card b{font-family:'Schibsted Grotesk',sans-serif;font-weight:600;font-size:19px;letter-spacing:-.015em;line-height:1.25}
.bv-card p{font-size:14px;color:var(--text-2);line-height:1.55;margin:0}
@media only screen and (max-width:1000px){
  .bv-cardgrid{grid-template-columns:repeat(2,1fr)}
  .bv-cardgrid.three{grid-template-columns:1fr}
}
@media only screen and (max-width:600px){
  .bv-cardgrid{grid-template-columns:1fr}
}

/* ================= tall-bånd ================= */
.bv-tall{gap:0}
.bv-tall-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  width:min(1100px,92vw);margin:0 auto;
  border-top:1px solid rgba(11,16,35,.14);
}
[data-theme="lys"] .bv-tall-grid{border-color:rgba(237,238,243,.16)}
.bv-tall-item{
  padding:44px 20px;text-align:center;
  border-bottom:1px solid rgba(11,16,35,.14);
}
[data-theme="lys"] .bv-tall-item{border-color:rgba(237,238,243,.16)}
.bv-tall-item b{
  display:block;font-family:'Schibsted Grotesk',sans-serif;font-weight:500;
  font-size:clamp(38px,4.6vw,64px);letter-spacing:-.03em;line-height:1;
  font-variant-numeric:tabular-nums;
}
.bv-tall-item>span{
  display:block;margin-top:10px;
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  opacity:.55;
}
@media only screen and (max-width:768px){
  .bv-tall-grid{grid-template-columns:1fr 1fr}
  .bv-tall-item{padding:28px 12px}
}

/* ================= FAQ (minimal) ================= */
.bv-faq{padding:7rem 2rem 3rem;display:flex;flex-direction:column;align-items:center}
.bv-faq-list{width:min(820px,92vw);margin-top:14px}
.bv-faq-list details{border-top:1px solid var(--glow-10)}
.bv-faq-list details:last-child{border-bottom:1px solid var(--glow-10)}
.bv-faq-list summary{
  list-style:none;cursor:pointer;
  display:flex;justify-content:space-between;align-items:center;gap:20px;
  padding:26px 4px;
  font-family:'Schibsted Grotesk',sans-serif;font-weight:500;
  font-size:clamp(19px,2.4vw,25px);letter-spacing:-.015em;
}
.bv-faq-list summary::-webkit-details-marker{display:none}
.bv-fi{
  position:relative;width:16px;height:16px;flex:none;opacity:.6;
}
.bv-fi::before,.bv-fi::after{
  content:'';position:absolute;background:currentColor;border-radius:2px;
  transition:transform .3s var(--ease);
}
.bv-fi::before{left:0;right:0;top:7px;height:2px}
.bv-fi::after{top:0;bottom:0;left:7px;width:2px}
details[open] .bv-fi::after{transform:scaleY(0)}
.bv-faq-list details p{
  padding:0 4px 26px;max-width:60ch;
  color:var(--text-2);line-height:1.65;font-size:15.5px;
}

/* ================= undersider: mini-stack + editorial-liste ================= */
.features_stack__HY1Kb.bv-stack-three{height:190vh}
@media only screen and (max-width:768px){
  .features_stack__HY1Kb.bv-stack-three{height:auto}
}

/* «Hva vi gjør» som typografisk liste i invert-bånd */
.bv-editorial{padding-bottom:96px}
.bv-editorial .bv-ed-list{
  list-style:none;width:min(980px,92vw);margin:48px auto 0;text-align:left;
}
.bv-editorial .bv-ed-list li{
  display:grid;grid-template-columns:64px 1fr;gap:8px 28px;
  border-top:1px solid rgba(11,16,35,.14);padding:30px 0;
}
[data-theme="lys"] .bv-editorial .bv-ed-list li{border-color:rgba(237,238,243,.16)}
.bv-editorial .bv-ed-list li:last-child{border-bottom:1px solid rgba(11,16,35,.14)}
[data-theme="lys"] .bv-editorial .bv-ed-list li:last-child{border-color:rgba(237,238,243,.16)}
.bv-ed-num{
  font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.08em;
  opacity:.5;padding-top:8px;
}
.bv-ed-list b{
  display:block;font-family:'Schibsted Grotesk',sans-serif;font-weight:500;
  font-size:clamp(22px,2.8vw,32px);letter-spacing:-.02em;line-height:1.2;
}
.bv-ed-list p{margin:8px 0 0;font-size:15px;line-height:1.55;opacity:.72;max-width:62ch}
@media only screen and (max-width:600px){
  .bv-editorial .bv-ed-list li{grid-template-columns:1fr;gap:4px}
}

/* ================= #hva: 01–06 som tett editorial-liste ================= */
.bv-ed-list--tight li{padding:20px 0}
.bv-ed-list--tight b{font-size:clamp(20px,2.4vw,28px)}

/* ================= #caser: karusell med nettleser-mockups ================= */
.bv-caser{padding:7rem 0 8rem;overflow:hidden}
.bv-caser-head{
  max-width:1160px;margin:0 auto 44px;padding:0 32px;
  display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;
}
.bv-caser-head h2{font-size:clamp(34px,4.6vw,60px);line-height:1.08;max-width:16ch}
.bv-arrows{display:flex;gap:10px}
.bv-arr{
  width:44px;height:44px;border-radius:50%;flex:none;cursor:pointer;
  background:var(--surface-1);border:1px solid var(--glow-20);color:var(--text-2);
  display:grid;place-items:center;transition:color .25s var(--ease),border-color .25s var(--ease);
}
.bv-arr:hover:not(:disabled){color:var(--contrast);border-color:var(--glow-30)}
.bv-arr:disabled{opacity:.35;cursor:default}
/* sporet blør ut mot høyre kant — kort 3 titter fram */
.caro{
  display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;
  padding:0 32px 8px;max-width:1160px;margin:0 auto;
  scrollbar-width:none;-ms-overflow-style:none;
}
.caro::-webkit-scrollbar{display:none}
.bv-case{flex:0 0 min(560px,84%);scroll-snap-align:start}
.bv-browser{
  background:var(--hv-frame);border:1px solid var(--hv-line);
  border-radius:16px 16px 0 0;overflow:hidden;height:400px;
  display:flex;flex-direction:column;
}
.bv-b-top{
  display:flex;align-items:center;gap:7px;padding:12px 16px;
  border-bottom:1px solid var(--hv-line);flex:none;
}
.bv-b-top i{width:9px;height:9px;border-radius:50%;background:var(--hv-line)}
.bv-url{
  margin-left:10px;font-family:'IBM Plex Mono',monospace;font-size:11px;
  letter-spacing:.05em;color:var(--hv-mute);
}
.bv-b-body{padding:22px;display:flex;flex-direction:column;gap:16px;flex:1;min-height:0}
.bv-case-foot{
  display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;
  border-top:1px solid var(--glow-20);padding:16px 2px 0;
}
.bv-case-foot b{font-family:'Schibsted Grotesk',sans-serif;font-weight:500;font-size:19px;letter-spacing:-.02em}
.bv-case-foot span{font-size:13.5px;color:var(--text-3)}

.bv-dash-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.bv-dash-kpi{background:var(--hv-card);border:1px solid var(--hv-line);border-radius:10px;padding:12px}
.bv-dash-kpi span{display:block;font-size:11px;color:var(--hv-mute);font-family:'IBM Plex Mono',monospace;letter-spacing:.04em;text-transform:uppercase}
.bv-dash-kpi b{display:block;font-family:'Schibsted Grotesk',sans-serif;font-weight:500;font-size:21px;margin-top:5px;letter-spacing:-.02em}
.bv-dash-kpi em{
  display:inline-block;font-style:normal;margin-top:6px;
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;
  background:rgba(217,165,75,.18);color:var(--contrast);border-radius:999px;padding:2px 8px;
}
.bv-chart-box{flex:1;min-height:0;background:var(--hv-card);border:1px solid var(--hv-line);border-radius:10px;padding:14px;display:flex}
.bv-chart-box svg{width:100%;height:100%;min-height:80px}

.bv-kan{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;flex:1;min-height:0}
.bv-kan-col>span{
  display:block;font-family:'IBM Plex Mono',monospace;font-size:10px;
  letter-spacing:.06em;text-transform:uppercase;color:var(--hv-mute);margin-bottom:8px;
}
.bv-kan-card{
  background:var(--hv-card);border:1px solid var(--hv-line);border-radius:9px;
  padding:10px;margin-bottom:8px;
}
.bv-kan-card b{display:block;font-size:12.5px;font-weight:500;line-height:1.3}
.bv-kan-card span{display:block;font-size:11px;color:var(--hv-mute);margin-top:4px;font-family:'IBM Plex Mono',monospace}
.bv-kan-card.done{border-color:var(--accent-hair)}
.bv-kan-card.done span{color:var(--accent-text)}

.bv-tbl{display:flex;flex-direction:column;flex:1;min-height:0;justify-content:center}
.bv-tr{
  display:grid;grid-template-columns:1.5fr .7fr .7fr .9fr;gap:10px;align-items:center;
  padding:9px 2px;border-bottom:1px solid var(--hv-line);font-size:12.5px;
}
.bv-tr:last-child{border-bottom:0}
.bv-tr.head span{
  font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--hv-mute);
}
.bv-tr span:not(:first-child){font-family:'IBM Plex Mono',monospace}
.bv-pill{
  font-style:normal;font-family:'IBM Plex Mono',monospace;font-size:10.5px;
  background:rgba(217,165,75,.18);color:var(--contrast);border-radius:999px;padding:3px 9px;white-space:nowrap;
}
.bv-pill.alt{background:transparent;border:1px solid var(--hv-line);color:var(--hv-mute)}

/* ================= #maaling: tre hårstrek-rader ================= */
.bv-maaling{padding:6rem 2rem 7rem;display:flex;flex-direction:column;align-items:center}
.bv-maaling-head{width:min(1160px,100%);margin-bottom:24px}
.bv-maaling-head h2{font-size:clamp(34px,4.6vw,60px);line-height:1.08;max-width:18ch}
.bv-mrow{
  width:min(1160px,100%);
  display:grid;grid-template-columns:64px minmax(0,1fr) minmax(0,440px);
  gap:28px;align-items:center;
  border-top:1px solid var(--glow-10);padding:36px 0;
}
.bv-mrow:last-child{border-bottom:1px solid var(--glow-10)}
.bv-mcopy b{
  display:block;font-family:'Schibsted Grotesk',sans-serif;font-weight:500;
  font-size:clamp(22px,2.8vw,32px);letter-spacing:-.02em;line-height:1.2;
}
.bv-mcopy span{display:block;margin-top:8px;font-size:14.5px;color:var(--text-2)}
.bv-mstage{min-width:0}
@media only screen and (max-width:900px){
  .bv-mrow{grid-template-columns:44px minmax(0,1fr);gap:16px}
  .bv-mstage{grid-column:1/-1;margin-top:18px}
}

.bv-plan{background:var(--hv-card);border:1px solid var(--hv-line);border-radius:14px;padding:20px}
.bv-plan h5{
  display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  font-size:14px;font-weight:600;margin-bottom:14px;
}
.bv-plan h5 em{font-style:normal;font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.05em;color:var(--hv-mute)}
.bv-plan-row{
  display:flex;justify-content:space-between;align-items:baseline;gap:14px;
  padding:9px 0;border-bottom:1px dashed var(--hv-line);font-size:13.5px;
}
.bv-plan-row span{color:var(--hv-mute)}
.bv-plan-row b{font-family:'IBM Plex Mono',monospace;font-weight:500}
.bv-plan-row.total{border-bottom:0;padding-top:14px;border-top:1px solid var(--hv-line);margin-top:6px}
.bv-plan-row.total b{color:var(--accent-text);font-size:19px}

/* terminal: ren CSS-stagger, linjene «skrives ut» når .rv får .in */
.term{
  background:var(--surface-3);border:1px solid var(--glow-10);border-radius:14px;
  padding:16px 18px;font-family:'IBM Plex Mono',monospace;font-size:12.5px;line-height:1.85;
}
.term .t-head{display:flex;gap:7px;margin-bottom:10px}
.term .t-head i{width:9px;height:9px;border-radius:50%;background:var(--glow-20)}
.term .ln{opacity:0;transition:opacity .35s var(--ease);color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.term .p{color:var(--text-3)}
.term .dim{color:var(--text-3);opacity:.7}
.term .ok{color:var(--accent-line)}
.rv.in .term .ln:nth-child(2){transition-delay:.15s;opacity:1}
.rv.in .term .ln:nth-child(3){transition-delay:.5s;opacity:1}
.rv.in .term .ln:nth-child(4){transition-delay:.85s;opacity:1}
.rv.in .term .ln:nth-child(5){transition-delay:1.2s;opacity:1}
.rv.in .term .ln:nth-child(6){transition-delay:1.55s;opacity:1}
.rv.in .term .ln:nth-child(7){transition-delay:1.9s;opacity:1}

.bv-notifs{display:flex;flex-direction:column;gap:10px}
.bv-notif{
  display:flex;align-items:flex-start;gap:12px;
  background:var(--surface-1);border:1px solid var(--glow-10);border-radius:12px;padding:13px 15px;
}
.bv-notif.warn{border-color:var(--accent-hair)}
.bv-nico{
  width:26px;height:26px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--glow-10);font-size:12px;color:var(--text-2);
}
.bv-notif.warn .bv-nico{background:var(--accent-soft);color:var(--accent-text)}
.bv-notif b{display:block;font-size:13.5px;font-weight:500}
.bv-notif div span{display:block;font-size:12.5px;color:var(--text-3);margin-top:2px}
.bv-notif em{
  margin-left:auto;font-style:normal;font-family:'IBM Plex Mono',monospace;
  font-size:10.5px;color:var(--text-3);white-space:nowrap;
}

/* ================= #passer: kvalifisering i invert-bånd ================= */
.bv-sitgrid{
  width:min(1000px,92vw);margin:44px auto 0;
  display:grid;grid-template-columns:1fr 1fr;gap:0 40px;text-align:left;
}
@media only screen and (max-width:760px){.bv-sitgrid{grid-template-columns:1fr}}
.bv-sit{
  display:flex;gap:14px;align-items:flex-start;
  border-top:1px solid rgba(11,16,35,.14);padding:18px 0;font-size:15px;line-height:1.5;
}
[data-theme="lys"] .bv-sit{border-color:rgba(237,238,243,.16)}
.bv-terskel{
  width:min(1000px,92vw);margin:32px auto 0;text-align:left;
  font-size:15px;line-height:1.6;opacity:.75;
}
.bv-terskel b{opacity:1}

/* ================= Book-knappen: samme form som knappen i bunn-navet =================
   Originalen er en perfekt sirkel (`border-radius:50%`, 58vh/80vw). Bevr bruker
   samme pillform som bunn-navets `.footer_mainButton__c_pnE` (kort, avrundet
   rektangel) i stedet — bare mye større. */
.start_main__8eNiH .start_button__sU1oz{
  width:auto;height:auto;aspect-ratio:auto;
  padding:clamp(28px,4vh,44px) clamp(56px,9vw,96px);
  border-radius:999px;
}
.start_main__8eNiH .start_button__sU1oz h2{font-size:clamp(28px,4vw,44px)}
@media only screen and (max-width:600px){
  .start_main__8eNiH .start_button__sU1oz{width:auto;height:auto;padding:26px 48px}
}

/* ================= #ansvar: seks forpliktelser, kun hårstreker ================= */
.bv-ansvar{padding:6rem 2rem 7rem;display:flex;flex-direction:column;align-items:center}
.bv-ansvar-head{width:min(1160px,100%);margin-bottom:30px}
.bv-ansvar-head h2{font-size:clamp(34px,4.6vw,60px);line-height:1.08;max-width:16ch}
.bv-own{
  width:min(1160px,100%);
  display:grid;grid-template-columns:1fr 1fr;gap:0 48px;
}
@media only screen and (max-width:760px){.bv-own{grid-template-columns:1fr}}
.bv-own-item{
  display:flex;gap:14px;align-items:center;
  border-top:1px solid var(--glow-10);padding:20px 0;
  font-family:'Schibsted Grotesk',sans-serif;font-weight:500;
  font-size:clamp(17px,2vw,21px);letter-spacing:-.015em;
}
.bv-ansvar-slutt{
  margin-top:72px;text-align:center;max-width:22ch;
  font-family:'Schibsted Grotesk',sans-serif;font-weight:500;
  font-size:clamp(26px,3.4vw,44px);letter-spacing:-.02em;line-height:1.15;
}

/* ================= feature-kortenes innmat =================
   Ingen nestede bokser (bokser i bokser er alltid feil), hårstreker og luft
   i stedet for beholdere, én bærende idé per kort.

   Anatomien er LIK på alle kort: kicker → tall → graf → rader → fotnote.
   Kortene bytter på samme plass i stakken, så flytter et element seg mellom
   to kort leses skiftet som en feil. Grafen er derfor obligatorisk og tar
   opp den ledige høyden (`flex:1`) — det er den som gjør at 3-raders og
   4-raders kort fyller de samme 720 pikslene uten dødflate.

   Alt settes med TO klasser. Capitals typeskala treffer
   `._main_main__02_DC p` (0,1,1) og slo `.fc-note` (0,1,0), så fotnoten kom
   ut som 20px mono i stedet for 11px. Samme felle gjelder h1–h3, strong og
   small: sjekk spesifisiteten hver gang et nytt element inn i kortet. */
/* Templatens .features_video__Gtgf4 er absolutt og fyller skallet, og det er
   den .fc-inner (inset:0) måler seg mot. Kortene som ble skrevet uten den
   klassen (mini-stakkene på undersidene) manglet et fyllende skall, så
   innmaten fikk null høyde å fordele. Gi dem samme skall — men ikke rør de
   kortene templaten allerede plasserer. */
.features_sticky__1_L9P>.feature-card:not(.features_video__Gtgf4){position:absolute;inset:0}
.fc-inner{
  display:flex;flex-direction:column;
  padding:clamp(30px,3.4vw,46px);
}
.feature-card .fc-kicker{
  font-family:'IBM Plex Mono',monospace;font-size:11px;line-height:1;
  letter-spacing:.14em;text-transform:uppercase;color:var(--hv-mute);
}

/* hero: ett stort tall bærer kortet */
.feature-card .fc-hero{margin-top:clamp(26px,4.4vh,44px)}
.feature-card .fc-hero b{
  display:block;font-family:'Schibsted Grotesk',sans-serif;font-weight:500;
  font-size:clamp(64px,8.5vw,112px);line-height:.92;letter-spacing:-.045em;
  font-variant-numeric:tabular-nums;color:var(--contrast);
}
/* enheten (x, %, MNOK, mnd) er en egen typografisk størrelse, ikke en
   forminsket versjon av tallet: den skal lese som en etikett ved siden av
   tallet, ikke som et senket siffer. Luften ligger i CSS, ikke som  
   i markupen, så alle fire kortene får nøyaktig samme avstand. */
.feature-card .fc-hero b em{
  font-style:normal;font-size:.24em;font-weight:500;
  letter-spacing:.01em;margin-left:.16em;color:var(--hv-mute);
}
.feature-card .fc-hero b i{font-style:normal}
.feature-card .fc-hero>span{
  display:block;margin-top:16px;font-size:15.5px;line-height:1.45;
  color:var(--text-2);max-width:30ch;
}

/* graf: en tynn strek som spiser den ledige høyden. `non-scaling-stroke`
   holder streken like tynn selv om SVG-en strekkes ulikt i x og y
   (preserveAspectRatio="none"), ellers blir kurven tjukkere jo brattere
   kortet gjør den. */
.feature-card .fc-graf{
  flex:1;min-height:88px;display:flex;align-items:stretch;
  margin-top:clamp(22px,3vh,34px);
}
.feature-card .fc-graf svg{display:block;width:100%;height:100%;overflow:visible}
.fc-spark,.fc-spark-base,.fc-zero,.fc-be{vector-effect:non-scaling-stroke}
.fc-spark{fill:none;stroke:var(--accent-line);stroke-width:2.5;stroke-linecap:round}
.fc-spark-base{fill:none;stroke:var(--hv-mute);stroke-width:1.5;stroke-dasharray:4 5;opacity:.45}
.fc-zero{stroke:var(--hv-line);stroke-width:1.5}
.fc-be{stroke:var(--accent-line);stroke-width:1.5;stroke-dasharray:3 4;opacity:.7}
.fc-draw{stroke-dasharray:420;stroke-dashoffset:420;animation:fcDraw 5.5s cubic-bezier(.23,1,.32,1) infinite}
@keyframes fcDraw{
  0%{stroke-dashoffset:420}
  34%,82%{stroke-dashoffset:0}
  94%,100%{stroke-dashoffset:420}
}

/* radene: hårstreker, ingen bokser */
.feature-card .fc-rows{
  list-style:none;margin-top:clamp(22px,3vh,34px);
  display:flex;flex-direction:column;
}
.feature-card .fc-row{
  display:flex;align-items:baseline;justify-content:space-between;gap:20px;
  padding:13px 0;border-top:1px solid var(--hv-line);
  font-size:14.5px;line-height:1.3;color:var(--text-2);
}
.feature-card .fc-row b{
  font-family:'IBM Plex Mono',monospace;font-weight:500;font-size:14px;
  color:var(--contrast);white-space:nowrap;
}
.feature-card .fc-note{
  margin:clamp(20px,2.6vh,30px) 0 0;
  font-family:'IBM Plex Mono',monospace;font-size:11px;line-height:1.6;
  letter-spacing:.05em;color:var(--hv-mute);
}

@media (max-width:768px){
  .fc-inner{padding:26px 22px}
  .feature-card .fc-hero b{font-size:clamp(48px,13vw,72px)}
  .feature-card .fc-hero>span{font-size:14px}
  .feature-card .fc-graf{min-height:70px}
  .feature-card .fc-row{padding:11px 0;font-size:13.5px}
}

/* Capitals tekstkolonne er `position:fixed;bottom:12.5vh` — festet til
   viewportens BUNN, så den står der hele seksjonen igjennom uansett hvor i
   flyten den egentlig hører hjemme. Den mangler horisontal forankring og
   stoler på at «static position» havner i høyre gridkolonne; hos oss kollapset
   den til viewport-venstre og la seg OPPÅ kortet.
   Runde 6 byttet til `sticky;top:34vh` — det løste plasseringen, men drepte
   teksten: kolonnen er `justify-content:flex-end`, så tekstblokkens statiske
   posisjon ligger ~1900px NED i en 2250px seksjon. Sticky med `top` holder
   bare et element IGJEN når du har rukket det; her rakk du det først helt på
   slutten, så kort 1–3 sto uten tekst.
   Riktig oversettelse er sticky med samme BUNN-anker som originalen: da blir
   blokka dratt opp i syne med én gang (den statiske posisjonen ligger under
   terskelen) og holdt der til seksjonen slipper — uten å kunne rømme ut av
   kolonnen slik `fixed` kunne. */
@media (min-width:769px){
  .features_main__xNgmA .features_content__Dpd5L .features_feature__7MNIW{
    position:sticky;top:auto;bottom:12.5vh;
  }
  /* `overflow:hidden` gjør kolonnen til egen scrollport, og da måler sticky
     seg mot en boks som aldri scroller — altså ingen effekt. `clip` klipper
     likt uten å lage scrollport. */
  .features_main__xNgmA .features_content__Dpd5L{overflow:clip}
}

/* Overskriftene ble klippet i to. Templatens tekstboks er `height:120%` med
   `overflow:hidden` — 120 % av en forelder som bare Capitals eget markup gir
   en definert høyde. Kort 1 har wrapperen (.features_headerContainer__vRSLU,
   to h2-er som krysfader for Eiere/Ledere) og ble riktig; kortene uten den
   fikk en 63px boks rundt en 104px linje, så «AI» mistet underlengdene og
   «Turnaround»/«Produkter» forsvant nesten helt.
   `height:auto` gir boksen nøyaktig linjens høyde. `overflow:hidden` blir
   stående, så avsløringen (translateY ±100 %) klipper fortsatt — den trenger
   bare en boks som er like høy som teksten, ikke 120 % av noe annet. */
.features_main__xNgmA .features_content__Dpd5L .features_feature__7MNIW .features_textContainer__v5mZs{
  height:auto;
}