/* Zervo nettside. Felles for alle sider. Alle farger og mål hentes fra tokens.css.
   Én animasjon brukes overalt: kort glir opp og tones inn. Zervo-streken er fremdriftslinjen. */
:root { --pop: 420ms; --step: 2600ms; }
html { scroll-behavior: smooth; }
.wrap { max-width: var(--container-max); margin: 0 auto; padding: 0 var(--container-pad); }
section { padding: var(--space-32) 0; }
.warm { background: var(--bg-warm); }

/* Knapp */
.btn {
  display: inline-flex; align-items: center; gap: var(--space-2);
  font-family: var(--font-display); font-weight: var(--weight-bold);
  font-size: var(--text-md); letter-spacing: var(--tracking-caps); text-transform: none;
  padding: 18px 30px; border-radius: var(--radius-sm);
  background: var(--accent); color: var(--on-accent); text-decoration: none;
  transition: background var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}
.btn:hover { background: var(--accent-hover); color: var(--on-accent); text-decoration: none; }
.btn:active { background: var(--accent-press); transform: translateY(1px); }
.btn.sm { padding: 10px 18px; font-size: var(--text-base); }
.note { font-family: var(--font-display); font-weight: var(--weight-semibold); letter-spacing: var(--tracking-caps); text-transform: none; font-size: var(--text-sm); color: var(--text-muted); }
.cta-row { display: flex; align-items: center; gap: var(--space-6); flex-wrap: wrap; }
.more { font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-base); color: var(--accent-text); display: inline-block; }
.more:hover { color: var(--accent-press); text-decoration: none; }

/* Nav */
.nav { position: sticky; top: env(safe-area-inset-top, 0px); z-index: var(--z-sticky); background: rgba(255,255,255,.85); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); }
.nav-in { display: flex; align-items: center; justify-content: space-between; height: 72px; gap: var(--space-6); }
.nav img { height: 28px; display: block; }
.nav .links { display: flex; align-items: center; gap: var(--space-8); }
.nav .links a.t { color: var(--text-heading); font-weight: var(--weight-medium); }
.nav .links a.t:hover { color: var(--brand-text); text-decoration: none; }

/* Seksjonstittel */
.head { max-width: 760px; margin-bottom: var(--space-16); }
.head .zv-strek { margin-bottom: var(--space-5); }
.head h2 { font-size: clamp(44px, 6vw, 84px); margin-top: var(--space-2); }
.head p { margin-top: var(--space-5); font-size: var(--text-lg); color: var(--text-muted); max-width: 30em; }

/* ---------- Felles animasjon og varselkort ---------- */
[data-in] { opacity: 0; transform: translateY(12px); transition: opacity var(--pop) var(--ease-out), transform var(--pop) var(--ease-out); }
.on [data-in] { opacity: 1; transform: none; }
.on [data-in="2"] { transition-delay: 700ms; }
.on [data-in="3"] { transition-delay: 1400ms; }
.on [data-in="4"] { transition-delay: 2100ms; }

.nt { display: flex; gap: var(--space-3); align-items: center; background: var(--kort); border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; text-align: left; }
.nt .ic { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; flex: none; font-weight: 700; font-size: 16px; }
.nt .ic svg { width: 18px; height: 18px; }
.nt b { display: block; font-size: var(--text-base); font-weight: var(--weight-semibold); line-height: 1.25; }
.nt span.s { display: block; font-size: var(--text-sm); color: var(--text-muted); line-height: 1.35; }
.ic.red { background: var(--danger-wash); color: var(--danger-text); }
.ic.blue { background: var(--brand-wash); color: var(--brand-text); }
.ic.gold { background: var(--proof-wash); color: var(--proof-text); }
.ic.green { background: var(--success); color: var(--on-blaa); }
.nt.win { border-top: 3px solid var(--success); }
.nt.win b { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-xl); line-height: 1; }
.nt.lost { border-left: 3px solid var(--danger); }

/* ---------- HERO ---------- */
.hero { padding: var(--space-20) 0 var(--space-24); }
.hero h1 { font-size: clamp(56px, 9.5vw, 136px); margin: var(--space-5) 0 var(--space-8); max-width: 9.5em; }
.hero .ingress { font-size: var(--text-xl); line-height: 1.35; color: var(--text-muted); max-width: 20em; margin-bottom: var(--space-10); }
.hero .ingress b { color: var(--text-heading); font-weight: var(--weight-semibold); }
.hero.sub h1 { font-size: clamp(56px, 8.5vw, 120px); max-width: 11em; }
.crumb { display: inline-flex; gap: var(--space-3); align-items: baseline; }
.crumb a { color: var(--text-muted); }
.trades { margin-top: var(--space-20); padding-top: var(--space-5); border-top: 1px solid var(--line); display: flex; gap: var(--space-3) var(--space-10); flex-wrap: wrap; align-items: baseline; }
.trades span { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-xl); }
.trades .note { margin-right: var(--space-2); }

/* ---------- PROBLEMET ---------- */
.problem { display: grid; grid-template-columns: 6fr 5fr; gap: var(--space-16); align-items: center; }
.problem .head { margin-bottom: 0; }
.problem .stack { display: flex; flex-direction: column; gap: 10px; }
.problem .stack .nt { padding: 16px 18px; }

/* ---------- MOTOREN: like ruter, én felles tidslinje ---------- */
.motor { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-6); }
.motor.three { grid-template-columns: repeat(3, 1fr); gap: var(--space-8); }
.motor.six { grid-template-columns: repeat(3, 1fr); gap: var(--space-16) var(--space-8); --step: 2600ms; }
.tile .bar { height: 3px; background: var(--line); position: relative; overflow: hidden; }
.tile .bar::after { content: ""; position: absolute; inset: 0; width: 0; background: var(--accent); }
.tile.active .bar::after { animation: fill var(--step) linear forwards; }
.tile.done .bar::after { width: 100%; }
@keyframes fill { to { width: 100%; } }
.tile .no { display: block; margin: var(--space-4) 0 var(--space-1); font-family: var(--font-display); font-weight: var(--weight-semibold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-sm); color: var(--text-faint); transition: color var(--pop); }
.tile.active .no, .tile.done .no { color: var(--accent-text); }
.tile h3 { font-size: var(--text-2xl); font-weight: var(--weight-extrabold); text-transform: none; line-height: .95; min-height: 2em; }
.screen { margin: var(--space-5) 0 var(--space-4); height: 210px; background: var(--kort); border: 1px solid var(--line); border-radius: var(--radius-xl); padding: var(--space-4); display: flex; flex-direction: column; justify-content: center; gap: 10px; }
.warm .screen .nt { background: var(--bg-warm); }
.tile p { color: var(--text-muted); }
.tile .more { margin-top: var(--space-4); }
.pill { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line-strong); border-radius: 999px; padding: 10px 16px; font-size: var(--text-sm); }
.pill svg { width: 16px; height: 16px; color: var(--text-muted); }
.score { display: flex; align-items: center; gap: var(--space-4); }
.score .num { font-family: var(--font-display); font-weight: var(--weight-extrabold); font-size: 64px; line-height: .8; font-variant-numeric: tabular-nums; min-width: 1.9ch; }
.stars { position: relative; font-size: 24px; letter-spacing: 2px; line-height: 1; display: inline-block; }
.stars i { font-style: normal; }
.stars .base { color: var(--grey-200); }
.stars .fill { position: absolute; inset: 0; overflow: hidden; white-space: nowrap; color: var(--proof); width: 76%; transition: width 2s var(--ease-out); }
.on .stars .fill { width: 98%; }
.score small { display: block; color: var(--text-muted); font-size: var(--text-sm); margin-top: 6px; font-variant-numeric: tabular-nums; }

/* ---------- TRE POENG (underside) ---------- */
.points { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-10); }
.points h3 { font-size: var(--text-3xl); font-weight: var(--weight-extrabold); text-transform: none; line-height: .95; padding-top: var(--space-3); border-top: 3px solid var(--text-heading); }
.points p { color: var(--text-muted); margin-top: var(--space-3); font-size: var(--text-md); }
.honest { margin-top: var(--space-12); font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-2xl); line-height: 1.05; max-width: 22em; }
.honest::before { content: ""; display: block; width: 40px; height: 4px; background: var(--accent); margin-bottom: var(--space-4); }

/* ---------- ANDRE FUNKSJONER ---------- */
.others { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6); }
.others a { display: block; padding-top: var(--space-4); border-top: 3px solid var(--line-strong); color: var(--text-heading); transition: border-color var(--dur-base) var(--ease-out); }
.others a:hover { border-color: var(--blaa-tekst); text-decoration: none; }
.others .note { display: block; }
.others b { display: block; font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-2xl); line-height: 1; margin: var(--space-2) 0 var(--space-3); }
.others .more { font-size: var(--text-sm); }

/* ---------- KOM I GANG: tre steg, hvem gjør hva ---------- */
.start { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-8); }
.start > * { padding-top: var(--space-5); border-top: 1px solid var(--strek); }
.start > .us { border-top-color: var(--brand); }
.start .who { display: block; font-family: var(--font-display); text-transform: none; letter-spacing: var(--tracking-caps); font-weight: var(--weight-semibold); font-size: var(--text-sm); color: var(--accent-text); }
.start .us .who { color: var(--brand-text); }
.start .big { display: block; margin: var(--space-3) 0 var(--space-2); font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-4xl); line-height: .9; font-variant-numeric: tabular-nums; }
.start h3 { font-size: var(--text-2xl); font-weight: var(--weight-extrabold); text-transform: none; line-height: 1; }
.start p { margin-top: var(--space-3); color: var(--text-muted); font-size: var(--text-md); }

/* ---------- VERDIPAKKEN: alt som er med ---------- */
.stack-all { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0 var(--space-8); margin-bottom: var(--space-20); }
.stack-all div { padding: var(--space-4) 0; border-top: 1px solid var(--line-strong); }
.stack-all b { display: block; font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-xl); line-height: 1; }
.stack-all b::before { content: "✓ "; color: var(--success); }
.stack-all span { display: block; margin-top: var(--space-1); color: var(--text-muted); font-size: var(--text-sm); }

/* ---------- GARANTI ---------- */
.risk { display: grid; grid-template-columns: auto 1fr 1fr 1fr; gap: var(--space-12); align-items: start; }
.risk .zv-stamp-num { font-size: 112px; }
.risk .zv-stamp-txt b { font-size: var(--text-xl); }
.risk h3 { font-size: var(--text-3xl); font-weight: var(--weight-extrabold); text-transform: none; line-height: .95; padding-top: var(--space-3); border-top: 3px solid var(--text-heading); }
.risk p { color: var(--text-muted); margin-top: var(--space-3); }

/* ---------- FAQ ---------- */
.faq { max-width: 860px; }
details { border-top: 1px solid var(--line-strong); }
details:last-of-type { border-bottom: 1px solid var(--line-strong); }
summary { list-style: none; cursor: pointer; padding: var(--space-5) 0; display: flex; justify-content: space-between; gap: var(--space-4); font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; font-size: var(--text-xl); line-height: 1.1; }
summary::-webkit-details-marker { display: none; }
summary::after { content: "+"; color: var(--accent-text); font-size: var(--text-2xl); line-height: .8; }
details[open] summary::after { content: "−"; }
details p { padding-bottom: var(--space-6); color: var(--text-muted); font-size: var(--text-md); max-width: 40em; }

/* ---------- AVSLUTNING ---------- */
.final h2 { font-size: clamp(56px, 8.5vw, 128px); margin: var(--space-5) 0 var(--space-10); max-width: 11em; }
footer { background: var(--bg-deep); padding: var(--space-12) 0; }
.foot { display: flex; justify-content: space-between; align-items: center; gap: var(--space-6); flex-wrap: wrap; color: var(--text-muted); font-size: var(--text-sm); }
.foot img { height: 24px; display: block; }
.foot a { color: var(--text-heading); margin-left: var(--space-5); }

/* ---------- SEKS ANIMASJONER, ÉN FAMILIE ----------
   Samme easing, farger og kortflate. Hver funksjon har sin egen bevegelse.
   Forsinkelser settes bare i .on-tilstanden, så nullstilling skjer med en gang. */

/* 01 Nettside: nettleseren bygger siden, knappen trykkes */
.browser { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: var(--kort); }
.browser .b-top { display: flex; gap: 5px; align-items: center; padding: 8px 10px; background: var(--bg-deep); font-size: var(--text-xs); color: var(--text-muted); }
.browser .b-top i { width: 7px; height: 7px; border-radius: 50%; background: var(--line-strong); }
.browser .b-top span { margin-left: 8px; }
.browser .b-body { padding: 14px; display: flex; flex-direction: column; gap: 8px; }
.browser .b-h, .browser .b-l { height: 12px; border-radius: 4px; background: var(--ink-800); width: 0; transition: width 600ms var(--ease-out); }
.browser .b-l { height: 8px; background: var(--grey-200); }
.browser .b-btn { position: relative; align-self: flex-start; margin-top: 4px; background: var(--accent); color: var(--on-accent); font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-sm); padding: 8px 14px; border-radius: var(--radius-sm); opacity: 0; transform: scale(.85); transition: all 420ms var(--ease-out); }
.browser .b-btn .b2 { position: absolute; inset: 0; display: grid; place-items: center; background: var(--success); color: var(--on-blaa); border-radius: inherit; opacity: 0; transition: opacity 300ms; }
.on .browser .b-h { width: 75%; }
.on .browser .b-l { width: 55%; transition-delay: 250ms; }
.on .browser .b-btn { opacity: 1; transform: none; transition-delay: 700ms; animation: press 2600ms var(--ease-out) both; }
.on .browser .b-btn .b2 { opacity: 1; transition-delay: 1500ms; }
@keyframes press { 0%, 52% { transform: none; } 56% { transform: scale(.92); } 62%, 100% { transform: none; } }

/* 02 Synlighet: bedriften klatrer til toppen av søket */
.climb { position: relative; height: 132px; }
.climb .r { position: absolute; left: 0; right: 0; height: 38px; display: flex; justify-content: space-between; align-items: center; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--kort); font-size: var(--text-sm); transition: top 900ms var(--ease-out), border-color 300ms, background 300ms; }
.climb .r b { font-weight: var(--weight-semibold); }
.climb .r span { color: var(--text-muted); }
.climb .a { top: 0; } .climb .b { top: 46px; } .climb .me { top: 92px; }
.climb .me .rank { opacity: 0; color: var(--brand-text); font-family: var(--font-display); font-weight: var(--weight-extrabold); margin-right: 6px; transition: opacity 300ms; }
.on .climb .me { top: 0; border: 2px solid var(--brand); background: var(--brand-wash); transition-delay: 400ms; }
.on .climb .a { top: 46px; transition-delay: 400ms; }
.on .climb .b { top: 92px; transition-delay: 400ms; }
.on .climb .me .rank { opacity: 1; transition-delay: 1200ms; }

/* 03 Samlet innboks: kanalene faller ned i én innboks */
.chans { display: flex; gap: 6px; justify-content: space-between; }
.chans span { flex: 1; text-align: center; font-size: var(--text-xs); font-weight: var(--weight-semibold); padding: 7px 0; border-radius: 8px; background: var(--brand-wash); color: var(--brand-text); transition: transform 600ms var(--ease-out), opacity 600ms; }
.inbox { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; border: 2px dashed var(--line-strong); border-radius: 12px; transition: border-color 400ms, background 400ms; }
.inbox b { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-lg); }
.inbox .n { font-family: var(--font-display); font-weight: var(--weight-extrabold); font-size: var(--text-3xl); line-height: 1; color: var(--brand-text); font-variant-numeric: tabular-nums; }
.on .chans span { transform: translateY(58px) scale(.5); opacity: 0; }
.on .chans span:nth-child(2) { transition-delay: 200ms; }
.on .chans span:nth-child(3) { transition-delay: 400ms; }
.on .chans span:nth-child(4) { transition-delay: 600ms; }
.on .inbox { border-style: solid; border-color: var(--brand); background: var(--kort); transition-delay: 300ms; }

/* 04 Rask respons: stoppeklokke teller til 42 sekunder */
.timer { display: flex; align-items: center; gap: var(--space-4); }
.ring { position: relative; width: 92px; height: 92px; flex: none; }
.ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.ring circle { fill: none; stroke-width: 7; }
.ring .track { stroke: var(--grey-200); }
.ring .prog { stroke: var(--success); stroke-linecap: round; stroke-dasharray: 226; stroke-dashoffset: 226; transition: stroke-dashoffset 1400ms var(--ease-out); }
.on .ring .prog { stroke-dashoffset: 40; }
.ring .t { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; font-family: var(--font-display); font-weight: var(--weight-extrabold); font-size: var(--text-2xl); line-height: .9; font-variant-numeric: tabular-nums; }
.ring .t small { display: block; font-size: var(--text-xs); color: var(--text-muted); letter-spacing: var(--tracking-caps); }
.timer .nt { flex: 1; min-width: 0; }

/* 05 Anmeldelser: stjernene fylles (bruker .score og .stars) */
.on .score .stars .fill { width: 98%; }

/* 06 Kampanjer: påminnelsen sveiper nedover lista, svarene blir nye jobber */
.sweep { display: flex; flex-direction: column; gap: 6px; }
.sweep .r { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--kort); font-size: var(--text-sm); transition: background 300ms, border-color 300ms; }
.sweep .r b { font-weight: var(--weight-semibold); }
.sweep .r small { color: var(--text-muted); margin-left: 6px; }
.sweep .tag { position: relative; font-family: var(--font-display); font-weight: var(--weight-semibold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-xs); padding: 3px 8px; border-radius: 6px; background: var(--grey-100); color: var(--text-muted); transition: all 300ms; white-space: nowrap; }
.on .sweep .r { background: var(--brand-wash); border-color: transparent; }
.on .sweep .tag { background: var(--kort); color: var(--brand-text); }
.on .sweep .r:nth-child(2), .on .sweep .r:nth-child(2) .tag { transition-delay: 250ms; }
.on .sweep .r:nth-child(3), .on .sweep .r:nth-child(3) .tag { transition-delay: 500ms; }
.sweep .tag .won { position: absolute; inset: 0; display: grid; place-items: center; border-radius: inherit; background: var(--success); color: var(--on-blaa); opacity: 0; transform: scale(.6); transition: all 360ms var(--ease-out); }
.on .sweep .r:nth-child(1) .won { opacity: 1; transform: none; transition-delay: 1200ms; }
.on .sweep .r:nth-child(3) .won { opacity: 1; transform: none; transition-delay: 1600ms; }


/* Justeringer for de seks rutene på forsiden */
.motor.six .screen { height: 248px; gap: 8px; }
.motor.six .screen .nt { padding: 9px 12px; }
.motor.six .screen .nt .ic { width: 32px; height: 32px; font-size: 14px; }
.motor.six .ring { width: 76px; height: 76px; }
.motor.six .ring .t { font-size: var(--text-xl); }
.motor.six .score .num { font-size: 52px; }
.motor.six .stars { font-size: 20px; }
.inbox small { display: block; font-size: var(--text-xs); color: var(--text-muted); margin-top: 2px; }
.chans span { font-size: 11px; }
.on .chans span:nth-child(5) { transition-delay: 800ms; }
.camp-head { display: flex; flex-direction: column; gap: 2px; padding: 0 2px 2px; }
.camp-head b { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-md); }
.camp-head span { font-size: var(--text-xs); color: var(--text-muted); }
.on .sweep .r:nth-child(1), .on .sweep .r:nth-child(1) .tag { transition-delay: 300ms; }
.on .sweep .r:nth-child(2), .on .sweep .r:nth-child(2) .tag { transition-delay: 550ms; }
.on .sweep .r:nth-child(3), .on .sweep .r:nth-child(3) .tag { transition-delay: 800ms; }

/* ---------- SEO, GEO OG AIO (nettside og synlighet) ---------- */
.search3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-5); }
.s-card { background: var(--kort); border: 1px solid var(--line); border-radius: var(--card-radius); padding: var(--card-pad); display: flex; flex-direction: column; gap: var(--space-3); }
.s-tag { align-self: flex-start; font-family: var(--font-display); font-weight: var(--weight-extrabold); font-size: var(--text-xl); letter-spacing: var(--tracking-caps); color: var(--brand-text); background: var(--brand-wash); border-radius: 8px; padding: 4px 12px; }
.s-name { display: flex; align-items: center; gap: var(--space-3); }
.s-full { display: flex; flex-direction: column; font-weight: var(--weight-semibold); font-size: var(--text-sm); line-height: 1.25; color: var(--text-heading); }
.s-full small { font-weight: var(--weight-regular); font-size: var(--text-xs); color: var(--text-muted); }
.s-card h3 { font-size: var(--text-2xl); font-weight: var(--weight-extrabold); text-transform: none; line-height: 1; }
.s-card p { color: var(--text-muted); }
.s-vis { background: var(--bg-warm); border-radius: 12px; padding: var(--space-4); height: 212px; position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; gap: 6px; font-size: var(--text-sm); }
.serp-mini div { display: flex; align-items: center; gap: 8px; background: var(--kort); border: 1px solid var(--line); border-radius: 8px; padding: 6px 10px; }
.serp-mini div:first-child { border: 2px solid var(--brand); font-weight: var(--weight-semibold); color: var(--brand-text); }
.serp-mini i { font-style: normal; font-family: var(--font-display); font-weight: var(--weight-extrabold); color: var(--text-faint); }
.geo-mini { background: var(--brand-wash); }
.geo-mini .lbl { font-family: var(--font-display); font-weight: var(--weight-semibold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-xs); color: var(--brand-text); }
.geo-mini .ln { height: 8px; border-radius: 4px; background: var(--kort); width: 92%; }
.geo-mini .ln.short { width: 64%; }
.geo-mini .src { align-self: flex-start; margin-top: 4px; background: var(--kort); border: 2px solid var(--brand); border-radius: 999px; padding: 3px 10px; font-weight: var(--weight-semibold); color: var(--brand-text); font-size: var(--text-xs); }
.aio-mini .logos { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 4px; }
.ai-logo { display: inline-flex; align-items: center; height: 28px; padding: 0 10px; background: var(--kort); border: 1px solid var(--line); border-radius: 8px; font-weight: var(--weight-semibold); font-size: var(--text-xs); }
.ai-logo img { height: 16px; width: auto; max-width: 84px; display: block; object-fit: contain; }
.aio-mini .q { background: var(--kort); border-radius: 12px 12px 12px 4px; padding: 6px 10px; align-self: flex-start; }
.aio-mini .a { background: var(--brand); color: var(--on-blaa); border-radius: 12px 12px 4px 12px; padding: 6px 10px; align-self: flex-end; font-weight: var(--weight-semibold); }
.ahead { margin-top: var(--space-6); background: var(--kort); border: 1px solid var(--strek); border-radius: var(--card-radius); padding: var(--space-6) var(--card-pad); display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); align-items: baseline; }
.ahead b { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-xl); line-height: 1.05; }
.ahead span { color: var(--text-muted); font-size: var(--text-md); }

/* ---------- HELE SYSTEMET: kart nederst på undersidene ---------- */
.sysmap { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.m-card { position: relative; display: flex; flex-direction: column; gap: var(--space-1); background: var(--bg-warm); border: 1px solid var(--line); border-radius: var(--card-radius); padding: var(--card-pad); color: var(--text-heading); transition: border-color var(--dur-base) var(--ease-out); }
a.m-card:hover { border-color: var(--blaa-tekst); text-decoration: none; color: var(--text-heading); }
.m-card b { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-xl); line-height: 1.05; margin-top: var(--space-1); }
.m-card .s { color: var(--text-muted); font-size: var(--text-sm); }
.m-card .more { margin-top: var(--space-3); font-size: var(--text-sm); }
.m-card.here { background: var(--kort); border: 2px solid var(--blaa); }
.m-card.here .note { color: var(--accent-text); }
.you-here { position: absolute; top: var(--space-4); right: var(--space-4); background: var(--accent); color: var(--on-accent); font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-xs); padding: 4px 10px; border-radius: 6px; }
section:not(.warm) .points > div { background: var(--bg-warm); }

/* ---------- GARANTI: egen seksjon, fortalt som tekst ---------- */
.guarantee { display: grid; grid-template-columns: auto 1fr; gap: var(--space-12); align-items: center; background: var(--success-wash); border-top: 6px solid var(--success); border-radius: 24px; padding: var(--space-16) var(--space-12); }
.g-num { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 240px; aspect-ratio: 1; max-width: 100%; border-radius: 50%; background: var(--kort); border: 3px solid var(--success); }
.g-num span { font-family: var(--font-display); font-weight: var(--weight-extrabold); font-size: 132px; line-height: .8; color: var(--success-text); font-variant-numeric: tabular-nums; }
.g-num small { font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-lg); color: var(--success-text); margin-top: var(--space-2); }
.g-text h2 { font-size: clamp(36px, 4.6vw, 64px); margin: var(--space-2) 0 var(--space-5); }
.g-text p { font-size: var(--text-lg); color: var(--text-body); max-width: 34em; }
.g-text p + p { margin-top: var(--space-4); color: var(--text-muted); }
.g-text .cta-row { margin-top: var(--space-8); }

/* ---------- ARTIKLER OG «LÆR MER» ---------- */
.a-hero h1 { font-size: clamp(40px, 6vw, 84px); max-width: 14em; }
.a-hero > .wrap > .note { display: block; margin-top: calc(-1 * var(--space-4)); }
.a-body { padding-top: var(--space-12); }
.a-grid { display: grid; grid-template-columns: 240px minmax(0, 720px); gap: var(--space-16); align-items: start; }
.toc { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 96px); background: var(--bg-warm); border: 1px solid var(--line); border-radius: var(--card-radius); padding: var(--space-5); }
.toc ol { margin: var(--space-3) 0 0; padding-left: 1.2em; display: grid; gap: var(--space-2); font-size: var(--text-sm); }
.toc a { color: var(--text-heading); }
.prose { min-width: 0; font-size: var(--text-md); line-height: var(--leading-relaxed); }
.prose h2 { font-size: clamp(30px, 3.4vw, 44px); margin: var(--space-12) 0 var(--space-4); scroll-margin-top: 96px; }
.prose p { margin: 0 0 var(--space-4); }
.prose ul { margin: 0 0 var(--space-5); padding-left: 1.2em; display: grid; gap: var(--space-2); }
.prose a { text-decoration: underline; text-underline-offset: 3px; }
.kort { background: var(--brand-wash); border-radius: var(--card-radius); padding: var(--space-6); border-left: 6px solid var(--brand); }
.kort p { margin: var(--space-2) 0 0; font-size: var(--text-lg); line-height: 1.5; color: var(--text-heading); }
.callout { background: var(--bg-warm); border: 1px solid var(--line); border-radius: 12px; padding: var(--space-5); margin: 0 0 var(--space-5); }
.callout p { margin: var(--space-2) 0 0; }
.prose .faq { margin-top: var(--space-4); }
.a-cta { margin-top: var(--space-12); background: var(--bg-warm); border: 1px solid var(--strek); border-radius: var(--card-radius); padding: var(--space-8) var(--card-pad); }
.a-cta b { display: block; font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-2xl); line-height: 1; margin: var(--space-2) 0 var(--space-3); }
.a-cta .cta-row { margin-top: var(--space-5); }
.a-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.a-card { display: flex; flex-direction: column; gap: var(--space-2); background: var(--kort); border: 1px solid var(--line); border-radius: var(--card-radius); padding: var(--card-pad); color: var(--text-heading); transition: border-color var(--dur-base) var(--ease-out); }
.a-card:hover { border-color: var(--blaa-tekst); text-decoration: none; color: var(--text-heading); }
.a-card b { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-xl); line-height: 1.05; }
.a-card .s { color: var(--text-muted); font-size: var(--text-sm); }
.a-card .more { margin-top: auto; padding-top: var(--space-3); font-size: var(--text-sm); }
.a-card.big { padding: var(--space-10) var(--space-8); border: 2px solid var(--brand); margin-bottom: var(--space-16); }
.a-card.big b { font-size: clamp(32px, 4vw, 52px); }
.a-card.big .s { font-size: var(--text-lg); }
.a-feat-label { display: block; margin-bottom: var(--space-3); }
.a-group + .a-group { margin-top: var(--space-16); }
.a-group-head { display: flex; align-items: baseline; gap: var(--space-4); flex-wrap: wrap; margin-bottom: var(--space-5); }
.a-group-head h2 { font-size: clamp(32px, 3.6vw, 48px); }
.a-group-head p { color: var(--text-muted); }

section:not(.warm) .a-card { background: var(--bg-warm); }
.warm .m-card { background: var(--kort); }
.warm .m-card.here { border-color: var(--blaa-tekst); }

/* ---------- FOOTER: logoen som signatur ---------- */
.site-foot { background: var(--bg-deep); padding: var(--space-24) 0 var(--space-8); overflow: hidden; }
.f-top { display: grid; grid-template-columns: 5fr 2fr 3fr 2fr; gap: var(--space-12); }
.f-cta b { display: block; font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: clamp(36px, 4vw, 52px); line-height: .95; margin: var(--space-4) 0 var(--space-3); }
.f-cta p { color: var(--text-muted); margin-bottom: var(--space-6); max-width: 24em; }
.f-contact { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); margin-top: var(--space-5); font-weight: var(--weight-semibold); }
.f-contact a { color: var(--text-heading); }
.f-col { display: flex; flex-direction: column; gap: var(--space-1); }
.f-col .note { margin-bottom: var(--space-2); }
.f-col a { color: var(--text-heading); padding: 6px 0; font-weight: var(--weight-medium); }
.f-col a:hover { color: var(--brand-text); }
.f-col a.all { color: var(--accent-text); font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-sm); }
.f-logo { margin: var(--space-20) 0 var(--space-6); }
.f-logo img { display: block; width: 100%; height: auto; }
.f-logo [data-in] { transform: translateY(40px); transition-duration: 900ms; }
.f-logo.on [data-in] { transform: none; }
.f-bottom { display: flex; justify-content: space-between; gap: var(--space-3) var(--space-6); flex-wrap: wrap; padding-top: var(--space-5); border-top: 1px solid var(--line-strong); color: var(--text-muted); font-size: var(--text-sm); }
.f-tag { font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; letter-spacing: var(--tracking-caps); color: var(--text-heading); }

/* ---------- BOOKING: tre steg ---------- */
.book { padding: var(--space-12) 0 var(--space-24); }
.book h1 { font-size: clamp(40px, 5.6vw, 72px); margin: var(--space-8) 0 var(--space-3); }
.book .ingress { font-size: var(--text-lg); color: var(--text-muted); margin-bottom: var(--space-8); max-width: 34em; }
.book .ingress b { color: var(--text-heading); }
.steps-bar { list-style: none; margin: 0; padding: 0; display: flex; gap: var(--space-2); flex-wrap: wrap; }
.steps-bar li { display: flex; align-items: center; gap: var(--space-2); padding: 8px 14px 8px 8px; border-radius: 999px; background: var(--kort); border: 1px solid var(--line); font-family: var(--font-display); font-weight: var(--weight-semibold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-sm); color: var(--text-muted); }
.steps-bar li span { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--grey-100); color: var(--text-muted); font-size: var(--text-sm); }
.steps-bar li.cur { border-color: var(--blaa-tekst); color: var(--text-heading); }
.steps-bar li.cur span { background: var(--accent); color: var(--on-accent); }
.steps-bar li.done span { background: var(--success); color: var(--on-blaa); }
.book-grid { display: grid; grid-template-columns: 7fr 4fr; gap: var(--space-10); align-items: start; }
.book-card { background: var(--kort); border: 1px solid var(--line); border-radius: var(--card-radius); padding: var(--space-8); }
.fields { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-5); }
.field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.field.full { grid-column: 1 / -1; margin-top: var(--space-5); }
.field label, .help legend { font-weight: var(--weight-semibold); font-size: var(--text-base); color: var(--text-heading); }
.field label small, .help legend small { font-weight: var(--weight-regular); color: var(--text-muted); }
.field input, .field select, .field textarea { font: inherit; font-size: var(--text-md); padding: 12px 14px; border: 1px solid var(--line-strong); border-radius: var(--radius-md); background: var(--kort); color: var(--text-heading); width: 100%; min-height: 48px; }
.field textarea { resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { outline: 2px solid var(--focus-ring); outline-offset: 1px; border-color: var(--focus-ring); }
.field .hint { font-size: var(--text-sm); color: var(--text-muted); }
.field .err { font-size: var(--text-sm); color: var(--danger-text); font-weight: var(--weight-semibold); }
.field .err:empty { display: none; }
.field.bad input, .field.bad select { border-color: var(--danger); background: var(--danger-wash); }
.help { border: 0; padding: 0; margin: var(--space-6) 0 0; }
.help legend { margin-bottom: var(--space-3); padding: 0; }
.chips { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.chip-opt { position: relative; cursor: pointer; }
.chip-opt input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.chip-opt span { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 14px; border: 1px solid var(--line-strong); border-radius: var(--radius-md); background: var(--kort); font-weight: var(--weight-medium); transition: all var(--dur-fast) var(--ease-out); }
.chip-opt input:checked + span { border-color: var(--brand); background: var(--brand-wash); color: var(--brand-text); }
.chip-opt input:checked + span::before { content: "✓ "; white-space: pre; }
.chip-opt input:focus-visible + span { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.privacy { margin: var(--space-5) 0; font-size: var(--text-sm); color: var(--text-muted); }
.book-card .btn { min-width: 220px; justify-content: center; }
.btn:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.book-side { display: flex; flex-direction: column; gap: var(--space-4); position: sticky; top: calc(env(safe-area-inset-top, 0px) + 96px); }
.book-side .book-card { padding: var(--space-6); }
.what { margin: var(--space-3) 0 0; padding-left: 1.2em; display: grid; gap: var(--space-4); }
.what b { display: block; }
.what span { color: var(--text-muted); font-size: var(--text-sm); }
.g-mini { display: flex; gap: var(--space-4); align-items: center; background: var(--success-wash); border-color: transparent; border-top: 4px solid var(--success); }
.g-30 { font-family: var(--font-display); font-weight: var(--weight-extrabold); font-size: 56px; line-height: .8; color: var(--success-text); }
.g-mini b { display: block; font-family: var(--font-display); text-transform: none; font-size: var(--text-lg); }
.g-mini span { font-size: var(--text-sm); color: var(--text-muted); }
.call { font-weight: var(--weight-semibold); padding: 0 var(--space-2); }

.notice { background: var(--warning-wash); border-radius: 12px; padding: var(--space-4) var(--space-5); margin-bottom: var(--space-6); font-weight: var(--weight-semibold); }
.time-grid { display: grid; grid-template-columns: 5fr 6fr; gap: var(--space-6); align-items: start; }
.time-grid > *, .book-grid > * { min-width: 0; }
.cal-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--space-4); }
.cal-head b { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-xl); }
.cal-nav { width: 44px; height: 44px; border-radius: 10px; border: 1px solid var(--line-strong); background: var(--kort); font-size: var(--text-lg); cursor: pointer; color: var(--text-heading); }
.cal-nav:disabled { opacity: .3; cursor: default; }
.cal-days, .cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; text-align: center; }
.cal-days { font-family: var(--font-display); font-weight: var(--weight-semibold); text-transform: none; font-size: var(--text-xs); color: var(--text-muted); margin-bottom: 6px; }
.cal-grid button { aspect-ratio: 1; border-radius: 10px; border: 1px solid var(--line); background: var(--bg-warm); font: inherit; font-weight: var(--weight-semibold); font-variant-numeric: tabular-nums; cursor: pointer; color: var(--text-heading); min-height: 40px; }
.cal-grid button:hover:not(:disabled) { border-color: var(--blaa-tekst); }
.cal-grid button:disabled { background: transparent; border-color: transparent; color: var(--ink-400); cursor: default; }
.cal-grid button.sel { background: var(--accent); border-color: var(--blaa-tekst); color: var(--on-accent); }
.slots-head { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-3); margin-bottom: var(--space-4); }
.slots-head b { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-xl); }
.eg-tag { font-family: var(--font-display); font-weight: var(--weight-semibold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-xs); color: var(--warning-text); background: var(--warning-wash); padding: 4px 8px; border-radius: 6px; white-space: nowrap; }
.slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: var(--space-2); }
.slot { min-height: 48px; border-radius: 10px; border: 1px solid var(--line-strong); background: var(--kort); font: inherit; font-weight: var(--weight-semibold); font-size: var(--text-md); font-variant-numeric: tabular-nums; cursor: pointer; color: var(--text-heading); }
.slot:hover { border-color: var(--blaa-tekst); }
.slot.sel { background: var(--accent); border-color: var(--blaa-tekst); color: var(--on-accent); }
.muted { color: var(--text-muted); }
.tz { margin-top: var(--space-4); font-size: var(--text-sm); color: var(--text-muted); }
.confirm-bar { margin-top: var(--space-6); display: flex; align-items: center; gap: var(--space-4) var(--space-6); flex-wrap: wrap; background: var(--kort); border: 1px solid var(--line); border-radius: var(--card-radius); padding: var(--space-4) var(--space-6); }
.confirm-bar .picked { flex: 1; min-width: 0; }
.back { font-weight: var(--weight-semibold); color: var(--text-muted); }

.done { max-width: 880px; }
.big-check { width: 88px; height: 88px; border-radius: 50%; background: var(--success); color: var(--on-blaa); display: grid; place-items: center; font-size: 44px; font-weight: 700; margin-top: var(--space-10); animation: pop 600ms var(--ease-out) both; }
@keyframes pop { from { transform: scale(.4); opacity: 0; } to { transform: none; opacity: 1; } }
.done h1 { margin-top: var(--space-5); }
.details { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6); border-top: 6px solid var(--success); }
.details div { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.details b { font-size: var(--text-lg); overflow-wrap: anywhere; }
.details span:not(.note) { color: var(--text-muted); font-size: var(--text-sm); }
.done h2 { font-size: clamp(32px, 4vw, 48px); margin: var(--space-12) 0 var(--space-5); }
.next3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); margin-bottom: var(--space-8); }
.next3 .book-card { padding: var(--space-6); display: flex; flex-direction: column; gap: var(--space-2); }
.next3 .n { width: 32px; height: 32px; border-radius: 50%; background: var(--accent); color: var(--on-accent); display: grid; place-items: center; font-family: var(--font-display); font-weight: var(--weight-extrabold); }
.next3 b { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-lg); line-height: 1.05; }
.next3 span:last-child { color: var(--text-muted); font-size: var(--text-sm); }
.only-generic { display: none; }
.done.generic .only-generic { display: inline; }
.done.generic .only-full { display: none; }
.only-ring { display: none; }
.done.ring .only-ring { display: inline; }
.done.ring .only-full, .done.ring .only-generic { display: none; }
.book-actions { display: flex; flex-direction: column; gap: var(--space-5); }
.book-actions > .btn { align-self: flex-start; }
.alt-call { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-3) var(--space-4); padding-top: var(--space-5); border-top: 1px solid var(--line); }
.alt-call > span { flex-basis: 100%; font-weight: var(--weight-semibold); }
.field.compact { flex: 1; min-width: 180px; }
.field.compact select { min-height: 44px; padding: 8px 12px; font-size: var(--text-base); }
.alt-call .btn.ghost { min-width: 0; }
.seg { border: 0; padding: 0; margin: var(--space-5) 0 0; }
.seg legend { font-weight: var(--weight-semibold); color: var(--text-heading); margin-bottom: var(--space-2); padding: 0; }
.seg legend small { font-weight: var(--weight-regular); color: var(--text-muted); }
.seg-opts { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-2); }
.seg-opts label { position: relative; cursor: pointer; }
.seg-opts input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.seg-opts span { display: flex; align-items: center; justify-content: center; min-height: 48px; border: 1px solid var(--line-strong); border-radius: var(--radius-md); background: var(--kort); font-weight: var(--weight-semibold); transition: all var(--dur-fast) var(--ease-out); }
.seg-opts input:checked + span { border-color: var(--brand); background: var(--brand-wash); color: var(--brand-text); box-shadow: inset 0 0 0 1px var(--brand); }
.seg-opts input:focus-visible + span { outline: 2px solid var(--focus-ring); outline-offset: 2px; }

/* ---------- PRODUKTSIDER: Zervo Web og Zervo Trust ---------- */
.brandmark { display: inline-flex; align-items: center; gap: 10px; color: var(--text-heading); text-decoration: none; }
.brandmark:hover { text-decoration: none; color: var(--text-heading); }
.brandmark span { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-md); padding: 3px 9px; border-radius: 6px; background: var(--brand-wash); color: var(--brand-text); line-height: 1.1; }
.brandmark.big img { height: 40px; }
.brandmark.big span { font-size: var(--text-xl); }
.prod-hero-grid { display: grid; grid-template-columns: 6fr 5fr; gap: var(--space-12); align-items: center; }
.prod-hero-grid > * { min-width: 0; }
.prod .hero h1 { font-size: clamp(52px, 7.6vw, 108px); }
.web-vis .browser.big { border-radius: 18px; border-color: var(--line-strong); }
.web-vis .browser.big .b-top { padding: 12px 14px; font-size: var(--text-sm); }
.web-vis .browser.big .b-body { padding: var(--space-8); gap: 12px; min-height: 300px; }
.web-vis .browser.big .b-h { height: 22px; }
.web-vis .browser.big .b-l { height: 12px; }
.web-vis .b-l.short { background: var(--grey-200); }
.on .browser .b-l.short { width: 38%; transition-delay: 400ms; }
.b-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 8px 0; }
.b-cards span { height: 64px; border-radius: 10px; background: var(--bg-warm); border: 1px solid var(--line); }
.web-vis .browser.big .b-btn { font-size: var(--text-md); padding: 12px 20px; }

.trust-vis { position: relative; height: 420px; }
.t-card { position: absolute; left: 4%; top: 30px; width: 62%; aspect-ratio: 1.6; border-radius: 18px; background: var(--kort); border: 1px solid var(--line-strong); padding: var(--space-6); display: flex; flex-direction: column; justify-content: space-between; transform: rotate(-4deg); }
.t-logo { font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-sm); color: var(--text-muted); }
.t-card b { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: clamp(32px, 4vw, 48px); line-height: .9; }
.t-stars { color: var(--proof); font-size: 28px; letter-spacing: 3px; }
.t-hint { font-weight: var(--weight-semibold); font-size: var(--text-sm); }
.t-phone { position: absolute; right: 4%; bottom: 0; width: 40%; aspect-ratio: .52; border-radius: 30px; border: 1.5px solid var(--line-strong); background: var(--bg-warm); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; animation: tap 5s var(--ease-out) infinite both; }
.t-g { width: 48px; height: 48px; border-radius: 50%; background: var(--kort); border: 1px solid var(--line); display: grid; place-items: center; font-weight: 700; font-size: 22px; color: var(--brand); }
.t-phone .t-stars { font-size: 20px; position: relative; color: var(--grey-200); }
.t-phone .t-stars::after { content: "★★★★★"; position: absolute; inset: 0; overflow: hidden; color: var(--proof); width: 0; animation: starfill 5s var(--ease-out) infinite both; }
.t-ok { font-size: var(--text-sm); font-weight: var(--weight-semibold); color: var(--success-text); animation: okin 5s var(--ease-out) infinite both; }
@keyframes tap { 0% { transform: translate(30px, 30px); } 20%, 85% { transform: translate(-40px, -20px); } 100% { transform: translate(30px, 30px); } }
@keyframes starfill { 0%, 30% { width: 0; } 55%, 90% { width: 100%; } 100% { width: 0; } }
@keyframes okin { 0%, 55% { opacity: 0; } 62%, 90% { opacity: 1; } 100% { opacity: 0; } }

.feat4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-4); }
.feat3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.f-card { background: var(--bg-warm); border: 1px solid var(--line); border-radius: var(--card-radius); padding: var(--card-pad); display: flex; flex-direction: column; gap: var(--space-3); }
.warm .f-card { background: var(--kort); }
.f-ic { font-family: var(--font-display); font-weight: var(--weight-extrabold); font-size: var(--text-3xl); line-height: 1; color: var(--accent-text); }
.f-card h3 { font-size: var(--text-2xl); font-weight: var(--weight-extrabold); text-transform: none; line-height: 1; }
.f-card p { color: var(--text-muted); }
.pack { display: grid; grid-template-columns: 7fr 5fr; gap: var(--space-12); align-items: center; background: var(--brand-wash); border-radius: 24px; padding: var(--space-16) var(--space-12); }
.pack > * { min-width: 0; }
.pack h2 { font-size: clamp(40px, 5vw, 68px); margin: var(--space-5) 0 var(--space-4); }
.pack p { font-size: var(--text-lg); color: var(--text-body); max-width: 32em; }
.pack p + p { margin-top: var(--space-3); color: var(--text-muted); }
.pack .cta-row { margin-top: var(--space-8); }
.pack-base { background: var(--kort); border-radius: var(--card-radius); padding: var(--space-6); display: grid; gap: var(--space-3); }
.pack-base div { border-top: 1px solid var(--line); padding-top: var(--space-3); }
.pack-base b { display: block; font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-xl); }
.pack-base b::before { content: "✓ "; color: var(--success); }
.pack-base span:not(.note) { color: var(--text-muted); font-size: var(--text-sm); }
.prod-contact { display: grid; grid-template-columns: 5fr 7fr; gap: var(--space-12); align-items: start; }
.prod-contact > * { min-width: 0; }
.prod-contact .head { margin-bottom: 0; }
.trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.sent { text-align: left; }
.sent h3 { font-size: var(--text-3xl); font-weight: var(--weight-extrabold); text-transform: none; margin: var(--space-5) 0 var(--space-2); }
.sent .big-check { margin-top: 0; }
.prod-foot { padding-top: var(--space-16); }
.pf-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-5) var(--space-10); padding-bottom: var(--space-10); }
.pf-top p { color: var(--text-muted); flex: 1; min-width: 220px; }
.prod-foot .f-contact { margin-top: 0; }

/* ---------- ZERVO TRUST: varianter, app og ærlighet ---------- */
.ap-logo { height: 22px; width: auto; display: block; }
.t-hint { display: inline-flex; align-items: center; gap: 6px; }
.nfc { display: inline-block; font-weight: 700; letter-spacing: -1px; transform: rotate(90deg) scaleY(.9); color: var(--brand-text); font-size: 13px; line-height: 1; }
.t-phone { gap: 10px; padding: 0 14px; }
.t-q { font-weight: var(--weight-semibold); font-size: var(--text-sm); text-align: center; }
.t-btn { width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 9px 8px; border-radius: 10px; border: 1px solid var(--line-strong); background: var(--kort); font-size: var(--text-xs); font-weight: var(--weight-semibold); text-align: center; }
.t-btn.main { background: var(--brand); border-color: var(--brand); color: var(--on-blaa); animation: press2 5s var(--ease-out) infinite both; }
.t-btn.main .t-g { width: 22px; height: 22px; font-size: 13px; border: 0; }
@keyframes press2 { 0%, 38% { transform: none; } 42% { transform: scale(.94); } 48%, 100% { transform: none; } }

.variants { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-5); }
.v-card { background: var(--bg-warm); border: 1px solid var(--line); border-radius: var(--card-radius); padding: var(--card-pad); display: flex; flex-direction: column; gap: var(--space-3); }
.v-card h3 { font-size: var(--text-3xl); font-weight: var(--weight-extrabold); text-transform: none; line-height: 1; }
.v-card p { color: var(--text-muted); }
.v-ill { height: 200px; border-radius: 12px; background: var(--proof-wash); display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; overflow: hidden; }
.qr { width: 44px; height: 44px; border-radius: 4px; background:
  conic-gradient(var(--ink-900) 25%, transparent 0 50%, var(--ink-900) 0 75%, transparent 0) 0 0 / 11px 11px,
  var(--white); border: 4px solid var(--white); outline: 2px solid var(--ink-900); }
.ill-stand { width: 112px; height: 140px; background: var(--kort); border: 1px solid var(--line-strong); border-radius: 12px 12px 4px 4px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; transform: perspective(300px) rotateX(10deg); }
.ill-base { width: 140px; height: 12px; border-radius: 6px; background: var(--ink-800); margin-top: -2px; }
.ill-card { width: 168px; height: 106px; background: var(--kort); border: 1px solid var(--line-strong); border-radius: 12px; display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto 1fr; padding: 12px 14px; transform: rotate(-6deg); }
.ill-card b { font-family: var(--font-display); font-weight: var(--weight-extrabold); font-size: 30px; color: var(--brand); line-height: 1; }
.ill-card .qr { grid-row: 1 / 3; grid-column: 2; align-self: end; }
.ill-card .nfc { align-self: end; justify-self: start; }
.ill-plate { width: 132px; height: 132px; border-radius: 50%; background: var(--kort); border: 1px solid var(--line-strong); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; }

.app-grid { display: grid; grid-template-columns: 7fr 5fr; gap: var(--space-16); align-items: center; }
.app-grid > * { min-width: 0; }
.app-grid h2 { font-size: clamp(40px, 5vw, 68px); margin: var(--space-3) 0 var(--space-5); }
.lede-big { font-size: var(--text-lg); color: var(--text-muted); max-width: 32em; }
.app-points { display: grid; gap: var(--space-3); margin-top: var(--space-8); }
.app-points div { background: var(--bg-warm); border: 1px solid var(--line); border-radius: 12px; padding: var(--space-4) var(--space-5); }
.app-points b { display: block; font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-lg); }
.app-points span { color: var(--text-muted); font-size: var(--text-sm); }
.app-phone { width: 100%; max-width: 320px; margin: 0 auto; border-radius: 40px; border: 1.5px solid var(--line-strong); background: var(--bg-warm); padding: var(--space-6) var(--space-4) var(--space-8); display: flex; flex-direction: column; gap: 10px; }
.ap-head { padding: 0 6px 6px; }
.ap-stat { background: var(--kort); border-radius: 14px; border: 1px solid var(--line); padding: 14px 16px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px 8px; }
.ap-stat span:first-child { font-size: var(--text-sm); color: var(--text-muted); }
.ap-stat b { grid-row: 1 / 3; grid-column: 2; font-family: var(--font-display); font-weight: var(--weight-extrabold); font-size: 48px; line-height: 1; color: var(--proof-text); }
.ap-stat .eg { font-size: var(--text-xs); }
.nt.flag { border-left: 3px solid var(--danger); }

.fair { display: grid; grid-template-columns: auto 1fr; gap: var(--space-8); align-items: center; background: var(--kort); border: 1px solid var(--line); border-top: 6px solid var(--success); border-radius: 24px; padding: var(--space-12) var(--space-10); }
.fair-ic { width: 88px; height: 88px; border-radius: 50%; background: var(--success); color: var(--on-blaa); display: grid; place-items: center; font-size: 44px; font-weight: 700; }
.fair h2 { font-size: clamp(32px, 4vw, 52px); margin-bottom: var(--space-3); }
.fair p { font-size: var(--text-lg); color: var(--text-muted); max-width: 40em; }

/* ---------- KRYSSALG mellom Web og Trust ---------- */
.btn.ghost { background: transparent; color: var(--text-heading); box-shadow: inset 0 0 0 2px var(--ink-900); }
.btn.ghost:hover { background: var(--ink-900); color: var(--on-blaa); }
.xsell { display: grid; grid-template-columns: auto 1fr auto; gap: var(--space-8) var(--space-10); align-items: center; border-radius: 24px; padding: var(--space-12) var(--space-10); }
.xsell > * { min-width: 0; }
.xsell.x-trust { background: var(--proof-wash); }
.xsell.x-web { background: var(--success-wash); }
.xsell img { height: 40px; width: auto; }
.xsell h2 { font-size: clamp(30px, 3.6vw, 48px); margin: var(--space-2) 0 var(--space-3); }
.xsell p { color: var(--text-muted); font-size: var(--text-md); max-width: 36em; }
.bump { display: flex; gap: var(--space-3); align-items: flex-start; margin-top: var(--space-5); padding: var(--space-4); border: 2px dashed var(--line-strong); border-radius: 12px; background: var(--bg-warm); cursor: pointer; font-weight: var(--weight-semibold); }
.bump input { width: 22px; height: 22px; margin: 1px 0 0; accent-color: var(--brand); flex: none; }
.bump:has(input:checked) { border-style: solid; border-color: var(--brand); background: var(--brand-wash); }
.x-takk { display: flex; gap: var(--space-4); align-items: flex-start; margin-top: var(--space-6); padding-top: var(--space-5); border-top: 1px solid var(--line); }
.x-takk img { height: 24px; width: auto; flex: none; margin-top: 2px; }
.x-takk p { color: var(--text-muted); font-size: var(--text-sm); }
.f-also { font-weight: var(--weight-semibold); white-space: nowrap; }

/* ---------- KUNDELOGOER (Zervo Web): karusell som glir uendelig ---------- */
.clients { margin-top: var(--space-16); padding-top: var(--space-8); border-top: 1px solid var(--line); }
.clients .note { display: block; margin-bottom: var(--space-5); }
.marquee { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.logo-track { list-style: none; margin: 0; padding: 0; display: flex; width: max-content; animation: marquee 45s linear infinite; }
.marquee:hover .logo-track { animation-play-state: paused; }
.logo-track li { flex: none; width: 200px; height: 96px; margin-right: var(--space-3); display: grid; place-items: center; background: var(--bg-warm); border: 1px solid var(--line); border-radius: 12px; padding: 14px 18px; }
.logo-track img { max-width: 100%; max-height: 60px; width: auto; height: auto; object-fit: contain; filter: grayscale(1) brightness(.6); opacity: .85; transition: filter var(--dur-base) var(--ease-out), opacity var(--dur-base) var(--ease-out); }
.logo-track li:hover img { filter: none; opacity: 1; }
.logo-track img[src*="nordic-tour"] { filter: grayscale(1) brightness(.3) contrast(1.6); }
.logo-track li:hover img[src*="nordic-tour"] { filter: none; }
@keyframes marquee { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .marquee { -webkit-mask-image: none; mask-image: none; padding: 0 var(--container-pad); }
  .logo-track { animation: none; width: auto; flex-wrap: wrap; justify-content: center; gap: var(--space-3); }
  .logo-track li { margin: 0; }
  .logo-track li[aria-hidden="true"] { display: none; }
}

/* ---------- SEO, AEO, GEO: animerte bilder (samme tempo, 8 s løkke) ---------- */
:root { --loop: 8s; }
/* SEO: søket skrives, resultatene kommer, du klatrer til #1 */
.vis-seo { justify-content: flex-start; gap: 10px; }
.g-bar { display: flex; align-items: center; gap: 8px; background: var(--kort); border: 1px solid var(--line-strong); border-radius: 999px; padding: 8px 14px; font-size: 13px; }
.g-bar svg { width: 15px; height: 15px; color: var(--text-muted); flex: none; }
.g-q { display: inline-flex; overflow: hidden; white-space: nowrap; }
.tw { display: inline-block; overflow: hidden; white-space: nowrap; max-width: 0; padding-right: 2px; border-right: 2px solid var(--ink-900); animation: tw var(--loop) steps(22) infinite; }
@keyframes tw { 0%, 4% { max-width: 0; } 24%, 96% { max-width: 22ch; } 100% { max-width: 0; } }
.g-res { position: relative; height: 128px; }
.g-r { position: absolute; left: 0; right: 0; height: 38px; display: flex; flex-direction: column; justify-content: center; padding: 0 12px; background: var(--kort); border: 1px solid var(--line); border-radius: 9px; opacity: 0; animation: resIn var(--loop) var(--ease-out) infinite; }
.g-r i { font-style: normal; font-weight: var(--weight-semibold); font-size: 13px; color: var(--brand-text); line-height: 1.15; display: flex; align-items: center; gap: 6px; }
.g-r span { font-size: 11px; color: var(--text-muted); line-height: 1.2; }
.g-r span::first-letter { color: var(--proof); }
.g-r.r1 { top: 0; animation-name: resIn, r1; } .g-r.r2 { top: 45px; animation-name: resIn, r2; } .g-r.me { top: 90px; animation-name: resIn, meUp; }
.g-r.me b { display: inline-block; font-family: var(--font-display); font-weight: var(--weight-extrabold); color: var(--brand-text); max-width: 0; overflow: hidden; animation: rank var(--loop) var(--ease-out) infinite; }
@keyframes resIn { 0%, 26% { opacity: 0; } 32%, 94% { opacity: 1; } 100% { opacity: 0; } }
@keyframes r1 { 0%, 46% { top: 0; } 58%, 100% { top: 45px; } }
@keyframes r2 { 0%, 46% { top: 45px; } 58%, 100% { top: 90px; } }
@keyframes meUp { 0%, 46% { top: 90px; border-color: var(--line); background: var(--kort); } 58%, 100% { top: 0; border-color: var(--brand); background: var(--brand-wash); box-shadow: inset 0 0 0 1px var(--brand); } }
@keyframes rank { 0%, 58% { max-width: 0; } 64%, 100% { max-width: 3ch; } }

/* AEO: Google skriver svaret, kildene kommer, du er kilden */
.vis-aeo { background: var(--brand-wash); justify-content: flex-start; gap: 9px; }
.ai-lbl { display: flex; align-items: center; gap: 6px; font-family: var(--font-display); font-weight: var(--weight-semibold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-xs); color: var(--brand-text); }
.spark { font-size: 15px; animation: spark var(--loop) ease-in-out infinite; }
@keyframes spark { 0%, 100% { transform: scale(1) rotate(0); } 10% { transform: scale(1.3) rotate(20deg); } 20% { transform: scale(1) rotate(0); } }
.vis-aeo .ln { height: 9px; border-radius: 5px; background: var(--kort); width: 0; animation: ln var(--loop) var(--ease-out) infinite; }
.vis-aeo .l1 { --w: 94%; } .vis-aeo .l2 { --w: 86%; animation-name: ln2; } .vis-aeo .l3 { --w: 58%; animation-name: ln3; }
@keyframes ln { 0%, 6% { width: 0; } 22%, 94% { width: var(--w); } 100% { width: 0; } }
@keyframes ln2 { 0%, 18% { width: 0; } 34%, 94% { width: var(--w); } 100% { width: 0; } }
@keyframes ln3 { 0%, 30% { width: 0; } 44%, 94% { width: var(--w); } 100% { width: 0; } }
.srcs { margin-top: auto; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.src-lbl { font-size: 11px; color: var(--text-muted); font-weight: var(--weight-semibold); }
.src { font-size: 11px; padding: 4px 10px; border-radius: 999px; background: var(--kort); border: 1px solid var(--line); opacity: 0; animation: srcIn var(--loop) var(--ease-out) infinite; }
.src.me { border: 2px solid var(--brand); color: var(--brand-text); font-weight: var(--weight-bold); animation-name: srcMe; }
@keyframes srcIn { 0%, 48% { opacity: 0; transform: translateY(6px); } 55%, 94% { opacity: 1; transform: none; } 100% { opacity: 0; } }
@keyframes srcMe { 0%, 54% { opacity: 0; transform: translateY(6px) scale(.9); } 62% { opacity: 1; transform: scale(1.08); } 68%, 94% { opacity: 1; transform: none; } 100% { opacity: 0; } }

/* GEO: fire AI-verktøy i et ryddig rutenett, chatten anbefaler deg */
.vis-geo { justify-content: flex-start; gap: 10px; }
.ai-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.ai-cell { height: 32px; display: grid; place-items: center; padding: 0 6px; background: var(--kort); border: 1px solid var(--line); border-radius: 8px; font-size: 11px; font-weight: var(--weight-semibold); animation: cellOn var(--loop) infinite; }
.ai-cell img { max-height: 15px; max-width: 100%; width: auto; height: auto; display: block; object-fit: contain; }
.ai-cell:nth-child(2) { animation-delay: calc(var(--loop) / 4); }
.ai-cell:nth-child(3) { animation-delay: calc(var(--loop) / 2); }
.ai-cell:nth-child(4) { animation-delay: calc(var(--loop) * 3 / 4); }
@keyframes cellOn { 0%, 24% { border-color: var(--brand); box-shadow: inset 0 0 0 1px var(--brand); } 25%, 100% { border-color: var(--line); box-shadow: none; } }
.vis-geo .chat { display: flex; flex-direction: column; gap: 8px; }
.vis-geo .q { align-self: flex-start; max-width: 92%; background: var(--kort); border: 1px solid var(--line); border-radius: 14px 14px 14px 4px; padding: 7px 11px; font-size: 12px; line-height: 1.35; opacity: 0; animation: qIn var(--loop) var(--ease-out) infinite; }
.vis-geo .slot { display: grid; justify-items: end; }
.vis-geo .slot > * { grid-area: 1 / 1; }
.vis-geo .dots { display: inline-flex; gap: 4px; padding: 10px 12px; background: var(--brand); border-radius: 14px 14px 4px 14px; opacity: 0; animation: dotsShow var(--loop) infinite; }
.vis-geo .dots i { width: 6px; height: 6px; border-radius: 50%; background: var(--kort); animation: bounce 900ms ease-in-out infinite; }
.vis-geo .dots i:nth-child(2) { animation-delay: 150ms; } .vis-geo .dots i:nth-child(3) { animation-delay: 300ms; }
.vis-geo .a { background: var(--brand); color: var(--on-blaa); border-radius: 14px 14px 4px 14px; padding: 8px 12px; font-size: 12px; line-height: 1.35; max-width: 92%; opacity: 0; animation: aIn var(--loop) var(--ease-out) infinite; }
.vis-geo .a b { font-weight: var(--weight-bold); }
@keyframes qIn { 0%, 6% { opacity: 0; transform: translateY(6px); } 14%, 94% { opacity: 1; transform: none; } 100% { opacity: 0; } }
@keyframes dotsShow { 0%, 20% { opacity: 0; } 25%, 44% { opacity: 1; } 48%, 100% { opacity: 0; } }
@keyframes aIn { 0%, 46% { opacity: 0; transform: translateY(6px); } 54%, 94% { opacity: 1; transform: none; } 100% { opacity: 0; } }
@keyframes bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }

@media (prefers-reduced-motion: reduce) {
  .tw, .g-r, .g-r.me b, .vis-aeo .ln, .src, .ai-cell, .vis-geo .q, .vis-geo .a, .vis-geo .dots, .spark { animation: none !important; }
  .tw { max-width: none; border-right: 0; }
  .g-r { opacity: 1; }
  .g-r.r1 { top: 45px; } .g-r.r2 { top: 90px; } .g-r.me { top: 0; border-color: var(--brand); background: var(--brand-wash); }
  .g-r.me b { max-width: 3ch; }
  .vis-aeo .ln { width: var(--w); }
  .src, .vis-geo .q, .vis-geo .a { opacity: 1; }
  .vis-geo .dots { display: none; }
  .ai-cell:first-child { border-color: var(--brand); }
}

/* ---------- FORSIDEN (spesifikasjon v2) ---------- */
ol.start { list-style: none; margin: 0; padding: 0; }
.steps-num .big { font-size: var(--text-5xl); line-height: .8; color: var(--accent-text); }
.steps-num .us .big { color: var(--brand-text); }
.pcards { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); }
.pcard { position: relative; background: var(--kort); border: 1px solid var(--line); border-left: 4px solid var(--danger); border-radius: var(--card-radius); padding: var(--card-pad); display: grid; grid-template-columns: auto 1fr; gap: var(--space-2) var(--space-4); align-items: start; }
.pcard .ic { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; grid-row: 1 / 3; }
.pcard h3 { font-size: var(--text-2xl); font-weight: var(--weight-extrabold); text-transform: none; line-height: 1; }
.pcard p { color: var(--text-muted); }
.pcard .eg-tag { position: absolute; top: var(--space-4); right: var(--space-4); }
.closing { margin-top: var(--space-10); font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: clamp(26px, 3vw, 40px); line-height: 1.05; max-width: 26em; }
.compare { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); }
.cmp { border-radius: var(--card-radius); padding: var(--space-8) var(--card-pad); }
.cmp h3 { font-size: var(--text-2xl); font-weight: var(--weight-extrabold); text-transform: none; min-height: 34px; display: flex; align-items: center; margin-bottom: var(--space-4); }
.cmp h3 img { height: 32px; width: auto; }
.cmp ul { list-style: none; margin: 0; padding: 0; display: grid; }
.cmp li { padding: var(--space-4) 0 var(--space-4) 36px; border-top: 1px solid var(--line); position: relative; font-size: var(--text-md); }
.cmp li::before { position: absolute; left: 0; top: var(--space-4); width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: 13px; font-weight: 700; }
.cmp.without { background: var(--bg-deep); color: var(--text-muted); }
.cmp.without h3 { color: var(--text-muted); }
.cmp.without li::before { content: "✕"; background: var(--danger-wash); color: var(--danger-text); }
.cmp.with { background: var(--kort); border: 2px solid var(--brand); }
.cmp.with li { font-weight: var(--weight-semibold); color: var(--text-heading); }
.cmp.with li::before { content: "✓"; background: var(--success); color: var(--on-blaa); }
.promise-main { display: grid; grid-template-columns: auto 1fr; gap: var(--space-10); align-items: center; background: var(--success-wash); border-top: 6px solid var(--success); border-radius: 24px; padding: var(--space-12) var(--space-10); }
.promise-main h3 { font-size: clamp(30px, 3.6vw, 48px); font-weight: var(--weight-extrabold); text-transform: none; line-height: 1; margin-bottom: var(--space-4); }
.promise-main p { font-size: var(--text-lg); max-width: 36em; }
.promise-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); margin-top: var(--space-4); }
.promise-grid article { background: var(--kort); border: 1px solid var(--line); border-top: 4px solid var(--success); border-radius: var(--card-radius); padding: var(--card-pad); }
.promise-grid h3 { font-size: var(--text-xl); font-weight: var(--weight-extrabold); text-transform: none; margin-bottom: var(--space-2); }
.promise-grid p { color: var(--text-muted); }
.terms { margin-top: var(--space-6); }
.price { display: grid; grid-template-columns: 7fr 5fr; gap: var(--space-12); align-items: center; background: var(--brand-wash); border-radius: 24px; padding: var(--space-16) var(--space-12); }
.price > * { min-width: 0; }
.price.solo { grid-template-columns: 1fr; }
.price.solo > div { max-width: 760px; }
.price h2 { font-size: clamp(40px, 5vw, 68px); margin: var(--space-5) 0 var(--space-4); }
.price p { font-size: var(--text-lg); max-width: 32em; }
.price p + p { margin-top: var(--space-3); color: var(--text-muted); }
.price .cta-row { margin-top: var(--space-8); }
.price-box { background: var(--kort); border-radius: var(--card-radius); padding: var(--space-10) var(--space-8); text-align: center; display: flex; flex-direction: column; gap: var(--space-2); }
.price-box .amount { font-family: var(--font-display); font-weight: var(--weight-extrabold); font-size: clamp(56px, 7vw, 96px); line-height: .9; color: var(--text-heading); }
.price-box .per { font-family: var(--font-display); font-weight: var(--weight-semibold); text-transform: none; letter-spacing: var(--tracking-caps); color: var(--text-muted); }
summary h3 { font: inherit; margin: 0; text-transform: inherit; }
.banner-text { font-size: var(--text-lg); color: var(--text-muted); max-width: 34em; margin: calc(-1 * var(--space-4)) 0 var(--space-8); }
.prose-wrap { max-width: 760px; }
.callout.todo { background: var(--warning-wash); border-color: transparent; }

/* ---------- ZERVO TRUST: GOOGLE REVIEW PLAYBOOK ---------- */
.pb-teaser { display: grid; grid-template-columns: auto 1fr auto; gap: var(--space-8) var(--space-10); align-items: center; background: var(--proof-wash); border-radius: 24px; padding: var(--space-10); }
.pb-teaser > * { min-width: 0; }
.pb-teaser h2 { font-size: clamp(30px, 3.6vw, 48px); margin: var(--space-2) 0 var(--space-3); }
.pb-teaser p { color: var(--text-muted); font-size: var(--text-md); max-width: 34em; }
.pb-mini { width: 120px; aspect-ratio: 3 / 4; background: var(--kort); border: 1px solid var(--line-strong); border-left: 8px solid var(--proof); border-radius: 6px 12px 12px 6px; padding: 14px 12px; display: flex; flex-direction: column; justify-content: space-between; transform: rotate(-5deg); }
.pb-mini-t { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: 15px; line-height: .95; }
.pb-mini .t-stars { font-size: 13px; }
.pb-hero h1 { font-size: clamp(52px, 7vw, 104px); }
.pb-cover-wrap { position: relative; width: 240px; max-width: 70%; aspect-ratio: 3 / 4; margin-top: var(--space-4); }
.pb-cover, .pb-page { position: absolute; inset: 0; border-radius: 8px 16px 16px 8px; }
.pb-page { background: var(--bg-deep); border: 1px solid var(--line-strong); transform: translate(14px, 10px) rotate(4deg); }
.pb-cover { background: var(--kort); border: 1px solid var(--line-strong); border-left: 12px solid var(--proof); padding: 22px 20px; display: flex; flex-direction: column; gap: 10px; transform: rotate(-3deg); position: relative; }
.pb-cover img { height: 22px; width: auto; align-self: flex-start; }
.pb-cover b { margin-top: auto; font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: 34px; line-height: .9; }
.pb-cover .t-stars { font-size: 20px; }
.pb-sub { font-size: var(--text-sm); color: var(--text-muted); font-weight: var(--weight-semibold); }
.pb-form .note { display: block; margin-bottom: var(--space-4); }
.value { display: inline-flex; align-items: baseline; flex-wrap: wrap; gap: 6px 12px; margin: calc(-1 * var(--space-3)) 0 var(--space-6); padding: 10px 16px; border-radius: 12px; background: var(--proof-wash); border: 1px solid var(--proof); }
.value span { font-family: var(--font-display); font-weight: var(--weight-semibold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-sm); color: var(--proof-text); }
.value s { font-family: var(--font-display); font-weight: var(--weight-extrabold); font-size: var(--text-2xl); color: var(--text-muted); text-decoration-thickness: 3px; text-decoration-color: var(--danger); }
.value b { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-2xl); color: var(--success-text); }
.pb-form .note s, .pb-teaser .zv-eyebrow s { text-decoration-color: var(--danger); text-decoration-thickness: 2px; }
.pb-stamp { position: absolute; top: -14px; right: -14px; width: 76px; height: 76px; border-radius: 50%; background: var(--proof); color: var(--ink-900); display: grid; place-items: center; text-align: center; font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: 13px; line-height: 1; transform: rotate(10deg); }
.fields.one { grid-template-columns: 1fr; }
.pb-form .btn { width: 100%; justify-content: center; }

/* ---------- FLATER OG BOKSER ----------
   Hver seksjon har sin egen form, så siden er lett å skanne. Kort: hårlinje, radius, ingen skygge. */
:root { --card-pad: var(--space-6); --card-radius: 16px; }
.box { background: var(--kort); border: 1px solid var(--line); border-radius: var(--card-radius); padding: var(--card-pad); }

/* Hero: fagene som små bokser */
.trades { border-top: 0; padding-top: 0; gap: var(--space-3); }
.trades span:not(.note) { font-size: var(--text-lg); padding: 10px 16px; border: 1px solid var(--line-strong); border-radius: var(--radius-md); background: var(--kort); }
.trades .trade { display: inline-flex; align-items: center; gap: 10px; }
.trades .trade svg { width: 22px; height: 22px; color: var(--brand-text); flex: none; }
.trades .note { flex-basis: 100%; }

/* Problemet: én boks med dagens situasjon, kalkulatoren i egen boks */
.problem .stack { background: var(--kort); border: 1px solid var(--line); border-radius: var(--card-radius); padding: var(--card-pad); }
.problem .stack > .note { margin-bottom: var(--space-2); }
.problem .stack .nt { background: var(--danger-wash); border-color: transparent; }
.problem .stack .nt .ic.red { background: var(--kort); }

/* Systemet: hver funksjon er et kort, streken går langs toppkanten */
.tile { background: var(--bg-warm); border: 1px solid var(--line); border-radius: var(--card-radius); padding: 0 var(--card-pad) var(--card-pad); overflow: hidden; display: flex; flex-direction: column; }
.warm .tile { background: var(--kort); }
.tile .bar { height: 5px; margin: 0 calc(-1 * var(--card-pad)); }
.tile .more { margin-top: auto; padding-top: var(--space-4); }
.screen { background: var(--kort); }
.warm .screen { background: var(--bg-warm); }
.warm .screen .nt { background: var(--kort); }

/* Kom i gang: tre kort med farget topp */
.start > * { background: var(--kort); border: 1px solid var(--line); border-top: 1px solid var(--strek); border-radius: var(--card-radius); padding: var(--card-pad); }

/* Alt er med + garanti: små bokser i rutenett */
.stack-all { gap: var(--space-3); }
.stack-all div { background: var(--bg-warm); border: 1px solid var(--line); border-radius: 12px; padding: var(--space-4) var(--space-5); }
.risk { gap: var(--space-4); grid-template-columns: 1.2fr 1fr 1fr 1fr; }
.risk > div { background: var(--bg-warm); border-radius: var(--card-radius); padding: var(--card-pad); border: 1px solid var(--line); }
.risk > .zv-stamp { background: var(--success-wash); border-color: transparent; border-top: 6px solid var(--success); }
.risk h3 { border-top: 0; padding-top: 0; }

/* Underside: poeng som kort, andre funksjoner som klikkbare kort */
.points > div { background: var(--kort); border: 1px solid var(--line); border-radius: var(--card-radius); padding: var(--card-pad); }
.points h3 { border-top: 0; padding-top: 0; }
.others a { background: var(--bg-warm); border: 1px solid var(--line); border-radius: var(--card-radius); padding: var(--card-pad); }
.others a:hover { border-color: var(--blaa-tekst); }

/* Spørsmål: hvert spørsmål i sin egen boks */
.faq { display: grid; gap: var(--space-3); }
details, details:last-of-type { background: var(--kort); border: 1px solid var(--line); border-radius: 12px; padding: 0 var(--space-6); }
details[open] { border-color: var(--line-strong); }

/* Avslutning: stort banner */
.banner { background: var(--brand-wash); border-radius: 24px; padding: var(--space-20) var(--space-16); }
.final h2 { margin-top: var(--space-5); }

@media (max-width: 1024px) {
  .motor, .motor.three, .motor.six { grid-template-columns: 1fr 1fr; gap: var(--space-12) var(--space-6); }
  .stack-all { grid-template-columns: 1fr 1fr; }
  .sysmap { grid-template-columns: 1fr 1fr; }
  .price { grid-template-columns: 1fr; }
  .promise-grid { grid-template-columns: 1fr 1fr 1fr; }
  .feat4 { grid-template-columns: 1fr 1fr; }
  .prod-hero-grid, .prod-contact, .pack, .app-grid { grid-template-columns: 1fr; }
  .pb-teaser { grid-template-columns: auto 1fr; }
  .pb-teaser .btn { grid-column: 1 / -1; justify-self: start; }
  .xsell { grid-template-columns: 1fr; justify-items: start; }
  .variants { grid-template-columns: 1fr 1fr 1fr; gap: var(--space-3); }
  .f-top { grid-template-columns: 1fr 1fr 1fr; }
  .f-cta { grid-column: 1 / -1; }
  .a-grid { grid-template-columns: minmax(0, 1fr); }
  .toc { display: none; }
  .a-list { grid-template-columns: 1fr 1fr; }
  .guarantee { grid-template-columns: 1fr; justify-items: start; padding: var(--space-12) var(--space-8); }
  .risk { grid-template-columns: 1fr 1fr; }
  .banner { padding: var(--space-16) var(--space-10); }
}
@media (max-width: 760px) {
  section { padding: var(--space-20) 0; }
  .nav .links a.t { display: none; }
  .hero { padding: var(--space-10) 0 var(--space-16); }
  .head { margin-bottom: var(--space-10); }
  .problem { grid-template-columns: 1fr; gap: var(--space-10); }
  .motor, .motor.three, .motor.six { grid-template-columns: 1fr; gap: var(--space-12); }
  .stack-all { grid-template-columns: 1fr; }
  .search3, .sysmap { grid-template-columns: 1fr; }
  .tile h3 { min-height: 0; }
  .points, .others { grid-template-columns: 1fr; gap: var(--space-8); }
  .start { grid-template-columns: 1fr; gap: var(--space-10); }
  .risk { grid-template-columns: 1fr; gap: var(--space-8); }
  .foot a { margin: 0 var(--space-5) 0 0; }
  .banner { padding: var(--space-10) var(--space-5); border-radius: 16px; }
  :root { --card-pad: var(--space-5); }
}
@media (prefers-reduced-motion: reduce) {
  [data-in] { opacity: 1; transform: none; }
}

/* ---------- MOBIL (under 760px): samlet gjennomgang ---------- */
@media (max-width: 760px) {
  :root { --container-pad: 20px; }
  section { padding: var(--space-16) 0; }
  .nav-in { height: 60px; }
  .nav img { height: 24px; }
  .nav .btn.sm { padding: 10px 14px; font-size: var(--text-sm); }
  .head { margin-bottom: var(--space-8); }
  .head h2 { font-size: clamp(34px, 9.5vw, 44px); }
  .head p { font-size: var(--text-md); }
  .note { font-size: var(--text-xs); }

  /* Hero */
  .hero { padding: var(--space-8) 0 var(--space-12); }
  .hero h1 { font-size: clamp(44px, 12.5vw, 60px); margin: var(--space-3) 0 var(--space-5); }
  .hero.sub h1 { font-size: clamp(40px, 11vw, 54px); }
  .hero .ingress { font-size: var(--text-md); margin-bottom: var(--space-6); }
  .cta-row { gap: var(--space-3); }
  .cta-row .btn { width: 100%; justify-content: center; }
  .trades { margin-top: var(--space-10); display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2); }
  .trades .note { grid-column: 1 / -1; }
  .trades span:not(.note) { font-size: var(--text-base); padding: 10px 12px; }
  .trades .trade svg { width: 18px; height: 18px; }

  /* Problemet og kalkulatoren */
  .problem .stack { padding: var(--space-4); }
  .cost .calc { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); padding: var(--space-6) var(--space-4); border-radius: 18px; }
  .cost .op { display: none; }
  .cost input { width: 100%; min-width: 0; font-size: var(--text-xl); padding: 10px 12px; }
  .cost label { min-width: 0; }
  .cost .total { grid-column: 1 / -1; margin-top: var(--space-2); padding-top: var(--space-4); }
  .cost .total b { font-size: clamp(44px, 14vw, 64px); }

  /* Systemet */
  .tile { padding: 0 var(--space-4) var(--space-5); }
  .tile .bar { margin: 0 calc(-1 * var(--space-4)); }
  .tile h3 { font-size: var(--text-xl); }
  .motor.six .screen { height: 232px; }

  /* Kom i gang, alt er med, garanti */
  .start .big { font-size: var(--text-3xl); }
  .stack-all { grid-template-columns: 1fr 1fr; gap: var(--space-2); }
  .stack-all div { padding: var(--space-3); }
  .stack-all b { font-size: var(--text-base); }
  .stack-all span { font-size: var(--text-xs); }
  .guarantee { padding: var(--space-8) var(--space-5); gap: var(--space-6); border-radius: 18px; }

  /* Spørsmål, banner, bunn */
  summary { font-size: var(--text-lg); padding: var(--space-4) 0; min-height: 44px; }
  details, details:last-of-type { padding: 0 var(--space-4); }
  details p { font-size: var(--text-base); }
  .final h2, .banner h2 { font-size: clamp(38px, 11vw, 52px); margin: var(--space-3) 0 var(--space-6); }
  .banner { padding: var(--space-8) var(--space-5); }
  .site-foot { padding: var(--space-16) 0 var(--space-6); }
  .f-top { grid-template-columns: 1fr 1fr; gap: var(--space-8) var(--space-5); }
  .f-cta .btn { width: 100%; justify-content: center; }
  .f-col:last-child { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; gap: 0 var(--space-5); }
  .f-col:last-child .note { width: 100%; }
  .f-logo { margin: var(--space-12) 0 var(--space-4); }
  .f-bottom { flex-direction: column; font-size: var(--text-xs); }
  .foot { flex-direction: column; align-items: flex-start; }
  .foot span { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); }
  .foot a { margin: 0; }

  /* Undersider og artikler */
  .points h3, .risk h3 { font-size: var(--text-2xl); }
  .s-card h3 { font-size: var(--text-xl); }
  .ahead b { font-size: var(--text-lg); }
  .a-list { grid-template-columns: 1fr; }
  .a-card.big { padding: var(--space-6) var(--space-5); margin-bottom: var(--space-10); }
  .a-hero h1 { font-size: clamp(34px, 9.5vw, 44px); }
  .a-body { padding-top: var(--space-6); }
  .prose { font-size: var(--text-base); }
  .prose h2 { font-size: clamp(26px, 7.5vw, 34px); margin-top: var(--space-10); }
  .kort { padding: var(--space-5); }
  .kort p { font-size: var(--text-md); }
  .a-cta { padding: var(--space-6) var(--space-5); }
  .m-card b { font-size: var(--text-lg); }

  /* Booking */
  .book { padding: var(--space-6) 0 var(--space-16); }
  .book h1 { font-size: clamp(36px, 10vw, 46px); margin-top: var(--space-6); }
  .steps-bar li { padding: 6px 10px 6px 6px; font-size: var(--text-xs); }
  .steps-bar li span { width: 22px; height: 22px; }
  .book-grid, .time-grid { grid-template-columns: 1fr; gap: var(--space-6); }
  .cal-grid button { min-height: 0; }
  .cal-days, .cal-grid { gap: 4px; }
  .slots { grid-template-columns: repeat(3, 1fr); }
  .book-side { position: static; }
  .book-card { padding: var(--space-5); }
  .fields { grid-template-columns: 1fr; gap: var(--space-4); }
  .book-card .btn { width: 100%; min-width: 0; }
  .confirm-bar { position: sticky; bottom: env(safe-area-inset-bottom, 0px); padding: var(--space-3) var(--space-4); box-shadow: var(--shadow-raised); }
  .confirm-bar .btn { width: 100%; justify-content: center; }
  .confirm-bar .back { order: 3; }
  .details { grid-template-columns: 1fr; gap: var(--space-4); }
  .next3 { grid-template-columns: 1fr; }

  /* Produktsider */
  .brandmark img { height: 22px; }
  .brandmark span { font-size: var(--text-sm); padding: 2px 7px; }
  .brandmark.big img { height: 30px; }
  .prod .hero h1 { font-size: clamp(40px, 11vw, 52px); }
  .feat4, .feat3 { grid-template-columns: 1fr; gap: var(--space-3); }
  .f-card h3 { font-size: var(--text-xl); }
  .web-vis .browser.big .b-body { padding: var(--space-5); min-height: 0; }
  .b-cards span { height: 44px; }
  .trust-vis { height: 300px; }
  .t-card { width: 72%; padding: var(--space-4); }
  .t-card b { font-size: 30px; }
  .t-stars { font-size: 20px; }
  .t-phone { width: 42%; border-radius: 22px; }
  .pack { padding: var(--space-8) var(--space-5); border-radius: 18px; gap: var(--space-6); }
  .pack h2 { font-size: clamp(34px, 9.5vw, 44px); }
  .pack p { font-size: var(--text-md); }
  .variants { grid-template-columns: 1fr; }
  .v-card h3 { font-size: var(--text-2xl); }
  .v-ill { height: 170px; }
  .app-grid { gap: var(--space-8); }
  .app-grid h2 { font-size: clamp(34px, 9.5vw, 44px); }
  .fair { grid-template-columns: 1fr; padding: var(--space-8) var(--space-5); gap: var(--space-5); border-radius: 18px; }
  .fair-ic { width: 64px; height: 64px; font-size: 32px; }
  .fair p { font-size: var(--text-md); }
  .t-btn { font-size: 10px; padding: 7px 4px; }
  .xsell { padding: var(--space-8) var(--space-5); gap: var(--space-5); border-radius: 18px; }
  .xsell img { height: 30px; }
  .xsell .btn { width: 100%; justify-content: center; }
  .x-takk { flex-direction: column; gap: var(--space-2); }
  .clients { margin-top: var(--space-10); }
  .logo-track li { width: 150px; height: 76px; padding: 10px 12px; margin-right: var(--space-2); }
  .logo-track img { max-height: 46px; }
  .alt-call .btn.ghost, .book-actions > .btn { width: 100%; justify-content: center; }
  /* Forsiden */
  .pcards, .compare, .promise-grid { grid-template-columns: 1fr; gap: var(--space-3); }
  .pcard h3 { font-size: var(--text-xl); }
  .closing { font-size: clamp(22px, 6.5vw, 28px); }
  .cmp { padding: var(--space-6) var(--space-5); }
  .promise-main { grid-template-columns: 1fr; padding: var(--space-8) var(--space-5); gap: var(--space-5); border-radius: 18px; }
  .price { padding: var(--space-8) var(--space-5); border-radius: 18px; gap: var(--space-6); }
  .price h2 { font-size: clamp(34px, 9.5vw, 44px); }
  .price p { font-size: var(--text-md); }
  .steps-num .big { font-size: var(--text-4xl); }
  .pb-teaser { grid-template-columns: 1fr; padding: var(--space-8) var(--space-5); border-radius: 18px; gap: var(--space-5); }
  .pb-teaser .btn { width: 100%; justify-content: center; }
  .pb-mini { width: 96px; }
  .pb-cover-wrap { width: 180px; }
  .pb-cover b { font-size: 26px; }
}

/* ---------- Zervo Trust: produktsider (Stand, Card, Plate) ---------- */
a.v-card { color: inherit; text-decoration: none; transition: transform var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out); }
a.v-card:hover { transform: translateY(-3px); border-color: var(--proof); box-shadow: 0 10px 24px -14px rgba(0,0,0,.25); }
a.v-card:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 3px; }
.v-more { margin-top: auto; font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-sm); color: var(--brand-text); }
.variants.two { grid-template-columns: repeat(2, 1fr); max-width: 820px; }

.pp-grid { display: grid; grid-template-columns: 5fr 6fr; gap: var(--space-12); align-items: start; }
.pp-grid > * { min-width: 0; }
.pg { display: flex; flex-direction: column; gap: var(--space-3); }
.pg-main { position: relative; }
.pg-track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; border-radius: var(--card-radius); border: 1px solid var(--line); background: var(--bg-warm); }
.pg-track::-webkit-scrollbar { display: none; }
.pg-track:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 3px; }
.pg-slide { flex: 0 0 100%; margin: 0; aspect-ratio: 4 / 5; scroll-snap-align: start; max-width: 100%; }
.pg-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ph { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-3); position: relative; padding: var(--space-6); text-align: center;
  background: repeating-linear-gradient(135deg, transparent 0 14px, rgba(0,0,0,.025) 14px 28px), var(--proof-wash); }
.ph-ill { display: flex; flex-direction: column; align-items: center; margin-bottom: var(--space-4); }
.ph-t { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-2xl); line-height: 1; }
.ph-c { color: var(--text-muted); max-width: 26ch; }
.ph-r { position: absolute; top: 14px; left: 14px; padding: 3px 8px; border-radius: 6px; background: var(--kort); border: 1px solid var(--line-strong); font-family: var(--font-display); font-weight: var(--weight-bold); font-size: var(--text-sm); }
.ph-sm { background: var(--proof-wash); font-family: var(--font-display); font-weight: var(--weight-extrabold); font-size: var(--text-lg); color: var(--text-muted); padding: 0; gap: 0; }
.pg-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line-strong); background: var(--kort); font-size: 18px; font-weight: 700; cursor: pointer; display: grid; place-items: center; box-shadow: 0 6px 16px -8px rgba(0,0,0,.3); }
.pg-nav.prev { left: 12px; } .pg-nav.next { right: 12px; }
.pg-nav:disabled { opacity: 0; pointer-events: none; }
.pg-count { position: absolute; bottom: 12px; right: 12px; padding: 4px 10px; border-radius: 999px; background: var(--ink-900); color: var(--on-blaa); font-size: var(--text-sm); font-variant-numeric: tabular-nums; }
.pg-thumbs { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--space-2); }
.pg-thumb { padding: 0; border: 2px solid transparent; border-radius: 10px; overflow: hidden; aspect-ratio: 4 / 5; cursor: pointer; background: none; max-width: 100%; }
.pg-thumb > * { width: 100%; height: 100%; display: grid; place-items: center; object-fit: cover; }
.pg-thumb[aria-current="true"] { border-color: var(--brand); }
.pg-thumb:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }

.pp-info { display: flex; flex-direction: column; gap: var(--space-4); }
.pp-info h1 { margin: 0; }
.pp-info .ingress { margin: 0; }
.pp-crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-size: var(--text-sm); color: var(--text-muted); }
.pp-crumbs a { color: var(--text-muted); }
.pp-crumbs [aria-current] { color: var(--text); font-weight: var(--weight-semibold); }
.pp-tag { margin: 0; font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; font-size: var(--text-xl); color: var(--brand-text); }
.pp-steder { display: flex; flex-direction: column; gap: var(--space-2); }
.pp-steder > div { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.pp-sted { padding: 6px 12px; border-radius: 999px; background: var(--proof-wash); border: 1px solid var(--proof); font-weight: var(--weight-medium); font-size: var(--text-sm); }
.pp-fakta { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); }
.pp-fakta > div { background: var(--bg-warm); border: 1px solid var(--line); border-radius: 12px; padding: var(--space-4); display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pp-fakta b { font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; }
.pp-fakta span { color: var(--text-muted); font-size: var(--text-sm); }

@media (max-width: 900px) {
  .pp-grid { grid-template-columns: 1fr; gap: var(--space-8); }
  .pg { max-width: 520px; width: 100%; margin-inline: auto; }
}
@media (max-width: 760px) {
  .variants.two { grid-template-columns: 1fr; }
  .pp-fakta { grid-template-columns: 1fr; }
  .pg-nav { display: none; }
  .pg-thumbs { gap: 6px; }
  .pp-info .cta-row .btn { width: 100%; justify-content: center; }
}
.v-ill .v-foto { width: 100%; height: 100%; object-fit: cover; object-position: center 47%; transform: scale(1.15); transition: transform var(--dur-base, .3s) var(--ease-out); }
a.v-card:hover .v-foto { transform: scale(1.22) rotate(-1deg); }
.v-ill:has(.v-foto) { height: 240px; }
.pg-track { background: #f1f2f4; }

/* ---------- Zervo Trust: produktside som nettbutikk ---------- */
section.shop { padding: var(--space-6) 0 var(--space-24); }
.shop .pp-crumbs { margin-bottom: var(--space-5); }
.shop .pp-grid { grid-template-columns: 7fr 5fr; gap: var(--space-12); }
.shop .pg { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 88px); display: grid; grid-template-columns: 76px 1fr; gap: var(--space-3); align-items: start; }
.shop .pg-thumbs { grid-column: 1; grid-row: 1; grid-template-columns: 1fr; }
.shop .pg-main { grid-column: 2; grid-row: 1; }
.shop .pg-track { border-radius: 16px; }

.buy { display: flex; flex-direction: column; gap: var(--space-5); }
.buy h1 { margin: 0; font-size: clamp(2.5rem, 5vw, 4rem); line-height: .95; }
.buy-kat { font-family: var(--font-display); font-weight: var(--weight-semibold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-sm); color: var(--text-muted); margin-bottom: calc(-1 * var(--space-3)); }
.buy-tag { margin: calc(-1 * var(--space-2)) 0 0; font-size: var(--text-lg); color: var(--text-muted); }
.buy-pris { display: flex; flex-direction: column; gap: 2px; padding: var(--space-4) 0; border-block: 1px solid var(--line); }
.buy-pris b { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-2xl); }
.buy-pris span { color: var(--text-muted); font-size: var(--text-sm); }
.buy-txt { margin: 0; }
.buy-l { display: block; font-size: var(--text-sm); color: var(--text-muted); margin-bottom: var(--space-2); }
.buy-l b { color: var(--text); }
.sws { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-2); }
.sw { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 6px 6px 10px; border: 1px solid var(--line-strong); border-radius: 12px; color: inherit; text-decoration: none; background: var(--kort); transition: border-color var(--dur-fast) var(--ease-out); }
.sw:hover { border-color: var(--ink-900); }
.sw[aria-current] { border: 2px solid var(--brand); padding: 5px 5px 9px; }
.sw-img { width: 100%; aspect-ratio: 1; border-radius: 8px; overflow: hidden; background: #f1f2f4; display: block; }
.sw-img img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.3); }
.sw-n { font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; font-size: var(--text-sm); }
.buy-row { display: flex; gap: var(--space-3); align-items: flex-end; }
.buy-row .buy-opt { flex: 0 0 auto; }
.qty { display: inline-flex; align-items: center; height: 52px; border: 1px solid var(--line-strong); border-radius: 12px; overflow: hidden; background: var(--kort); }
.qty button { width: 44px; height: 100%; border: 0; background: none; font-size: 20px; cursor: pointer; }
.qty button:hover { background: var(--bg-warm); }
.qty input { width: 44px; height: 100%; border: 0; text-align: center; font: inherit; font-weight: var(--weight-semibold); -moz-appearance: textfield; }
.qty input::-webkit-outer-spin-button, .qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.buy-btn { flex: 1; height: 52px; justify-content: center; }
.buy-note { margin: calc(-1 * var(--space-2)) 0 0; font-size: var(--text-sm); color: var(--text-muted); }
.buy-trygt { list-style: none; margin: 0; padding: var(--space-4); display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2) var(--space-4); background: var(--bg-warm); border-radius: 12px; font-size: var(--text-sm); font-weight: var(--weight-medium); }
.buy-trygt li { display: flex; gap: 8px; align-items: center; }
.buy-trygt span { width: 20px; height: 20px; border-radius: 50%; background: var(--success-text); color: var(--on-blaa); display: grid; place-items: center; font-size: 11px; flex: none; }
.acc { border-top: 1px solid var(--line); }
.acc details, .acc details:last-of-type { border: 0; border-bottom: 1px solid var(--line); border-radius: 0; padding: 0; background: none; }
.acc summary { list-style: none; cursor: pointer; padding: var(--space-4) 0; display: flex; justify-content: space-between; align-items: center; font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; }
.acc summary::-webkit-details-marker { display: none; }
.acc summary::after, .acc details[open] summary::after { content: "+"; font-size: 22px; line-height: 1; transition: transform var(--dur-fast) var(--ease-out); }
.acc details[open] summary::after { transform: rotate(45deg); }
.acc details > div { padding-bottom: var(--space-5); display: flex; flex-direction: column; gap: var(--space-3); color: var(--text-muted); }
.acc details > div p { margin: 0; padding: 0; font-size: inherit; }
.acc summary h3, .acc summary { font-size: var(--text-md); color: var(--text); }
.acc .pp-steder { flex-direction: row; flex-wrap: wrap; }
.acc-steg { margin: 0; padding: 0; list-style: none; counter-reset: s; display: flex; flex-direction: column; gap: var(--space-3); }
.acc-steg li { counter-increment: s; display: grid; grid-template-columns: 28px 1fr; column-gap: var(--space-3); }
.acc-steg li::before { content: counter(s); grid-row: span 2; width: 28px; height: 28px; border-radius: 50%; background: var(--brand-wash); color: var(--brand-text); display: grid; place-items: center; font-weight: var(--weight-bold); font-size: var(--text-sm); }
.acc-steg b { color: var(--text); }

.shop-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 340px)); gap: var(--space-5); }
.shop-card { display: flex; flex-direction: column; background: var(--kort); border: 1px solid var(--line); border-radius: var(--card-radius); overflow: hidden; color: inherit; text-decoration: none; transition: transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out); }
.shop-card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px -16px rgba(0,0,0,.3); }
.shop-img { aspect-ratio: 4 / 5; background: var(--proof-wash); display: flex; align-items: center; justify-content: center; overflow: hidden; max-width: 100%; }
.shop-body { padding: var(--space-4) var(--space-5) 0; display: flex; flex-direction: column; gap: 4px; }
.shop-kat { font-size: var(--text-sm); color: var(--text-muted); }
.shop-body b { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-2xl); line-height: 1; }
.shop-txt { color: var(--text-muted); font-size: var(--text-sm); }
.shop-pris { font-weight: var(--weight-semibold); margin-top: 4px; }
.shop-card .v-more { padding: var(--space-4) var(--space-5) var(--space-5); }

.buy-bar { display: none; }
@media (max-width: 900px) {
  .shop .pp-grid { grid-template-columns: 1fr; gap: var(--space-6); }
  .shop .pg { position: static; grid-template-columns: 1fr; }
  .shop .pg-main { grid-column: 1; grid-row: 1; }
  .shop .pg-thumbs { grid-column: 1; grid-row: 2; grid-template-columns: repeat(5, 1fr); }
}
@media (max-width: 760px) {
  .buy-row { flex-wrap: wrap; }
  .buy-row .buy-btn { flex: 1 1 100%; }
  .buy-trygt { grid-template-columns: 1fr; }
  .shop-grid { grid-template-columns: 1fr 1fr; gap: var(--space-3); }
  .shop-body { padding: var(--space-3) var(--space-3) 0; }
  .shop-body b { font-size: var(--text-xl); }
  .shop-txt { display: none; }
  .shop-card .v-more { padding: var(--space-3); font-size: 12px; }
  .buy-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: var(--z-sticky); display: flex; align-items: center; gap: var(--space-3); padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px)); background: rgba(255,255,255,.96); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-top: 1px solid var(--line); transform: translateY(110%); transition: transform var(--dur-base, .3s) var(--ease-out); }
  .buy-bar.on { transform: none; }
  .buy-bar[hidden] { display: none !important; }
  .bb-img { width: 44px; height: 44px; border-radius: 8px; overflow: hidden; background: #f1f2f4; flex: none; }
  .bb-img img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.3); }
  .bb-t { display: flex; flex-direction: column; flex: 1; min-width: 0; line-height: 1.2; }
  .bb-t b { font-family: var(--font-display); text-transform: none; }
  .bb-t span { font-size: var(--text-sm); color: var(--text-muted); }
}

/* Krysssalg til Trust med transparent produktbilde */
.xsell.has-foto { grid-template-columns: 200px 1fr auto; padding-block: var(--space-8); }
.xsell .xs-foto { height: 220px; width: auto; max-width: 100%; margin: calc(-1 * var(--space-6)) 0; filter: drop-shadow(0 18px 24px rgba(0,0,0,.12)); }
.xsell .xs-logo { height: 28px; display: block; margin-bottom: var(--space-3); }
@media (max-width: 900px) {
  .xsell.has-foto { grid-template-columns: 1fr; } .xsell .xs-foto { height: 200px; margin: 0; justify-self: center; }
}

/* Produktkort i nettbutikkstil: hvitt kort, bildet går helt ut til kanten */
.v-card:has(.v-foto) { background: var(--kort); padding: 0; gap: 0; overflow: hidden; }
.v-card:has(.v-foto) > :not(.v-ill) { padding-inline: var(--space-6); }
.v-card:has(.v-foto) h3 { padding-top: var(--space-5); }
.v-card:has(.v-foto) p { padding-top: var(--space-2); }
.v-card:has(.v-foto) .v-more { padding-block: var(--space-4) var(--space-6); }
.v-ill:has(.v-foto) { height: auto; aspect-ratio: 1 / 1; border-radius: 0; background: #f1f2f4; max-width: 100%; }
.v-ill .v-foto { width: 100%; height: 100%; object-fit: cover; object-position: center 48%; transform: scale(1.2); transition: transform var(--dur-base, .3s) var(--ease-out); }
a.v-card:hover .v-foto { transform: scale(1.26); }
.shop-img { aspect-ratio: 1 / 1; background: #f1f2f4; }
.shop-img .v-foto { width: 100%; height: 100%; object-fit: cover; object-position: center 48%; transform: scale(1.2); transition: transform var(--dur-base, .3s) var(--ease-out); }
.shop-card:hover .v-foto { transform: scale(1.26); }
a.v-card:hover { border-color: var(--line-strong); }
.kombiner { border-top: 1px solid var(--line); }
.pp-sted { background: var(--kort); border-color: var(--line-strong); }

/* Kontaktperson ved skjemaet */
.kontakt-person { display: flex; align-items: center; gap: var(--space-4); margin-top: var(--space-6); padding: var(--space-4); background: var(--kort); border: 1px solid var(--line); border-radius: 16px; max-width: 360px; }
.kontakt-person img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; flex: none; }
.kontakt-person div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.kontakt-person b { font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; font-size: var(--text-lg); line-height: 1.1; }
.kontakt-person span { color: var(--text-muted); font-size: var(--text-sm); }
/* Zervo Trust på Core-forsiden */
section.core-trust { padding-top: 0; }
.xsell.x-plain { background: var(--kort); border: 1px solid var(--line-strong); }
.xsell.x-plain .xs-foto { height: auto; width: 100%; margin: 0; }
.xsell.has-foto.x-plain { grid-template-columns: 260px 1fr auto; } @media (max-width: 900px) {
  .xsell.has-foto.x-plain { grid-template-columns: 1fr; } .xsell.x-plain .xs-foto { max-width: 280px; }
}
.buy-pris-l { font-size: var(--text-sm); color: var(--text-muted); text-transform: none; letter-spacing: var(--tracking-caps); font-family: var(--font-display); font-weight: var(--weight-semibold); }
.buy-pris b { font-size: var(--text-3xl); line-height: 1; }
.buy-pris b small { font-size: var(--text-lg); font-weight: var(--weight-semibold); color: var(--text-muted); margin-left: 2px; }
.buy-pris b.pl { font-size: inherit; color: var(--text); font-weight: var(--weight-bold); font-family: inherit; text-transform: none; }
.buy-sum { margin: calc(-1 * var(--space-2)) 0 0; font-size: var(--text-md); }
.buy-sum b { font-variant-numeric: tabular-nums; }
/* Bindingsvalg i kjøpsboksen */
.bind { border: 0; margin: 0; padding: 0; display: grid; gap: var(--space-2); }
.bind legend { padding: 0; }
.bind-opt { position: relative; display: flex; align-items: center; gap: var(--space-3); padding: 14px 16px; border: 1px solid var(--line-strong); border-radius: 12px; background: var(--kort); cursor: pointer; transition: border-color var(--dur-fast) var(--ease-out); }
.bind-opt:hover { border-color: var(--ink-900); }
.bind-opt input { width: 20px; height: 20px; accent-color: var(--brand); flex: none; margin: 0; }
.bind-opt span { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.bind-opt b { font-weight: var(--weight-semibold); }
.bind-opt small { color: var(--text-muted); font-size: var(--text-sm); }
.bind-opt em { font-style: normal; font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; font-size: 12px; letter-spacing: var(--tracking-caps); padding: 4px 8px; border-radius: 999px; background: var(--success-wash); color: var(--success-text); white-space: nowrap; }
.bind-opt:has(input:checked) { border: 2px solid var(--brand); padding: 13px 15px; }
.bind-opt:has(input:focus-visible) { outline: 2px solid var(--focus-ring); outline-offset: 2px; }

/* ---------- Zervo Trust: hero-animasjon (tapp → valg → Google → takk), 12 s løkke ---------- */
.th-pts { list-style: none; margin: 0 0 var(--space-6); padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-2); }
.th-pts li { padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--kort); font-size: var(--text-sm); font-weight: var(--weight-medium); }
.th-pts li::before { content: "✓ "; color: var(--success-text); font-weight: 700; }

.th { --t: 12s; position: relative; height: 540px; max-width: 560px; width: 100%; justify-self: end; }
.th-glow { position: absolute; inset: 8% 0 4% 6%; border-radius: 40px; background: radial-gradient(60% 60% at 40% 60%, var(--brand-wash), transparent 70%); }
.th-prod { position: absolute; left: 0; bottom: 30px; width: 58%; }
.th-prod img { width: 100%; height: auto; display: block; filter: drop-shadow(0 30px 30px rgba(20,30,60,.18)); }
.th-waves { position: absolute; left: 27%; top: 62%; width: 0; height: 0; }
.th-waves i { position: absolute; left: -40px; top: -40px; width: 80px; height: 80px; border-radius: 50%; border: 3px solid var(--brand); opacity: 0; animation: th-wave var(--t) var(--ease-out) infinite; }
.th-waves i:nth-child(2) { animation-delay: .18s; }
.th-waves i:nth-child(3) { animation-delay: .36s; }
.th-plus { position: absolute; left: 50%; top: 4%; transform: translateX(-50%); white-space: nowrap; padding: 8px 14px; border-radius: 999px; background: var(--ink-900); color: var(--on-blaa); font-size: var(--text-sm); box-shadow: 0 12px 24px -10px rgba(0,0,0,.35); opacity: 0; animation: th-plus var(--t) var(--ease-out) infinite; }
.th-plus b { color: #fbbc04; }

.th-phone { position: absolute; right: 0; top: 0; width: 250px; height: 510px; border-radius: 40px; background: #111; padding: 10px; box-shadow: 0 40px 60px -30px rgba(20,30,60,.45), inset 0 0 0 2px #2a2a2a; animation: th-phone var(--t) cubic-bezier(.4,0,.2,1) infinite; transform-origin: 50% 80%; }
.th-notch { position: absolute; left: 50%; top: 18px; transform: translateX(-50%); width: 72px; height: 20px; border-radius: 12px; background: #111; z-index: 3; }
.th-screen { position: relative; width: 100%; height: 100%; border-radius: 31px; overflow: hidden; background: #fff; }
.th-s { position: absolute; inset: 0; padding: 52px 18px 22px; display: flex; flex-direction: column; align-items: center; gap: 12px; opacity: 0; }
.s0 { background: linear-gradient(160deg, #1d2b4f, #0e1424); color: #fff; justify-content: space-between; animation: th-s0 var(--t) linear infinite; }
.th-time { font-size: 44px; font-weight: 300; letter-spacing: -1px; margin-top: 18px; }
.th-hold { display: flex; flex-direction: column; align-items: center; gap: 14px; font-size: 13px; opacity: .85; text-align: center; }
.th-ring { width: 54px; height: 54px; border-radius: 50%; border: 2px solid rgba(255,255,255,.6); animation: th-pulse 1.2s ease-in-out infinite; }

.s1 { animation: th-s1 var(--t) var(--ease-out) infinite; justify-content: center; }
.th-av { width: 56px; height: 56px; border-radius: 50%; background: var(--brand); color: #fff; display: grid; place-items: center; font-family: var(--font-display); font-weight: 800; font-size: 20px; }
.th-biz { font-family: var(--font-display); font-weight: 800; text-transform: none; font-size: 18px; }
.th-q { font-size: 14px; color: var(--text-muted); text-align: center; margin-bottom: 6px; }
.th-btn { position: relative; width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 8px; border-radius: 12px; border: 1px solid var(--line-strong); font-size: 13px; font-weight: 600; text-align: center; }
.th-btn.main { background: #1a73e8; border-color: #1a73e8; color: #fff; animation: th-press1 var(--t) var(--ease-out) infinite; }
.th-gdot { width: 22px; height: 22px; border-radius: 50%; background: #fff; color: #4285f4; display: grid; place-items: center; font-weight: 800; font-size: 13px; }
.th-tap { position: absolute; left: 50%; top: 50%; width: 34px; height: 34px; margin: -17px 0 0 -17px; border-radius: 50%; background: rgba(255,255,255,.55); box-shadow: 0 0 0 2px rgba(0,0,0,.15); opacity: 0; }
.th-btn.main .th-tap { animation: th-tap1 var(--t) var(--ease-out) infinite; }

.s2 { align-items: stretch; gap: 10px; padding-top: 44px; animation: th-s2 var(--t) var(--ease-out) infinite; }
.th-glogo { font-family: Arial, Helvetica, sans-serif; font-size: 24px; letter-spacing: -.5px; text-align: center; padding-bottom: 8px; border-bottom: 1px solid #e8eaed; }
.th-glogo b { font-weight: 500; }
.s2 .th-biz { text-align: center; font-family: Arial, Helvetica, sans-serif; text-transform: none; font-weight: 600; font-size: 16px; }
.th-user { display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 600; font-family: Arial, Helvetica, sans-serif; }
.th-user small { display: block; font-weight: 400; color: #5f6368; font-size: 11px; }
.th-uav { width: 32px; height: 32px; border-radius: 50%; background: #34a853; color: #fff; display: grid; place-items: center; font-weight: 700; flex: none; }
.th-stars { display: flex; justify-content: center; gap: 6px; font-size: 30px; line-height: 1; }
.th-stars i { font-style: normal; color: #dadce0; animation: th-star var(--t) var(--ease-out) infinite; }
.th-stars i:nth-child(2) { animation-delay: .22s; }
.th-stars i:nth-child(3) { animation-delay: .44s; }
.th-stars i:nth-child(4) { animation-delay: .66s; }
.th-stars i:nth-child(5) { animation-delay: .88s; }
.th-text { min-height: 74px; border: 1px solid #dadce0; border-radius: 8px; padding: 10px; font-family: Arial, Helvetica, sans-serif; font-size: 13px; color: #202124; display: flex; align-items: flex-start; }
.th-type { white-space: nowrap; overflow: hidden; clip-path: inset(0 100% 0 0); animation: th-type var(--t) steps(25) infinite; }
.th-caret { width: 1.5px; height: 16px; background: #1a73e8; margin-left: 1px; animation: th-blink .8s steps(1) infinite; }
.th-pub { position: relative; align-self: flex-end; margin-top: auto; padding: 10px 22px; border-radius: 20px; background: #1a73e8; color: #fff; font-family: Arial, Helvetica, sans-serif; font-size: 13px; font-weight: 600; animation: th-press2 var(--t) var(--ease-out) infinite; }
.th-pub .th-tap { animation: th-tap2 var(--t) var(--ease-out) infinite; }

.s3 { justify-content: center; text-align: center; animation: th-s3 var(--t) var(--ease-out) infinite; }
.th-check { width: 72px; height: 72px; border-radius: 50%; background: #34a853; color: #fff; display: grid; place-items: center; font-size: 36px; font-weight: 700; animation: th-pop var(--t) var(--ease-out) infinite; }
.s3 b { font-family: var(--font-display); font-weight: 800; text-transform: none; font-size: 20px; line-height: 1.05; }
.th-done-stars { color: #fbbc04; font-size: 22px; letter-spacing: 2px; }
.th-small { font-size: 12px; color: #5f6368; }

@keyframes th-phone { 0%, 3% { transform: none; } 9%, 13% { transform: translate(-74px, 70px) rotate(-10deg); } 19%, 100% { transform: none; } }
@keyframes th-wave { 0%, 8% { opacity: 0; transform: scale(.4); } 10% { opacity: .9; } 16%, 100% { opacity: 0; transform: scale(1.8); } }
@keyframes th-pulse { 0%, 100% { transform: scale(.9); opacity: .5; } 50% { transform: scale(1.05); opacity: 1; } }
@keyframes th-s0 { 0%, 13% { opacity: 1; } 16%, 97% { opacity: 0; } 100% { opacity: 1; } }
@keyframes th-s1 { 0%, 14% { opacity: 0; transform: translateY(14px); } 17%, 36% { opacity: 1; transform: none; } 39%, 100% { opacity: 0; transform: translateX(-24px); } }
@keyframes th-press1 { 0%, 31% { transform: none; } 33% { transform: scale(.94); } 36%, 100% { transform: none; } }
@keyframes th-tap1 { 0%, 30% { opacity: 0; transform: scale(.3); } 32% { opacity: 1; transform: scale(1); } 36%, 100% { opacity: 0; transform: scale(1.7); } }
@keyframes th-s2 { 0%, 37% { opacity: 0; transform: translateX(30px); } 40%, 79% { opacity: 1; transform: none; } 82%, 100% { opacity: 0; } }
@keyframes th-star { 0%, 43% { color: #dadce0; transform: none; } 45% { color: #fbbc04; transform: scale(1.35); } 47%, 80% { color: #fbbc04; transform: none; } 83%, 100% { color: #dadce0; } }
@keyframes th-type { 0%, 54% { clip-path: inset(0 100% 0 0); } 68%, 100% { clip-path: inset(0 0 0 0); } }
@keyframes th-blink { 50% { opacity: 0; } }
@keyframes th-press2 { 0%, 73% { transform: none; } 75% { transform: scale(.92); } 78%, 100% { transform: none; } }
@keyframes th-tap2 { 0%, 72% { opacity: 0; transform: scale(.3); } 74% { opacity: 1; transform: scale(1); } 78%, 100% { opacity: 0; transform: scale(1.7); } }
@keyframes th-s3 { 0%, 79% { opacity: 0; transform: scale(.94); } 82%, 95% { opacity: 1; transform: none; } 98%, 100% { opacity: 0; } }
@keyframes th-pop { 0%, 80% { transform: scale(.4); } 84% { transform: scale(1.12); } 87%, 100% { transform: none; } }
@keyframes th-plus { 0%, 82% { opacity: 0; transform: translate(-50%, 12px); } 85%, 95% { opacity: 1; transform: translate(-50%, 0); } 98%, 100% { opacity: 0; transform: translate(-50%, -6px); } }

@media (prefers-reduced-motion: reduce) {
  .th *, .th { animation: none !important; }
  .th .s2 { opacity: 1; }
  .th-stars i { color: #fbbc04; }
  .th-type { clip-path: none; }
}
@media (max-width: 900px) {
  .th { justify-self: center; height: 470px; max-width: 460px; }
}
@media (max-width: 760px) {
  .th { height: 400px; }
  .th-phone { width: 196px; height: 400px; border-radius: 32px; padding: 8px; }
  .th-prod { width: 60%; bottom: 10px; }
  @keyframes th-phone { 0%, 3% { transform: none; } 9%, 13% { transform: translate(-50px, 50px) rotate(-10deg); } 19%, 100% { transform: none; } }
}
.th-prod { width: 66%; bottom: 10px; }
.th-plus { top: -9%; }
.th-phone { z-index: 2; }
@media (max-width: 760px) {
  .th-prod { width: 64%; bottom: 0; } .th-plus { top: -14%; }
}
.th-eg { position: absolute; left: 6%; top: 4%; z-index: 3; padding: 3px 9px; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--kort); font-size: 11px; font-weight: var(--weight-semibold); color: var(--text-muted); text-transform: none; letter-spacing: var(--tracking-caps); }

/* Trust-hero v2: bytter produkt hver runde, ekte Google-logo, ender på profilen med ny anmeldelse */
.th-prod { height: 62%; }
.th-p { position: absolute; left: 0; right: 0; bottom: 0; opacity: 0; animation: th-cycle calc(var(--t) * 3) linear infinite both; }
.th-p.p-card { animation-delay: var(--t); }
.th-p.p-plate { animation-delay: calc(var(--t) * 2); }
.th-p img { width: 100%; height: auto; display: block; filter: drop-shadow(0 30px 30px rgba(20,30,60,.18)); }
.th-p .th-waves { position: absolute; width: 0; height: 0; }
.th-name { position: absolute; left: 50%; bottom: -6px; transform: translateX(-50%); font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: 12px; padding: 4px 10px; border-radius: 999px; background: var(--kort); border: 1px solid var(--line-strong); }
.th-prod > .th-plus { z-index: 2; }
@keyframes th-cycle { 0% { opacity: 0; } 1.5%, 32% { opacity: 1; } 33.4%, 100% { opacity: 0; } }

.th-gdot img { width: 14px; height: 14px; display: block; }
img.th-glogo { height: 26px; width: auto; align-self: center; border: 0; padding: 0; margin-bottom: 4px; }
.s2 img.th-glogo, .s3 img.th-glogo { padding-bottom: 0; }
.s3 { align-items: stretch; justify-content: flex-start; text-align: left; gap: 10px; padding-top: 44px; }
.s3 .th-biz { text-align: center; font-family: Arial, Helvetica, sans-serif; text-transform: none; font-weight: 600; font-size: 16px; }
.th-tabs { display: flex; justify-content: space-around; border-bottom: 1px solid #e8eaed; font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #5f6368; }
.th-tabs span { padding: 6px 2px; }
.th-tabs .on { color: #1a73e8; border-bottom: 2px solid #1a73e8; font-weight: 600; }
.th-rev { display: flex; flex-direction: column; gap: 6px; padding: 10px; border-radius: 10px; font-family: Arial, Helvetica, sans-serif; }
.th-rev.new { background: #e8f0fe; animation: th-newrev var(--t) var(--ease-out) infinite; }
.th-rstars { color: #fbbc04; font-size: 15px; letter-spacing: 1px; }
.th-rtext { font-size: 13px; color: #202124; }
.th-rev.ghost { gap: 7px; }
.th-line { height: 8px; border-radius: 4px; background: #eceef1; }
.th-line.w50 { width: 50%; } .th-line.w60 { width: 60%; } .th-line.w70 { width: 70%; } .th-line.w80 { width: 80%; } .th-line.w90 { width: 90%; }
@keyframes th-newrev { 0%, 80% { transform: translateY(-14px); opacity: 0; } 84% { transform: none; opacity: 1; } 100% { transform: none; opacity: 1; } }
@keyframes th-s3 { 0%, 79% { opacity: 0; transform: translateX(30px); } 82%, 96% { opacity: 1; transform: none; } 99%, 100% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .th-p.p-stand { opacity: 1; } }

.th-tabs { justify-content: space-between; font-size: 11px; gap: 4px; } .th-tabs span { padding: 6px 0; white-space: nowrap; } 

/* Trust-hero v3: produktet stort og fritt, telefonen ved siden av */
.th { height: 520px; max-width: 600px; }
.th-glow { inset: 0 30% 10% 0; background: radial-gradient(55% 55% at 50% 55%, var(--brand-wash), transparent 72%); }
.th-eg { left: auto; right: 0; top: 0; }
.th-prod { left: 0; top: 20px; bottom: auto; width: min(400px, 66%); height: auto; aspect-ratio: 1; max-width: 100%; }
.th-prod::after { content: ""; position: absolute; left: 14%; right: 14%; bottom: 1%; height: 7%; border-radius: 50%; background: radial-gradient(closest-side, rgba(20,30,60,.22), transparent); z-index: -1; }
.th-p { inset: 0; bottom: 0; }
.th-p img { width: 100%; height: 100%; object-fit: contain; object-position: center bottom; filter: drop-shadow(0 18px 18px rgba(20,30,60,.14)); }
.th-name { bottom: -34px; }
.th-prod > .th-plus { top: -4%; }
.th-phone { top: auto; bottom: 0; right: 0; width: 224px; height: 456px; border-radius: 36px; padding: 9px; transform-origin: 30% 90%; }
.th-screen { border-radius: 28px; }
@keyframes th-phone { 0%, 3% { transform: none; } 9%, 13% { transform: translate(-36px, -10px) rotate(-9deg); } 19%, 100% { transform: none; } }
.th-waves i { border-width: 3px; width: 90px; height: 90px; left: -45px; top: -45px; }
@media (max-width: 900px) {
  .th { height: 500px; }
}
@media (max-width: 760px) {
  .th { height: 420px; }
  .th-prod { width: 64%; top: 10px; }
  .th-phone { width: 172px; height: 350px; border-radius: 28px; padding: 7px; }
  .th-name { bottom: -28px; font-size: 10px; }
  @keyframes th-phone { 0%, 3% { transform: none; } 9%, 13% { transform: translate(-20px, -6px) rotate(-9deg); } 19%, 100% { transform: none; } }
}

/* Trust-hero v4: tett beskårne produktbilder, ingen overlapp med telefonen */
.th-prod { width: min(360px, 60%); top: 30px; }
.th-p { display: flex; align-items: flex-end; justify-content: center; }
.th-pi { position: relative; }
.p-stand .th-pi { width: 74%; }
.p-plate .th-pi { width: 86%; }
.p-card .th-pi { width: 100%; }
.th-pi img { width: 100%; height: auto; object-fit: initial; display: block; }
.th-phone { width: 210px; height: 430px; }
.th-name { bottom: -36px; }
@media (max-width: 760px) {
  .th { height: 400px; }
  .th-prod { width: 56%; top: 20px; }
  .th-phone { width: 160px; height: 328px; }
}
@media (max-width: 400px) {
  .th { height: 360px; } .th-prod { width: 54%; } .th-phone { width: 144px; height: 296px; border-radius: 24px; padding: 6px; }
}

/* ---------- Produktkort (Trust) ---------- */
.pk-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
.pk-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 820px; }
.pk { display: flex; flex-direction: column; background: var(--kort); border: 1px solid var(--line); border-radius: 20px; overflow: hidden; color: inherit; text-decoration: none; transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-base, .3s) var(--ease-out), transform var(--dur-base, .3s) var(--ease-out); }
.pk:hover { border-color: var(--line-strong); box-shadow: 0 18px 40px -24px rgba(20,30,60,.35); transform: translateY(-3px); }
.pk:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 3px; }
.pk-img { aspect-ratio: 4 / 3; max-width: 100%; background: linear-gradient(180deg, #f5f6f8, #eceef2); display: grid; place-items: center; padding: 9% 12% 11%; position: relative; }
.pk-img::after { content: ""; position: absolute; left: 22%; right: 22%; bottom: 8%; height: 6%; border-radius: 50%; background: radial-gradient(closest-side, rgba(20,30,60,.18), transparent); }
.pk-img img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 10px 14px rgba(20,30,60,.14)); transition: transform var(--dur-base, .3s) var(--ease-out); }
.pk:hover .pk-img img { transform: translateY(-5px); }
.pk-body { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-5) var(--space-6) var(--space-6); flex: 1; }
.pk-top { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); flex-wrap: wrap; }
.pk-top b { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-3xl); line-height: 1; }
.pk-pris { font-weight: var(--weight-semibold); font-size: var(--text-sm); white-space: nowrap; }
.pk-txt { color: var(--text-muted); }
.pk-steder { display: flex; flex-wrap: wrap; gap: 6px; }
.pk-steder span { padding: 4px 10px; border-radius: 999px; border: 1px solid var(--line); font-size: 12px; color: var(--text-muted); }
.pk-btn { margin-top: auto; display: flex; justify-content: center; padding: 12px; border-radius: 12px; box-shadow: inset 0 0 0 2px var(--ink-900); font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-sm); transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out); }
.pk:hover .pk-btn { background: var(--ink-900); color: var(--on-blaa); }
@media (max-width: 900px) {
  .pk-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  .pk-grid, .pk-grid.two { grid-template-columns: 1fr; gap: var(--space-4); }
  .pk-img { aspect-ratio: 16 / 10; }
  .pk-top b { font-size: var(--text-2xl); }
}
.pk-img { display: block; padding: 0; overflow: hidden; }
.pk-img img { position: absolute; top: 9%; left: 12%; width: 76%; height: 78%; object-fit: contain; object-position: center bottom; }

/* iPhone-ramme over animasjonsskjermen */
.th-phone { background: none; padding: 0; border-radius: 0; box-shadow: none; aspect-ratio: 409 / 842; height: auto; filter: drop-shadow(0 30px 40px rgba(20,30,60,.28)); }
.th-phone .th-screen { position: absolute; left: 3.2%; right: 2.9%; top: 1.1%; bottom: 1.2%; width: auto; height: auto; border-radius: 13% / 6.2%; }
.th-frame { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 4; pointer-events: none; }
.th-notch { display: none; }
@media (max-width: 760px) {
  .th-phone { height: auto; padding: 0; border-radius: 0; }
}
@media (max-width: 400px) {
  .th-phone { height: auto; padding: 0; border-radius: 0; }
}

/* ---------- Trust-hero v5: scene, lys låseskjerm med varsel, stegvisning ---------- */
.th { height: 580px; max-width: 600px; }
.th-glow, .th-eg { display: none; }
.th-stage { position: absolute; left: 0; right: 0; top: 0; bottom: 64px; border-radius: 32px; overflow: hidden;
  background: radial-gradient(70% 60% at 30% 70%, #ffffff 0%, transparent 70%), linear-gradient(160deg, var(--brand-wash), #f4f6fb 60%, #eef1f7); border: 1px solid var(--line); }
.th-stage::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 26%; background: linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.75)); border-top: 1px solid rgba(20,30,60,.06); }
.th-prod { left: 5%; top: auto; bottom: 96px; width: min(320px, 54%); z-index: 1; }
.th-name { display: none; }
.th-prod > .th-plus { top: -10%; }
.th-phone { right: 5%; bottom: 84px; top: auto; width: 214px; }
@keyframes th-phone { 0%, 4% { transform: none; } 10%, 15% { transform: translate(-52px, 14px) rotate(-7deg); } 21%, 100% { transform: none; } }
.th-p.on-glow .th-pi::before { content: none; }
.th-pi::after { content: ""; position: absolute; inset: -4%; border-radius: 20px; box-shadow: 0 0 0 0 rgba(31,103,255,0); animation: th-glowp var(--t) var(--ease-out) infinite; pointer-events: none; }
@keyframes th-glowp { 0%, 9% { box-shadow: 0 0 0 0 rgba(31,103,255,0); } 12% { box-shadow: 0 0 40px 8px rgba(31,103,255,.28); } 20%, 100% { box-shadow: 0 0 0 0 rgba(31,103,255,0); } }

/* Lys låseskjerm + varsel */
.s0 { background: linear-gradient(170deg, #e9efff 0%, #f6f1ff 55%, #ffffff 100%); color: #1d2433; justify-content: flex-start; gap: 2px; padding-top: 58px; }
.th-date { font-size: 12px; font-weight: 600; opacity: .7; }
.th-time { font-size: 50px; font-weight: 600; letter-spacing: -2px; margin-top: 0; line-height: 1.05; }
.th-hold { display: none; }
.th-banner { position: absolute; left: 8px; right: 8px; top: 12px; display: flex; align-items: center; gap: 9px; padding: 10px 11px; border-radius: 16px; background: rgba(255,255,255,.92); box-shadow: 0 10px 24px -10px rgba(20,30,60,.35); text-align: left; font-size: 11px; line-height: 1.3; color: #3b4352; opacity: 0; transform: translateY(-120%); animation: th-banner var(--t) cubic-bezier(.2,.9,.3,1.2) infinite; z-index: 5; }
.th-banner img { width: 30px; height: 30px; border-radius: 8px; background: var(--brand); padding: 6px; flex: none; }
.th-banner b { display: block; font-size: 12px; color: #11151c; }
@keyframes th-banner { 0%, 10% { opacity: 0; transform: translateY(-120%); } 13%, 15% { opacity: 1; transform: none; } 16% { transform: scale(.96); } 17%, 100% { opacity: 0; transform: none; } }
@keyframes th-s0 { 0%, 16% { opacity: 1; } 18%, 97% { opacity: 0; } 100% { opacity: 1; } }
@keyframes th-s1 { 0%, 16% { opacity: 0; transform: translateY(14px); } 19%, 36% { opacity: 1; transform: none; } 39%, 100% { opacity: 0; transform: translateX(-24px); } }

/* Stegvisning */
.th-steps { position: absolute; left: 0; right: 0; bottom: 0; margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.th-steps li { display: flex; align-items: center; justify-content: center; gap: 7px; padding: 10px 6px; border-radius: 14px; border: 1px solid var(--line); background: var(--kort); font-size: 13px; font-weight: var(--weight-semibold); color: var(--text-muted); white-space: nowrap; }
.th-steps i { font-style: normal; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: var(--bg-warm); font-size: 12px; flex: none; }
.th-steps li:nth-child(1) { animation: th-st1 var(--t) linear infinite; }
.th-steps li:nth-child(2) { animation: th-st2 var(--t) linear infinite; }
.th-steps li:nth-child(3) { animation: th-st3 var(--t) linear infinite; }
.th-steps li:nth-child(4) { animation: th-st4 var(--t) linear infinite; }
@keyframes th-st1 { 0%, 16% { border-color: var(--brand); color: var(--text); box-shadow: 0 6px 16px -10px rgba(31,103,255,.6); } 17%, 100% { border-color: var(--line); color: var(--text-muted); box-shadow: none; } }
@keyframes th-st2 { 0%, 16% { border-color: var(--line); color: var(--text-muted); box-shadow: none; } 17%, 37% { border-color: var(--brand); color: var(--text); box-shadow: 0 6px 16px -10px rgba(31,103,255,.6); } 38%, 100% { border-color: var(--line); color: var(--text-muted); box-shadow: none; } }
@keyframes th-st3 { 0%, 37% { border-color: var(--line); color: var(--text-muted); box-shadow: none; } 38%, 79% { border-color: var(--brand); color: var(--text); box-shadow: 0 6px 16px -10px rgba(31,103,255,.6); } 80%, 100% { border-color: var(--line); color: var(--text-muted); box-shadow: none; } }
@keyframes th-st4 { 0%, 79% { border-color: var(--line); color: var(--text-muted); box-shadow: none; } 80%, 99% { border-color: var(--success); color: var(--text); box-shadow: 0 6px 16px -10px rgba(30,160,90,.6); } 100% { border-color: var(--line); color: var(--text-muted); box-shadow: none; } }

@media (prefers-reduced-motion: reduce) { .th-banner { opacity: 0; } .th-steps li:nth-child(3) { border-color: var(--brand); color: var(--text); } }
@media (max-width: 760px) {
  .th { height: 480px; }
  .th-prod { width: 50%; bottom: 72px; left: 4%; }
  .th-phone { width: 158px; right: 4%; bottom: 70px; }
  @keyframes th-phone { 0%, 4% { transform: none; } 10%, 15% { transform: translate(-26px, 8px) rotate(-7deg); } 21%, 100% { transform: none; } }
}
@media (max-width: 400px) {
  .th { height: 440px; } .th-phone { width: 140px; height: auto; } .th-prod { width: 48%; }
}
.th-banner img { background: #fff; border: 1px solid #e3e7ef; }
.th-banner { top: 36px; } .th-prod { width: min(340px, 58%); } @media (max-width: 760px) {
  .th-prod { width: 52%; }
}

/* ---------- Trust-hero v6: midtstilt produkt + realistiske skjermer ---------- */
.th-prod { top: calc(50% - 32px); bottom: auto; left: 3%; transform: translateY(-50%); width: min(330px, 56%); }
.th-p { align-items: center; }
@media (max-width: 760px) {
  .th-prod { top: calc(50% - 28px); width: 50%; left: 3%; bottom: auto; }
}

.th-screen { font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Inter, Roboto, Arial, sans-serif; color: #1d1d1f; -webkit-font-smoothing: antialiased; }
.th-screen b, .th-screen span { text-transform: none; letter-spacing: normal; }
.th-s { padding: 40px 14px 16px; gap: 8px; }

/* iOS-statuslinje */
.ios-sb { position: absolute; left: 0; right: 0; top: 0; height: 30px; z-index: 6; display: flex; justify-content: space-between; align-items: center; padding: 6px 20px 0 24px; font-size: 12px; font-weight: 600; color: #111; pointer-events: none; }
.sb-ic { display: flex; align-items: center; gap: 4px; }
.sb-ic i { display: block; }
.sig { display: flex !important; align-items: flex-end; gap: 1.5px; height: 9px; }
.sig b { width: 2.5px; background: #111; border-radius: 1px; }
.sig b:nth-child(1) { height: 3px; } .sig b:nth-child(2) { height: 5px; } .sig b:nth-child(3) { height: 7px; } .sig b:nth-child(4) { height: 9px; }
.wifi { width: 12px; height: 9px; background: radial-gradient(circle at 50% 100%, #111 0 2px, transparent 2.5px 4px, #111 4.5px 5.8px, transparent 6.3px 8px, #111 8.5px 9.8px, transparent 10.3px); clip-path: polygon(50% 100%, 0 0, 100% 0); }
.bat { width: 20px; height: 9.5px; border: 1.2px solid rgba(17,17,17,.45); border-radius: 3px; padding: 1px; position: relative; }
.bat b { display: block; width: 80%; height: 100%; background: #111; border-radius: 1.5px; }
.s0 .ios-sb, .th-screen .s0 ~ .ios-sb { color: #111; }

/* Låseskjerm */
.s0 { background: radial-gradient(120% 70% at 20% 0%, #c9d8ff 0%, transparent 60%), radial-gradient(100% 70% at 100% 100%, #e6d9ff 0%, transparent 60%), linear-gradient(180deg, #eef2ff, #f7f3ff); padding-top: 46px; gap: 0; justify-content: flex-start; }
.ls-date { font-size: 13px; font-weight: 600; color: rgba(29,29,31,.75); }
.ls-time { font-size: 62px; font-weight: 700; letter-spacing: -2px; line-height: 1; color: #1d1d1f; }
.th-date, .th-time { display: none; }
.ls-bottom { position: absolute; left: 22px; right: 22px; bottom: 22px; display: flex; justify-content: space-between; }
.ls-bottom i { width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,.55); backdrop-filter: blur(6px); }
.th-banner { top: 128px; left: 8px; right: 8px; align-items: flex-start; padding: 10px 11px; border-radius: 18px; background: rgba(255,255,255,.78); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 12px 30px -14px rgba(20,30,60,.35); }
.th-banner img { width: 32px; height: 32px; border-radius: 8px; padding: 5px; background: #fff; border: 0; box-shadow: 0 0 0 1px rgba(0,0,0,.06); }
.bn { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1; }
.bn-h { display: flex; justify-content: space-between; font-size: 10px; color: rgba(29,29,31,.6); }
.bn-h b { font-weight: 600; letter-spacing: .3px; font-size: 10px; color: rgba(29,29,31,.6); display: inline; }
.bn-h em { font-style: normal; }
.bn-t { font-size: 12.5px; font-weight: 600; color: #1d1d1f; display: block; }
.bn-b { font-size: 12px; color: #1d1d1f; }

/* Zervo-side i Safari */
.s1 { background: #f5f6f8; justify-content: flex-start; padding-top: 34px; gap: 6px; }
.sf-url { display: flex; align-items: center; justify-content: center; gap: 5px; width: 100%; padding: 7px; border-radius: 10px; background: #e9eaee; font-size: 12px; color: #3c3c43; margin-bottom: 10px; }
.sf-url svg { width: 8px; height: 10px; color: #8e8e93; }
.lp-logo { width: 54px; height: 54px; border-radius: 16px; background: linear-gradient(135deg, #1f67ff, #3b82f6); color: #fff; display: grid; place-items: center; font-weight: 700; font-size: 18px; box-shadow: 0 8px 18px -10px rgba(31,103,255,.8); }
.lp-name { font-size: 17px; font-weight: 700; margin-top: 4px; }
.lp-sub { font-size: 12px; color: #6e6e73; margin-bottom: 8px; }
.lp-card { width: 100%; background: #fff; border-radius: 16px; padding: 14px 12px; display: flex; flex-direction: column; gap: 8px; box-shadow: 0 1px 2px rgba(0,0,0,.05), 0 8px 20px -14px rgba(0,0,0,.25); }
.lp-q { font-size: 13px; font-weight: 600; text-align: center; margin-bottom: 2px; }
.s1 .th-btn { font-family: inherit; font-size: 12.5px; font-weight: 600; padding: 11px 8px; border-radius: 12px; border: 1px solid #d2d2d7; background: #fff; color: #1d1d1f; }
.s1 .th-btn.main { background: #1a73e8; border-color: #1a73e8; color: #fff; }
.th-gdot { width: 20px; height: 20px; }
.lp-foot { margin-top: auto; display: flex; align-items: center; gap: 4px; font-size: 10px; color: #8e8e93; }
.lp-foot img { width: 11px; height: 11px; }
.th-av, .th-biz, .th-q { display: none; }

/* Google: skriv anmeldelse */
.s2 { font-family: Roboto, Arial, Helvetica, sans-serif; background: #fff; padding-top: 34px; gap: 10px; align-items: stretch; }
.g-top { display: flex; align-items: center; justify-content: space-between; padding-bottom: 8px; border-bottom: 1px solid #e8eaed; }
.g-top b { font-size: 14px; font-weight: 500; color: #202124; }
.g-x { font-size: 13px; color: #5f6368; width: 16px; }
.s2 .th-glogo { display: none; }
.th-user b { font-size: 13px; font-weight: 500; color: #202124; display: block; }
.th-user small { font-size: 11px; }
.th-uav { width: 30px; height: 30px; font-size: 13px; background: #7b1fa2; }
.th-stars { gap: 8px; font-size: 32px; margin: 4px 0 0; }
.g-hint { font-size: 11px; color: #5f6368; text-align: center; }
.th-text { min-height: 64px; border-radius: 4px; border-color: #80868b; font-family: Roboto, Arial, sans-serif; }
.g-photo { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 16px; border: 1px solid #dadce0; font-size: 11.5px; color: #1a73e8; font-weight: 500; }
.g-photo span { font-size: 14px; line-height: 1; }
.th-pub { align-self: stretch; text-align: center; margin-top: auto; border-radius: 20px; padding: 11px; font-family: Roboto, Arial, sans-serif; font-weight: 500; }

/* Google: profil */
.s3 { font-family: Roboto, Arial, Helvetica, sans-serif; padding-top: 36px; gap: 6px; }
.s3 .th-glogo { display: none; }
.g-logo { height: 22px; width: auto; align-self: center; margin-bottom: 4px; }
.g-biz { font-size: 18px; font-weight: 400; color: #202124; text-align: center; }
.g-cat { font-size: 11px; color: #70757a; text-align: center; margin-bottom: 4px; }
.th-rev { border-radius: 12px; }
.th-rev .th-user { position: relative; }
.g-new { margin-left: auto; font-style: normal; font-size: 10px; font-weight: 500; color: #188038; background: #e6f4ea; padding: 2px 8px; border-radius: 10px; }
.th-rtext { font-size: 12.5px; }


.s1 .th-btn { white-space: nowrap; font-size: 12px; padding: 11px 6px; gap: 6px; } .lp-q { font-size: 13px; white-space: nowrap; } 
.s1 .th-btn { font-size: 11px; padding: 10px 4px; gap: 5px; letter-spacing: -.1px; }
.s1 .th-gdot { width: 18px; height: 18px; } .s1 .th-gdot img { width: 11px; height: 11px; }
.lp-card { padding: 12px 9px; }
.th-stars { font-size: 27px; gap: 5px; }
.s3 b.g-biz { font-family: Roboto, Arial, Helvetica, sans-serif; font-weight: 400; text-transform: none; font-size: 18px; line-height: 1.2; }
.s3 .th-user b, .s2 .th-user b { font-family: Roboto, Arial, Helvetica, sans-serif; font-weight: 500; text-transform: none; font-size: 13px; line-height: 1.2; }


/* Mobil: hele telefonen skaleres som én enhet, så skjermen ser lik ut som på desktop */
@media (max-width: 760px) {
  .th-phone { width: 214px; scale: .74; transform-origin: 100% 100%; right: 3%; bottom: 66px; }
}
@media (max-width: 400px) {
  .th-phone { scale: .64; }
}

/* Kortlenker: ingen blå farge eller understrek ved hover (overstyrer a:hover i designsystemet) */
a.pk, a.pk:hover, a.v-card:hover, a.shop-card:hover, a.sw:hover, a.m-card:hover { text-decoration: none; color: inherit; }
@media (max-width: 760px) {
  .th-stage { bottom: 56px; border-radius: 24px; }
  .th-steps { gap: 5px; }
  .th-steps li { flex-direction: column; gap: 3px; padding: 7px 2px; font-size: 10px; border-radius: 10px; white-space: normal; text-align: center; }
  .th-steps i { width: 18px; height: 18px; font-size: 10px; }
}
.s1 .th-gdot img { width: 12px; height: 12px; object-fit: contain; }

/* ---------- Trust-hero v7: småfeil ---------- */
/* Produktnavn tilbake, uten firkant-glød ved tapp */
.th-pi::after { content: none; animation: none; }
.th-name { display: inline-block; bottom: -40px; padding: 5px 14px; font-size: 12px; background: var(--kort); border: 1px solid var(--line-strong); box-shadow: 0 6px 14px -10px rgba(20,30,60,.4); }
/* Statuslinjens klokke skjules på låseskjermen (der står den store klokka) */
.sb-t { animation: th-sbt var(--t) linear infinite; }
@keyframes th-sbt { 0%, 16% { opacity: 0; } 18%, 97% { opacity: 1; } 100% { opacity: 0; } }
/* Varsel under klokka */
.th-banner { top: 150px; }
/* Faner får plass */
.th-tabs { justify-content: space-around; font-size: 10.5px; gap: 0; }
.th-tabs span { padding: 6px 4px; }
/* «+1» over produktet, ikke oppå */
.th-prod > .th-plus { top: -18%; }
/* Trykkmarkør: tynn ring */
.th-tap { width: 30px; height: 30px; margin: -15px 0 0 -15px; background: rgba(255,255,255,.18); box-shadow: 0 0 0 2px rgba(255,255,255,.9), 0 4px 10px rgba(0,0,0,.18); }
.th-btn.main .th-tap { left: 82%; }
.p-plate .th-pi { width: 78%; }

/* Personvalg med bilde */
.field .lbl { font-weight: var(--weight-semibold); font-size: var(--text-sm); }
.pick { position: relative; }
.pick-btn { width: 100%; min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 12px; border: 1px solid var(--line-strong); border-radius: var(--radius-md); background: var(--kort); font: inherit; color: var(--text); cursor: pointer; text-align: left; }
.pick-btn:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 1px; }
.pick-val { display: flex; align-items: center; gap: 10px; color: var(--text-muted); }
.pick-val img, .pick-list img { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; flex: none; }
.pick-val:has(img), .pick-val:has(.pick-ic) { color: var(--text); font-weight: var(--weight-semibold); }
.pick-car { color: var(--text-muted); }
.pick-list { position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 6px); margin: 0; padding: 6px; list-style: none; background: var(--kort); border: 1px solid var(--line-strong); border-radius: 14px; box-shadow: 0 18px 40px -18px rgba(20,30,60,.35); }
.pick-list li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; cursor: pointer; font-weight: var(--weight-medium); }
.pick-list li:hover, .pick-list li:focus { background: var(--bg-warm); outline: none; }
.pick-list li[aria-selected="true"] { background: var(--brand-wash); }
.pick-ic { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--bg-warm); color: var(--text-muted); font-weight: 700; flex: none; }
.field:has([data-tidligere]), .field[data-hvem] { align-self: end; }

/* ---------- Pakker og tillegg (Trust) ---------- */
.pk-badge, .pakke-info span { font-style: normal; display: inline-block; vertical-align: middle; margin-left: 6px; padding: 3px 8px; border-radius: 999px; background: var(--brand-wash); color: var(--brand-text); font-family: var(--font-body, inherit); font-size: 12px; font-weight: var(--weight-semibold); text-transform: none; letter-spacing: 0; }
.pakke-info { margin: calc(-1 * var(--space-2)) 0 0; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: var(--text-sm); color: var(--text-muted); }
.pakke-info span { margin-left: 0; }
.qty-hint { display: block; margin-top: 6px; font-size: var(--text-sm); color: var(--text-muted); }
.bump-buy { display: flex; align-items: center; gap: var(--space-3); padding: 12px 14px; border: 2px dashed var(--brand); border-radius: 14px; background: var(--brand-wash); cursor: pointer; }
.bump-buy input { width: 20px; height: 20px; accent-color: var(--brand); flex: none; margin: 0; }
.bmp-img { width: 52px; height: 52px; border-radius: 10px; background: var(--kort); display: grid; place-items: center; flex: none; overflow: hidden; }
.bmp-img img { width: 86%; height: 86%; object-fit: contain; }
.bmp-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.bmp-t b { font-weight: var(--weight-semibold); }
.bmp-t em { font-style: normal; margin-left: 6px; padding: 2px 8px; border-radius: 999px; background: var(--success-wash); color: var(--success-text); font-size: 11px; font-weight: var(--weight-bold); text-transform: none; letter-spacing: var(--tracking-caps); }
.bmp-t small { color: var(--text-muted); font-size: var(--text-sm); }
.bump-buy:has(input:not(:checked)) { border-style: solid; border-color: var(--line-strong); background: var(--kort); }

.bundle-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); max-width: 920px; }
.bundle { position: relative; display: flex; flex-direction: column; background: var(--kort); border: 1px solid var(--line); border-radius: 22px; overflow: hidden; }
.bundle.on { border: 2px solid var(--brand); box-shadow: 0 24px 48px -28px rgba(31,103,255,.45); }
.bd-tag { position: absolute; top: 14px; left: 14px; z-index: 2; font-style: normal; padding: 5px 12px; border-radius: 999px; background: var(--brand); color: var(--on-blaa); font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: 12px; }
.bd-img { position: relative; aspect-ratio: 16 / 9; background: linear-gradient(180deg, #f5f6f8, #eceef2); display: flex; align-items: center; justify-content: center; padding: 6% 8%; max-width: 100%; }
.bd-img img { height: 100%; width: auto; max-width: 48%; object-fit: contain; filter: drop-shadow(0 10px 14px rgba(20,30,60,.14)); }
.bd-img img + img { margin-left: -6%; }
.bd-img.n3 img { max-width: 36%; }
.bd-body { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-5) var(--space-6) var(--space-6); flex: 1; }
.bd-kat { font-size: var(--text-sm); color: var(--text-muted); font-weight: var(--weight-semibold); }
.bundle h3 { margin: 0; font-size: var(--text-3xl); font-weight: var(--weight-extrabold); text-transform: none; line-height: 1; }
.bd-pris { margin: 0; color: var(--text-muted); }
.bd-pris b { font-family: var(--font-display); font-weight: var(--weight-extrabold); font-size: var(--text-3xl); color: var(--text); }
.bd-pts { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.bd-pts li::before { content: "✓ "; color: var(--success-text); font-weight: 700; }
.bd-btn { margin-top: auto; justify-content: center; }
.bd-note { margin-top: var(--space-5); font-size: var(--text-sm); color: var(--text-muted); max-width: 70ch; }
@media (max-width: 760px) {
  .bundle-grid { grid-template-columns: 1fr; }
  .bump-buy { padding: 10px; }
}

/* v8: varsel fra toppen, Google-ikon ikke sammenklemt */
.s1 .th-gdot { flex: none; width: 20px; height: 20px; border-radius: 50%; background: #fff; display: grid; place-items: center; }
.s1 .th-gdot img { width: 13px; height: 13px; display: block; }
.th-banner { top: 34px; left: 7px; right: 7px; }
@keyframes th-banner { 0%, 9% { opacity: 0; transform: translateY(-140%); } 12%, 15% { opacity: 1; transform: none; } 16% { transform: scale(.97); } 17%, 100% { opacity: 0; transform: translateY(-140%); } }
.s1 .th-btn { font-size: 10.5px; gap: 5px; padding: 10px 6px; }
/* Rekkefølge i animasjonen: Stand → Plate → Card */
.th-p.p-plate { animation-delay: var(--t); }
.th-p.p-card { animation-delay: calc(var(--t) * 2); }

/* Kortvelger (Cards) */
.pakke-info.big { margin: 0; padding: 12px 14px; border-radius: 14px; background: var(--brand-wash); color: var(--text); font-size: var(--text-md); }
.pakke-info.big span { font-size: var(--text-md); padding: 5px 12px; background: var(--brand); color: var(--on-blaa); font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; letter-spacing: var(--tracking-caps); }
.kv { border: 0; margin: 0; padding: 0; display: grid; gap: var(--space-2); }
.kv legend { padding: 0; }
.kv-opts { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-2); }
.kv-opt { position: relative; cursor: pointer; }
.kv-opt input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.kv-opt span { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 64px; padding: 8px 4px; border: 1px solid var(--line-strong); border-radius: 12px; background: var(--kort); text-align: center; transition: border-color var(--dur-fast) var(--ease-out); }
.kv-opt b { font-weight: var(--weight-semibold); font-size: var(--text-sm); }
.kv-opt small { font-size: 11.5px; color: var(--text-muted); }
.kv-opt:hover span { border-color: var(--ink-900); }
.kv-opt input:checked + span { border: 2px solid var(--brand); padding: 7px 3px; background: var(--brand-wash); }
.kv-opt input:focus-visible + span { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.kv-egen { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.kv-egen label { font-weight: var(--weight-semibold); font-size: var(--text-sm); }
.kv-egen input { width: 96px; height: 44px; padding: 0 10px; border: 1px solid var(--line-strong); border-radius: 10px; font: inherit; }
.kv-calc { font-size: var(--text-sm); color: var(--text-muted); }
.kv-info { margin: 0; font-size: var(--text-sm); color: var(--text-muted); }
@media (max-width: 760px) { .kv-opts { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.kv-egen[hidden] { display: none; }

/* Disk-pakken → Komplett-oppgradering */
.bmp-on { display: none; }
.bump-buy:has(input:checked) .bmp-on { display: inline; }
.bump-buy:has(input:checked) .bmp-off { display: none; }
.bump-buy:has(input:checked) { border-style: solid; }
@property --ang { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
.up-komplett { position: relative; display: flex; align-items: center; gap: var(--space-3); padding: 12px 14px; border-radius: 14px; cursor: pointer; border: 2px solid transparent;
  background: linear-gradient(var(--white), var(--white)) padding-box, conic-gradient(from var(--ang), #1f67ff, #8b5cf6, #ea4335, #fbbc04, #34a853, #1f67ff) border-box;
  animation: up-spin 3.5s linear infinite, up-in .45s cubic-bezier(.2,.9,.3,1.2) both; box-shadow: 0 14px 30px -18px rgba(31,103,255,.55); }
.up-komplett[hidden] { display: none; }
.up-komplett input { width: 20px; height: 20px; accent-color: var(--brand); flex: none; margin: 0; }
.up-komplett .bmp-t em { background: var(--brand-wash); color: var(--brand-text); }
.up-komplett:has(input:checked) { background: linear-gradient(var(--brand-wash), var(--brand-wash)) padding-box, conic-gradient(from var(--ang), #1f67ff, #8b5cf6, #ea4335, #fbbc04, #34a853, #1f67ff) border-box; }
@keyframes up-spin { to { --ang: 360deg; } }
@keyframes up-in { from { opacity: 0; transform: translateY(-8px) scale(.98); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .up-komplett { animation: none; } }

/* Prisboks på forsiden: innhold til høyre */
.price.solo { grid-template-columns: 7fr 5fr; }
.price-inc { background: var(--kort); border-radius: 18px; padding: var(--space-6); box-shadow: 0 18px 40px -28px rgba(31,103,255,.5); }
.price-inc ul { list-style: none; margin: var(--space-3) 0 0; padding: 0; display: grid; gap: 10px; }
.price-inc li { display: flex; align-items: center; gap: 10px; font-weight: var(--weight-semibold); }
.price-inc li::before { content: "✓"; width: 22px; height: 22px; border-radius: 50%; background: var(--success-wash); color: var(--success-text); display: grid; place-items: center; font-size: 12px; font-weight: 700; flex: none; }
@media (max-width: 900px) { .price.solo { grid-template-columns: 1fr; } }

/* ---------- Trust-hero v9: ingen scene, ingen steg – fritt, levende og fjærende ---------- */
.th { height: 540px; max-width: 620px; }
.th-stage, .th-steps, .th-plus { display: none !important; }
/* Produktet: stort, midt i venstre halvdel, med kontaktskygge */
.th-prod { left: 0; top: 50%; bottom: auto; width: min(370px, 60%); transform: translateY(-56%); }
.th-prod::after { left: 16%; right: 16%; bottom: -2%; height: 8%; background: radial-gradient(closest-side, rgba(20,30,60,.22), transparent); }
.th-pi { animation: th-bump var(--t) var(--ease-out) infinite; transform-origin: 50% 100%; }
@keyframes th-bump { 0%, 10% { transform: none; } 12% { transform: translateY(-6px) scale(1.025); } 15%, 100% { transform: none; } }
.th-name { bottom: -46px; }
/* Telefonen: svever, glir fjærende inn mot chipen, retter seg opp */
.th-phone { right: 0; bottom: 18px; top: auto; width: 232px; transform-origin: 40% 90%; filter: drop-shadow(0 40px 50px rgba(20,30,60,.28)) drop-shadow(0 8px 14px rgba(20,30,60,.12));
  animation: th-phone2 var(--t) cubic-bezier(.34,1.25,.5,1) infinite; }
@keyframes th-phone2 {
  0% { transform: translateY(0) rotate(-4deg); }
  4% { transform: translateY(-8px) rotate(-4deg); }
  10%, 14% { transform: translate(-86px, 18px) rotate(-15deg) scale(.95); }
  20% { transform: translateY(0) rotate(0deg); }
  30% { transform: translateY(-8px) rotate(0deg); }
  42% { transform: translateY(0) rotate(0deg); }
  56% { transform: translateY(-8px) rotate(0deg); }
  70% { transform: translateY(0) rotate(0deg); }
  84% { transform: translateY(-8px) rotate(0deg); }
  100% { transform: translateY(0) rotate(-4deg); }
}
.th-waves i { border-width: 2.5px; border-color: #1f67ff; box-shadow: 0 0 18px rgba(31,103,255,.35); }
/* Skjermoverganger som på iPhone */
@keyframes th-s1 { 0%, 15% { opacity: 1; transform: translateY(100%); } 18%, 36% { opacity: 1; transform: none; } 39%, 100% { opacity: 1; transform: translateX(-35%); visibility: hidden; } }
.s1 { animation: th-s1 var(--t) cubic-bezier(.2,.9,.25,1) infinite; z-index: 2; }
@keyframes th-s2 { 0%, 36% { opacity: 1; transform: translateX(100%); } 39%, 78% { opacity: 1; transform: none; } 81%, 100% { opacity: 1; transform: translateX(-35%); visibility: hidden; } }
.s2 { animation: th-s2 var(--t) cubic-bezier(.2,.9,.25,1) infinite; z-index: 3; box-shadow: -10px 0 30px rgba(0,0,0,.08); }
@keyframes th-s3 { 0%, 78% { opacity: 1; transform: translateX(100%); } 81%, 97% { opacity: 1; transform: none; } 100% { opacity: 0; transform: none; } }
.s3 { animation: th-s3 var(--t) cubic-bezier(.2,.9,.25,1) infinite; z-index: 4; box-shadow: -10px 0 30px rgba(0,0,0,.08); background: #fff; }
.s0 { z-index: 1; }
/* Anmeldelseskortet som flyr ut av telefonen og lander over produktet */
.th-fly { position: absolute; z-index: 6; right: 70px; bottom: 260px; display: flex; align-items: center; gap: 10px; padding: 10px 14px 10px 10px; border-radius: 16px; background: #fff; box-shadow: 0 18px 40px -14px rgba(20,30,60,.35), 0 0 0 1px rgba(20,30,60,.06); opacity: 0; animation: th-fly var(--t) cubic-bezier(.34,1.3,.5,1) infinite; white-space: nowrap; }
.th-fly img { width: 30px; height: 30px; padding: 5px; border-radius: 50%; background: #f1f3f4; }
.th-fly span { display: flex; flex-direction: column; line-height: 1.15; font-family: Roboto, Arial, sans-serif; }
.th-fly b { color: #fbbc04; font-size: 15px; letter-spacing: 1px; }
.th-fly small { font-size: 12px; color: #3c4043; font-weight: 500; }
@keyframes th-fly { 0%, 79% { opacity: 0; transform: translate(0, 40px) scale(.5); } 83% { opacity: 1; transform: translate(-150px, -40px) scale(1.04); } 86%, 94% { opacity: 1; transform: translate(-160px, -46px) scale(1); } 98%, 100% { opacity: 0; transform: translate(-160px, -70px) scale(.96); } }
@media (prefers-reduced-motion: reduce) { .th-fly { opacity: 0; } .th-phone { transform: none; } }
@media (max-width: 900px) { .th { height: 520px; } }
@media (max-width: 760px) {
  .th { height: 430px; }
  .th-prod { width: 56%; top: 46%; }
  .th-phone { width: 214px; scale: .72; transform-origin: 40% 90%; right: -10px; bottom: 0; }
  .th-fly { right: 40px; bottom: 210px; scale: .85; }
  @keyframes th-fly { 0%, 79% { opacity: 0; transform: translate(0, 30px) scale(.5); } 83% { opacity: 1; transform: translate(-90px, -30px) scale(1.04); } 86%, 94% { opacity: 1; transform: translate(-96px, -34px) scale(1); } 98%, 100% { opacity: 0; transform: translate(-96px, -54px) scale(.96); } }
  @keyframes th-phone2 { 0% { transform: rotate(-4deg); } 10%, 14% { transform: translate(-60px, 12px) rotate(-15deg) scale(.95); } 20%, 96% { transform: none; } 100% { transform: rotate(-4deg); } }
}
@media (max-width: 400px) { .th { height: 390px; } .th-phone { scale: .62; } .th-prod { width: 54%; } }
/* v9b: balanse – større produkt, litt mindre telefon */
.th-prod { width: min(440px, 70%); left: -2%; top: 48%; }
.p-stand .th-pi { width: 80%; } .p-plate .th-pi { width: 82%; } .p-card .th-pi { width: 100%; }
.th-phone { width: 208px; bottom: 30px; }
.th-fly { right: 40px; bottom: 250px; }
@media (max-width: 760px) { .th-prod { width: 64%; left: -2%; } .th-phone { width: 208px; } }
.th-hero .prod-hero-grid { grid-template-columns: 5fr 6fr; gap: var(--space-8); }
.th { max-width: 640px; height: 560px; }
.th-prod { top: 46%; }
@media (max-width: 900px) { .th-hero .prod-hero-grid { grid-template-columns: 1fr; } }
.th-hero h1 { font-size: clamp(42px, 4.6vw, 72px); }
@keyframes th-fly { 0%, 79% { opacity: 0; transform: translate(0, 40px) scale(.5); } 83% { opacity: 1; transform: translate(-200px, -128px) scale(1.04); } 86%, 94% { opacity: 1; transform: translate(-210px, -136px) scale(1); } 98%, 100% { opacity: 0; transform: translate(-210px, -160px) scale(.96); } }
@media (max-width: 760px) { @keyframes th-fly { 0%, 79% { opacity: 0; transform: translate(0, 30px) scale(.5); } 83% { opacity: 1; transform: translate(-110px, -90px) scale(1.04); } 86%, 94% { opacity: 1; transform: translate(-116px, -96px) scale(1); } 98%, 100% { opacity: 0; transform: translate(-116px, -116px) scale(.96); } } }
.prod .th-hero h1 { font-size: clamp(46px, 5.2vw, 80px); }

/* Bekreftelse: annen bransje */
.only-annen { display: none; }
.done.annen .only-annen { display: inline; }
.done.annen .only-full, .done.annen .only-generic, .done.annen .only-ring { display: none; }

/* ---------- Målgruppe-linje (som Privat | Bedrift) ---------- */
.aud { background: var(--ink-900); color: var(--on-blaa); font-size: 13px; }
.aud-in { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); min-height: 38px; }
.aud-tabs { display: flex; align-items: stretch; gap: 2px; align-self: stretch; }
.aud-tabs a { display: flex; align-items: center; padding: 0 14px; color: rgba(255,255,255,.72); text-decoration: none; font-weight: var(--weight-semibold); border-bottom: 2px solid transparent; transition: color var(--dur-fast) var(--ease-out); }
.aud-tabs a:hover { color: var(--on-blaa); text-decoration: none; }
.aud-tabs a.on { color: var(--on-blaa); border-bottom-color: var(--accent, #e58b6f); background: rgba(255,255,255,.06); }
.aud-tabs a:first-child { margin-left: -14px; }
.aud-login { color: rgba(255,255,255,.85); text-decoration: none; font-weight: var(--weight-semibold); display: inline-flex; align-items: center; gap: 6px; }
.aud-login::before { content: ""; width: 14px; height: 14px; border-radius: 50%; border: 1.5px solid currentColor; box-shadow: inset 0 -5px 0 -3px currentColor; }
.aud-login:hover { color: var(--on-blaa); text-decoration: none; }
.aud a:focus-visible { outline: 2px solid var(--white); outline-offset: -2px; }
@media (max-width: 760px) {
  .aud { font-size: 12px; }
  .aud-tabs a { padding: 0 10px; }
  .aud-tabs a:first-child { margin-left: -10px; }
}
@media (max-width: 400px) { .aud-login::before { display: none; } .aud-tabs a { padding: 0 8px; } .aud-tabs a:first-child { margin-left: -8px; } }

/* Linje under knappen på Core-forsiden */
.not-us { margin: var(--space-5) 0 0; font-size: var(--text-md); }
.not-us a { color: var(--text-muted); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--line-strong); }
.not-us a:hover { color: var(--text); }

/* ---------- For andre bedrifter ---------- */
.bd-guard { background: var(--brand-wash); font-size: var(--text-sm); padding: 10px 0; text-align: center; }
.bd-guard a { font-weight: var(--weight-semibold); color: var(--brand-text); }
.bd-hero { padding-bottom: var(--space-8); }
.prod .bd-hero h1 { font-size: clamp(44px, 6.4vw, 92px); max-width: 12em; }
.bd-hero .ingress { max-width: 40em; }
section.bd-valg { padding-top: 0; }
.bd-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); }
a.bd-kort { display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-6); border: 1px solid var(--line); border-radius: 24px; background: var(--kort); color: inherit; text-decoration: none; transition: transform var(--dur-base, .3s) var(--ease-out), box-shadow var(--dur-base, .3s) var(--ease-out), border-color var(--dur-fast) var(--ease-out); }
a.bd-kort:hover { transform: translateY(-4px); box-shadow: 0 24px 50px -30px rgba(20,30,60,.4); border-color: var(--line-strong); color: inherit; text-decoration: none; }
.bd-top { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
.bd-top img { height: 30px; width: auto; }
.bd-top em { font-style: normal; font-size: var(--text-sm); font-weight: var(--weight-semibold); padding: 4px 10px; border-radius: 999px; background: var(--bg-warm); }
.bd-vis { aspect-ratio: 16 / 9; border-radius: 16px; background: linear-gradient(180deg, #f5f6f8, #eceef2); display: flex; align-items: center; justify-content: center; overflow: hidden; position: relative; max-width: 100%; }
.bd-vis-trust img { height: 86%; width: auto; max-width: 46%; object-fit: contain; filter: drop-shadow(0 12px 16px rgba(20,30,60,.16)); }
.bd-vis-trust img + img { margin-left: -6%; }
.bd-vis-web { padding: 8% 10% 0; align-items: flex-end; }
.bw-bar { position: absolute; top: 8%; left: 10%; right: 10%; height: 22px; background: #fff; border-radius: 10px 10px 0 0; display: flex; align-items: center; gap: 5px; padding: 0 10px; box-shadow: 0 -1px 0 rgba(0,0,0,.04); }
.bw-bar i { width: 7px; height: 7px; border-radius: 50%; background: #dfe2e8; }
.bw-bar span { margin-left: 8px; font-size: 10px; color: #8a909c; }
.bw-body { width: 100%; height: 78%; background: #fff; border-radius: 0 0 0 0; padding: 18px 20px; display: flex; flex-direction: column; gap: 8px; box-shadow: 0 20px 40px -24px rgba(20,30,60,.35); }
.bw-body b { width: 62%; height: 14px; border-radius: 4px; background: var(--ink-900); }
.bw-body span { width: 80%; height: 8px; border-radius: 4px; background: #e6e8ed; }
.bw-body span.s { width: 55%; }
.bw-body em { align-self: flex-start; margin-top: 6px; font-style: normal; font-size: 10px; font-weight: 700; color: #fff; background: var(--brand); padding: 6px 10px; border-radius: 6px; animation: bw-pulse 2.4s ease-in-out infinite; }
@keyframes bw-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(31,103,255,.35); } 50% { box-shadow: 0 0 0 8px rgba(31,103,255,0); } }
.bd-tekst { display: flex; flex-direction: column; gap: 6px; }
.bd-tekst > b { font-family: var(--font-display); font-weight: var(--weight-extrabold); text-transform: none; font-size: var(--text-3xl); line-height: 1; }
.bd-tekst > span { color: var(--text-muted); }
.bd-pts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.bd-pts span { padding: 4px 10px; border-radius: 999px; border: 1px solid var(--line); font-size: 12px; color: var(--text-muted); }
.bd-btn { margin-top: auto; display: flex; justify-content: center; padding: 13px; border-radius: 12px; background: var(--ink-900); color: var(--on-blaa); font-family: var(--font-display); font-weight: var(--weight-bold); text-transform: none; letter-spacing: var(--tracking-caps); font-size: var(--text-sm); }
a.bd-kort:hover .bd-btn { background: var(--brand); }
section.bd-logos { padding: var(--space-8) 0 var(--space-16); }
@media (prefers-reduced-motion: reduce) { .bw-body em { animation: none; } }
@media (max-width: 760px) { .bd-grid { grid-template-columns: 1fr; } a.bd-kort { padding: var(--space-5); } }
.done.annen .next3, .done.annen h2:has(+ .next3) { display: none; }

/* ==========================================================================
   Zervo Klinikk-designsystemet (2026-10-19)
   Alt under følger ds/: tokens, typeskala, knapp, flater og bevegelse.
   Ingen gradienter, ingen glass, ingen versaler i overskrifter, én kurve.
   ========================================================================== */
body { background: var(--flate); color: var(--blekk); font-family: var(--font-tekst); font-size: 16px; line-height: 26px; }
.wrap, .zk-wrap { max-width: var(--maks-bredde); margin-inline: auto; padding-inline: var(--sidemarg); box-sizing: content-box; }
.zk-wrap { box-sizing: content-box; }
@media (max-width: 640px) { .wrap, .zk-wrap { padding-inline: 20px; } }
section { padding-block: var(--rom-9); }
@media (max-width: 640px) { section { padding-block: var(--rom-8); } }
section.zk-garanti { padding-block: var(--rom-7); }
.warm { background: var(--kort); }
h1, h2, h3, h4 { font-family: var(--font-display); text-transform: none; color: var(--blekk); text-wrap: balance; }
h3, h4 { font-weight: 600; letter-spacing: -0.005em; }
a:hover { color: var(--blaa-tekst); }

/* Seksjonsoverskrifter */
.zv-eyebrow, .zv-label, .note, .eyebrow { font-family: var(--font-tekst); font-size: 13px; line-height: 16px; font-weight: 650; letter-spacing: 0.09em; text-transform: uppercase; color: var(--blaa-tekst); }
.zv-label, .note { color: var(--blekk-dempet); }
.head { max-width: var(--tekst-bredde); margin-bottom: var(--rom-7); display: flex; flex-direction: column; gap: var(--rom-3); }
.head h2, .final h2, .banner h2, .pack h2, .app-grid h2, .price h2, .g-text h2 { font-size: 44px; line-height: 48px; font-weight: 650; letter-spacing: -0.02em; margin: 0; }
.head p { margin-top: 0; font-size: 19px; line-height: 30px; color: var(--blekk-dempet); }
.hero h1, .hero.sub h1, .prod .hero h1, .pb-hero h1, .th-hero h1, .prod .th-hero h1, .prod .bd-hero h1, .buy h1 { font-size: 56px; line-height: 60px; font-weight: 650; letter-spacing: -0.025em; }
.a-hero h1, .book h1 { font-size: 44px; line-height: 48px; font-weight: 650; letter-spacing: -0.02em; }
.prose h2, .a-group-head h2, .done h2, .xsell h2, .pb-teaser h2, .fair h2, .promise-main h3, .t-card b, .a-card.big b, .f-cta b { font-size: 26px; line-height: 32px; font-weight: 600; letter-spacing: -0.01em; }
.closing { font-family: var(--font-display); font-size: 26px; line-height: 32px; font-weight: 600; }
.score .num, .motor.six .score .num, .ap-stat b, .g-30, .big-check, .fair-ic { font-size: 40px; line-height: 44px; font-weight: 650; letter-spacing: -0.02em; }
.g-num span, .risk .zv-stamp-num, .price-box .amount, .cost .total b { font-size: 56px; line-height: 60px; }
@media (max-width: 640px) {
  .hero h1, .hero.sub h1, .prod .hero h1, .pb-hero h1, .th-hero h1, .prod .th-hero h1, .prod .bd-hero h1, .buy h1 { font-size: 40px; line-height: 44px; }
  .head h2, .final h2, .banner h2, .pack h2, .app-grid h2, .price h2, .g-text h2, .a-hero h1, .book h1 { font-size: 32px; line-height: 36px; }
  .prose h2, .a-group-head h2, .done h2, .xsell h2, .pb-teaser h2, .fair h2, .promise-main h3, .t-card b, .a-card.big b, .f-cta b, .closing { font-size: 22px; line-height: 28px; }
  .g-num span, .risk .zv-stamp-num, .price-box .amount, .cost .total b { font-size: 40px; line-height: 44px; }
}
.ingress, .hero p.ingress { font-size: 19px; line-height: 30px; color: var(--blekk-dempet); max-width: 34em; }

/* Knapp: koral er handling, setningsform, radius-m */
.btn { height: 48px; padding: 0 var(--rom-5); border-radius: var(--radius-m); border: 1.5px solid transparent; font-family: var(--font-tekst); font-size: 15px; line-height: 20px; font-weight: 600; letter-spacing: 0.005em; text-transform: none; justify-content: center; white-space: nowrap; background: var(--koral); color: var(--on-koral); transition: background-color var(--varighet-respons) linear, border-color var(--varighet-respons) linear; }
.btn:hover, .btn:active { background: var(--koral-trykk); color: var(--on-koral); transform: none; }
.btn.sm { height: 36px; padding: 0 var(--rom-4); font-size: 14px; }
.btn.ghost, .btn.sec, .btn.secondary { background: var(--kort); color: var(--blekk); border-color: var(--kant); }
.btn.ghost:hover, .btn.sec:hover, .btn.secondary:hover { background: var(--kort); border-color: var(--blekk); color: var(--blekk); }
.more { font-family: var(--font-tekst); font-weight: 600; text-transform: none; letter-spacing: 0; font-size: 15px; color: var(--blaa-tekst); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1.5px; }
.more:hover { color: var(--blaa-tekst); text-decoration-thickness: 2.5px; }
.note { text-transform: uppercase; }
.cta-row { gap: var(--rom-5); }
.cta-row .note { text-transform: none; letter-spacing: 0; font-size: 14px; font-weight: 500; }

/* Navigasjon: fast flate, ingen glass */
.nav { background: var(--flate); backdrop-filter: none; -webkit-backdrop-filter: none; border-bottom: 1px solid var(--strek); }
.nav-in { height: 76px; }
.nav img { height: 26px; }
.nav .links { gap: var(--rom-6); }
.nav .links a.t { font-family: var(--font-tekst); font-size: 15px; font-weight: 600; color: var(--blekk); }
.nav .zk-knapp, .nav .zk-knapp:hover { color: var(--on-koral); text-decoration: none; }
.aud { background: var(--kort); border-bottom: 1px solid var(--strek); }

/* Kort: radius-l, hoyde-1 på flate, ingen fargede venstrekanter */
.tile, .pcard, .a-card, .t-card, .cmp, .promise-grid article, .promise-main, .faq details, .pk, .bundle, .xsell, .price, .price-box, .banner { border-radius: var(--radius-l); }
[class*="card"], .tile { border-left-width: 1px; }

/* Bunntekst */
.site-foot { background: var(--kort); border-top: 1px solid var(--strek); }
.f-bottom .f-tag { font-family: var(--font-tekst); text-transform: none; letter-spacing: 0; font-weight: 500; }

/* Logo i mørk modus: hvit variant */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) img[src="/logos/zervo-core.svg"] { content: url("logos/zervo-core-mork.svg"); }
  :root:not([data-theme="light"]) img[src="/logos/zervo-trust.svg"] { content: url("logos/zervo-trust-mork.svg"); }
  :root:not([data-theme="light"]) img[src="/logos/zervo-web.svg"] { content: url("logos/zervo-web-mork.svg"); }
  :root:not([data-theme="light"]) img[src="/logos/zervo-wordmark.svg"] { content: url("logos/zervo-wordmark-white.svg"); }
  :root:not([data-theme="light"]) img[src="/logos/zervo-mark.svg"] { content: url("logos/zervo-mark-white.svg"); }
}
:root[data-theme="dark"] img[src="/logos/zervo-core.svg"] { content: url("logos/zervo-core-mork.svg"); }
:root[data-theme="dark"] img[src="/logos/zervo-trust.svg"] { content: url("logos/zervo-trust-mork.svg"); }
:root[data-theme="dark"] img[src="/logos/zervo-web.svg"] { content: url("logos/zervo-web-mork.svg"); }
:root[data-theme="dark"] img[src="/logos/zervo-wordmark.svg"] { content: url("logos/zervo-wordmark-white.svg"); }
:root[data-theme="dark"] img[src="/logos/zervo-mark.svg"] { content: url("logos/zervo-mark-white.svg"); }

/* ---------- Forsiden (eksempler/Forside.html) ---------- */
.fs-rad { display: flex; flex-wrap: wrap; gap: var(--rom-4); align-items: center; }
.fs-stakk { display: flex; flex-direction: column; gap: var(--rom-3); }
.fs-hero { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--rom-7); align-items: center; padding-block: var(--rom-8) var(--rom-9); }
.fs-hero__tekst { display: flex; flex-direction: column; gap: var(--rom-5); min-width: 0; }
.fs-hero__bilde { display: flex; flex-direction: column; align-items: center; gap: var(--rom-3); min-width: 0; }
.fs-fakta { display: inline-flex; align-items: center; gap: var(--rom-2); margin: 0; font: 600 14px/20px var(--font-tekst); color: var(--blekk-dempet); }
.fs-fakta .zk-ikon { width: 18px; height: 18px; color: var(--blaa); }
.fs-hero .not-us { margin: 0; }
.fs-hero .not-us a { font-size: 14px; font-weight: 600; color: var(--blaa-tekst); }
@media (max-width: 860px) { .fs-hero { grid-template-columns: 1fr; padding-block: var(--rom-7) var(--rom-8); } }
.tb-topp { display: flex; justify-content: space-between; align-items: center; }
.tb-topp [data-zk-logo] svg { height: 16px; width: auto; display: block; }
.tb-tittel { margin: 2px 0; font: 650 20px/24px var(--font-display); letter-spacing: -.01em; }
.tb-time { display: grid; grid-template-columns: 42px 1fr; gap: var(--rom-2); align-items: center; padding: var(--rom-2) var(--rom-3); background: var(--kort); border-radius: var(--radius-m); font-size: 13px; line-height: 17px; }
.tb-time b { font: 650 13px/17px var(--font-tekst); font-variant-numeric: tabular-nums; color: var(--blekk-dempet); }
.tb-time span { font-weight: 600; min-width: 0; }
.tb-time small { display: block; font-weight: 400; color: var(--blekk-dempet); font-size: 12px; }
.tb-ny { background: var(--ok-tint); box-shadow: var(--hoyde-2); }
.tb-ny b, .tb-ny small { color: var(--ok); }
.tb-full { margin: auto 0 0; font-size: 12px; line-height: 16px; color: var(--blekk-dempet); text-align: center; }
.tb-full b { color: var(--blekk); }
.fs-hjelper { background: var(--kort); border-block: 1px solid var(--strek); padding-block: 0; }
.fs-hjelper__inn { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--rom-7); align-items: end; padding-block: var(--rom-8); }
.fs-hjelper .zk-chip { background: var(--flate); border-color: transparent; }
@media (max-width: 860px) { .fs-hjelper__inn { grid-template-columns: 1fr; gap: var(--rom-5); } }
.fs-senket { background: var(--kort); border-block: 1px solid var(--strek); }
.fs-senket .zk-tjeneste { background: var(--flate); box-shadow: none; }
.fs-problem { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gutter); }
.pk-problem { display: flex; flex-direction: column; gap: var(--rom-2); }
@media (max-width: 1000px) { .fs-problem { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .fs-problem { grid-template-columns: 1fr; } }
.tj-mer { align-self: flex-start; margin-top: auto; }
.fs-to { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gutter); }
@media (max-width: 760px) { .fs-to { grid-template-columns: 1fr; } }
.fs-status { box-shadow: none; background: var(--senket); }
.fs-steg { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); }
.fs-steg li { display: flex; flex-direction: column; gap: var(--rom-2); background: var(--flate); box-shadow: none; }
.fs-steg .zk-tall { color: var(--blaa); }
@media (max-width: 760px) { .fs-steg { grid-template-columns: 1fr; } }
#faq .faq { max-width: 800px; }
/* Målgruppelinjen: rolig, på kort-flaten. Valgt fane i blekk med blå strek (koral er bare knapper). */
.aud { color: var(--blekk-dempet); font-family: var(--font-tekst); }
.aud-tabs a { color: var(--blekk-dempet); }
.aud-tabs a:hover { color: var(--blekk); }
.aud-tabs a.on { color: var(--blekk); border-bottom-color: var(--blaa); background: transparent; }
.aud-login { color: var(--blekk-dempet); }
.aud-login:hover { color: var(--blekk); }
.aud a:focus-visible { outline: 2px solid var(--fokus); outline-offset: -2px; }

/* Undersider: én setning og én demo i toppen */
.sub-hero { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--rom-7); align-items: center; }
.sub-hero__tekst { display: flex; flex-direction: column; gap: var(--rom-5); min-width: 0; }
.sub-hero__tekst h1 { margin: 0; }
.sub-hero__tekst .crumb { display: flex; }
.sub-hero__tekst .crumb .zk-knapp { height: auto; padding: 0; font-size: 14px; }
.sub-hero__demo { min-width: 0; }
@media (max-width: 860px) { .sub-hero { grid-template-columns: 1fr; } }

/* Koral er bare primærknappen: pynt og valgte tilstander bruker blått */
.tile .bar::after { background: var(--blaa); }
.honest::before { display: none; }
.start > * { border-top: 1px solid var(--strek); }
.steps-bar li.cur span { background: var(--blaa); color: var(--on-blaa); }
.cal-grid button.sel, .slot.sel { background: var(--blaa-tint); border-color: var(--blaa-tekst); color: var(--blekk); }
.next3 .n { background: var(--blaa-tint); color: var(--blaa-tekst); }
.you-here { background: var(--blaa-tint); color: var(--blaa-tekst); font-family: var(--font-tekst); text-transform: none; letter-spacing: 0; border-radius: var(--radius-s); }

/* Komplett-oppgraderingen: ingen regnbue. Den kommer inn med «Valgt»-signaturen og får Z-hjørnet når den velges. */
.up-komplett { background: var(--kort); border: 1.5px solid var(--blaa-tekst); border-radius: var(--radius-m); box-shadow: var(--hoyde-2);
  animation: zk-up-inn var(--varighet-standard) var(--kurve-ro) both; transition: border-radius var(--varighet-valgt) var(--kurve-ro), background-color var(--varighet-kort) linear; }
.up-komplett:has(input:checked) { background: var(--blaa-tint); border-color: var(--blaa-tekst); border-radius: var(--radius-z); }
@keyframes zk-up-inn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .up-komplett { animation: none; transition: none; } }

/* Ingen gradienter på flater */
.pk-img, .bd-img, .bd-vis { background: var(--senket); }
.th-glow { display: none; }
.marquee { -webkit-mask-image: none; mask-image: none; }
.logo-track { animation: none; flex-wrap: wrap; width: auto; justify-content: center; row-gap: var(--rom-5); }
.logo-track li[aria-hidden="true"] { display: none; }

/* Trust-helten: rolig kurve, ingen sprett */
.th-phone { animation-timing-function: var(--kurve-ro) !important; }
.s1, .s2, .s3 { animation-timing-function: var(--kurve-ro) !important; }
.g-mini { background: var(--kort); border-color: var(--strek); }
.g-segl { width: 56px; height: 56px; flex: none; display: grid; place-items: center; background: var(--blaa); color: var(--on-blaa); text-align: center; font: 600 11px/12px var(--font-tekst); }
.g-segl b { display: block; font: 650 22px/22px var(--font-display); }
@media (max-width: 420px) {
  .nav img { height: 20px; }
  .nav-in { gap: var(--rom-3); }
  .nav .zk-knapp--liten, .nav .btn.sm { padding: 0 var(--rom-3); }
  .bd-top { flex-wrap: wrap; }
  .bd-top img { height: 24px; max-width: 100%; }
}
.bd-kort { min-width: 0; }

/* ==========================================================================
   Trust-demoen (v10, designsystemet): alle tre produktene står samlet, telefonen holdes mot Stand,
   kunden velger Google, og anmeldelsen havner øverst. Spilles én gang. Uten data-steg = sluttbildet.
   Scene 600 × 520, skaleres med --s (settes i site.js).
   ========================================================================== */
.tk-ramme-ut { position: relative; width: 100%; max-width: 600px; aspect-ratio: 600 / 520; justify-self: end; }
.tk { position: absolute; left: 0; top: 0; width: 600px; height: 520px; transform: scale(var(--s, 1)); transform-origin: 0 0; }
.tk, .tk * { animation: none; }
.tk-fam { position: absolute; left: 0; top: 0; width: 380px; height: 520px; }
.tk-p { position: absolute; margin: 0; }
.tk-p img { display: block; width: 100%; height: auto; filter: drop-shadow(0 18px 22px rgba(20, 27, 45, .16)); }
.tk-plate { left: 4px; top: 36px; width: 170px; z-index: 1; }
.tk-stand { left: 150px; top: 118px; width: 200px; z-index: 2; }
.tk-cards { left: 0; top: 300px; width: 215px; z-index: 3; }
.tk-navn { position: absolute; left: 50%; bottom: -18px; transform: translateX(-50%); height: 28px; padding: 0 var(--rom-3); display: inline-flex; align-items: center; border-radius: var(--radius-full); background: var(--kort); color: var(--blekk); box-shadow: var(--hoyde-1); font: 600 13px/16px var(--font-tekst); white-space: nowrap; }
.tk-ring { position: absolute; left: 22%; top: 66%; width: 64px; height: 64px; margin: -32px 0 0 -32px; border-radius: 50%; border: 2px solid var(--blaa); opacity: 0; pointer-events: none; }

.tk-tlf { position: absolute; left: 372px; top: 34px; width: 220px; aspect-ratio: 409 / 842; z-index: 5; filter: drop-shadow(0 28px 32px rgba(20, 27, 45, .26)); transform-origin: 30% 80%;
  transition: transform var(--varighet-valgt) var(--kurve-ro); }
.tk-ramme { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 3; pointer-events: none; }
.tk-skjerm { position: absolute; left: 3.2%; right: 2.9%; top: 1.1%; bottom: 1.2%; border-radius: 13% / 6.2%; overflow: hidden; background: #fff; color: #1f1f1f;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Roboto, Arial, sans-serif; -webkit-font-smoothing: antialiased; }
.tk-sb { position: absolute; left: 0; right: 0; top: 0; height: 30px; z-index: 6; display: flex; justify-content: space-between; align-items: center; padding: 6px 18px 0 22px; font-size: 11px; font-weight: 600; }
.tk-v { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; padding: 40px 14px 14px; gap: 6px; text-align: center;
  opacity: 0; transform: translateY(12px); transition: opacity var(--varighet-kort) var(--kurve-ro), transform var(--varighet-standard) var(--kurve-ro); }
/* Lås */
.tk-laas { background: #e9eef8; padding-top: 52px; }
.tk-dato { font-size: 11px; font-weight: 600; color: #3c4b6b; }
.tk-klokke { font: 600 50px/1 -apple-system, "SF Pro Display", "Helvetica Neue", Arial, sans-serif; letter-spacing: -.02em; color: #1d2b4f; }
.tk-varsel { margin-top: 14px; width: 100%; display: flex; align-items: center; gap: 8px; padding: 9px 10px; border-radius: 14px; background: rgba(255, 255, 255, .92); box-shadow: 0 6px 18px rgba(20, 27, 45, .12); text-align: left;
  transition: opacity var(--varighet-kort) var(--kurve-ro), transform var(--varighet-standard) var(--kurve-ro); }
.tk-varsel img { width: 26px; height: 26px; padding: 5px; border-radius: 7px; background: #1877F2; filter: brightness(0) invert(1); background-clip: padding-box; flex: none; }
.tk-varsel > span { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.tk-varsel b { font-size: 11px; } .tk-varsel small { font-size: 11px; color: #3c4043; }
.tk-varsel em { font-style: normal; font-size: 10px; color: #6b7280; align-self: flex-start; }
/* Zervo-siden */
.tk-side { background: #f7f4f1; }
.tk-url { font-size: 10px; color: #5f6368; padding: 3px 10px; border-radius: 999px; background: #ebe6e1; }
.tk-av { margin-top: 8px; width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; background: #1877F2; color: #fff; font-weight: 700; font-size: 15px; }
.tk-navn2 { font-size: 15px; } .tk-takk { font-size: 11px; color: #555b69; }
.tk-kort { margin-top: 8px; width: 100%; display: flex; flex-direction: column; gap: 7px; padding: 12px 10px; border-radius: 14px; background: #fff; box-shadow: 0 1px 2px rgba(20, 27, 45, .08); }
.tk-q { font-size: 12px; font-weight: 600; }
.tk-gbtn { display: flex; align-items: center; justify-content: center; gap: 6px; height: 34px; border-radius: 10px; background: #1a73e8; color: #fff; font-size: 11.5px; font-weight: 600; transition: background-color var(--varighet-respons) linear; }
.tk-gbtn img { width: 16px; height: 16px; padding: 2px; border-radius: 50%; background: #fff; }
.tk-dbtn { display: flex; align-items: center; justify-content: center; height: 32px; border-radius: 10px; border: 1px solid #dadce0; font-size: 11px; color: #3c4043; }
.tk-drevet { margin-top: auto; display: inline-flex; align-items: center; gap: 4px; font-size: 10px; color: #555b69; }
.tk-drevet img { width: 10px; height: 10px; }
/* Google: skriv anmeldelse */
.tk-skriv { align-items: stretch; text-align: left; gap: 10px; }
.tk-gtopp { text-align: center; font-size: 13px; padding-bottom: 8px; border-bottom: 1px solid #e8eaed; }
.tk-bruker { display: flex; align-items: center; gap: 8px; text-align: left; }
.tk-bruker > span:last-child { display: flex; flex-direction: column; line-height: 1.2; }
.tk-bruker b { font-size: 12px; } .tk-bruker small { font-size: 10px; color: #5f6368; }
.tk-uav { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: #7e57c2; color: #fff; font-size: 12px; font-weight: 600; flex: none; }
.tk-stj { display: flex; justify-content: center; gap: 6px; font-size: 26px; line-height: 1; }
.tk-stj i { font-style: normal; color: #fbbc04; transition: color var(--varighet-kort) var(--kurve-ro); }
.tk-stj i:nth-child(2) { transition-delay: 80ms; } .tk-stj i:nth-child(3) { transition-delay: 160ms; } .tk-stj i:nth-child(4) { transition-delay: 240ms; } .tk-stj i:nth-child(5) { transition-delay: 320ms; }
.tk-tekst { min-height: 64px; padding: 8px 10px; border: 1px solid #dadce0; border-radius: 8px; font-size: 12px; transition: opacity var(--varighet-kort) var(--kurve-ro) 400ms; }
.tk-pub { align-self: flex-end; margin-top: auto; padding: 8px 18px; border-radius: 18px; background: #1a73e8; color: #fff; font-size: 12px; font-weight: 600; }
/* Google: profilen */
.tk-profil { opacity: 1; transform: none; align-items: stretch; text-align: left; gap: 6px; }
.tk-glogo { height: 20px; align-self: center; margin-bottom: 2px; }
.tk-biz { font-size: 15px; }
.tk-snitt { font-size: 11px; color: #5f6368; } .tk-snitt i { font-style: normal; color: #fbbc04; letter-spacing: 1px; }
.tk-faner { display: flex; gap: 12px; font-size: 11px; color: #5f6368; border-bottom: 1px solid #e8eaed; }
.tk-faner span { padding: 6px 0; } .tk-faner .on { color: #1a73e8; box-shadow: inset 0 -2px 0 #1a73e8; font-weight: 600; }
.tk-rev { display: flex; flex-direction: column; gap: 4px; padding: 10px; background: #fff; }
.tk-ny { background: #e8f0fe; box-shadow: 0 6px 16px -8px rgba(26, 115, 232, .45); }
.tk-ny em { margin-left: auto; font-style: normal; font-size: 9px; font-weight: 700; color: #fff; background: #1a73e8; padding: 2px 6px; border-radius: 6px; align-self: center; }
.tk-rs { font-style: normal; color: #fbbc04; font-size: 12px; letter-spacing: 1px; } .tk-rt { font-size: 11.5px; }
.tk-spok i { display: block; height: 7px; border-radius: 4px; background: #eceef1; } .tk-spok i:nth-child(1) { width: 55%; } .tk-spok i:nth-child(2) { width: 90%; } .tk-spok i:nth-child(3) { width: 70%; }
/* Utfallet */
.tk-fly { position: absolute; left: 96px; top: 6px; z-index: 6; transition: opacity var(--varighet-kort) var(--kurve-ro); }

/* ---- Tidslinjen: data-steg 0 → 6. Uten attributt vises sluttbildet. ---- */
.tk:is([data-steg="0"], [data-steg="1"], [data-steg="2"]) .tk-laas,
.tk:is([data-steg="3"], [data-steg="4"]) .tk-side,
.tk[data-steg="5"] .tk-skriv { opacity: 1; transform: none; }
.tk:is([data-steg="0"], [data-steg="1"], [data-steg="2"], [data-steg="3"], [data-steg="4"], [data-steg="5"]) .tk-profil { opacity: 0; transform: translateY(12px); }
.tk:is([data-steg="0"], [data-steg="1"]) .tk-varsel { opacity: 0; transform: translateY(-12px); }
.tk:is([data-steg="1"], [data-steg="2"]) .tk-tlf { transform: translate(-178px, 96px) rotate(-14deg); }
.tk[data-steg="2"] .tk-ring { animation: zk-ring var(--varighet-standard) var(--kurve-ro) both; }
.tk[data-steg="2"] .tk-ring.r2 { animation-delay: 150ms; }
.tk[data-steg="4"] .tk-gbtn { background: #174ea6; }
.tk:is([data-steg="0"], [data-steg="1"], [data-steg="2"], [data-steg="3"], [data-steg="4"]) .tk-stj i { color: #dadce0; transition-delay: 0ms; }
.tk:is([data-steg="0"], [data-steg="1"], [data-steg="2"], [data-steg="3"], [data-steg="4"]) .tk-tekst { opacity: 0; transition-delay: 0ms; }
.tk:is([data-steg="0"], [data-steg="1"], [data-steg="2"], [data-steg="3"], [data-steg="4"], [data-steg="5"]) .tk-fly { opacity: 0; }
.tk[data-steg="6"] .tk-ny { animation: zk-valgt var(--varighet-valgt) var(--kurve-ro) both; }
.tk[data-steg="6"] .tk-fly { animation: zk-valgt var(--varighet-valgt) var(--kurve-ro) 200ms both, zk-inn var(--varighet-kort) var(--kurve-ro) 200ms both; }
.th-hero .prod-hero-grid { align-items: center; }
@media (max-width: 900px) { .tk-ramme-ut { justify-self: center; } }
/* v10b: større produkter, ryddig rad i anmeldelsen */
.tk-plate { left: 0; top: 24px; width: 200px; }
.tk-stand { left: 168px; top: 112px; width: 226px; }
.tk-cards { left: 0; top: 292px; width: 236px; }
.tk-tlf { left: 384px; top: 30px; width: 214px; }
.tk:is([data-steg="1"], [data-steg="2"]) .tk-tlf { transform: translate(-176px, 112px) rotate(-14deg); }
.tk-bruker > span:last-child { flex: 1; min-width: 0; }
.tk-fly { left: 112px; top: 0; }
.th-pts { margin: 0; }
.th-pts li::before { content: none !important; display: none !important; }
.th-pts .zk-chip { height: 36px; font-size: 14px; }
.th-pts li { padding: 0; border: 0; background: none; }
.th-hero .th-pts { margin-bottom: var(--rom-6); }

/* ==========================================================================
   Bevegelse (designsystemet): sluttbildet er standard. .zf-for er førtilstanden, satt av site.js
   bare på det som ligger under skjermen. Én kurve, 450 ms, 12 px, stagger via --zf-i.
   ========================================================================== */
[data-in], .on [data-in], .on [data-in="2"], .on [data-in="3"], .on [data-in="4"] { opacity: 1; transform: none;
  transition: opacity var(--varighet-standard) var(--kurve-ro), transform var(--varighet-standard) var(--kurve-ro);
  transition-delay: calc(var(--zf-i, 0) * var(--stagger)); }
@media (max-width: 640px) { [data-in] { transition-delay: calc(var(--zf-i, 0) * 120ms); } }
.zf-for [data-in] { opacity: 0; transform: translateY(12px); transition: none; }
.stars .fill, .on .stars .fill { width: 98%; transition: width var(--varighet-teller) var(--kurve-ro) 300ms; }
.zf-for .stars .fill { width: 76%; transition: none; }
/* Den gamle fremdriftsstreken over stegkortene er borte: kortene kommer inn i rekkefølge i stedet. */
.tile .bar { display: none; }
.tile .no, .tile.active .no, .tile.done .no { color: var(--blaa-tekst); }
@media (prefers-reduced-motion: reduce) { [data-in] { transition: none !important; } }

/* ==========================================================================
   Komponenter strammet inn mot designsystemet (gjelder Core, Trust og Web)
   ========================================================================== */
/* Ikoner */
.zf-venstre .zk-ikon, .zf-venstre svg { transform: rotate(180deg); }
.crumb a, .crumb .note, a.note { display: inline-flex; align-items: center; gap: var(--rom-1); }
.crumb .zk-ikon, a.note .zk-ikon { width: 16px; height: 16px; }

/* Varselrader (.nt) = designsystemets rad: kort, ikon i rute, utfall med Z-hjørnet */
.nt { background: var(--kort); border: 0; border-radius: var(--radius-m); box-shadow: var(--hoyde-1); padding: var(--rom-3) var(--rom-4); gap: var(--rom-3); }
.warm .screen .nt, .screen .nt { background: var(--kort); }
.nt .ic { width: 36px; height: 36px; border-radius: var(--radius-m); font: 650 14px/1 var(--font-tekst); }
.nt .ic .zk-ikon { width: 20px; height: 20px; }
.nt b { font: 600 15px/20px var(--font-tekst); color: var(--blekk); }
.nt span.s { font-size: 14px; line-height: 20px; color: var(--blekk-dempet); }
.ic.red { background: var(--feil-tint); color: var(--feil); }
.ic.blue { background: var(--blaa-tint); color: var(--blaa); }
.ic.gold { background: var(--rav-tint); color: var(--rav-tekst); }
.ic.green { background: var(--kort); color: var(--ok); }
.nt.lost { border: 0; }
.nt.win { border: 0; background: var(--ok-tint); box-shadow: var(--hoyde-2); border-radius: var(--radius-z); }
.nt.win b { font: 650 20px/24px var(--font-display); letter-spacing: -.01em; color: var(--ok); }
.nt.win span.s { color: var(--ok); }
.nt.flag { border: 0; }
.screen { background: var(--senket); border: 0; border-radius: var(--radius-l); height: auto; min-height: 210px; }
.problem .stack { background: var(--senket); border: 0; border-radius: var(--radius-l); padding: var(--rom-5); box-shadow: none; gap: var(--rom-2); }
.problem .stack .note { margin-bottom: var(--rom-1); }

/* Stegkort */
.tile { background: var(--kort); border-radius: var(--radius-l); box-shadow: var(--hoyde-1); padding: var(--rom-5); display: flex; flex-direction: column; }
.warm .tile { background: var(--flate); box-shadow: none; }
.tile .no { margin: 0 0 var(--rom-2); font: 650 13px/16px var(--font-tekst); letter-spacing: .09em; text-transform: uppercase; }
.tile h3 { font: 600 20px/26px var(--font-display); letter-spacing: -.005em; min-height: 0; }
.tile p { font-size: 15px; line-height: 24px; color: var(--blekk-dempet); }

/* Tre poeng og kart over systemet */
.points { gap: var(--gutter); }
.points > div { background: var(--kort); border-radius: var(--radius-l); box-shadow: var(--hoyde-1); padding: var(--rom-5); }
.warm .points > div { background: var(--flate); box-shadow: none; }
.points h3 { border: 0; padding: 0; font: 600 20px/26px var(--font-display); letter-spacing: -.005em; }
.points p { font-size: 15px; line-height: 24px; }
.honest { font: 600 20px/28px var(--font-display); max-width: var(--tekst-bredde); color: var(--blekk); }
.ahead, .a-cta { background: var(--blaa-tint); border: 0; border-radius: var(--radius-l); box-shadow: none; }
.ahead b { font-family: var(--font-tekst); font-weight: 650; }
.m-card, a.m-card { background: var(--kort); border: 0; border-radius: var(--radius-l); box-shadow: var(--hoyde-1); }
a.m-card:hover { box-shadow: var(--hoyde-2); }
.m-card.here, .warm .m-card.here { background: var(--blaa-tint); border: 0; box-shadow: none; border-radius: var(--radius-z); }
.m-card b, .others b { font: 600 20px/26px var(--font-display); }
.a-card { border-radius: var(--radius-l); border: 0; box-shadow: var(--hoyde-1); background: var(--kort); }
.a-card:hover { box-shadow: var(--hoyde-2); }
.a-card b { font-family: var(--font-display); font-weight: 600; }

/* Avslutning: rolig kort med én primærknapp */
.final .banner { background: var(--kort); border: 0; border-radius: var(--radius-l); box-shadow: var(--hoyde-1); padding: var(--rom-7); display: flex; flex-direction: column; gap: var(--rom-5); align-items: flex-start; }
.final .banner h2 { margin: 0; max-width: 16em; }
.banner-text { color: var(--blekk-dempet); font-size: 19px; line-height: 30px; max-width: 34em; }

/* Spørsmål og svar */
.faq details { background: var(--kort); border: 0; box-shadow: var(--hoyde-1); border-radius: var(--radius-l); }
.faq summary h3, .faq summary { font: 600 17px/24px var(--font-tekst); }
summary::after { color: var(--blaa-tekst); }

/* Skjemafelt = zk-felt */
.book-card, .prod-contact form, .bd-form { background: var(--kort); border: 0; border-radius: var(--radius-l); box-shadow: var(--hoyde-1); }
.field { gap: var(--rom-2); }
.field label, .help legend, .seg legend, .field .lbl { font: 600 15px/20px var(--font-tekst); color: var(--blekk); }
.field input, .field select, .field textarea { height: 48px; padding: 0 var(--rom-4); border: 1.5px solid var(--kant); border-radius: var(--radius-m); background: var(--kort); color: var(--blekk); font: 400 16px/24px var(--font-tekst); transition: border-color var(--varighet-respons) linear; }
.field textarea { height: auto; min-height: 120px; padding: var(--rom-3) var(--rom-4); }
.field input:hover, .field select:hover, .field textarea:hover { border-color: var(--blekk-dempet); }
.field input:focus, .field select:focus, .field textarea:focus { outline: 2px solid var(--fokus); outline-offset: 2px; border-color: var(--blaa-tekst); }
.field .hint, .qty-hint { font-size: 14px; line-height: 20px; color: var(--blekk-dempet); }
.field .err { font: 500 14px/20px var(--font-tekst); color: var(--feil); }
.field.bad input, .field.bad select, .field.bad textarea { border: 2px solid var(--feil); background: var(--kort); }
.seg-opts span, .pick-btn, .qty, .cal-nav, .pg-nav { border: 1.5px solid var(--kant); border-radius: var(--radius-m); background: var(--kort); font-family: var(--font-tekst); }
.pg-nav { border-radius: var(--radius-full); display: grid; place-items: center; }
.pg-nav .zk-ikon, .cal-nav .zk-ikon { width: 18px; height: 18px; }
.cal-nav { display: grid; place-items: center; }
.seg-opts span { font-weight: 600; }
.seg-opts input:checked + span, .kv-opt input:checked + span { border: 1.5px solid var(--blaa-tekst); background: var(--blaa-tint); color: var(--blekk); box-shadow: none; padding: inherit; }
.kv-opt span { border: 1.5px solid var(--kant); border-radius: var(--radius-m); }
.kv-opt input:checked + span { padding: 8px 4px; }
.pick-list { border: 0; border-radius: var(--radius-l); box-shadow: var(--hoyde-3); }
.pick-list li { border-radius: var(--radius-m); }
.pick-list li[aria-selected="true"] { background: var(--blaa-tint); }
.bind-opt, .bump-buy, .buy-opt { border: 1.5px solid var(--kant); border-radius: var(--radius-m); background: var(--kort); }
.bind-opt:has(input:checked) { border: 1.5px solid var(--blaa-tekst); padding: 14px 16px; background: var(--blaa-tint); }
.bind-opt em, .pk-badge, .bmp-t em, .up-komplett .bmp-t em { font: 600 13px/16px var(--font-tekst); letter-spacing: 0; text-transform: none; height: 26px; padding: 0 10px; display: inline-flex; align-items: center; border-radius: var(--radius-s); background: var(--ok-tint); color: var(--ok); }
.up-komplett .bmp-t em, .pk-badge { background: var(--blaa-tint); color: var(--blekk); }
.bump-buy:has(input:checked) { border: 1.5px solid var(--blaa-tekst); background: var(--blaa-tint); }
.bind-opt input, .bump-buy input, .up-komplett input, .buy-opt input { accent-color: var(--blaa-tekst); }
.steps-bar li span { background: var(--senket); color: var(--blekk-dempet); font-weight: 650; }
.steps-bar li.done span { background: var(--ok-tint); color: var(--ok); }
.steps-bar li .zk-ikon { width: 16px; height: 16px; }
.big-check { width: 72px; height: 72px; background: var(--ok-tint); color: var(--ok); border-radius: var(--radius-z); }
.big-check .zk-ikon { width: 36px; height: 36px; }
.privacy { font-size: 13px; line-height: 20px; color: var(--blekk-dempet); }
.score .num { font-variant-numeric: proportional-nums; letter-spacing: -0.02em; min-width: 0; }

/* ---------- Trust og Web: samme system ---------- */
/* Haker som ikon (maske fra ikonsettet), ikke tegn */
:root { --zf-sjekk: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }
.bd-pts li::before, .pack-base b::before, .stack-all b::before, .price-inc li::before, .cmp.with li::before, .chip-opt input:checked + span::before, .buy-trygt li::before {
  content: ""; display: inline-block; flex: none; width: 18px; height: 18px; margin-right: var(--rom-2); vertical-align: -3px; background: var(--ok) !important; border-radius: 0;
  -webkit-mask: var(--zf-sjekk) center / contain no-repeat; mask: var(--zf-sjekk) center / contain no-repeat; }
.bd-pts li, .buy-trygt li { display: flex; align-items: flex-start; gap: 0; }
.buy-trygt li > span[data-zk-ikon] { display: none; }

/* Pakker */
.bundle { border: 0; border-radius: var(--radius-l); box-shadow: var(--hoyde-1); }
.bundle.on { border: 1.5px solid var(--blaa-tekst); box-shadow: var(--hoyde-2); }
.bundle h3 { font: 650 34px/40px var(--font-display); letter-spacing: -.015em; }

/* Ærlig, innenfor Googles regler: varselkort ok */
.fair { background: var(--ok-tint); border: 0; border-radius: var(--radius-l); box-shadow: none; padding: var(--rom-6); gap: var(--rom-5); }
.fair-ic { width: 56px; height: 56px; border-radius: var(--radius-z); background: var(--kort); color: var(--ok); font-size: 0; }
.fair-ic::before { content: ""; width: 28px; height: 28px; background: var(--ok); -webkit-mask: var(--zf-sjekk) center / contain no-repeat; mask: var(--zf-sjekk) center / contain no-repeat; }
.fair p { font-size: 16px; line-height: 26px; color: var(--blekk); }

/* Playbook-teaser og kryssalg: kort, ikke fargeflate */
.pb-teaser { background: var(--kort); border-radius: var(--radius-l); box-shadow: var(--hoyde-1); }
.xsell { border: 0; border-radius: var(--radius-l); }
.bump, .bump-buy { border: 1.5px solid var(--kant); border-radius: var(--radius-m); background: var(--kort); }
.inbox { border: 1.5px solid var(--strek); border-radius: var(--radius-m); }

/* Steg med tall: blekk, ikke blått */
.feat3 .big, .steps-num .big, .start .big { color: var(--blekk); font: 650 40px/44px var(--font-display); letter-spacing: -.02em; }
.feat3 > *, .start > * { background: var(--kort); border: 0; border-radius: var(--radius-l); box-shadow: var(--hoyde-1); padding: var(--rom-5); }
.warm .feat3 > *, .warm .start > * { background: var(--flate); box-shadow: none; }

/* Produktkort og merker */
.pk { border: 0; border-radius: var(--radius-l); box-shadow: var(--hoyde-1); overflow: hidden; transition: box-shadow var(--varighet-respons) linear; }
a.pk:hover { box-shadow: var(--hoyde-2); }
.pk-btn { height: 40px; border-radius: var(--radius-m); border: 1.5px solid var(--kant); font: 600 15px/20px var(--font-tekst); }
.pk-steder span, .pp-sted { border-radius: var(--radius-full); font: 600 13px/16px var(--font-tekst); }
.pk-pris, .pk-pris b { font-family: var(--font-tekst); }
.bd-kort { border: 0; border-radius: var(--radius-l); box-shadow: var(--hoyde-1); }
.bd-guard { background: var(--blaa-tint); color: var(--blekk); }
.app-phone { border-radius: 36px; box-shadow: var(--hoyde-3); }
.ap-stat b { color: var(--blekk); }
.buy-trygt li::before { content: none !important; }
.buy-trygt li > span[data-zk-ikon] { display: inline-flex; width: 20px; height: 20px; margin-right: var(--rom-2); background: none; color: var(--ok); border-radius: 0; }
.buy-trygt li > span[data-zk-ikon] .zk-ikon { width: 18px; height: 18px; }

/* SEO / AEO / GEO-bildene: ingen løkker, ingen skrivemaskin. Sluttbildet er standard; radene kommer inn via [data-in]. */
.s-vis *, .bd-vis * { animation: none !important; }
.s-vis .tw { max-width: none; border-right: 0; padding-right: 0; }
.s-vis .g-r { opacity: 1; }
.s-vis .g-r.r1 { top: 45px; } .s-vis .g-r.r2 { top: 90px; }
.s-vis .g-r.me { top: 0; border: 1.5px solid var(--blaa-tekst); background: var(--blaa-tint); box-shadow: none; }
.s-vis .g-r.me b { max-width: 3ch; margin-right: 2px; }
.s-vis .ln { width: var(--w); }
.s-vis .src { opacity: 1; }
.s-vis .src.me { border: 1.5px solid var(--blaa-tekst); background: var(--blaa-tint); color: var(--blekk); }
.s-vis .q, .s-vis .a { opacity: 1; }
.s-vis .a { background: var(--blaa); color: var(--on-blaa); }
.s-vis .spark { display: inline-flex; } .s-vis .spark .zk-ikon { width: 16px; height: 16px; }
.s-vis .ai-cell { border-color: var(--strek); box-shadow: none; }
.s-vis .g-r, .s-vis .g-bar, .s-vis .ai-cell, .s-vis .q { border-radius: var(--radius-m); }
.s-vis .g-r.me, .s-vis .src.me, .s-vis .a { border-radius: var(--radius-z); }
.s-card { background: var(--kort); border: 0; border-radius: var(--radius-l); box-shadow: var(--hoyde-1); }
.warm .s-card { background: var(--flate); box-shadow: none; }
.s-vis { background: var(--senket); border: 0; border-radius: var(--radius-l); }
.s-tag { border-radius: var(--radius-s); background: var(--blaa-tint); color: var(--blaa-tekst); font: 650 13px/16px var(--font-tekst); }
/* Web-heroen: designsystemets nettleserramme */
.web-vis { display: flex; flex-direction: column; gap: var(--rom-2); min-width: 0; }
.web-vis .zk-nettleser { box-shadow: var(--hoyde-3); }
.wv { display: flex; flex-direction: column; gap: var(--rom-3); align-items: flex-start; }
.wv-h { margin: 0; }
.wv-skjema { display: grid; grid-template-columns: 1fr 1fr auto; gap: var(--rom-2); width: 100%; }
.wv-felt { height: 36px; display: flex; align-items: center; padding: 0 var(--rom-3); border: 1.5px solid var(--kant); border-radius: var(--radius-m); background: var(--kort); color: var(--blekk-dempet); font-size: 14px; }
.wv-eks { align-self: flex-end; }
@media (max-width: 480px) { .wv-skjema { grid-template-columns: 1fr; } }
.hero .cta-row .btn, .final .cta-row .btn, .buy-btn { height: 56px; padding: 0 var(--rom-6); font-size: 16px; }
/* For andre bedrifter: kort etter systemet */
a.bd-kort { border: 0; border-radius: var(--radius-l); box-shadow: var(--hoyde-1); transition: box-shadow var(--varighet-respons) linear; }
a.bd-kort:hover { transform: none; box-shadow: var(--hoyde-2); border: 0; }
.bd-btn { height: 48px; padding: 0; align-items: center; border-radius: var(--radius-m); background: var(--kort); color: var(--blekk); border: 1.5px solid var(--kant); font: 600 15px/20px var(--font-tekst); }
a.bd-kort:hover .bd-btn { background: var(--kort); border-color: var(--blekk); }
.bd-vis { border-radius: var(--radius-l); }
.bw-bar { background: var(--kort); border-radius: var(--radius-m) var(--radius-m) 0 0; box-shadow: none; border-bottom: 1px solid var(--strek); }
.bw-bar i { background: var(--strek); }
.bw-body { background: var(--kort); box-shadow: var(--hoyde-2); }
.bw-body b { background: var(--blekk); }
.bw-body span { background: var(--senket); }
.bw-body em { background: var(--koral); color: var(--on-koral); border-radius: var(--radius-s); font-family: var(--font-tekst); }
.bd-top em { background: var(--senket); font: 600 13px/16px var(--font-tekst); border-radius: var(--radius-s); }
.bd-pts li, .pk-steder span { background: var(--senket); border: 0; border-radius: var(--radius-full); }
.bundle .bd-pts li { background: none; border-radius: 0; }
.bd-kort .bd-pts span { background: var(--senket); border: 0; font: 600 13px/16px var(--font-tekst); color: var(--blekk); padding: 6px 12px; }
.xsell, .xsell.x-web, .xsell.x-trust, .xsell.x-plain { background: var(--kort); border: 0; box-shadow: var(--hoyde-1); }
/* Ingen fargede venstrekanter, ingen zoom/rotasjon på hover */
.kort { background: var(--blaa-tint); border: 0; border-radius: var(--radius-l); }
.pcard { border: 0; box-shadow: var(--hoyde-1); border-radius: var(--radius-l); }
.nt.flag, .nt.lost { border-left: 0; }
a.v-card:hover .v-foto { transform: scale(1.02); }
.f-card { background: var(--kort); border: 0; border-radius: var(--radius-l); box-shadow: var(--hoyde-1); }
.warm .f-card { background: var(--flate); box-shadow: none; }
.f-ic { color: var(--blekk); font: 650 40px/44px var(--font-display); letter-spacing: -.02em; }
/* Playbook: verdien som merke, omslaget rolig */
.value { border: 0; border-radius: var(--radius-s); background: var(--rav-tint); color: var(--rav-tekst); font-family: var(--font-tekst); }
.value s { color: var(--blekk-dempet); }
.value b { color: var(--ok); font-family: var(--font-tekst); }
.pb-cover, .pb-mini { border-left-color: var(--blaa); }
.pb-page { transform: translate(10px, 8px) rotate(2deg); }
.pb-stamp { background: var(--blaa); color: var(--on-blaa); border-radius: var(--radius-z); font-family: var(--font-tekst); }
.tk-bruker b, .tk-bruker small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Forsiden: ren typografi i heroen, ingen telefon */
.fs-hero--tekst { grid-template-columns: minmax(0, 1fr); padding-block: var(--rom-9); }
.fs-hero--tekst .fs-hero__tekst { max-width: 820px; }
.fs-hero--tekst .zk-display-xl { font-size: 72px; line-height: 76px; letter-spacing: -0.03em; }
@media (max-width: 860px) { .fs-hero--tekst .zk-display-xl { font-size: 48px; line-height: 52px; } }
@media (max-width: 640px) { .fs-hero--tekst { padding-block: var(--rom-8); } .fs-hero--tekst .zk-display-xl { font-size: 40px; line-height: 44px; } }

/* Core-forsiden: Zervo-appen på én rad */
.fs-app { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--rom-7); align-items: center; }
.fs-app__tekst { display: flex; flex-direction: column; gap: var(--rom-5); }
@media (max-width: 760px) { .fs-app { grid-template-columns: 1fr; gap: var(--rom-5); } }

/* Core-forsiden: Zervo Trust med ekte produktbilder og riktig produktlogo */
.fs-trust { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--rom-7); align-items: center; }
.fs-trust__tekst { display: flex; flex-direction: column; gap: var(--rom-4); align-items: flex-start; }
.fs-trust__logo { height: 26px; width: auto; margin-bottom: var(--rom-2); }
.fs-trust__prod { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); }
.fs-trust__prod a { display: flex; flex-direction: column; gap: var(--rom-1); height: 100%; padding: var(--rom-4); background: var(--flate); border-radius: var(--radius-l); color: var(--blekk); text-decoration: none; transition: box-shadow var(--varighet-respons) linear; }
.fs-trust__prod a:hover { box-shadow: var(--hoyde-2); color: var(--blekk); text-decoration: none; }
.fs-trust__bilde { aspect-ratio: 1 / 1; display: grid; place-items: center; margin-bottom: var(--rom-2); }
.fs-trust__bilde img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; filter: drop-shadow(0 14px 18px rgba(20, 27, 45, .14)); }
.fs-trust__navn { font: 600 20px/26px var(--font-display); letter-spacing: -.005em; }
.fs-trust__hvor { font-size: 14px; line-height: 20px; color: var(--blekk-dempet); }
@media (max-width: 900px) { .fs-trust { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .fs-trust__prod { gap: var(--rom-2); } .fs-trust__prod a { padding: var(--rom-2); } .fs-trust__navn { font-size: 16px; line-height: 22px; } .fs-trust__hvor { font-size: 12px; line-height: 16px; } }

/* Anmeldelser-undersiden: Trust-tips med logo og produktene */
.trust-tip { margin-top: var(--rom-7); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--rom-6); align-items: center; padding: var(--rom-6); background: var(--kort); border-radius: var(--radius-l); box-shadow: var(--hoyde-1); color: var(--blekk); text-decoration: none; transition: box-shadow var(--varighet-respons) linear; }
.warm .trust-tip { background: var(--flate); }
.trust-tip:hover { box-shadow: var(--hoyde-2); color: var(--blekk); text-decoration: none; }
.trust-tip__tekst { display: flex; flex-direction: column; gap: var(--rom-2); align-items: flex-start; }
.trust-tip__tekst img { height: 22px; width: auto; margin-bottom: var(--rom-2); }
.trust-tip__tekst b { font: 600 20px/26px var(--font-display); }
.trust-tip__tekst > span:not(.zk-knapp) { color: var(--blekk-dempet); }
.trust-tip__tekst .zk-knapp { height: auto; padding: 0; margin-top: var(--rom-2); }
.trust-tip__prod { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--rom-3); align-items: end; }
.trust-tip__prod img { width: 100%; height: auto; filter: drop-shadow(0 12px 16px rgba(20, 27, 45, .14)); }
@media (max-width: 760px) { .trust-tip { grid-template-columns: 1fr; } }
.fs-trust__logo { margin-bottom: var(--rom-4); }

/* Personvern og 404 */
.jur-inn { max-width: var(--tekst-bredde); display: flex; flex-direction: column; gap: var(--rom-4); }
.jur-del { padding: 0; display: flex; flex-direction: column; gap: var(--rom-2); margin-top: var(--rom-4); }
.jur-del h2 { font: 600 20px/26px var(--font-display); }
.jur-del p { color: var(--blekk-dempet); }
.jur-del a, .jur-inn a:not(.zk-knapp) { color: var(--blaa-tekst); text-decoration: underline; text-underline-offset: 3px; }
.jur-fot .f-bottom { padding-block: var(--rom-6); display: flex; justify-content: space-between; flex-wrap: wrap; gap: var(--rom-3); }
/* Hopp til innholdet: synlig ved tastaturfokus */
.hopp { position: absolute; left: var(--rom-4); top: -60px; z-index: 2000; padding: var(--rom-2) var(--rom-4); border-radius: var(--radius-m); background: var(--kort); color: var(--blekk); box-shadow: var(--hoyde-2); font-weight: 600; }
.hopp:focus { top: var(--rom-3); }
/* Meny på mobil */
.meny-knapp { display: none; }
.meny-panel { display: none; }
@media (max-width: 760px) {
  .meny-knapp { display: inline-flex; align-items: center; gap: var(--rom-2); height: 36px; padding: 0 var(--rom-3); border: 1.5px solid var(--kant); border-radius: var(--radius-m); background: var(--kort); color: var(--blekk); font: 600 14px/20px var(--font-tekst); cursor: pointer; order: -1; }
  .meny-strek, .meny-strek::before, .meny-strek::after { display: block; width: 14px; height: 1.75px; border-radius: 2px; background: currentColor; position: relative; }
  .meny-strek::before, .meny-strek::after { content: ""; position: absolute; left: 0; }
  .meny-strek::before { top: -5px; } .meny-strek::after { top: 5px; }
  .nav .links { gap: var(--rom-2); }
  .nav { position: sticky; }
  .meny-panel:not([hidden]) { display: flex; flex-direction: column; position: absolute; left: 0; right: 0; top: 100%; padding: var(--rom-2) 20px var(--rom-4); background: var(--flate); border-bottom: 1px solid var(--strek); box-shadow: var(--hoyde-2); }
  .meny-lenke { display: flex; align-items: center; min-height: 48px; border-bottom: 1px solid var(--strek); color: var(--blekk); font: 600 17px/24px var(--font-tekst); text-decoration: none; }
  .meny-lenke:last-child { border-bottom: 0; }
}
@media (max-width: 380px) { .meny-knapp { padding: 0 var(--rom-2); } .nav .zk-knapp--liten, .nav .btn.sm { padding: 0 10px; font-size: 13px; } }
@media (max-width: 420px) {
  .meny-tekst { display: none; }
  .meny-knapp { width: 36px; justify-content: center; padding: 0; }
  .nav .links { gap: var(--rom-2); }
}
@media (max-width: 340px) { .nav img { height: 18px; } }

/* ==========================================================================
   Skjemaer i steg
   ========================================================================== */
.st-skjema { display: flex; flex-direction: column; gap: var(--rom-5); }
.st-topp { display: flex; flex-direction: column; gap: var(--rom-2); order: -1; }
.st-rad { display: flex; align-items: baseline; gap: var(--rom-3); }
.st-teller { font: 650 13px/16px var(--font-tekst); letter-spacing: .09em; text-transform: uppercase; color: var(--blaa-tekst); }
.st-navn { font: 600 20px/26px var(--font-display); color: var(--blekk); }
.st-topp .zk-spor__fyll { transition: width var(--varighet-standard) var(--kurve-ro); }
.st-prikker { list-style: none; margin: 0; padding: 0; display: flex; gap: var(--rom-4); flex-wrap: wrap; font: 600 13px/16px var(--font-tekst); color: var(--blekk-dempet); }
.st-prikker li { display: inline-flex; align-items: center; gap: 6px; }
.st-prikker li::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--strek); }
.st-prikker li.na { color: var(--blekk); } .st-prikker li.na::before { background: var(--blaa); }
.st-prikker li.ferdig::before { background: var(--ok); }
.st-steg { display: flex; flex-direction: column; gap: var(--rom-5); }
.st-steg[hidden] { display: none; }
.st-steg .fields { margin: 0; }
.st-steg .fields > fieldset, .st-steg .fields > .bump, .st-steg .fields > .field.full, .st-steg .fields > [data-hvem] { grid-column: 1 / -1; margin-top: 0; }
.st-knapper { display: flex; justify-content: space-between; align-items: center; gap: var(--rom-3); flex-direction: row-reverse; }
.st-knapper .st-neste { min-width: 200px; }
.st-tilbake-siste { align-self: flex-start; height: auto; padding: 0; }
.st-skjema .book-actions, .st-skjema > .st-steg > .btn { align-self: stretch; }
.st-skjema button[type=submit].btn { width: 100%; height: 56px; font-size: 16px; }
.st-skjema .book-actions { display: flex; flex-direction: column; gap: var(--rom-4); }
.st-skjema .alt-call { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--rom-3); padding-top: var(--rom-4); border-top: 1px solid var(--strek); }
@media (max-width: 560px) { .st-knapper { flex-direction: column-reverse; align-items: stretch; } .st-knapper .st-neste { width: 100%; } }
.st-knapper { flex-direction: row; }
.st-knapper .st-neste { margin-left: auto; }
@media (max-width: 560px) { .st-knapper { flex-direction: column-reverse; } .st-knapper .st-neste { margin-left: 0; } }

/* Trust-demo v10c: riktig statuslinje og ryddigere skjermer */
.tk-sb { height: 34px; padding: 0 7% 0 9%; font: 600 11.5px/1 -apple-system, "SF Pro Text", "Helvetica Neue", Arial, sans-serif; letter-spacing: -.01em; align-items: center; top: 1.2%; }
.tk-tid { min-width: 34px; text-align: center; }
.tk-ikoner { display: inline-flex; align-items: center; gap: 4px; color: #1d1d1f; }
.tk-ikoner svg { display: block; height: 9px; width: auto; fill: currentColor; }
.tk-ikoner svg:last-child { height: 10px; }
.tk-laas .tk-tid, .tk-sb { color: #1d1d1f; }
.tk-v { padding-top: 46px; }
.tk-gbtn { white-space: nowrap; font-size: 11px; height: 36px; padding: 0 10px; gap: 7px; }
.tk-gbtn img { width: 18px; height: 18px; padding: 2px; flex: none; }
.tk-dbtn { height: 34px; }
.tk-kort { padding: 12px; border-radius: 16px; gap: 8px; }
.tk-q { font-size: 12.5px; margin-bottom: 2px; }
.tk-av { border-radius: 14px; }
.tk-bruker { gap: 9px; }
.tk-bn { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1; }
.tk-bn b { font-size: 12px; line-height: 15px; } .tk-bn small { font-size: 10px; line-height: 13px; color: #5f6368; }
.tk-ny em { margin-left: 6px; flex: none; font-size: 9px; line-height: 1; padding: 4px 6px; border-radius: 6px; align-self: center; }
.tk-rev { border-radius: 12px; gap: 6px; }
.tk-ny { padding: 11px 11px 12px; }
.tk-rs { font-size: 13px; letter-spacing: 1.5px; }
.tk-faner { margin-bottom: 4px; }
.tk-laas { background: linear-gradient(180deg, #dfe7f6 0%, #eef2fa 100%); }
.tk-varsel { border-radius: 16px; padding: 10px 11px; box-shadow: 0 8px 22px rgba(20, 27, 45, .14); }
.tk-varsel img { border-radius: 8px; width: 28px; height: 28px; padding: 6px; }
.tk-skriv { gap: 12px; }
.tk-gtopp { display: flex; align-items: center; justify-content: center; gap: 6px; }
.tk-app { width: 30px; height: 30px; border-radius: 8px; background: #1877F2; display: grid; place-items: center; flex: none; }
.tk-app img { width: 15px; height: 15px; padding: 0; background: none; filter: none; border-radius: 0; }
.tk-gtopp img { width: 15px; height: 15px; }
.tk-pub { margin-bottom: 22px; }
.tk-v { padding-bottom: 24px; }
.tk-q { text-wrap: balance; }

/* Kjøpsboksen: grupper uten rammer, tydelige etiketter */
.buy-opt, fieldset.buy-opt { border: 0; padding: 0; margin: 0; background: none; border-radius: 0; min-width: 0; }
.buy-l, .buy-opt legend { display: block; padding: 0; margin: 0 0 var(--rom-2); font: 600 15px/20px var(--font-tekst); color: var(--blekk); }
.buy-l b { font-weight: 600; color: var(--blekk-dempet); }
.qty { height: 56px; border: 1.5px solid var(--kant); border-radius: var(--radius-m); background: var(--kort); }
.qty button { width: 48px; font-size: 20px; color: var(--blekk); transition: background-color var(--varighet-respons) linear; }
.qty button:hover { background: var(--senket); }
.qty input { width: 40px; font: 600 16px/1 var(--font-tekst); color: var(--blekk); background: transparent; }
.bind-opt b, .bump-buy b { font: 600 15px/20px var(--font-tekst); }
.bind-opt small, .bump-buy small, .bmp-t span { color: var(--blekk-dempet); }
/* Fordeler: fire små fliser med ikon */
.bt { list-style: none; margin: 0; padding: var(--rom-4); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--rom-3); background: var(--senket); border: 0; border-radius: var(--radius-l); box-shadow: none; }
.bt li { display: flex; align-items: center; gap: var(--rom-3); padding: var(--rom-3); background: var(--kort); border-radius: var(--radius-m); box-shadow: var(--hoyde-1); min-width: 0; }
.bt li::before { content: none !important; display: none !important; }
.bt .bt-ikon { width: 36px; height: 36px; flex: none; display: grid; place-items: center; border-radius: var(--radius-m); background: var(--blaa-tint); color: var(--blaa); }
.bt .bt-ikon .zk-ikon { width: 20px; height: 20px; }
.bt-tekst { display: flex; flex-direction: column; min-width: 0; }
.bt-tekst b { font: 600 14px/18px var(--font-tekst); color: var(--blekk); }
.bt-tekst small { font-size: 13px; line-height: 18px; color: var(--blekk-dempet); }
@media (max-width: 380px) { .bt { grid-template-columns: 1fr; } }
/* Variantvalg */
.sws { gap: var(--rom-2); }
.sw { border: 1.5px solid var(--kant); border-radius: var(--radius-m); background: var(--kort); padding: 6px 6px 10px; transition: border-color var(--varighet-respons) linear; }
.sw:hover { border-color: var(--blekk); }
.sw[aria-current] { border: 1.5px solid var(--blaa-tekst); background: var(--blaa-tint); padding: 6px 6px 10px; }
.sw-img { border-radius: var(--radius-s); background: var(--senket); }
.sw-n { font: 600 14px/18px var(--font-tekst); }
.bump-buy { padding: var(--rom-3) var(--rom-4); gap: var(--rom-3); }
.bmp-img { background: var(--senket); border-radius: var(--radius-m); }
.buy-trygt.bt span, .buy-trygt.bt li > span[data-zk-ikon] { width: auto; height: auto; margin: 0; border-radius: 0; background: none; color: inherit; font-size: inherit; display: flex; }
.buy-trygt.bt .bt-ikon, .buy-trygt.bt li > span.bt-ikon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: var(--radius-m); background: var(--blaa-tint); color: var(--blaa); flex: none; }
.buy-trygt.bt .bt-tekst { display: flex; flex-direction: column; }
.buy-trygt.bt { font-size: 14px; }
.bt-tekst { align-items: flex-start; text-align: left; } .buy-trygt.bt li { justify-content: flex-start; }

/* Bunnteksten på Core: Zervo Trust som eget produkt, ikke egen seksjon */
.f-trust { margin-top: var(--rom-7); display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: var(--rom-5); align-items: center; padding: var(--rom-4) var(--rom-5); background: var(--flate); border-radius: var(--radius-l); color: var(--blekk); text-decoration: none; transition: box-shadow var(--varighet-respons) linear; }
.f-trust:hover { box-shadow: var(--hoyde-2); color: var(--blekk); text-decoration: none; }
.f-trust__logo { height: 22px; width: auto; }
.f-trust__tekst { font-size: 14px; line-height: 22px; color: var(--blekk-dempet); max-width: 52ch; }
.f-trust__bilder { display: flex; align-items: flex-end; }
.f-trust__bilder img { height: 52px; width: auto; filter: drop-shadow(0 6px 8px rgba(20, 27, 45, .14)); }
.f-trust__bilder img + img { margin-left: -10px; }
@media (max-width: 900px) { .f-trust { grid-template-columns: 1fr auto; } .f-trust__tekst { grid-column: 1 / -1; grid-row: 2; } .f-trust__bilder { display: none; } }

/* Core-hero: midtstilt, med søkemotorene og AI-assistentene */
.fs-hero--midt { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--rom-7); padding-block: var(--rom-9) var(--rom-8); }
.fs-hero--midt .fs-hero__tekst { align-items: center; max-width: 860px; }
.fs-hero--midt .zk-display-xl { font-size: 76px; line-height: 80px; letter-spacing: -0.03em; }
.fs-hero--midt .zk-ingress { max-width: 36em; }
.fs-hero--midt .fs-rad { justify-content: center; }
.fs-motorer { display: flex; flex-direction: column; align-items: center; gap: var(--rom-3); }
.fs-motorer ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: var(--rom-3); }
.fs-motorer li { height: 52px; padding: 0 var(--rom-5); display: grid; place-items: center; background: var(--kort); border-radius: var(--radius-full); box-shadow: var(--hoyde-1);
  animation: zk-opp var(--varighet-standard) var(--kurve-ro) both; animation-delay: calc(300ms + var(--i) * var(--stagger)); }
.fs-motorer img { height: 22px; width: auto; display: block; }
.fs-hero--midt .not-us { margin: 0; }
@media (max-width: 860px) { .fs-hero--midt .zk-display-xl { font-size: 52px; line-height: 56px; } }
@media (max-width: 640px) { .fs-hero--midt { padding-block: var(--rom-8) var(--rom-7); gap: var(--rom-6); } .fs-hero--midt .zk-display-xl { font-size: 40px; line-height: 44px; } .fs-motorer li { height: 44px; padding: 0 var(--rom-4); } .fs-motorer img { height: 18px; } }
@media (prefers-reduced-motion: reduce) { .fs-motorer li { animation: none; } }

/* Zervo-løftet */
.fs-loftet { display: flex; flex-direction: column; gap: var(--gutter); }
.fs-loftet .zk-seksjonstopp { margin-bottom: var(--rom-5); }
.fs-garanti { box-shadow: var(--hoyde-2); }
.fs-lofter { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); }
.fs-lofte { display: flex; flex-direction: column; gap: var(--rom-2); padding: var(--rom-5); background: var(--flate); border-radius: var(--radius-l); }
.fs-lofte__ikon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: var(--radius-m); background: var(--blaa-tint); color: var(--blaa); margin-bottom: var(--rom-2); }
.fs-lofte__ikon .zk-ikon { width: 22px; height: 22px; }
.fs-lofte__tall { font: 650 13px/16px var(--font-tekst); letter-spacing: .09em; text-transform: uppercase; color: var(--blaa-tekst); }
@media (max-width: 860px) { .fs-lofter { grid-template-columns: 1fr; } }

/* Core: kortene, mer å se på */
.pk-problem { position: relative; gap: var(--rom-3); padding: var(--rom-5); transition: box-shadow var(--varighet-respons) linear; }
.pk-problem:hover { box-shadow: var(--hoyde-2); }
.pk-problem__ikon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: var(--radius-m); background: var(--feil-tint); color: var(--feil); }
.pk-problem__ikon .zk-ikon { width: 22px; height: 22px; }
.pk-problem__merke { align-self: flex-start; margin-top: auto; }
.pk-problem__merke .zk-ikon { width: 14px; height: 14px; }
.fs-problem { align-items: stretch; }
.zk-tjeneste { transition: box-shadow var(--varighet-respons) linear; }
.zk-tjeneste:hover { box-shadow: var(--hoyde-2); }
.fs-senket .zk-tjeneste:hover { box-shadow: var(--hoyde-2); }
.tj-ai { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--rom-2); }
.tj-ai li { height: 36px; padding: 0 var(--rom-3); display: grid; place-items: center; background: var(--kort); border-radius: var(--radius-full); box-shadow: var(--hoyde-1); }
.tj-ai img { height: 16px; width: auto; display: block; }
.fs-steg { position: relative; counter-reset: none; }
.fs-steg li { position: relative; gap: var(--rom-3); padding: var(--rom-5); }
.fs-steg__topp { display: flex; align-items: center; justify-content: space-between; }
.fs-steg__ikon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: var(--radius-m); background: var(--blaa-tint); color: var(--blaa); }
.fs-steg__ikon .zk-ikon { width: 22px; height: 22px; }
.fs-steg li:not(:last-child)::after { content: ""; position: absolute; top: 44px; right: calc(-1 * var(--gutter)); width: var(--gutter); height: 2px; background: var(--strek); }
@media (max-width: 760px) { .fs-steg li:not(:last-child)::after { display: none; } }

/* Logoen i menyen tegnes inn når siden åpnes (én gang per besøk) */
@keyframes zf-logo-inn { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
.nav .zf-logo-inn { animation: zf-logo-inn 900ms var(--kurve-ro) 150ms both; }
@media (prefers-reduced-motion: reduce) { .nav .zf-logo-inn { animation: none; } }
.f-trust__bilder img { height: 68px; }

/* Problemlister: teller, rader inn fra venstre, svaret lander til slutt */
.stack-topp { display: flex; justify-content: space-between; align-items: baseline; gap: var(--rom-3); flex-wrap: wrap; margin-bottom: var(--rom-2); }
.stack-tall { font: 600 14px/20px var(--font-tekst); color: var(--blekk-dempet); }
.stack-tall b { font: 650 28px/1 var(--font-display); color: var(--feil); margin-right: 4px; font-variant-numeric: proportional-nums; }
.zf-for .stack .nt[data-in] { transform: translateX(-12px); }
.stack .nt.lost .ic { transition: background-color var(--varighet-kort) linear; }
.stack-svar { align-self: flex-start; margin-top: var(--rom-2); }
.stack-svar .zk-ikon { width: 18px; height: 18px; }

/* Web: grunnmuren som lag på lag */
.pack { background: var(--kort); border: 0; border-radius: var(--radius-l); box-shadow: var(--hoyde-1); padding: var(--rom-7); gap: var(--rom-7); }
.warm .pack { background: var(--flate); }
.grunnmur { display: flex; flex-direction: column; gap: var(--rom-2); padding: var(--rom-5); background: var(--senket); border-radius: var(--radius-l); }
.gm-tittel { margin: var(--rom-3) 0 var(--rom-1); font: 650 13px/16px var(--font-tekst); letter-spacing: .09em; text-transform: uppercase; color: var(--blekk-dempet); }
.gm-lag { display: flex; align-items: center; gap: var(--rom-3); padding: var(--rom-3) var(--rom-4); background: var(--kort); border-radius: var(--radius-m); box-shadow: var(--hoyde-1); }
.gm-lag > span:nth-child(2) { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.gm-lag b { font: 600 15px/20px var(--font-tekst); } .gm-lag small { font-size: 13px; line-height: 18px; color: var(--blekk-dempet); }
.gm-ikon { width: 36px; height: 36px; flex: none; display: grid; place-items: center; border-radius: var(--radius-m); background: var(--blaa-tint); color: var(--blaa); }
.gm-ikon .zk-ikon { width: 20px; height: 20px; }
.gm-sjekk { color: var(--ok); display: inline-flex; } .gm-sjekk .zk-ikon { width: 20px; height: 20px; }
.gm-lag:nth-of-type(3) { margin-inline: 4px; } .gm-lag:nth-of-type(4) { margin-inline: 8px; }
.gm-topp { background: var(--kort); border: 1.5px dashed var(--kant); box-shadow: none; }
.gm-topp .gm-ikon { background: var(--senket); color: var(--blekk-dempet); }
.zf-for .grunnmur .gm-lag[data-in] { transform: translateY(-12px); }

/* Web: kundelogoer som rolig karusell (pauser ved hover, står stille ved redusert bevegelse) */
.marquee { overflow: hidden; padding-block: var(--rom-4); -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.logo-track { display: flex; flex-wrap: nowrap; width: max-content; gap: 0; animation: zf-karusell 50s linear infinite; }
.marquee:hover .logo-track, .marquee:focus-within .logo-track { animation-play-state: paused; }
.logo-track li, .logo-track li[aria-hidden="true"] { display: flex; align-items: center; justify-content: center; flex: none; height: 64px; padding: 0 var(--rom-6); margin: 0; background: none; border: 0; box-shadow: none; border-radius: 0; }
.logo-track img { height: 40px; width: auto; max-width: 160px; object-fit: contain; filter: grayscale(1); opacity: .65; transition: filter var(--varighet-kort) linear, opacity var(--varighet-kort) linear; }
.logo-track li:hover img { filter: none; opacity: 1; }
@keyframes zf-karusell { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .logo-track { animation: none; flex-wrap: wrap; width: auto; justify-content: center; } .logo-track li[aria-hidden="true"] { display: none; } }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .logo-track img { filter: grayscale(1) invert(1); } }

/* SEO, AEO og GEO: tre kort i samme merke */
.search3 { gap: var(--gutter); }
.s-card { display: flex; flex-direction: column; gap: var(--rom-4); padding: var(--rom-5); border-radius: var(--radius-l); transition: box-shadow var(--varighet-respons) linear; }
.s-card:hover { box-shadow: var(--hoyde-2); }
.s-name { display: flex; align-items: center; gap: var(--rom-3); margin: 0; }
.s-tag { width: 48px; height: 48px; flex: none; display: grid; place-items: center; padding: 0; border-radius: var(--radius-m); background: var(--blaa); color: var(--on-blaa); font: 650 14px/1 var(--font-display); letter-spacing: .02em; }
.s-full { display: flex; flex-direction: column; font: 600 15px/20px var(--font-tekst); color: var(--blekk); }
.s-full small { font: 400 13px/18px var(--font-tekst); color: var(--blekk-dempet); }
.s-card h3 { margin: var(--rom-1) 0 0; font: 600 20px/26px var(--font-display); letter-spacing: -.005em; }
.s-card p { margin: 0; font-size: 15px; line-height: 24px; color: var(--blekk-dempet); }
.s-vis { height: 200px; padding: var(--rom-4); display: flex; flex-direction: column; gap: var(--rom-2); overflow: hidden; }
.s-vis .g-bar { background: var(--kort); border: 0; box-shadow: var(--hoyde-1); border-radius: var(--radius-full); padding: 8px 14px; font-size: 13px; gap: 8px; }
.g-g { width: 16px; height: 16px; flex: none; display: block; }
.s-vis .g-r { background: var(--kort); border: 0; box-shadow: var(--hoyde-1); }
.s-vis .g-r i { color: var(--blekk); font-weight: 600; }
.s-vis .g-r.me { box-shadow: var(--hoyde-2); }
.s-vis .g-r.me i, .s-vis .g-r.me b { color: var(--blaa-tekst); }
.vis-aeo.s-vis { background: var(--blaa-tint); }
.s-vis .ai-lbl { font: 650 12px/16px var(--font-tekst); letter-spacing: 0; text-transform: none; color: var(--blekk); gap: 8px; }
.s-vis .ln { background: var(--kort); height: 10px; }
.s-vis .src { background: var(--kort); border: 0; box-shadow: var(--hoyde-1); font: 600 11px/14px var(--font-tekst); padding: 5px 10px; }
.s-vis .ai-cell { background: var(--kort); border: 0; box-shadow: var(--hoyde-1); border-radius: var(--radius-m); height: 34px; }
.s-vis .q { background: var(--kort); border: 0; box-shadow: var(--hoyde-1); }
.s-vis .a { font-weight: 500; }
.ahead { padding: var(--rom-5) var(--rom-6); display: flex; gap: var(--rom-3); align-items: baseline; flex-wrap: wrap; }
.pack .gm-tittel { font: 650 13px/16px var(--font-tekst); letter-spacing: .09em; text-transform: uppercase; color: var(--blekk-dempet); margin: var(--rom-3) 0 var(--rom-1); max-width: none; }

/* Kassa: bestillingen øverst i skjemaet */
.st-topp { order: 0; }
.kasse { display: flex; flex-direction: column; gap: var(--rom-3); padding: var(--rom-4); background: var(--senket); border-radius: var(--radius-l); }
.kasse-topp { display: flex; align-items: center; gap: var(--rom-2); }
.kasse-tittel { font: 650 13px/16px var(--font-tekst); letter-spacing: .09em; text-transform: uppercase; color: var(--blekk-dempet); }
.kasse-endre { margin-left: auto; font: 600 14px/20px var(--font-tekst); color: var(--blaa-tekst); text-decoration: underline; text-underline-offset: 3px; }
.kasse-linjer { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--rom-2); }
.kasse-linjer li { display: flex; align-items: center; gap: var(--rom-2); padding: 6px 12px 6px 6px; background: var(--kort); border-radius: var(--radius-m); box-shadow: var(--hoyde-1); }
.kasse-linjer img { width: 40px; height: 40px; object-fit: contain; }
.kasse-linjer span { display: flex; flex-direction: column; } .kasse-linjer b { font: 600 14px/18px var(--font-tekst); } .kasse-linjer small { font-size: 12px; line-height: 16px; color: var(--blekk-dempet); }
.kasse-sum { margin: 0; display: grid; gap: 4px; padding-top: var(--rom-3); border-top: 1px solid var(--strek); }
.kasse-sum div { display: flex; justify-content: space-between; gap: var(--rom-3); font-size: 14px; line-height: 22px; }
.kasse-sum dt { color: var(--blekk-dempet); } .kasse-sum dd { margin: 0; text-align: right; color: var(--blekk); }
.kasse-sum dd b { font: 650 18px/22px var(--font-display); } .kasse-sum small { color: var(--blekk-dempet); font-size: 12px; }

/* «Legg til»-kortene */
.pk-legg { display: flex; flex-direction: column; border-radius: var(--radius-l); transition: box-shadow var(--varighet-respons) linear, background-color var(--varighet-kort) linear; }
.pk-legg .pk-img { display: grid; }
.pk-handling { display: flex; align-items: center; justify-content: space-between; gap: var(--rom-3); flex-wrap: wrap; margin-top: var(--rom-2); }
.pk-legg-btn { flex: 1; min-width: 200px; }
.pk-legg-btn small { font-weight: 500; color: var(--blekk-dempet); margin-left: 4px; }
.pk-legg-pa { display: none; align-items: center; gap: var(--rom-2); }
.pk-legg-btn[aria-pressed="true"] { background: var(--ok-tint); border-color: var(--ok); color: var(--ok); }
.pk-legg-btn[aria-pressed="true"] .pk-legg-av { display: none; }
.pk-legg-btn[aria-pressed="true"] .pk-legg-pa { display: inline-flex; }
.pk-legg-btn .zk-ikon { width: 18px; height: 18px; }
.pk-legg.lagt-til { box-shadow: var(--hoyde-2); }
.pk-les { height: auto; padding: 0; }

/* GEO-bildet v2: et AI-svar som anbefaler deg */
.geo2 { gap: var(--rom-3); background: var(--senket); }
.geo-topp { display: flex; justify-content: space-between; align-items: center; }
.geo-app { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; background: var(--kort); border-radius: var(--radius-full); box-shadow: var(--hoyde-1); }
.geo-app img { height: 15px; width: auto; }
.geo-flere { display: inline-flex; gap: 6px; }
.geo-flere img { height: 14px; width: auto; padding: 7px 9px; box-sizing: content-box; background: var(--kort); border-radius: var(--radius-full); box-shadow: var(--hoyde-1); }
.geo-q { align-self: flex-end; max-width: 88%; padding: 8px 12px; background: var(--kort); border-radius: var(--radius-l) var(--radius-l) var(--radius-s) var(--radius-l); box-shadow: var(--hoyde-1); font: 500 12.5px/18px var(--font-tekst); color: var(--blekk); }
.geo-svar { display: flex; flex-direction: column; gap: 2px; padding: 10px 14px; background: var(--blaa); color: var(--on-blaa); box-shadow: var(--hoyde-2); align-self: flex-start; min-width: 70%; }
.geo-lbl { font: 650 10px/14px var(--font-tekst); letter-spacing: .09em; text-transform: uppercase; opacity: .85; }
.geo-svar b { font: 650 16px/20px var(--font-display); }
.geo-stj { font-size: 12px; line-height: 16px; opacity: .9; }

/* Web: tre søyler med små bevis */
.soyler { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); }
.soyle { display: flex; flex-direction: column; gap: var(--rom-3); padding: var(--rom-5); background: var(--kort); border-radius: var(--radius-l); box-shadow: var(--hoyde-1); transition: box-shadow var(--varighet-respons) linear; }
.soyle:hover { box-shadow: var(--hoyde-2); }
.soyle-ikon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: var(--radius-m); background: var(--blaa-tint); color: var(--blaa); }
.soyle-ikon .zk-ikon { width: 24px; height: 24px; }
.soyle h3 { font: 600 22px/28px var(--font-display); letter-spacing: -.01em; }
.soyle p { color: var(--blekk-dempet); font-size: 15px; line-height: 24px; }
.soyle-bevis { margin-top: auto; display: flex; align-items: center; gap: var(--rom-3); flex-wrap: wrap; min-height: 64px; padding: var(--rom-3) var(--rom-4); background: var(--senket); border-radius: var(--radius-m); }
.soyle-bevis .zk-utfallsmerke { font-size: 14px; padding: 8px 12px; }
.soyle-bevis .zk-ikon { width: 16px; height: 16px; }
.soyle-tid { font-size: 13px; color: var(--blekk-dempet); }
.soyle-logoer img { height: 18px; width: auto; }
.soyle-eks { margin-top: var(--rom-3); text-align: right; }
@media (max-width: 900px) { .soyler { grid-template-columns: 1fr; } }

/* Web: vanlig nettside mot Zervo Web */
.vs { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--gutter); align-items: stretch; }
.vs-kol { padding: var(--rom-6); border-radius: var(--radius-l); }
.vs-vanlig { background: var(--senket); }
.vs-zervo { background: var(--kort); box-shadow: var(--hoyde-2); }
.vs-tittel { margin: 0 0 var(--rom-4); font: 600 20px/26px var(--font-display); color: var(--blekk-dempet); min-height: 30px; display: flex; align-items: center; }
.vs-tittel img { height: 26px; width: auto; }
.vs ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--rom-3); }
.vs li { display: flex; align-items: center; gap: var(--rom-3); font: 500 16px/24px var(--font-tekst); }
.vs-vanlig li { color: var(--blekk-dempet); }
.vs-vanlig li .zk-ikon { color: var(--feil); }
.vs-zervo li { color: var(--blekk); font-weight: 600; }
.vs-zervo li .zk-ikon { color: var(--ok); }
.vs li > span { display: inline-flex; flex: none; } .vs .zk-ikon { width: 20px; height: 20px; }
@media (max-width: 760px) { .vs { grid-template-columns: 1fr; } }

/* Web: fire steg */
.steg4 { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gutter); }
.steg4 li { position: relative; display: flex; flex-direction: column; gap: var(--rom-3); padding: var(--rom-5); background: var(--flate); border-radius: var(--radius-l); }
.steg4-topp { display: flex; justify-content: space-between; align-items: center; }
.steg4-nr { font: 650 40px/44px var(--font-display); letter-spacing: -.02em; color: var(--blekk); }
.steg4-ikon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: var(--radius-m); background: var(--blaa-tint); color: var(--blaa); }
.steg4-ikon .zk-ikon { width: 22px; height: 22px; }
.steg4 h3 { font: 600 20px/26px var(--font-display); }
.steg4 p { color: var(--blekk-dempet); font-size: 15px; line-height: 24px; }
.steg4 li:not(:last-child)::after { content: ""; position: absolute; top: 46px; right: calc(-1 * var(--gutter)); width: var(--gutter); height: 2px; background: var(--strek); }
.steg4-siste { background: var(--ok-tint) !important; }
@media (max-width: 1000px) { .steg4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .steg4 li::after { display: none; } }
@media (max-width: 560px) { .steg4 { grid-template-columns: 1fr; } }

/* Trust: produktkortene (Stand, Plate, Cards) */
.pk-grid { gap: var(--gutter); }
a.pk { background: var(--kort); border: 0; border-radius: var(--radius-l); box-shadow: var(--hoyde-1); transform: none; transition: box-shadow var(--varighet-respons) linear; }
a.pk:hover { transform: none; box-shadow: var(--hoyde-2); border: 0; }
.pk .pk-img { aspect-ratio: 5 / 4; background: var(--senket); margin: var(--rom-3) var(--rom-3) 0; border-radius: var(--radius-m); }
.pk .pk-img::after { display: none; }
.pk .pk-img img { top: 8%; left: 10%; width: 80%; height: 84%; filter: drop-shadow(0 14px 18px rgba(20, 27, 45, .16)); transition: transform var(--varighet-standard) var(--kurve-ro); }
a.pk:hover .pk-img img { transform: translateY(-4px); }
.pk .pk-body { gap: var(--rom-3); padding: var(--rom-5); }
.pk .pk-top { align-items: center; }
.pk .pk-top b { font: 650 28px/32px var(--font-display); letter-spacing: -.015em; display: inline-flex; align-items: center; gap: var(--rom-2); }
.pk .pk-pris { height: 28px; display: inline-flex; align-items: center; padding: 0 10px; border-radius: var(--radius-s); background: var(--blaa-tint); color: var(--blekk); font: 600 13px/16px var(--font-tekst); }
.pk .pk-txt { font-size: 15px; line-height: 24px; color: var(--blekk-dempet); }
.pk .pk-steder span { padding: 5px 12px; border: 0; background: var(--senket); color: var(--blekk); font: 600 12px/16px var(--font-tekst); }
.pk .pk-btn { margin-top: auto; height: 48px; display: flex; align-items: center; justify-content: center; gap: var(--rom-2); padding: 0; border: 1.5px solid var(--kant); border-radius: var(--radius-m); box-shadow: none; background: var(--kort); color: var(--blekk); font: 600 15px/20px var(--font-tekst); text-transform: none; letter-spacing: 0; transition: border-color var(--varighet-respons) linear, background-color var(--varighet-respons) linear; }
a.pk:hover .pk-btn { background: var(--kort); color: var(--blekk); border-color: var(--blekk); }
.pk .pk-btn .zk-ikon { width: 18px; height: 18px; transition: transform var(--varighet-kort) var(--kurve-ro); }
a.pk:hover .pk-btn .zk-ikon { transform: translateX(3px); }
.pk .pk-badge { margin: 0; height: 24px; display: inline-flex; align-items: center; padding: 0 8px; border-radius: var(--radius-s); background: var(--rav-tint); color: var(--rav-tekst); font: 600 12px/16px var(--font-tekst); }

/* ==========================================================================
   Trust-demo v11: varsel fra toppen → Zervo-siden → Google-anmeldelse skrives → publisert.
   Velg produkt ved å holde over (eller trykke på) Stand, Plate eller Cards. Scene 600 × 520, skaleres med --s.
   ========================================================================== */
.tk-ramme-ut { display: none; }
.tt-ut { position: relative; width: 100%; max-width: 600px; justify-self: end; }
.tt-ut::before { content: ""; display: block; aspect-ratio: 600 / 520; }
.tt { position: absolute; left: 0; top: 0; width: 600px; height: 520px; transform: scale(var(--s, 1)); transform-origin: 0 0; }
.tt-hint { margin: var(--rom-2) 0 0; text-align: center; font: 500 13px/18px var(--font-tekst); color: var(--blekk-dempet); }
@media (hover: none) { .tt-hint { font-size: 0; } .tt-hint::after { content: "Trykk på Stand, Plate eller Cards for å se den i bruk."; font-size: 13px; } }

/* Produktene */
.tt-fam { position: absolute; inset: 0 220px 0 0; }
.tt-p { position: absolute; margin: 0; padding: 0; border: 0; background: none; cursor: pointer; transition: transform var(--varighet-kort) var(--kurve-ro), opacity var(--varighet-kort) linear, filter var(--varighet-kort) linear; }
.tt-p img { display: block; width: 100%; height: auto; filter: drop-shadow(0 18px 22px rgba(20, 27, 45, .16)); }
.tt-plate { left: 0; top: 24px; width: 196px; z-index: 1; }
.tt-stand { left: 168px; top: 110px; width: 222px; z-index: 2; }
.tt-cards { left: 0; top: 296px; width: 232px; z-index: 3; }
.tt-navn { position: absolute; left: 50%; bottom: -16px; transform: translateX(-50%); height: 30px; padding: 0 var(--rom-3); display: inline-flex; align-items: center; border-radius: var(--radius-full); background: var(--kort); color: var(--blekk); box-shadow: var(--hoyde-1); font: 600 13px/16px var(--font-tekst); white-space: nowrap; transition: background-color var(--varighet-kort) linear, color var(--varighet-kort) linear; }
.tt[data-prod] .tt-p { opacity: .55; filter: saturate(.7); }
.tt[data-prod="stand"] .tt-stand, .tt[data-prod="plate"] .tt-plate, .tt[data-prod="cards"] .tt-cards { opacity: 1; filter: none; transform: translateY(-4px); z-index: 4; }
.tt[data-prod="stand"] .tt-stand .tt-navn, .tt[data-prod="plate"] .tt-plate .tt-navn, .tt[data-prod="cards"] .tt-cards .tt-navn { background: var(--rav); color: var(--blekk); }
.tt-p:focus-visible { outline: 2px solid var(--fokus); outline-offset: 6px; border-radius: var(--radius-m); }
.tt-ring { position: absolute; width: 60px; height: 60px; margin: -30px 0 0 -30px; border-radius: 50%; border: 2px solid var(--blaa); opacity: 0; pointer-events: none; }
.tt-stand .tt-ring { left: 22%; top: 66%; } .tt-plate .tt-ring { left: 17%; top: 76%; } .tt-cards .tt-ring { left: 50%; top: 76%; }
.tt[data-steg="2"] .tt-p .tt-ring { animation: zk-ring var(--varighet-standard) var(--kurve-ro) both; }

/* Telefonen */
.tt-tlf { position: absolute; left: 386px; top: 26px; width: 212px; aspect-ratio: 409 / 842; z-index: 6; filter: drop-shadow(0 28px 32px rgba(20, 27, 45, .26)); transform-origin: 30% 80%; transition: transform var(--varighet-valgt) var(--kurve-ro); }
.tt[data-steg="1"][data-prod="stand"] .tt-tlf, .tt[data-steg="2"][data-prod="stand"] .tt-tlf { transform: translate(-190px, 128px) rotate(-14deg) scale(.92); }
.tt[data-steg="1"][data-prod="plate"] .tt-tlf, .tt[data-steg="2"][data-prod="plate"] .tt-tlf { transform: translate(-372px, 40px) rotate(-14deg) scale(.92); }
.tt[data-steg="1"][data-prod="cards"] .tt-tlf, .tt[data-steg="2"][data-prod="cards"] .tt-tlf { transform: translate(-300px, 200px) rotate(-12deg) scale(.86); }
.tt-ramme { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 5; pointer-events: none; }
.tt-skjerm { position: absolute; left: 3.2%; right: 2.9%; top: 1.1%; bottom: 1.2%; border-radius: 13% / 6.2%; overflow: hidden; background: #fff; color: #1f1f1f; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Roboto, Arial, sans-serif; -webkit-font-smoothing: antialiased; }
.tt-sb { position: absolute; left: 0; right: 0; top: 1.2%; height: 34px; z-index: 8; display: flex; justify-content: space-between; align-items: center; padding: 0 7% 0 9%; font: 600 11.5px/1 -apple-system, "SF Pro Text", "Helvetica Neue", Arial, sans-serif; color: #1d1d1f; pointer-events: none; }
.tt-tid { min-width: 34px; text-align: center; }
.tt-ikoner { display: inline-flex; align-items: center; gap: 4px; }
.tt-ikoner svg { display: block; height: 9px; width: auto; fill: currentColor; } .tt-ikoner svg:last-child { height: 10px; }
.tt-v { position: absolute; inset: 0; display: flex; flex-direction: column; padding: 46px 14px 18px; opacity: 0; transform: translateY(10px); transition: opacity var(--varighet-kort) var(--kurve-ro), transform var(--varighet-standard) var(--kurve-ro); }
/* Trykk-markør */
.tt-trykk { position: absolute; right: 18%; top: 50%; width: 26px; height: 26px; margin-top: -13px; border-radius: 50%; background: rgba(20, 27, 45, .22); opacity: 0; transform: scale(.6); pointer-events: none; }

/* 1 Hjemskjerm og varsel */
.tt-hjem { align-items: center; background: #e7ecf6; padding-top: 70px; gap: 2px; }
.tt-dato { font-size: 11px; font-weight: 600; color: #3c4b6b; }
.tt-klokke { font: 600 48px/1 -apple-system, "SF Pro Display", "Helvetica Neue", Arial, sans-serif; letter-spacing: -.02em; color: #1d2b4f; }
.tt-varsel { position: absolute; left: 8px; right: 8px; top: 40px; z-index: 7; display: flex; align-items: center; gap: 9px; padding: 10px 11px; border-radius: 18px; background: rgba(255, 255, 255, .96); box-shadow: 0 10px 26px rgba(20, 27, 45, .18); opacity: 0; transform: translateY(-120%); transition: transform var(--varighet-standard) var(--kurve-ro), opacity var(--varighet-kort) linear; }
.tt-app { width: 32px; height: 32px; flex: none; border-radius: 9px; background: #1877F2; display: grid; place-items: center; }
.tt-app img { width: 16px; height: 16px; }
.tt-varsel-t { display: flex; flex-direction: column; gap: 1px; min-width: 0; font-size: 11px; line-height: 14px; color: #1d1d1f; }
.tt-varsel-topp { display: flex; justify-content: space-between; gap: 6px; }
.tt-varsel-topp b { font-size: 11.5px; } .tt-varsel-topp em { font-style: normal; color: #8e8e93; font-size: 10px; }

/* 2 Zervo-siden */
.tt-side { align-items: stretch; background: #f7f4f1; gap: 8px; }
.tt-url { align-self: center; display: inline-flex; align-items: center; gap: 4px; height: 20px; padding: 0 10px; border-radius: 999px; background: #e9e4de; color: #555b69; font-size: 9.5px; }
.tt-url svg { width: 7px; height: 8px; }
.tt-bedrift { margin-top: 8px; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.tt-logo { width: 54px; height: 54px; border-radius: 16px; display: grid; place-items: center; background: #141B2D; color: #fff; font: 700 18px/1 var(--font-display); letter-spacing: -.02em; box-shadow: 0 6px 14px rgba(20, 27, 45, .18); }
.tt-bedrift b { font: 650 16px/20px var(--font-display); color: #141B2D; }
.tt-sp { text-align: center; font-size: 11px; color: #555b69; margin-top: -2px; }
.tt-sp2 { text-align: center; font: 600 13px/18px var(--font-display); color: #141B2D; margin: 8px 0 2px; }
.tt-valg { position: relative; display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px; border-radius: 12px; font: 600 11.5px/1 var(--font-tekst); white-space: nowrap; overflow: hidden; transition: background-color var(--varighet-respons) linear, box-shadow var(--varighet-respons) linear; }
.tt-google { background: #fff; color: #141B2D; box-shadow: 0 1px 2px rgba(20, 27, 45, .1), 0 0 0 1px rgba(20, 27, 45, .08); }
.tt-google img { width: 20px; height: 20px; flex: none; }
.tt-privat { background: transparent; color: #555b69; box-shadow: 0 0 0 1px #d8d2cb; }
.tt-privat-ikon { width: 20px; height: 20px; flex: none; border-radius: 6px; background: #e9e4de; position: relative; }
.tt-privat-ikon::after { content: ""; position: absolute; left: 5px; right: 5px; top: 7px; height: 6px; border: 1.5px solid #555b69; border-top: 0; border-radius: 0 0 3px 3px; }
.tt-powered { margin-top: auto; align-self: center; display: inline-flex; align-items: center; gap: 5px; font-size: 9.5px; color: #8c837c; }
.tt-powered img { height: 10px; width: auto; }

/* 3 Google: skriv */
.tt-skriv { background: #fff; gap: 12px; padding-top: 44px; }
.tt-gtopp { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-bottom: 10px; border-bottom: 1px solid #e8eaed; font-size: 12px; }
.tt-gtopp b { font-size: 12.5px; }
.tt-x { font-size: 18px; line-height: 1; color: #5f6368; width: 22px; }
.tt-post { position: relative; overflow: hidden; height: 26px; padding: 0 12px; display: inline-flex; align-items: center; border-radius: 13px; background: #e8eaed; color: #80868b; font-size: 11px; font-weight: 600; transition: background-color var(--varighet-kort) linear, color var(--varighet-kort) linear; }
.tt-bruker { display: flex; align-items: center; gap: 9px; }
.tt-bruker > span:last-child { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.tt-bruker b { font-size: 12px; } .tt-bruker small { display: inline-flex; align-items: center; gap: 4px; font-size: 10px; color: #5f6368; }
.tt-bruker small img { width: 10px; height: 10px; }
.tt-uav { width: 30px; height: 30px; flex: none; border-radius: 50%; display: grid; place-items: center; background: #7e57c2; color: #fff; font-size: 12px; font-weight: 600; }
.tt-uav.b { background: #0b8043; }
.tt-stj { display: flex; justify-content: center; gap: 8px; font-size: 27px; line-height: 1; padding: 4px 0; }
.tt-stj i { font-style: normal; color: #dadce0; transition: color var(--varighet-respons) linear, transform var(--varighet-kort) var(--kurve-ro); }
.tt-felt { min-height: 88px; padding: 10px 12px; border: 1.5px solid #dadce0; border-radius: 8px; font-size: 12px; line-height: 17px; color: #202124; transition: border-color var(--varighet-respons) linear; }
.tt-caret { display: inline-block; width: 1.5px; height: 14px; margin-left: 1px; vertical-align: -2px; background: #1a73e8; opacity: 0; }
.tt-tips { font-size: 10px; color: #5f6368; text-align: center; }

/* 4 Publisert */
.tt-profil { background: #fff; gap: 7px; padding-top: 44px; }
.tt-glogo { height: 20px; width: auto; align-self: center; margin-bottom: 2px; }
.tt-biz { font-size: 15px; }
.tt-snitt { font-size: 11px; color: #5f6368; display: flex; align-items: center; gap: 4px; }
.tt-snitt b { color: #202124; } .tt-snitt i { font-style: normal; color: #fbbc04; letter-spacing: 1px; }
.tt-faner { display: flex; gap: 14px; font-size: 11px; color: #5f6368; border-bottom: 1px solid #e8eaed; }
.tt-faner span { padding: 6px 0; } .tt-faner .on { color: #1a73e8; box-shadow: inset 0 -2px 0 #1a73e8; font-weight: 600; }
.tt-rev { display: flex; flex-direction: column; gap: 5px; padding: 10px 11px; border-radius: 12px; background: #fff; }
.tt-ny { background: #e8f0fe; box-shadow: 0 6px 16px -8px rgba(26, 115, 232, .45); }
.tt-gml { opacity: .7; }
.tt-rs { font-style: normal; color: #fbbc04; font-size: 13px; letter-spacing: 1.5px; } .tt-rt { font-size: 11.5px; line-height: 15px; color: #202124; }
.tt-toast { position: absolute; left: 12px; right: 12px; bottom: 22px; display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 10px; background: #202124; color: #fff; font-size: 11.5px; font-weight: 500; opacity: 0; transform: translateY(10px); transition: opacity var(--varighet-kort) linear, transform var(--varighet-standard) var(--kurve-ro); }
.tt-toast svg { width: 16px; height: 16px; color: #81c995; flex: none; }

/* ---- Tidslinjen (data-steg) ----
   0 hjemskjerm · 1 holdes mot produktet · 2 varsel kommer · 3 trykk på varsel · 4 Zervo-siden · 5 trykk Google
   6 Google: stjerner og tekst · 7 trykk Publiser · 8 publisert (sluttbilde, også uten attributt) */
.tt:not([data-steg]) .tt-profil, .tt[data-steg="8"] .tt-profil,
.tt:is([data-steg="0"], [data-steg="1"], [data-steg="2"], [data-steg="3"]) .tt-hjem,
.tt:is([data-steg="4"], [data-steg="5"]) .tt-side,
.tt:is([data-steg="6"], [data-steg="7"]) .tt-skriv { opacity: 1; transform: none; }
.tt:is([data-steg="2"], [data-steg="3"]) .tt-varsel { opacity: 1; transform: none; }
.tt[data-steg="3"] .tt-varsel .tt-trykk, .tt[data-steg="5"] .tt-google .tt-trykk, .tt[data-steg="7"] .tt-post .tt-trykk { animation: tt-trykk 420ms var(--kurve-ro) both; }
@keyframes tt-trykk { 0% { opacity: 0; transform: scale(.5); } 35% { opacity: 1; transform: scale(1); } 100% { opacity: 0; transform: scale(1.4); } }
.tt[data-steg="3"] .tt-varsel { background: #f2f2f7; }
.tt[data-steg="5"] .tt-google { background: #e8f0fe; box-shadow: 0 0 0 1.5px #1a73e8; }
.tt[data-steg="6"] .tt-stj i.pa, .tt[data-steg="7"] .tt-stj i, .tt:not([data-steg]) .tt-stj i { color: #fbbc04; }
.tt[data-steg="6"] .tt-stj i.pa { transform: scale(1.12); }
.tt[data-steg="6"] .tt-felt { border-color: #1a73e8; }
.tt[data-steg="6"] .tt-caret { opacity: 1; }
.tt:is([data-steg="6"], [data-steg="7"]) .tt-post.klar { background: #1a73e8; color: #fff; }
.tt:not([data-steg]) .tt-toast, .tt[data-steg="8"] .tt-toast { opacity: 1; transform: none; }
.tt[data-steg="8"] .tt-ny { animation: zk-valgt var(--varighet-valgt) var(--kurve-ro) both; }
.tt:not([data-steg]) .tt-ny, .tt[data-steg="8"] .tt-ny { border-radius: var(--radius-z); }
@media (max-width: 900px) { .tt-ut { justify-self: center; } }
.tt-gtopp b { flex: 1; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tt-gtopp .tt-post { flex: none; }
.tt-valg span { overflow: hidden; text-overflow: ellipsis; }
.tt-valg { justify-content: flex-start; }

/* Trust «Hvorfor»: uten (rødt) mot med (Trust-gult) */
.mu { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: var(--rom-4); align-items: stretch; }
.mu-kol { display: flex; flex-direction: column; gap: var(--rom-4); padding: var(--rom-6); border-radius: var(--radius-l); }
.mu-uten { background: var(--feil-tint); }
.mu-med { background: var(--rav-tint); box-shadow: var(--hoyde-2); }
.mu-tittel { margin: 0; display: flex; align-items: center; justify-content: space-between; gap: var(--rom-3); }
.mu-tittel img { height: 22px; width: auto; }
.mu-merke { display: inline-flex; align-items: center; gap: var(--rom-2); height: 32px; padding: 0 var(--rom-3); border-radius: var(--radius-s); font: 650 14px/18px var(--font-tekst); }
.mu-uten .mu-merke { background: var(--kort); color: var(--feil); }
.mu-med .mu-merke { background: var(--kort); color: var(--rav-tekst); }
.mu-merke .zk-ikon { width: 18px; height: 18px; }
.mu-reise { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--rom-2); }
.mu-reise li { display: flex; align-items: center; gap: var(--rom-3); padding: var(--rom-3) var(--rom-4); background: var(--kort); border-radius: var(--radius-m); box-shadow: var(--hoyde-1); }
.mu-reise li > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.mu-reise b { font: 600 15px/20px var(--font-tekst); color: var(--blekk); } .mu-reise small { font-size: 13px; line-height: 18px; color: var(--blekk-dempet); }
.mu-nr { width: 28px; height: 28px; flex: none; display: grid; place-items: center; border-radius: 50%; font: 650 13px/1 var(--font-tekst); }
.mu-uten .mu-nr { background: var(--feil-tint); color: var(--feil); }
.mu-med .mu-nr { background: var(--rav-tint); color: var(--rav-tekst); }
.mu-uten .mu-reise li:last-child { box-shadow: inset 0 0 0 1.5px var(--feil); }
.mu-res { margin-top: auto; display: flex; align-items: center; gap: var(--rom-4); padding: var(--rom-4) var(--rom-5); background: var(--kort); border-radius: var(--radius-l); }
.mu-tall { display: flex; flex-direction: column; line-height: 1; }
.mu-tall b { font: 650 48px/1 var(--font-display); letter-spacing: -.03em; font-variant-numeric: proportional-nums; }
.mu-tall small { font: 600 13px/18px var(--font-tekst); color: var(--blekk-dempet); margin-top: 4px; }
.mu-uten .mu-tall b { color: var(--feil); }
.mu-med .mu-tall b { color: var(--rav-tekst); }
.mu-tekst { font: 600 16px/22px var(--font-display); color: var(--blekk); }
.mu-med .mu-res { box-shadow: var(--hoyde-2); }
.mu-pil { align-self: center; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: var(--kort); color: var(--blekk); box-shadow: var(--hoyde-1); }
.mu-pil .zk-ikon { width: 22px; height: 22px; }
.mu-cta { margin-top: var(--rom-6); display: flex; align-items: center; gap: var(--rom-4); flex-wrap: wrap; }
.mu-cta .btn { height: 56px; padding: 0 var(--rom-6); font-size: 16px; }
.mu-eks { margin-left: auto; }
.zf-for .mu-uten [data-in] { transform: translateX(-12px); }
.zf-for .mu-med [data-in] { transform: translateX(12px); }
@media (max-width: 900px) { .mu { grid-template-columns: 1fr; } .mu-pil { transform: rotate(90deg); justify-self: center; } }

/* Trust pakker: best sammen */
.sammen { list-style: none; margin: 0 0 var(--rom-7); padding: 0; display: flex; align-items: stretch; gap: var(--rom-3); }
.sammen li { flex: 1; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; padding: var(--rom-4); background: var(--kort); border-radius: var(--radius-l); box-shadow: var(--hoyde-1); min-width: 0; }
.sm-bilde { height: 96px; display: grid; place-items: center; margin-bottom: var(--rom-2); }
.sm-bilde img { max-height: 96px; width: auto; filter: drop-shadow(0 10px 14px rgba(20, 27, 45, .14)); }
.sm-sted { font: 650 12px/16px var(--font-tekst); letter-spacing: .09em; text-transform: uppercase; color: var(--rav-tekst); }
.sammen b { font: 600 20px/26px var(--font-display); color: var(--blekk); }
.sammen small { font-size: 13px; line-height: 18px; color: var(--blekk-dempet); }
.sammen .sm-pluss { flex: none; align-self: center; padding: 0; background: none; box-shadow: none; font: 650 28px/1 var(--font-display); color: var(--blekk-dempet); }
.sammen .sm-res { background: var(--rav-tint); justify-content: center; box-shadow: var(--hoyde-2); }
.sm-tall { font: 650 56px/1 var(--font-display); letter-spacing: -.03em; color: var(--rav-tekst); }
@media (max-width: 900px) { .sammen { flex-wrap: wrap; } .sammen li:not(.sm-pluss) { flex: 1 1 40%; } .sammen .sm-pluss { display: none; } }

/* Trust «Slik funker det»: tre steg med små bilder i Trust-gult */
.ts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); counter-reset: none; }
.ts-steg { position: relative; display: flex; flex-direction: column; gap: var(--rom-3); padding: var(--rom-4) var(--rom-4) var(--rom-5); background: var(--kort); border-radius: var(--radius-l); box-shadow: var(--hoyde-1); }
.ts-steg:not(:last-child)::after { content: ""; position: absolute; top: 96px; right: calc(-1 * var(--gutter)); width: var(--gutter); height: 2px; background: var(--rav); opacity: .5; }
.ts-vis { position: relative; height: 176px; border-radius: var(--radius-m); background: var(--rav-tint); display: flex; align-items: center; justify-content: center; overflow: hidden; margin-bottom: var(--rom-2); }
.ts-nr { width: 36px; height: 36px; display: grid; place-items: center; border-radius: var(--radius-m); background: var(--rav); color: var(--blekk); font: 650 16px/1 var(--font-display); }
.ts-steg h3 { font: 600 22px/28px var(--font-display); letter-spacing: -.01em; }
.ts-steg p { color: var(--blekk-dempet); font-size: 15px; line-height: 24px; }
/* 1: produkt + telefon + bølger */
.ts-vis-1 img { height: 132px; width: auto; filter: drop-shadow(0 12px 14px rgba(20, 27, 45, .16)); transform: translateX(-28px); }
.ts-tlf { position: absolute; right: 22%; top: 30px; width: 58px; height: 112px; border-radius: 14px; background: var(--blekk); padding: 4px; transform: rotate(-12deg); box-shadow: var(--hoyde-2); }
.ts-tlf span { display: block; height: 100%; border-radius: 10px; background: #e7ecf6; }
.ts-bolge { position: absolute; left: 38%; top: 52%; }
.ts-bolge i { position: absolute; left: -16px; top: -16px; width: 32px; height: 32px; border-radius: 50%; border: 2px solid var(--blaa); opacity: .55; }
.ts-bolge i + i { left: -26px; top: -26px; width: 52px; height: 52px; opacity: .3; }
/* 2: to valg */
.ts-vis-2 { flex-direction: column; gap: 10px; padding: var(--rom-4); }
.ts-valg { width: 88%; height: 44px; display: flex; align-items: center; justify-content: center; gap: 8px; border-radius: var(--radius-m); background: transparent; box-shadow: inset 0 0 0 1.5px var(--kant); color: var(--blekk-dempet); font: 600 14px/1 var(--font-tekst); }
.ts-valg-g { background: var(--kort); color: var(--blekk); box-shadow: var(--hoyde-2); }
.ts-valg img { width: 20px; height: 20px; }
/* 3: appen */
.ts-app { width: 82%; display: flex; flex-direction: column; gap: 6px; padding: 10px; background: var(--kort); border-radius: var(--radius-l); box-shadow: var(--hoyde-2); }
.ts-app-topp { padding: 2px 4px 6px; border-bottom: 1px solid var(--strek); }
.ts-app-topp img { height: 16px; width: auto; display: block; }
.ts-app-rad { display: flex; justify-content: space-between; align-items: center; padding: 6px 8px; background: var(--senket); border-radius: var(--radius-s); font-size: 12px; }
.ts-app-rad b { font-weight: 600; } .ts-app-rad i { font-style: normal; color: var(--rav); letter-spacing: 1px; }
.ts-app-rad em { font-style: normal; font: 600 11px/1 var(--font-tekst); padding: 3px 6px; border-radius: var(--radius-s); background: var(--blaa-tint); color: var(--blaa-tekst); }
@media (max-width: 900px) { .ts { grid-template-columns: 1fr; } .ts-steg::after { display: none; } }
.fair-ic { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; flex: none; align-self: center; color: var(--ok); }
.fair-ic::before { content: none; display: none; }
.fair-ic .zk-ikon { width: 28px; height: 28px; stroke-width: 2.2; }
.fair { align-items: center; }
.tt-gtopp { gap: 6px; } .tt-gtopp b { font-size: 11.5px; text-overflow: clip; } .tt-x { width: 14px; font-size: 16px; } .tt-post { padding: 0 10px; }
.tt-toast { white-space: nowrap; font-size: 11px; padding: 10px; }

/* Trust: dashboardet */
.db { display: flex; flex-direction: column; gap: var(--rom-2); }
.db-ramme { display: flex; flex-direction: column; gap: var(--rom-4); padding: var(--rom-5); background: var(--senket); border-radius: var(--radius-l); box-shadow: var(--hoyde-3); }
.db-topp { display: flex; justify-content: space-between; align-items: center; }
.db-topp img { height: 22px; width: auto; }
.db-periode { height: 32px; display: inline-flex; align-items: center; padding: 0 var(--rom-3); background: var(--kort); border-radius: var(--radius-m); font: 600 13px/16px var(--font-tekst); color: var(--blekk); box-shadow: var(--hoyde-1); }
.db-kpi { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--rom-3); }
.db-k { display: flex; flex-direction: column; gap: 4px; padding: var(--rom-4); background: var(--kort); border-radius: var(--radius-l); box-shadow: var(--hoyde-1); }
.db-k > span { display: inline-flex; align-items: center; gap: 6px; font: 600 13px/18px var(--font-tekst); color: var(--blekk-dempet); }
.db-k > span img { width: 14px; height: 14px; }
.db-k b { font: 650 40px/44px var(--font-display); letter-spacing: -.02em; color: var(--blekk); font-variant-numeric: proportional-nums; }
.db-k small { font-size: 13px; line-height: 18px; color: var(--blekk-dempet); }
.db-k small.opp { color: var(--ok); }
.db-k-g { box-shadow: inset 0 3px 0 var(--rav), var(--hoyde-1); }
.db-k-p small { color: var(--feil); font-weight: 600; }
.db-rad { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--rom-3); }
.db-tabell, .db-feed { padding: var(--rom-4); background: var(--kort); border-radius: var(--radius-l); box-shadow: var(--hoyde-1); min-width: 0; }
.db-tt { margin: 0 0 var(--rom-3); font: 650 12px/16px var(--font-tekst); letter-spacing: .09em; text-transform: uppercase; color: var(--blekk-dempet); }
.db-tabell table { width: 100%; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
.db-tabell th { text-align: left; font: 600 12px/16px var(--font-tekst); color: var(--blekk-dempet); padding: 0 8px 8px 0; border-bottom: 1px solid var(--strek); }
.db-tabell td { padding: 10px 8px 10px 0; border-bottom: 1px solid var(--strek); vertical-align: middle; }
.db-tabell tr:last-child td { border-bottom: 0; }
.db-tabell td b { display: block; font-weight: 600; } .db-tabell td small { font-size: 12px; color: var(--blekk-dempet); }
.db-trend { display: inline-flex; height: 24px; align-items: center; padding: 0 8px; border-radius: var(--radius-s); background: var(--senket); font: 600 12px/1 var(--font-tekst); white-space: nowrap; }
.db-trend.opp { background: var(--ok-tint); color: var(--ok); }
.db-trend.ned { background: var(--feil-tint); color: var(--feil); }
.db-varsel td { background: color-mix(in srgb, var(--feil-tint) 45%, transparent); }
.db-feed { display: flex; flex-direction: column; gap: var(--rom-2); }
.db-inn { position: relative; display: flex; flex-direction: column; gap: 3px; padding: var(--rom-3); border-radius: var(--radius-m); font-size: 13px; line-height: 18px; }
.db-inn-g { background: var(--rav-tint); }
.db-inn-p { background: var(--feil-tint); }
.db-kilde { display: inline-flex; align-items: center; gap: 6px; font: 600 12px/16px var(--font-tekst); color: var(--blekk-dempet); }
.db-kilde img { width: 13px; height: 13px; }
.db-stj { font-style: normal; color: var(--rav); letter-spacing: 1px; }
.db-stj.lav span { color: var(--strek); }
.db-inn em { position: absolute; top: var(--rom-3); right: var(--rom-3); font: 600 11px/1 var(--font-tekst); font-style: normal; padding: 4px 6px; border-radius: var(--radius-s); background: var(--kort); color: var(--feil); }
.db-eks { text-align: right; }
.db-punkter { list-style: none; margin: var(--rom-6) 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gutter); }
.db-punkter li { display: flex; flex-direction: column; gap: 4px; }
.db-punkter li > span { width: 40px; height: 40px; display: grid; place-items: center; border-radius: var(--radius-m); background: var(--rav-tint); color: var(--rav-tekst); margin-bottom: var(--rom-2); }
.db-punkter .zk-ikon { width: 22px; height: 22px; }
.db-punkter b { font: 600 17px/22px var(--font-display); } .db-punkter small { font-size: 14px; line-height: 21px; color: var(--blekk-dempet); }
@media (max-width: 1000px) { .db-rad { grid-template-columns: 1fr; } .db-punkter { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .db-kpi { grid-template-columns: 1fr; } .db-punkter { grid-template-columns: 1fr; } .db-tabell { overflow-x: auto; } .db-ramme { padding: var(--rom-3); } }
/* v11b: alle produktene alltid like synlige; det valgte får bare gul navnelapp og en liten løft */
.tt[data-prod] .tt-p { opacity: 1; filter: none; }
.tt[data-prod="stand"] .tt-stand, .tt[data-prod="plate"] .tt-plate, .tt[data-prod="cards"] .tt-cards { transform: translateY(-6px); }
.tt-p img { transition: filter var(--varighet-kort) linear; }
.tt[data-steg="2"][data-prod="stand"] .tt-stand img, .tt[data-steg="2"][data-prod="plate"] .tt-plate img, .tt[data-steg="2"][data-prod="cards"] .tt-cards img { filter: drop-shadow(0 18px 22px rgba(20, 27, 45, .16)) drop-shadow(0 0 14px rgba(24, 119, 242, .35)); }
.tt-hint { display: none; }

/* Trust: for hvem */
.fh { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--rom-3); }
.fh li { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: var(--rom-4); background: var(--kort); border-radius: var(--radius-l); box-shadow: var(--hoyde-1); transition: box-shadow var(--varighet-respons) linear; }
.fh li:hover { box-shadow: var(--hoyde-2); }
.fh b { font: 600 17px/22px var(--font-display); color: var(--blekk); margin-bottom: 2px; }
.fh-hvor { display: inline-flex; align-items: center; height: 24px; padding: 0 8px; border-radius: var(--radius-s); background: var(--rav-tint); color: var(--rav-tekst); font: 600 12px/16px var(--font-tekst); }
.fh-alle { grid-column: span 4; flex-direction: row !important; align-items: center !important; justify-content: space-between; background: var(--rav-tint) !important; box-shadow: none !important; }
.fh-alle .zk-knapp { height: auto; padding: 0; }
@media (max-width: 1000px) { .fh { grid-template-columns: repeat(3, minmax(0, 1fr)); } .fh-alle { grid-column: span 3; } }
@media (max-width: 700px) { .fh { grid-template-columns: repeat(2, minmax(0, 1fr)); } .fh-alle { grid-column: span 2; flex-direction: column !important; align-items: flex-start !important; } }
.fh li { flex-direction: row; flex-wrap: wrap; align-content: flex-start; } .fh li b { flex-basis: 100%; }

/* For hvem: hver bransje lenker til sin artikkel */
.fh li { padding: 0; }
.fh-lenke { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 6px; height: 100%; padding: var(--rom-4); color: var(--blekk); text-decoration: none; border-radius: var(--radius-l); }
.fh-lenke:hover { color: var(--blekk); text-decoration: none; }
.fh-lenke b { flex-basis: 100%; }
.fh-les { flex-basis: 100%; margin-top: auto; padding-top: var(--rom-2); font: 600 13px/18px var(--font-tekst); color: var(--blaa-tekst); text-decoration: underline; text-underline-offset: 3px; }
.fh-alle { padding: var(--rom-4) !important; }

/* Bransjeartikler: produkter og handlinger */
.br-plass { list-style: none; padding: 0; display: flex; flex-direction: column; gap: var(--rom-3); }
.br-plass li { display: flex; align-items: center; gap: var(--rom-4); padding: var(--rom-3); background: var(--kort); border-radius: var(--radius-l); box-shadow: var(--hoyde-1); }
.br-plass li::before { content: none !important; }
.br-prod { width: 84px; height: 84px; flex: none; display: grid; place-items: center; background: var(--rav-tint); border-radius: var(--radius-m); }
.br-prod img { max-width: 72px; max-height: 72px; width: auto; height: auto; }
.br-plass span { display: flex; flex-direction: column; } .br-plass b { font: 600 17px/22px var(--font-display); } .br-plass small { font-size: 15px; line-height: 22px; color: var(--blekk-dempet); }
.br-cta { margin: var(--rom-6) 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--rom-4); align-items: center; padding: var(--rom-5); border-radius: var(--radius-l); color: var(--blekk); text-decoration: none; }
.br-cta:hover { color: var(--blekk); text-decoration: none; }
.br-cta img { height: 24px; width: auto; }
.br-cta > span:nth-child(2) { display: flex; flex-direction: column; gap: 4px; }
.br-cta b { font: 600 18px/24px var(--font-display); } .br-cta small { font-size: 14px; line-height: 21px; color: var(--blekk-dempet); }
.br-trust { background: var(--rav-tint); box-shadow: var(--hoyde-2); }
.br-web, .br-core { background: var(--kort); box-shadow: var(--hoyde-1); transition: box-shadow var(--varighet-respons) linear; }
.br-web:hover, .br-core:hover { box-shadow: var(--hoyde-2); }
.br-core { background: var(--blaa-tint); }
@media (max-width: 760px) { .br-cta { grid-template-columns: 1fr; } }
.prose a.br-cta, .prose a.br-cta * { text-decoration: none; } .prose a.br-cta b { color: var(--blekk); } .prose .br-plass a { text-decoration: none; }

/* Bransjeillustrasjoner */
.br-ill { display: block; width: 100%; height: auto; }
.fh-ill { flex-basis: 100%; display: block; margin: calc(-1 * var(--rom-2)) calc(-1 * var(--rom-2)) var(--rom-2); border-radius: var(--radius-m); overflow: hidden; }
.fh-lenke:hover .br-ill { transform: translateY(-2px); }
.br-ill { transition: transform var(--varighet-kort) var(--kurve-ro); }
.br-hero-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--rom-7); align-items: center; }
.br-hero-tekst { display: flex; flex-direction: column; gap: var(--rom-4); }
.br-hero-tekst h1 { margin: 0; }
.br-hero-bilde .br-ill { border-radius: var(--radius-l); box-shadow: var(--hoyde-2); }
@media (max-width: 860px) { .br-hero-grid { grid-template-columns: 1fr; } .br-hero-bilde { order: -1; } }
/* Bransjeartikler: playbook og avslutning */
.br-pb { background: var(--kort); box-shadow: var(--hoyde-1); grid-template-columns: auto minmax(0, 1fr) auto; }
.br-pb-bok { width: 70px; height: 92px; display: flex; flex-direction: column; justify-content: space-between; padding: 8px; border-radius: 4px 10px 10px 4px; background: var(--kort); box-shadow: inset 6px 0 0 var(--blaa), var(--hoyde-2); }
.br-pb-bok b { font: 650 10px/12px var(--font-display) !important; color: var(--blekk); }
.br-pb-bok i { font-style: normal; color: var(--rav); font-size: 10px; letter-spacing: 1px; }
.br-slutt { margin-top: var(--rom-7); padding: var(--rom-6); background: var(--rav-tint); border-radius: var(--radius-l); }
.br-slutt h2 { margin-top: 0 !important; }
.br-slutt .cta-row { margin-top: var(--rom-4); }
.zk-knapp--tekst { white-space: normal; height: auto; min-height: 36px; max-width: 100%; text-align: left; } .fh-alle { flex-wrap: wrap; }
.fh .fh-alle { grid-column: 1 / -1 !important; } html, body { overflow-x: clip; } .marquee { overflow: hidden; max-width: 100%; }

/* For hvem: søk og «Vis alle» */
.fh-sok { display: flex; align-items: center; gap: var(--rom-4); margin-bottom: var(--rom-5); flex-wrap: wrap; }
.fh-sok-felt { position: relative; flex: 1; min-width: 240px; max-width: 520px; }
.fh-sok-felt > span[data-zk-ikon] { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: var(--blekk-dempet); display: inline-flex; pointer-events: none; }
.fh-sok-felt input { width: 100%; height: 52px; padding: 0 var(--rom-4) 0 48px; border: 1.5px solid var(--kant); border-radius: var(--radius-full); background: var(--kort); color: var(--blekk); font: 400 16px/24px var(--font-tekst); box-shadow: var(--hoyde-1); }
.fh-sok-felt input:focus { outline: 2px solid var(--fokus); outline-offset: 2px; border-color: var(--blaa-tekst); }
.fh-antall { font: 600 14px/20px var(--font-tekst); color: var(--blekk-dempet); }
.fh .fh-mer-rad, .fh .fh-tom { grid-column: 1 / -1; background: none !important; box-shadow: none !important; padding: 0 !important; display: flex; justify-content: center; }
.fh .fh-mer-rad[hidden], .fh .fh-tom[hidden], .fh li[hidden] { display: none !important; }
.fh .fh-tom { padding: var(--rom-5) !important; color: var(--blekk-dempet); font-size: 15px; }

/* Bransjeartikkel: CTA per produkt i plasseringslisten */
.br-plass li > span { flex: 1; min-width: 0; }
.prose .br-plass a.br-velg { flex: none; text-decoration: none; color: var(--blekk); }
@media (max-width: 560px) { .br-plass li { flex-wrap: wrap; } .br-plass .br-velg { width: 100%; justify-content: center; } }

/* Bransjeartikkel: avsluttende CTA i Trust-profil, Web og Core under */
.br-slutt { position: relative; overflow: hidden; background: var(--rav-tint); box-shadow: var(--hoyde-2); border-top: 4px solid var(--rav); margin-bottom: var(--rom-6); }
.br-slutt-logo { height: 26px; width: auto; margin-bottom: var(--rom-4); }
.br-slutt-prod { display: flex; gap: var(--rom-4); align-items: flex-end; margin-top: var(--rom-4); }
.br-slutt-prod img { height: 88px; width: auto; filter: drop-shadow(0 8px 14px rgba(0,0,0,.12)); }
.prose .br-slutt .br-trust-knapp, .br-trust .btn { background: var(--rav); color: var(--blekk); text-decoration: none; }
.prose .br-slutt .br-trust-knapp:hover, .br-trust .btn:hover { background: var(--rav-tekst); color: var(--kort); }
@media (max-width: 560px) { .br-slutt-prod img { height: 64px; } }

/* ===================== Prissiden (trust-priser.html) ===================== */
.tp-hero { padding: var(--rom-7) 0 var(--rom-5); }
.tp-hero h1 { font: 700 clamp(34px, 5vw, 52px)/1.08 var(--font-display); letter-spacing: -0.02em; margin: var(--rom-2) 0 var(--rom-3); text-wrap: balance; max-width: 18ch; }
.tp-hero .ingress { max-width: 56ch; color: var(--blekk-dempet); font-size: 18px; line-height: 28px; }
.tp { padding-bottom: var(--rom-8); }
.tp-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: var(--rom-6); align-items: start; }
.tp-steg { display: flex; flex-direction: column; gap: var(--rom-7); min-width: 0; }
.tp-tittel { display: flex; gap: var(--rom-4); align-items: flex-start; margin-bottom: var(--rom-5); }
.tp-tittel h2 { font: 700 26px/32px var(--font-display); margin: 0 0 4px; }
.tp-tittel p { margin: 0; color: var(--blekk-dempet); max-width: 60ch; }
.tp-nr { flex: none; width: 32px; height: 32px; border-radius: 50%; display: inline-grid; place-items: center; background: var(--blekk); color: var(--kort); font: 700 15px/1 var(--font-display); }

/* Pakker */
.tp-pakker { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--rom-3); margin-bottom: var(--rom-4); }
.tp-pakke { all: unset; box-sizing: border-box; cursor: pointer; display: flex; flex-direction: column; gap: 4px; padding: var(--rom-4); border-radius: var(--radius-l); background: var(--kort); box-shadow: inset 0 0 0 1.5px var(--kant); transition: box-shadow var(--varighet-respons) linear, background-color var(--varighet-respons) linear; }
.tp-pakke:hover { box-shadow: inset 0 0 0 1.5px var(--blekk-dempet); }
.tp-pakke:focus-visible { outline: 2px solid var(--fokus); outline-offset: 2px; }
.tp-pakke[aria-pressed="true"] { background: var(--rav-tint); box-shadow: inset 0 0 0 2px var(--rav); }
.tp-pakke-topp { display: flex; align-items: center; justify-content: space-between; gap: var(--rom-2); }
.tp-pakke-topp b { font: 700 20px/24px var(--font-display); }
.tp-pakke-topp em { font-style: normal; font: 600 12px/16px var(--font-tekst); padding: 3px 8px; border-radius: var(--radius-full); background: var(--rav-tint); color: var(--rav-tekst); }
.tp-pakke[aria-pressed="true"] .tp-pakke-topp em { background: var(--kort); }
.tp-pakke-inn { color: var(--blekk-dempet); font-size: 14px; }
.tp-pakke-pris { font: 600 15px/20px var(--font-tekst); }

/* Produktkort med teller */
.tp-prod { display: flex; flex-direction: column; gap: var(--rom-3); }
.tp-p { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; gap: var(--rom-4); align-items: center; padding: var(--rom-3) var(--rom-4) var(--rom-3) var(--rom-3); border-radius: var(--radius-l); background: var(--kort); box-shadow: var(--hoyde-1); transition: box-shadow var(--varighet-respons) linear; }
.tp-p.er-valgt { box-shadow: inset 0 0 0 2px var(--rav), var(--hoyde-1); }
.tp-p-bilde { width: 72px; height: 72px; border-radius: var(--radius-m); background: var(--rav-tint); display: grid; place-items: center; }
.tp-p-bilde img { max-width: 60px; max-height: 60px; width: auto; height: auto; }
.tp-p-tekst { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tp-p-tekst b { font: 600 18px/24px var(--font-display); }
.tp-p-tekst small { color: var(--blekk-dempet); font-size: 14px; line-height: 20px; }
.tp-p-tekst .tp-p-sett { color: var(--rav-tekst); font-weight: 600; }
.tp-tell { display: inline-flex; align-items: center; gap: 2px; background: var(--senket); border-radius: var(--radius-full); padding: 4px; }
.tp-tell button { all: unset; cursor: pointer; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; font: 600 22px/1 var(--font-tekst); color: var(--blekk); background: var(--kort); box-shadow: var(--hoyde-1); }
.tp-tell button:hover:not(:disabled) { background: var(--rav-tint); }
.tp-tell button:focus-visible { outline: 2px solid var(--fokus); outline-offset: 2px; }
.tp-tell button:disabled { opacity: .35; cursor: default; box-shadow: none; }
.tp-tell output { min-width: 64px; text-align: center; font: 600 16px/20px var(--font-tekst); font-variant-numeric: tabular-nums; }
.tp-tell output span { color: var(--blekk-dempet); font-weight: 400; font-size: 13px; }

/* Trust (alltid med) */
.tp-trust { padding: var(--rom-5); border-radius: var(--radius-l); background: var(--kort); box-shadow: var(--hoyde-2); border-top: 4px solid var(--rav); }
.tp-trust-topp { display: flex; align-items: center; justify-content: space-between; gap: var(--rom-3); }
.tp-trust-topp img { height: 26px; width: auto; }
.tp-merke { display: inline-flex; align-items: center; font: 600 12px/16px var(--font-tekst); padding: 4px 10px; border-radius: var(--radius-full); }
.tp-merke-ok { background: var(--ok-tint); color: var(--ok); }
.tp-merke-snart { background: var(--blaa-tint); color: var(--blaa-tekst); }
.tp-trust-pris { margin: var(--rom-3) 0 var(--rom-5); font-size: 16px; }
.tp-trust-pris b { font: 700 28px/32px var(--font-display); }
.tp-trust-pris > span { display: block; color: var(--blekk-dempet); font-size: 14px; margin-top: 2px; }
.tp-trust-rad { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 300px); gap: var(--rom-5); align-items: start; }
.tp-far { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--rom-4); }
.tp-far li { display: flex; gap: var(--rom-3); align-items: flex-start; }
.tp-far li::before { content: none !important; }
.tp-ic { flex: none; width: 36px; height: 36px; border-radius: var(--radius-m); background: var(--rav-tint); color: var(--rav-tekst); display: grid; place-items: center; }
.tp-ic svg { width: 20px; height: 20px; }
.tp-far b { display: block; font: 600 16px/22px var(--font-tekst); }
.tp-far small { display: block; color: var(--blekk-dempet); font-size: 14px; line-height: 21px; margin-top: 2px; }

/* Mini-dashboard */
.tp-demo { background: var(--flate); border-radius: var(--radius-l); padding: var(--rom-4); box-shadow: inset 0 0 0 1px var(--kant); display: flex; flex-direction: column; gap: var(--rom-3); }
.tp-demo-topp { display: flex; justify-content: space-between; align-items: center; font-size: 12px; color: var(--blekk-dempet); }
.tp-demo-topp img { height: 16px; width: auto; }
.tp-demo-kpi { display: grid; grid-template-columns: 1fr 1fr; gap: var(--rom-2); }
.tp-demo-kpi div { background: var(--kort); border-radius: var(--radius-m); padding: 10px 12px; box-shadow: var(--hoyde-1); }
.tp-demo-kpi span { display: flex; align-items: center; gap: 4px; font-size: 12px; line-height: 16px; color: var(--blekk-dempet); }
.tp-demo-kpi span img { width: 12px; height: 12px; }
.tp-demo-kpi b { font: 700 22px/28px var(--font-display); font-variant-numeric: tabular-nums; }
.tp-demo-g b { color: var(--rav-tekst); }
.tp-demo-trakt { display: flex; flex-direction: column; gap: 4px; }
.tp-demo-trakt i { display: block; height: 6px; width: var(--b); border-radius: 3px; background: var(--rav); opacity: .85; }
.tp-demo-trakt i:last-child { background: var(--ok); }
.tp-demo-privat { background: var(--kort); border-radius: var(--radius-m); padding: 10px 12px; box-shadow: inset 3px 0 0 var(--koral); }
.tp-demo-tt { font: 600 12px/16px var(--font-tekst); color: var(--blekk-dempet); }
.tp-demo-privat p { margin: 4px 0; font-size: 14px; line-height: 20px; }
.tp-demo-hvem { font-size: 12px; color: var(--blekk-dempet); }
.tp-demo-hvem b { color: var(--blekk); }

/* Trust+ tillegg */
.tp-plus { margin-top: var(--rom-4); padding: var(--rom-5); border-radius: var(--radius-l); background: var(--kort); box-shadow: inset 0 0 0 1.5px var(--kant); }
.tp-plus-topp { display: flex; justify-content: space-between; align-items: center; gap: var(--rom-3); }
.tp-plus-topp > div { display: flex; align-items: center; gap: var(--rom-3); flex-wrap: wrap; }
.tp-plus-navn { font: 600 20px/26px var(--font-display); }
.tp-plus-navn b { font-weight: 700; }
.tp-plus-pris { margin: var(--rom-2) 0 0; font: 600 15px/22px var(--font-tekst); }
.tp-plus-ingress { color: var(--blekk-dempet); margin: var(--rom-2) 0 var(--rom-4); }
.tp-plus-tt { font: 600 13px/18px var(--font-tekst); text-transform: uppercase; letter-spacing: .06em; color: var(--blekk-dempet); margin: 0 0 var(--rom-3); }
.tp-far-plus .tp-ic { background: var(--blaa-tint); color: var(--blaa-tekst); }
.tp-bryter { position: relative; display: inline-flex; cursor: pointer; }
.tp-bryter input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: inherit; }
.tp-bryter-spor { width: 52px; height: 30px; border-radius: 15px; background: var(--senket); box-shadow: inset 0 0 0 1.5px var(--kant); display: flex; align-items: center; padding: 3px; transition: background-color var(--varighet-respons) linear; }
.tp-bryter-spor span { width: 24px; height: 24px; border-radius: 50%; background: var(--kort); box-shadow: var(--hoyde-1); transition: transform var(--varighet-respons) ease; }
.tp-bryter input:checked + .tp-bryter-spor { background: var(--rav); }
.tp-bryter input:checked + .tp-bryter-spor span { transform: translateX(22px); }
.tp-bryter input:focus-visible + .tp-bryter-spor { outline: 2px solid var(--fokus); outline-offset: 2px; }
.tp-bryter input:disabled { cursor: not-allowed; }
.tp-bryter input:disabled + .tp-bryter-spor { opacity: .5; }
.tp-lok { display: flex; align-items: center; justify-content: space-between; gap: var(--rom-3); margin-top: var(--rom-4); padding-top: var(--rom-4); border-top: 1px solid var(--kant); font-weight: 600; }
.tp-vente { margin-top: var(--rom-5); padding: var(--rom-4); border-radius: var(--radius-m); background: var(--flate); }
.tp-vente-tt { margin: 0 0 var(--rom-3); font-size: 15px; } .tp-vente-tt b { display: block; font-size: 16px; }
.tp-vente-felt { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 110px); gap: var(--rom-3); margin-bottom: var(--rom-3); }
.tp-felt { display: flex; flex-direction: column; gap: 4px; font: 600 13px/18px var(--font-tekst); min-width: 0; }
.tp-felt small { font-weight: 400; color: var(--blekk-dempet); }
.tp-felt input { height: 44px; padding: 0 12px; border: 1.5px solid var(--kant); border-radius: var(--radius-m); background: var(--kort); color: var(--blekk); font: 400 16px/22px var(--font-tekst); min-width: 0; width: 100%; box-sizing: border-box; }
.tp-felt input:focus { outline: 2px solid var(--fokus); outline-offset: 1px; }
.tp-vente-feil { color: var(--feil); font-size: 14px; margin: 0 0 var(--rom-2); min-height: 0; }
.tp-vente-feil:empty { display: none; }
.tp-vente-takk { margin-top: var(--rom-4); display: flex; gap: var(--rom-3); align-items: flex-start; padding: var(--rom-4); border-radius: var(--radius-m); background: var(--ok-tint); }
.tp-vente-takk > span { color: var(--ok); display: inline-flex; }
.tp-vente-takk p { margin: 0; }

/* Binding */
.tp-binding { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--rom-3); }
.tp-b { position: relative; cursor: pointer; }
.tp-b input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.tp-b-inn { position: relative; display: flex; flex-direction: column; gap: 4px; height: 100%; box-sizing: border-box; padding: var(--rom-4); border-radius: var(--radius-l); background: var(--kort); box-shadow: inset 0 0 0 1.5px var(--kant); transition: box-shadow var(--varighet-respons) linear, background-color var(--varighet-respons) linear; }
.tp-b input:checked + .tp-b-inn { background: var(--rav-tint); box-shadow: inset 0 0 0 2px var(--rav); }
.tp-b input:focus-visible + .tp-b-inn { outline: 2px solid var(--fokus); outline-offset: 2px; }
.tp-b-inn b { font: 600 17px/22px var(--font-display); padding-right: 80px; }
.tp-b-pris { font: 700 20px/26px var(--font-display); }
.tp-b-inn small { color: var(--blekk-dempet); font-size: 14px; line-height: 20px; }
.tp-b-inn em { position: absolute; top: var(--rom-4); right: var(--rom-4); font-style: normal; font: 600 12px/16px var(--font-tekst); padding: 3px 8px; border-radius: var(--radius-full); background: var(--ok-tint); color: var(--ok); }

/* Oppsummering */
.tp-sum { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 88px); }
.tp-sum-kort { padding: var(--rom-5); border-radius: var(--radius-l); background: var(--kort); box-shadow: var(--hoyde-2); }
.tp-nr-rad { display: flex; align-items: center; gap: var(--rom-3); margin: 0 0 var(--rom-4); font: 700 20px/26px var(--font-display); }
.tp-sum-linjer { list-style: none; padding: 0; margin: 0 0 var(--rom-4); display: flex; flex-direction: column; gap: var(--rom-2); }
.tp-sum-linjer li { display: flex; gap: var(--rom-3); align-items: center; }
.tp-sum-linjer li::before { content: none !important; }
.tp-sum-linjer img { width: 36px; height: 36px; object-fit: contain; background: var(--rav-tint); border-radius: var(--radius-s); padding: 3px; box-sizing: border-box; }
.tp-sum-linjer span { display: flex; flex-direction: column; } .tp-sum-linjer small { color: var(--blekk-dempet); font-size: 12px; }
.tp-sum-linjer .tp-tom { color: var(--blekk-dempet); }
.tp-sum-pris { margin: 0; padding: var(--rom-3) 0; border-top: 1px solid var(--kant); display: flex; flex-direction: column; gap: 6px; }
.tp-sum-pris:empty { display: none; }
.tp-sum-pris div { display: flex; justify-content: space-between; gap: var(--rom-3); font-size: 14px; }
.tp-sum-pris dt { color: var(--blekk); } .tp-sum-pris dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tp-sum-pris .tp-dempet dt, .tp-sum-pris .tp-dempet dd { color: var(--blekk-dempet); font-weight: 400; }
.tp-sum-pris .tp-ok dd { color: var(--ok); }
.tp-sum-total { display: flex; justify-content: space-between; align-items: baseline; padding-top: var(--rom-3); border-top: 1.5px solid var(--blekk); }
.tp-sum-total span { font-weight: 600; }
.tp-sum-total b { font: 700 28px/34px var(--font-display); font-variant-numeric: tabular-nums; }
.tp-sum-note { font-size: 13px; line-height: 19px; color: var(--blekk-dempet); margin: var(--rom-2) 0 var(--rom-4); }
.tp-videre { width: 100%; }
.tp-sum-trygt { display: flex; align-items: center; justify-content: center; gap: 6px; margin: var(--rom-3) 0 0; font-size: 13px; color: var(--blekk-dempet); }
.tp-sum-trygt span { color: var(--ok); display: inline-flex; } .tp-sum-trygt svg { width: 16px; height: 16px; }

/* Mobil prislinje */
.tp-bar { display: none; }
.tp-bestill-valg { margin-top: var(--rom-4); padding: var(--rom-4); border-radius: var(--radius-m); background: var(--kort); box-shadow: var(--hoyde-1); }
.tp-bestill-valg:empty { display: none; }
.tp-kopi-tt { font-weight: 600; margin: 0 0 var(--rom-2); }
.tp-bestill-valg ul { margin: 0 0 var(--rom-2); padding-left: 18px; } .tp-bestill-valg p { margin: 0 0 var(--rom-2); }

@media (max-width: 960px) {
  .tp-grid { grid-template-columns: minmax(0, 1fr); }
  .tp-sum { position: static; }
  .tp-trust-rad { grid-template-columns: minmax(0, 1fr); }
  .tp-bar:not([hidden]) { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; align-items: center; justify-content: space-between; gap: var(--rom-3); padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); background: var(--kort); box-shadow: 0 -6px 20px rgba(0,0,0,.08); transition: transform var(--varighet-respons) ease; }
  .tp-bar.skjul { transform: translateY(110%); }
  .tp-bar span { display: flex; flex-direction: column; } .tp-bar b { font: 700 20px/24px var(--font-display); } .tp-bar small { font-size: 12px; color: var(--blekk-dempet); }
}
@media (max-width: 600px) {
  .tp-pakker, .tp-binding { grid-template-columns: minmax(0, 1fr); }
  .tp-p { grid-template-columns: 56px minmax(0, 1fr); }
  .tp-p-bilde { width: 56px; height: 56px; } .tp-p-bilde img { max-width: 46px; max-height: 46px; }
  .tp-p .tp-tell { grid-column: 1 / -1; justify-self: stretch; justify-content: space-between; }
  .tp-vente-felt { grid-template-columns: minmax(0, 1fr); }
  .tp-trust, .tp-plus, .tp-sum-kort { padding: var(--rom-4); }
}
@media (prefers-reduced-motion: reduce) { .tp-bryter-spor span, .tp-bar { transition: none; } }
@media (max-width: 1180px) { .tp-trust-rad { grid-template-columns: minmax(0, 1fr); } .tp-trust-rad .tp-demo { max-width: 420px; } }
.tp [hidden], .tp-bestill[hidden] { display: none !important; }
.tp-bar b { white-space: nowrap; }

/* Mobil: CTA først, menyknappen lengst til høyre (Linus 2026-10-20) */
@media (max-width: 900px) { .meny-knapp { order: 10 !important; } }

/* Zervo-løftet med fire garantier (Notion 26. okt 2026) */
.fs-lofter--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.fs-garanti .zk-eyebrow { margin: 0 0 var(--rom-2); }
@media (max-width: 1100px) { .fs-lofter--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .fs-lofter--4 { grid-template-columns: minmax(0, 1fr); } }

/* Web: tre pakker (Notion 26. okt 2026) og Zervo-løftet */
.wp-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); margin-top: var(--rom-6); }
.wp { display: flex; flex-direction: column; gap: var(--rom-4); padding: var(--rom-5); border-radius: var(--radius-l); background: var(--kort); box-shadow: var(--hoyde-1); border-top: 4px solid var(--blaa); }
.wp:nth-child(2) { box-shadow: var(--hoyde-2); }
.wp-topp { display: flex; flex-direction: column; gap: 2px; }
.wp-topp .zk-eyebrow { margin: 0; }
.wp-topp b { font: 700 28px/34px var(--font-display); color: var(--blekk); }
.wp-topp small { color: var(--blekk-dempet); font-size: 15px; line-height: 22px; }
.wp ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--rom-2); }
.wp li { display: flex; gap: var(--rom-2); align-items: flex-start; font-size: 15px; line-height: 22px; }
.wp li::before { content: none !important; }
.wp li > span { flex: none; color: var(--blaa-tekst); display: inline-flex; margin-top: 2px; }
.wp li svg { width: 18px; height: 18px; }
.wp-cta { justify-content: center; margin-top: var(--rom-5); }
.wl-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); margin-top: var(--rom-5); }
.wl { display: flex; flex-direction: column; gap: var(--rom-2); padding: var(--rom-5); border-radius: var(--radius-l); background: var(--kort); box-shadow: var(--hoyde-1); }
.wl-ikon { width: 40px; height: 40px; border-radius: var(--radius-m); background: var(--blaa-tint); color: var(--blaa-tekst); display: grid; place-items: center; }
.wl-ikon svg { width: 22px; height: 22px; }
.wl-tall { font: 650 13px/16px var(--font-tekst); letter-spacing: .09em; text-transform: uppercase; color: var(--blaa-tekst); }
.wl h3 { font: 700 20px/26px var(--font-display); margin: 0; }
.wl p { margin: 0; color: var(--blekk-dempet); font-size: 15px; line-height: 22px; }
@media (max-width: 900px) { .wp-grid, .wl-grid { grid-template-columns: minmax(0, 1fr); } }
.tp-sum-pris .tp-bonus dd { white-space: normal; text-align: right; max-width: 60%; }
.tp-vente-felt .tp-felt > span { white-space: nowrap; }

/* Trust: teamet */
.tm { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: var(--space-6); }
.tm-kort { display: flex; gap: var(--space-6); align-items: center; background: var(--kort); border: 1px solid var(--line); border-radius: 24px; padding: var(--space-6); }
.tm-bilde { width: 112px; height: 112px; flex: none; border-radius: 50%; object-fit: cover; background: var(--proof-wash); }
.tm-tekst { min-width: 0; }
.tm-tekst h3 { font-size: var(--text-lg, 22px); margin: 0; }
.tm-rolle { color: var(--text-muted); margin: 2px 0 var(--space-3); }
.tm-kontakt { display: flex; flex-direction: column; gap: 4px; margin: 0; }
.tm-kontakt a { overflow-wrap: anywhere; font-weight: 600; }
@media (max-width: 420px) { .tm-kort { flex-direction: column; text-align: center; } }

/* Liten «Snakk med oss» med Foud */
.snakk { display: inline-flex; align-items: center; gap: 10px; margin-top: var(--space-4); padding: 4px 14px 4px 4px; border: 1px solid var(--line); border-radius: 999px; background: var(--kort); color: var(--text-muted); font-size: 14px; text-decoration: none; max-width: 100%; }
.snakk img { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; flex: none; }
.snakk b { color: var(--blaa, currentColor); font-weight: 600; }
.snakk:hover { border-color: var(--line-strong); }
.snakk:hover b { text-decoration: underline; }

/* Interaktivt demo-dashboard */
.db-seg { display: inline-flex; gap: 2px; padding: 3px; background: var(--kort); border-radius: var(--radius-m); box-shadow: var(--hoyde-1); flex-wrap: wrap; }
.db-seg button { height: 28px; padding: 0 10px; border: 0; border-radius: var(--radius-s); background: transparent; font: 600 13px/1 var(--font-tekst); color: var(--blekk-dempet); cursor: pointer; }
.db-seg button[aria-pressed="true"] { background: var(--blekk); color: var(--kort); }
.db-seg button:focus-visible, .db-tabell tr[data-db-sted]:focus-visible { outline: 2px solid var(--blaa); outline-offset: 2px; }
.db-seg--liten { box-shadow: none; background: var(--senket); }
.db-seg--liten button { height: 24px; padding: 0 8px; font-size: 12px; }
.db-topp { gap: var(--rom-3); flex-wrap: wrap; }
.db-tt-rad { display: flex; justify-content: space-between; align-items: center; gap: var(--rom-2); flex-wrap: wrap; margin-bottom: var(--rom-3); }
.db-tt-rad .db-tt { margin: 0; }
.db-alle { border: 0; background: none; padding: 0; font: 600 13px/1 var(--font-tekst); color: var(--blaa); cursor: pointer; }
.db-tabell tr[data-db-sted] { cursor: pointer; transition: opacity .15s; }
.db-tabell tr[data-db-sted]:hover td { background: var(--senket); }
.db-tabell tr.db-valgt td { background: var(--blaa-tint); }
.db-tabell tr.db-valgt td:first-child { box-shadow: inset 3px 0 0 var(--blaa); padding-left: 8px; }
.db-tabell tr.db-dempet { opacity: .45; }
.db-hint { margin: var(--rom-3) 0 0; font-size: 12px; color: var(--blekk-dempet); }
.db-liste { display: flex; flex-direction: column; gap: var(--rom-2); }
.db-handter { align-self: flex-start; margin-top: 4px; height: 26px; padding: 0 10px; border: 1px solid var(--feil); border-radius: var(--radius-s); background: var(--kort); color: var(--feil); font: 600 12px/1 var(--font-tekst); cursor: pointer; }
.db-handter:hover { background: var(--feil); color: var(--kort); }
.db-ferdig { margin-top: 4px; font: 600 12px/16px var(--font-tekst); color: var(--ok); }
.db-k small.ned { color: var(--feil); }
.db-k-p small.db-ok { color: var(--ok); }
.db-tom { margin: 0; font-size: 13px; color: var(--blekk-dempet); }
.mu-cta .snakk { margin-top: 0; }

/* Steg 1: telefonen holdes mot Stand, med kontaktløs-buer i stedet for ringer */
.ts-vis-1 img { transform: translateX(-40px); }
.ts-vis-1 .ts-tlf { right: auto; left: calc(50% + 34px); top: 34px; transform: rotate(-14deg); }
.ts-vis-1 .ts-bolge { position: absolute; left: calc(50% + 4px); top: 66px; width: 28px; height: 40px; stroke: var(--blaa); stroke-width: 2.5; }
.ts-vis-1 .ts-bolge path { animation: ts-bue 1.8s ease-in-out infinite; }
.ts-vis-1 .ts-bolge path:nth-child(2) { animation-delay: .2s; }
.ts-vis-1 .ts-bolge path:nth-child(3) { animation-delay: .4s; }
@keyframes ts-bue { 0%, 100% { opacity: .25; } 40% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .ts-vis-1 .ts-bolge path { animation: none; opacity: .7; } }

/* Trust-undersider */
.tsu-hero .tsu-tekst { display: flex; flex-direction: column; align-items: flex-start; gap: var(--rom-3); max-width: 44rem; }
.tsu-hero .tsu-tekst h1 { margin: 0; }
.tsu-hero .tsu-tekst .snakk { margin-top: 0; }
.tsu-hero .db { margin-top: var(--rom-7); }
.tsu-vis { min-width: 0; display: flex; justify-content: center; }
.tsu-kort { width: 100%; max-width: 460px; display: flex; flex-direction: column; gap: var(--rom-3); padding: var(--rom-5); background: var(--kort); border-radius: var(--radius-l); box-shadow: var(--hoyde-3); }
.tsu-kort .zk-fotnote { margin: 0; text-align: right; }
.tsu-to { padding: var(--rom-4); }
.tsu-to .ts-vis { margin: 0; }
.tsu-regler .ts-valg, .tsu-to .ts-valg { width: 100%; }
.tsu-sjekk { list-style: none; margin: var(--rom-2) 0 0; padding: 0; display: grid; gap: var(--rom-2); }
.tsu-sjekk li { display: flex; align-items: center; gap: var(--rom-2); font-weight: 600; }
.tsu-sjekk li > span { width: 26px; height: 26px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--ok-tint); color: var(--ok); }
.tsu-sjekk .zk-ikon { width: 16px; height: 16px; }
.tsu-prod { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; }
.tsu-prod > img { width: 100%; height: 120px; object-fit: contain; filter: drop-shadow(0 10px 12px rgba(20, 27, 45, .14)); }
.tsu-prod .tsu-sjekk { grid-column: 1 / -1; }
.tsu-auto { align-items: flex-start; }
.tsu-auto .tsu-sjekk { width: 100%; }
.tsu-pris { margin: var(--rom-2) 0 0; color: var(--blekk-dempet); } .tsu-pris b { color: var(--blekk); }
.tsu-steg { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); }
.tsu-steg li { display: flex; flex-direction: column; gap: var(--rom-3); padding: var(--rom-5); background: var(--kort); border-radius: var(--radius-l); box-shadow: var(--hoyde-1); }
.tsu-steg h3 { font: 600 22px/28px var(--font-display); margin: 0; }
.tsu-steg p { margin: 0; color: var(--blekk-dempet); font-size: 15px; line-height: 24px; }
.tsu-kart { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tsu-kart .m-card { text-decoration: none; color: inherit; }
.tsu-slutt { margin-top: var(--rom-7); }
#alt .tsu-kart .m-card { background: var(--kort); }
@media (max-width: 900px) { .tsu-steg, .tsu-kart { grid-template-columns: 1fr; } .tsu-vis { margin-top: var(--rom-5); } }

/* ---------- Hovedforsiden (index.html, lag-hub.py) ---------- */
.hub-hero { text-align: center; padding-block: var(--rom-10) var(--rom-9); display: flex; flex-direction: column; align-items: center; gap: var(--rom-5); }
.hub-hero .zk-ingress { max-width: 40rem; }
/* Animert merke: firkantene fra Core, Trust og Web (lag-hub.py styrer tilstandene) */
.hub-merke { width: min(360px, 72vw); margin-bottom: var(--rom-3); }
.hub-merke svg { display: block; width: 100%; height: auto; overflow: visible; }
.hm-zervo { fill: var(--blaa); }
.hm-strek { fill: var(--blekk); }
.hm-alt { transition: transform 700ms cubic-bezier(.65, 0, .35, 1); }
.hm-firkant, .hm-ord { transform-box: fill-box; transform-origin: center; }
.hm-firkant { opacity: 0; transform: rotate(-90deg) scale(.4); transition: transform 650ms cubic-bezier(.34, 1.56, .64, 1), opacity 300ms ease; }
.hm-firkant.er-inne, .hm-firkant.er-rad { opacity: 1; transform: none; }
.hm-firkant.er-ute { transform: rotate(90deg) scale(.4); }
.hm-firkant.er-samlet { opacity: 0; transform: none; transition: transform 600ms cubic-bezier(.65, 0, .35, 1), opacity 150ms ease 450ms; }
.hm-firkant.er-rad { transition: transform 700ms cubic-bezier(.34, 1.4, .64, 1), opacity 200ms ease; }
.hm-firkant.er-rad[data-p="trust"] { transition-delay: 60ms; }
.hm-firkant.er-rad[data-p="web"] { transition-delay: 120ms; }
.hm-ord { fill: var(--blekk); opacity: 0; transform: translateY(72px); transition: transform 600ms cubic-bezier(.22, 1, .36, 1), opacity 300ms ease; }
.hm-ord.er-inne { opacity: 1; transform: none; transition-delay: 120ms; }
.hm-ord.er-ute { transform: translateY(-72px); }
.hub-merke.uten-overgang *, .hub-merke.uten-overgang .hm-alt { transition: none !important; }
@media (prefers-reduced-motion: reduce) { .hub-merke * { transition: none !important; } }
.hub-valg { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--rom-5); }
.hub-kort { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: var(--rom-3); background: var(--kort); border: 1px solid var(--strek); border-radius: var(--radius-l); padding: var(--rom-7) var(--rom-6) var(--rom-6); color: var(--blekk); overflow: hidden; transition: border-color var(--varighet-standard) var(--kurve-ro), transform var(--varighet-standard) var(--kurve-ro); }
.hub-kort::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: var(--hub-farge, var(--blaa)); }
.hub-kort--core { --hub-farge: var(--blaa); }
.hub-kort--trust { --hub-farge: var(--rav); }
.hub-kort--web { --hub-farge: var(--blekk); }
a.hub-kort:hover { border-color: var(--hub-farge); text-decoration: none; color: var(--blekk); transform: translateY(-2px); }
.hub-logo { height: 30px; width: auto; margin-bottom: var(--rom-2); }
.hub-behov { font-family: var(--font-display); font-weight: 650; font-size: 1.5rem; line-height: 1.15; letter-spacing: -0.01em; text-wrap: balance; margin: 0; }
.hub-kort p { margin: 0; }
.hub-bilder { display: flex; gap: var(--rom-3); align-items: flex-end; height: 72px; }
.hub-bilder img { height: 100%; width: auto; object-fit: contain; }
.hub-fakta { margin-top: auto; padding-top: var(--rom-3); font-size: .875rem; color: var(--blekk-dempet); font-variant-numeric: tabular-nums; }
.hub-kort .zk-knapp { pointer-events: none; }
.hub-les { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hub-alle { margin-top: var(--rom-5); }
@media (max-width: 900px) {
  .hub-valg, .hub-les { grid-template-columns: 1fr; }
  .hub-hero { padding-block: var(--rom-8) var(--rom-7); }
}