/* Fargepalett og typografi hentet direkte fra den ekte markedsføringssiden
   https://takst-befaringssenteret.no (Elementor-CSS-en er lest programmatisk
   for å sikre nøyaktige hex-verdier). Begge portaler (fagside/driftsside)
   deler nå denne ene navyblå paletten -- se "Driftsside" lenger ned i denne
   filen for hvorfor den tidligere, separate varme driftsside-drakten er
   fjernet. */
:root{
  --blue-900:#081F35;
  --blue-800:#0E2A3E;
  --blue-700:#1E4570;
  --blue-600:#36709b;
  --blue-100:#E4EAED;
  --blue-050:#F3F6F8;
  --paper:#F3F6F8;
  --surface:#ffffff;
  --ink:#0E2A3E;
  --ink-soft:#456073;
  --line:#C9D8E0;
  --line-soft:#E4EAED;
  --good:#2a7050;
  --good-bg:#e7f3ec;
  --good-light:#6a9c3f;
  --good-light-bg:#eef4e4;
  --warn:#955614;
  --warn-bg:#faf0e1;
  --bad:#b23b3b;
  --bad-bg:#fbe9e9;
  --grey:#5f666c;
  --grey-bg:#eceef0;
  --mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --sans: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --disp: 'Inter', var(--sans);

  /* v72: lyseblå sekundærtekst på de mørke landingssideflatene (hero,
     statistikk, om-oss, cta-banner, footer) -- egne variabler i stedet for
     hardkodet hex i hver enkelt regel, slik at #landingWrap.tema-drift
     (Driftsportalens egen, uavhengige fargeprofil -- se lenger ned) kan
     tone dem om til grønt sammen med --blue-*, uten å røre selve
     fargeverdien som brukes utenfor landingssiden (det finnes ingen slik
     bruk i dag, men variabelen er likevel definert her og ikke inline i
     .landing-hero osv., for konsistens med resten av filen). */
  --krav-ok:#1f7a3d; --krav-mangler:#9c4514; --krav-venter:#8a6d00; --krav-ikke:#6b7280;
  --landing-topbar-ink:#a9c3d6;
  --landing-soft-ink:#cfdcea;
  --landing-softer-ink:#b4cee0;
  --landing-soft2-ink:#c9dae6;
  --landing-muted-ink:#a9c3d6;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#0c1520; --surface:#10253d; --ink:#e7edf2; --ink-soft:#9DBBCE;
    --line:#2a3844; --line-soft:#22303c;
    --blue-100:#153251; --blue-050:#10253d;
    --good-bg:#173428; --good-light-bg:#26361a; --warn-bg:#3a2a16; --bad-bg:#3a1c1c;
    /* v237: innebygde kontroller (nedtrekk, dato, avkrysning) følger mørk modus */
    color-scheme:dark;
    --krav-ok:#7fd6a4; --krav-mangler:#f2a36b; --krav-venter:#f2d56b; --krav-ikke:#9DBBCE;
  }
  /* v237: tekst på merker og brikker. De lyse variantene av grønn/gul/rød/blå
     brukes bare som tekstfarge her; flatene (--good-bg osv.) er uendret.
     Før var f.eks. gul tekst på mørkebrun flate (kontrast 2,4) og mørkeblå
     tekst på mørkeblå flate (planlagt, NS 3600, valgt fane) nesten uleselig. */
  :root:not([data-theme="light"]) .badge.tg0,
  :root:not([data-theme="light"]) .badge.st-closed,
  :root:not([data-theme="light"]) .badge.st-kommende,
  :root:not([data-theme="light"]) .badge.st-fullfort,
  :root:not([data-theme="light"]) .chip.good{ color:#7fd6a4; }
  :root:not([data-theme="light"]) .badge.tg1{ color:#b2dc86; }
  :root:not([data-theme="light"]) .badge.tg2,
  :root:not([data-theme="light"]) .badge.st-progress,
  :root:not([data-theme="light"]) .badge.st-pagaende,
  :root:not([data-theme="light"]) .badge.st-snart,
  :root:not([data-theme="light"]) .chip.warn{ color:#f2b866; }
  :root:not([data-theme="light"]) .badge.tg3,
  :root:not([data-theme="light"]) .badge.st-open,
  :root:not([data-theme="light"]) .badge.st-forfalt,
  :root:not([data-theme="light"]) .chip.bad{ color:#f59a9a; }
  :root:not([data-theme="light"]) .badge.st-planlagt,
  :root:not([data-theme="light"]) .badge.type-ns3600,
  :root:not([data-theme="light"]) .chip,
  :root:not([data-theme="light"]) .chip.blue,
  :root:not([data-theme="light"]) .settings-tabs button.active,
  :root:not([data-theme="light"]) .an-tabs button.active,
  :root:not([data-theme="light"]) .seg-toggle button.sel,
  :root:not([data-theme="light"]) .link-btn{ color:#a9cdee; }
  :root:not([data-theme="light"]) .an-tabs button.active,
  :root:not([data-theme="light"]) .seg-toggle button.sel{ border-color:#a9cdee; }
  /* v240: lenker i statusdashbordet, blå infoboks og tallene i statuskortene (mørk modus) */
  :root:not([data-theme="light"]) .sak-lenke,
  :root:not([data-theme="light"]) .info-boks-blaa{ color:#a9cdee; }
  :root:not([data-theme="light"]) .stat .v.good{ color:#7fd6a4; }
  :root:not([data-theme="light"]) .stat .v.warn{ color:#f2b866; }
  :root:not([data-theme="light"]) .stat .v.bad{ color:#f59a9a; }
  :root:not([data-theme="light"]) .report h2,
  :root:not([data-theme="light"]) .vl-kap h3{ color:#cfe3f4; }
  /* v247: body.tema-drift og body.tema-kjoper satte lyse --blue-100/--blue-050 og
     overstyrte de mørke verdiene fra :root. Resultat i mørk modus: lys tekst på
     lys flate (merker, valgt fane, tabeller i Veiledning, kontrast 1,1 til 1,7).
     Mørke varianter i hver portals egen fargetone. */
  :root:not([data-theme="light"]) body.tema-drift{ --blue-100:#12372f; --blue-050:#0f2a26; }
  :root:not([data-theme="light"]) body.tema-kjoper{ --blue-100:#2a2147; --blue-050:#1e1a38; }
  /* Forsidene (#landingWrap) har samme overstyring og samme feil: lyse kort med lys
     tekst. Mørke kortflater, og lys tekst der --blue-700/800 ellers var tekstfarge. */
  :root:not([data-theme="light"]) #landingWrap.tema-drift{ --blue-100:#12372f; --blue-050:#0f2a26; }
  :root:not([data-theme="light"]) #landingWrap.tema-kjoper{ --blue-100:#2a2147; --blue-050:#1e1a38; }
  :root:not([data-theme="light"]) #landingWrap :is(.pk-navn, .lf-eyebrow, .lhv-foot-label, .lhv-forstor,
    .pk-pris-boenhet, .pk-slider-verdi, .sm-doc-label, summary, th, .landing-badge-light, .landing-link, .landing-more a){ color:#cfe3f4; }
  :root:not([data-theme="light"]) #landingWrap .landing-section :is(.landing-badge, a:not(.btn), details a){ color:#cfe3f4; }
  :root:not([data-theme="light"]) #landingWrap .landing-section h3{ color:var(--ink); }
  :root:not([data-theme="light"]) #landingWrap.tema-drift .pk-knapp{ color:#cfe3f4; }
  :root:not([data-theme="light"]) #landingWrap .pk-spar{ color:#7fd6a4; }
  :root:not([data-theme="light"]) #landingWrap .lhv-pill.good{ color:#7fd6a4; }
  :root:not([data-theme="light"]) #landingWrap .lhv-pill.warn{ color:#f2b866; }
  :root:not([data-theme="light"]) #landingWrap .lhv-pill.bad{ color:#f59a9a; }
}
.sak-lenke{ color:var(--blue-700); }
.info-boks-blaa{ background:var(--blue-100); color:var(--blue-700); }
*{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans);
  font-size:14px; line-height:1.5; -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.disp{ font-family:var(--disp); font-weight:700; letter-spacing:-0.01em;}
.mono{font-family:var(--mono); font-variant-numeric:tabular-nums;}
button{font-family:inherit; cursor:pointer;}
input,select,textarea{font-family:inherit; font-size:inherit;}

/* ---- Login ---- */
.login-wrap{ min-height:100%; display:flex; align-items:center; justify-content:center; padding:24px; }
.login-card{ width:100%; max-width:360px; background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:28px; }
.login-brand{ display:flex; align-items:center; gap:10px; margin-bottom:22px; }
.login-brand .brand-mark{
  width:34px; height:34px; border-radius:9px; background:linear-gradient(155deg,var(--blue-600),var(--blue-800));
  display:flex; align-items:center; justify-content:center; font-family:var(--disp); font-weight:800;
  color:#fff; font-size:14px; flex:none;
}
.brand-mark-img{ width:60%; height:60%; display:block; }
.login-brand .name{ font-family:var(--disp); font-weight:700; font-size:15px; }
.login-brand .sub{ font-size:11px; color:var(--ink-soft); }
.login-card h1{ font-size:18px; margin:0 0 4px; }
.login-card p.lead{ margin:0 0 18px; color:var(--ink-soft); font-size:12.5px; }
.login-err{ background:var(--bad-bg); color:var(--bad); border-radius:8px; padding:9px 12px; font-size:12.5px; margin-bottom:14px; display:none; }
.login-err.show{ display:block; }
.login-note{ margin-top:16px; font-size:11.5px; color:var(--ink-soft); border-top:1px solid var(--line-soft); padding-top:14px; }
.link-btn{ display:block; width:100%; text-align:center; background:transparent; border:none; color:var(--blue-700); font-size:12px; font-weight:600; padding:12px 0 0; }
.link-btn:hover{ text-decoration:underline; }
.form-row .hint{ font-size:11px; color:var(--ink-soft); }

/* ---- Organisasjon (firmainnstillinger) ---- */
.logo-box{ display:flex; align-items:center; gap:16px; margin-bottom:18px; }
.logo-preview{ width:96px; height:96px; border-radius:10px; border:1px dashed var(--line); background:var(--paper);
  display:flex; align-items:center; justify-content:center; overflow:hidden; flex:none; }
.logo-preview img{ width:100%; height:100%; object-fit:contain; }
.logo-preview .ph{ font-size:10.5px; color:var(--ink-soft); text-align:center; padding:6px; }
.logo-actions{ display:flex; flex-direction:column; gap:6px; }
.logo-actions .row{ display:flex; gap:8px; flex-wrap:wrap; }

/* ---- Fargetema-velger (rapportforsidens 4 fargedesign) ---- */
.tema-swatch-row{ display:flex; gap:10px; margin:4px 0 16px; }
.tema-swatch{ width:32px; height:32px; border-radius:50%; border:2px solid transparent; cursor:pointer; padding:0; }
.tema-swatch.active{ border-color:var(--ink); box-shadow:0 0 0 2px var(--surface), 0 0 0 4px var(--ink); }

/* ---- App shell ---- */
.app{ display:none; min-height:100%; }
.app.show{ display:flex; }

/* v96: rail er nå "sticky" og ruller uavhengig av hovedinnholdet.
   Tidligere strakk .rail seg bare til samme høyde som raden (ingen egen
   overflow/posisjon), så HELE siden -- meny inkludert -- rullet som én
   enhet. Så lenge alle sider var korte nok til å holde seg innenfor
   skjermhøyden var dette usynlig, men v95s utvidede Oversikt-dashbord (nye
   "Dine moduler"/"Eksterne tjenester"-seksjoner) gjorde siden vesentlig
   lengre -- Pål meldte at "SHA-koordinering ble borte i venstre menyen" når
   han rullet ned på den nye, lengre Oversikt-siden, fordi HELE menyen
   rullet med ut av syne sammen med resten av siden. `position:sticky` +
   egen `overflow-y:auto`/`height:100vh` låser menyen til skjermen og lar
   den rulle for seg selv når nav-listen (nå 18 punkter) + footer ikke får
   plass -- løser både dette tilfellet og ville løst samme problem på kortere
   skjermer selv uten det lengre dashbordet. Uendret på mobil (.rail er
   `display:none` under 880px, se egen regel lenger ned). */
.rail{
  width:236px; flex:0 0 236px; background:var(--blue-900); color:#dbe6f0;
  display:flex; flex-direction:column; padding:18px 14px; gap:18px;
  position:sticky; top:0; height:100vh; overflow-y:auto;
}
.brand{ display:flex; align-items:center; gap:10px; padding:0 4px; }
.brand-mark{
  width:32px; height:32px; border-radius:8px; background:linear-gradient(155deg,var(--blue-600),var(--blue-800));
  display:flex; align-items:center; justify-content:center; font-family:var(--disp); font-weight:800;
  color:#fff; font-size:14px; flex:none; box-shadow:inset 0 0 0 1px rgba(255,255,255,.15);
}
.brand-name{ font-family:var(--disp); font-weight:700; font-size:14.5px; color:#fff; line-height:1.2;}
.brand-sub{ font-size:10.5px; color:#8fa5b8; letter-spacing:.04em; text-transform:uppercase; }

.side-switch{ display:flex; background:rgba(255,255,255,.06); border-radius:10px; padding:3px; gap:3px; }
.side-switch button{
  flex:1; border:none; background:transparent; color:#a9bccb; font-size:12.5px; font-weight:600;
  padding:8px 6px; border-radius:8px; transition:.15s;
}
.side-switch button.active{ background:var(--blue-700); color:#fff; box-shadow:0 1px 2px rgba(0,0,0,.25);}

.nav-group{ display:flex; flex-direction:column; gap:2px; }
.nav-label{ font-size:10.5px; text-transform:uppercase; letter-spacing:.07em; color:#6f8598; padding:10px 10px 4px;}
.nav-item{
  display:flex; align-items:center; gap:9px; padding:8px 10px; border-radius:8px; border:none;
  background:transparent; color:#c4d3e0; font-size:13px; text-align:left; width:100%;
}
.nav-item .dot{width:6px;height:6px;border-radius:50%;background:#4a6278; flex:none;}
.nav-item.active{ background:rgba(255,255,255,.09); color:#fff; font-weight:600; }
.nav-item.active .dot{ background:#7fb2e0; }

/* "Aktiv nå"-indikator (Tilganger-siden, v40) -- samme frittstående
   punkt-idé som .nav-item .dot over, men brukt inline i tabellceller. */
.aktiv-dot{ display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--good); box-shadow:0 0 0 2px var(--good-bg); margin-right:6px; vertical-align:middle; }
.nav-item .count{
  margin-left:auto; font-size:10.5px; background:rgba(255,255,255,.12); padding:1px 6px; border-radius:999px;
  font-family:var(--mono);
}
.nav-item .count.hot{ background:var(--bad); color:#fff; }

.rail-foot{ margin-top:auto; padding:10px; border-top:1px solid rgba(255,255,255,.08); display:flex; flex-direction:column; gap:8px;}
.rail-foot .who{ display:flex; gap:9px; align-items:center; }
.avatar{ width:26px;height:26px;border-radius:50%; background:var(--blue-600); color:#fff; display:flex;
  align-items:center; justify-content:center; font-size:11px; font-weight:700; flex:none;}
.rail-foot .name{ font-size:12.5px; color:#e2eaf1; font-weight:600; }
.rail-foot .role{ font-size:10.5px; color:#7d92a4; }
.rail-actions{ display:flex; gap:6px; }
.rail-actions .logout-btn{ flex:1; }
.logout-btn{ border:1px solid rgba(255,255,255,.15); background:transparent; color:#c4d3e0; font-size:11.5px;
  padding:6px 8px; border-radius:7px; }
.logout-btn:hover{ border-color:rgba(255,255,255,.35); }

.main{ flex:1; min-width:0; display:flex; flex-direction:column; }
.topbar{
  display:flex; align-items:center; gap:14px; padding:14px 26px; border-bottom:1px solid var(--line);
  background:var(--surface); flex-wrap:wrap;
}
.crumb{ font-size:12px; color:var(--ink-soft); }
.crumb b{ color:var(--ink); font-weight:600; }

.content{ padding:24px 26px 60px; max-width:1180px; width:100%; margin:0 auto; }
.page-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:18px; flex-wrap:wrap;}
.page-head h1{ font-size:22px; margin:0 0 4px; }
.page-head p{ margin:0; color:var(--ink-soft); font-size:13px; max-width:52ch; }

.btn{
  border:1px solid var(--line); background:var(--surface); color:var(--ink); padding:8px 14px; border-radius:8px;
  font-size:12.5px; font-weight:600; display:inline-flex; align-items:center; gap:6px; transition:.12s;
}
.btn:hover{ border-color:var(--blue-600); }
.btn-primary{ background:var(--blue-700); color:#fff; border-color:var(--blue-700); }
.btn-primary:hover{ background:var(--blue-800); border-color:var(--blue-800);}
.btn-sm{ padding:5px 10px; font-size:11.5px; border-radius:7px;}
.btn:disabled{ opacity:.45; cursor:not-allowed; }

.grid{ display:grid; gap:16px; }
.grid-3{ grid-template-columns:repeat(3,1fr); }
@media (max-width:820px){ .grid-3{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .grid-3{grid-template-columns:1fr;} }
.grid-2{ grid-template-columns:repeat(2,1fr); }
@media (max-width:560px){ .grid-2{grid-template-columns:1fr;} }

.card{ background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:16px; }
.stat{ display:flex; flex-direction:column; gap:6px; }
.stat .k{ font-size:11px; color:var(--ink-soft); text-transform:uppercase; letter-spacing:.05em;}
.stat .v{ font-family:var(--disp); font-size:26px; font-weight:800; }
.stat .d{ font-size:11.5px; color:var(--ink-soft); }
.stat .v.warn{ color:var(--warn); } .stat .v.bad{ color:var(--bad); } .stat .v.good{ color:var(--good); }

table{ width:100%; border-collapse:collapse; font-size:12.8px; }
th{ text-align:left; font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-soft);
    padding:8px 10px; border-bottom:1px solid var(--line); font-weight:600;}
td{ padding:10px; border-bottom:1px solid var(--line-soft); vertical-align:middle; }
tr:last-child td{ border-bottom:none; }
.table-wrap{ overflow-x:auto; position:relative; }
/* v84: handlingsknappen (siste kolonne, f.eks. "Rediger") kan havne utenfor
   synlig område når en tabell er bredere enn plassen den har -- brukeren må
   da oppdage at DET ER TABELLEN, ikke siden, som må scrolles sidelengs for
   å nå knappen. Låser derfor siste kolonne til høyre kant av scroll-området
   i alle tabeller, slik at handlingsknappen alltid er synlig og klikkbar. */
.table-wrap table th:last-child,
.table-wrap table td:last-child{
  position:sticky; right:0; background:var(--surface); z-index:1;
  box-shadow:-6px 0 6px -6px rgba(0,0,0,.18);
}
.code{ font-family:var(--mono); font-size:11.5px; color:var(--ink-soft); }

.badge{ display:inline-flex; align-items:center; gap:5px; padding:2px 8px; border-radius:999px; font-size:11px; font-weight:700; font-family:var(--mono);}
.badge.tg0{ background:var(--good-bg); color:var(--good); }
.badge.tg1{ background:var(--good-light-bg); color:#46741f; }
.badge.tg2{ background:var(--warn-bg); color:var(--warn); }
.badge.tg3{ background:var(--bad-bg); color:var(--bad); }
.badge.st-open{ background:var(--bad-bg); color:var(--bad); }
.badge.st-progress{ background:var(--warn-bg); color:var(--warn); }
.badge.st-closed{ background:var(--good-bg); color:var(--good); }
.badge.st-forfalt{ background:var(--bad-bg); color:var(--bad); }
.badge.st-snart{ background:var(--warn-bg); color:var(--warn); }
.badge.st-kommende{ background:var(--good-bg); color:var(--good); }
.badge.st-planlagt{ background:var(--blue-100); color:var(--blue-700); }

/* ---- Årshjul (driftsoppgaver) ---- */
.arshjul-wheel-wrap{ display:flex; justify-content:center; margin:10px 0 6px; }
.ah-wheel{ display:flex; flex-direction:column; align-items:center; gap:14px; }
.ah-spoke{ stroke:var(--line); stroke-width:1; }
.ah-mlabel{ font-family:var(--mono); font-size:10px; fill:var(--ink-soft); }
.ah-ring-outer{ fill:none; stroke:var(--line); stroke-width:1.5; }
.ah-ring-inner{ fill:var(--surface); stroke:var(--line); stroke-width:1.5; }
.ah-dot{ stroke:var(--surface); stroke-width:1.5; }
.ah-dot.ah-forfalt{ fill:var(--bad); }
.ah-dot.ah-snart{ fill:var(--warn); }
.ah-dot.ah-kommende{ fill:var(--good); }
.ah-dot.ah-planlagt{ fill:var(--blue-700); }
.ah-legend{ display:flex; gap:16px; flex-wrap:wrap; justify-content:center; font-size:11.5px; color:var(--ink-soft); }
.ah-legend span{ display:inline-flex; align-items:center; gap:6px; }
.ah-legend i.ah-dot{ display:inline-block; width:9px; height:9px; border-radius:50%; stroke:none; }

.two-col{ display:grid; grid-template-columns:280px 1fr; gap:18px; align-items:flex-start; }
@media (max-width:760px){ .two-col{ grid-template-columns:1fr; } }

.bygg-list{ display:flex; flex-direction:column; gap:6px; }
.bygg-item{ display:flex; flex-direction:column; gap:2px; text-align:left; padding:10px 12px; border-radius:10px;
  border:1px solid var(--line); background:var(--surface); }
.bygg-item.active{ border-color:var(--blue-700); background:var(--blue-050); }
.bygg-item .nm{ font-weight:700; font-size:13px; }
.bygg-item .ad{ font-size:11.5px; color:var(--ink-soft); }
.chip{ font-size:10px; padding:2px 6px; border-radius:6px; background:var(--blue-100); color:var(--blue-700); font-weight:600;}
.chip.bad{ background:var(--bad-bg); color:var(--bad); }
.chip.good{ background:var(--good-bg); color:var(--good); }
.chip.warn{ background:var(--warn-bg); color:var(--warn); }
.chip.blue{ background:var(--blue-100); color:var(--blue-700); }

.tree{ display:flex; flex-direction:column; gap:2px; }
.tree button{ display:flex; align-items:center; gap:8px; width:100%; text-align:left; padding:8px 10px;
  border-radius:8px; border:none; background:transparent; color:var(--ink); font-size:12.8px; }
.tree button:hover{ background:var(--blue-050); }
.tree button.active{ background:var(--blue-700); color:#fff; font-weight:600; }
.tree .ns{ font-family:var(--mono); font-size:10.5px; color:var(--ink-soft); flex:none; width:30px;}
.tree button.active .ns{ color:#cfe0f0; }

.form-row{ display:flex; flex-direction:column; gap:5px; margin-bottom:12px; }
.form-row label{ font-size:11.5px; font-weight:600; color:var(--ink-soft); }
.form-row select, .form-row textarea, .form-row input{
  border:1px solid var(--line); border-radius:8px; padding:8px 10px; background:var(--paper); color:var(--ink);
}
.card > textarea, .modal-card > textarea, .modal-card .card > textarea, .modal-card > div > textarea, .modal-card > div > .card > textarea{
  width:100%; box-sizing:border-box; border:1px solid var(--line); border-radius:8px; padding:8px 10px; background:var(--paper); color:var(--ink); font:inherit; resize:vertical;
}
.modal-card .card > div > input[type=text]{ border:1px solid var(--line); border-radius:8px; padding:6px 8px; background:var(--paper); color:var(--ink); }
.seg{ display:flex; gap:6px; flex-wrap:wrap; }
.seg button{ border:1px solid var(--line); background:var(--surface); padding:6px 12px; border-radius:999px; font-size:12px; font-weight:600; color:var(--ink-soft);}
/* Tilstandsgrad-knappene fargekodes konsekvent, både i hvilestilling
   (tonet omriss, samme språk som .badge.tgX) og valgt (heldekket) -- etter
   ønske: TG0 grønn, TG1 lys grønn, TG2 gul/oransje, TG3 rød, TGIU grå. */
.seg button.tg0{ border-color:var(--good); background:var(--good-bg); color:var(--good); }
.seg button.tg1{ border-color:var(--good-light); background:var(--good-light-bg); color:var(--good-light); }
.seg button.tg2{ border-color:var(--warn); background:var(--warn-bg); color:var(--warn); }
.seg button.tg3{ border-color:var(--bad); background:var(--bad-bg); color:var(--bad); }
.seg button.tgIU{ border-color:var(--grey); background:var(--grey-bg); color:var(--grey); }
.seg button.sel{ border-color:var(--blue-700); background:var(--blue-700); color:#fff; }
.seg button.sel.tg0{ border-color:var(--good); background:var(--good); color:#fff; }
.seg button.sel.tg1{ border-color:var(--good-light); background:var(--good-light); color:#fff; }
.seg button.sel.tg2{ border-color:var(--warn); background:var(--warn); color:#fff; }
.seg button.sel.tg3{ border-color:var(--bad); background:var(--bad); color:#fff; }
.seg button.sel.tgIU{ border-color:var(--grey); background:var(--grey); color:#fff; }
.badge.tgIU{ background:var(--line-soft); color:var(--ink-soft); }

/* ---- Hierarkisk NS 3451-tre (tilstandsanalyse) ----
   Kollapsbart som standard (hovedgruppe/undergruppe lukket, kun ekspander-
   knapp + navn synlig) i stedet for hele treet flatt utrullet, pluss et
   søkefelt øverst -- se renderKontrollpunktTre() i app.js. Etter mønster fra
   en konkurrents tilsvarende kontrollpunkt-/bygningsdel-oversikt, etter at
   NS 3451-utvidelsen gjorde det gamle, alltid-utrullede treet upraktisk
   langt. */
.ns-tree{ display:flex; flex-direction:column; gap:2px; max-height:60vh; overflow-y:auto; }
.ns-tree-sok{ margin-bottom:10px; }
.ns-tree-sok input{
  width:100%; border:1px solid var(--line); border-radius:8px; padding:7px 10px;
  background:var(--paper); color:var(--ink); font-size:12.5px;
}
.ns-tree-sok input:focus{ outline:none; border-color:var(--blue-600); }
.ns-toggle{ display:flex; align-items:center; gap:6px; width:100%; text-align:left; border:none; background:transparent; cursor:pointer; border-radius:6px; }
.ns-toggle:hover{ background:var(--blue-050); }
.ns-caret{ display:inline-block; width:11px; flex:none; color:var(--ink-soft); font-size:11px; }
.ns-l1{ margin-top:8px; }
.ns-l1:first-child{ margin-top:0; }
.ns-l1-label{ font-size:10.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); font-weight:700; padding:6px 4px; }
.ns-l1-children{ margin-left:2px; }
.ns-l2{ margin-left:4px; }
.ns-l2-label{ font-size:11.5px; font-weight:600; color:var(--ink); padding:5px 6px; }
.ns-l2-children{ margin-left:4px; }
.ns-l3{ display:flex; align-items:center; gap:7px; width:100%; text-align:left; padding:7px 8px 7px 16px;
  border-radius:8px; border:none; background:transparent; color:var(--ink); font-size:12.5px; }
.ns-l3:hover{ background:var(--blue-050); }
.ns-l3.active{ background:var(--blue-700); color:#fff; font-weight:600; }
.ns-l3 .kode{ font-family:var(--mono); font-size:10.5px; color:var(--ink-soft); flex:none; width:28px; display:inline-block; margin-right:6px; }
.ns-l3.active .kode{ color:#cfe0f0; }
.tgdot{ width:9px; height:9px; border-radius:50%; flex:none; background:var(--line); }
.tgdot.tg0{ background:var(--good); }
.tgdot.tg1{ background:var(--good-light); }
.tgdot.tg2{ background:var(--warn); }
.tgdot.tg3{ background:var(--bad); }
.tgdot.tgIU{ background:var(--grey); }
.ns-l3.ns-check{ cursor:pointer; }
.ns-l3.ns-check input{ margin:0; flex:none; }
/* Legg til/fjern-veksling per kontrollpunkt når en sjekkliste (mal) er
   aktiv under befaring, se kontrollTreCfg.renderLeaf i fag-analyse-detalj. */
.ns-l3-toggle{
  margin-left:auto; flex:none; width:20px; height:20px; border-radius:6px;
  display:flex; align-items:center; justify-content:center; font-size:12px;
  font-weight:700; color:var(--ink-soft); background:var(--blue-050);
}
.ns-l3-toggle:hover{ background:var(--blue-100); color:var(--ink); }
.ns-l3.active .ns-l3-toggle{ background:rgba(255,255,255,.18); color:#fff; }

/* ---- Kostnadslinjer ---- */
.kost-list{ display:flex; flex-direction:column; gap:6px; margin-bottom:10px; }
.kost-row{ display:flex; gap:6px; align-items:center; }
.kost-row input{ border:1px solid var(--line); border-radius:7px; padding:6px 8px; background:var(--paper); color:var(--ink); font-size:12px; flex:1; min-width:0; }
.kost-row button{ border:1px solid var(--line); background:var(--surface); color:var(--ink-soft); border-radius:7px; padding:5px 8px; font-size:11px; flex:none; }
.kost-row button:hover{ border-color:var(--bad); color:var(--bad); }
.kost-btn-row{ display:flex; gap:6px; flex-wrap:wrap; }

/* ---- AI-forslag til kostnadsoverslag (ikke lagret før bruker trykker "+ Legg til") ---- */
.kost-forslag{ display:flex; flex-direction:column; gap:6px; margin-bottom:12px; padding:10px; border:1px dashed var(--line); border-radius:9px; background:var(--surface); }
.kost-forslag-hint{ color:var(--ink-soft); font-size:12px; }
.kost-row-forslag{ background:var(--paper); border:1px solid var(--line); border-radius:7px; padding:6px 8px; }
.kost-row-forslag > div{ font-size:13px; flex:1; min-width:0; }
.kost-row-forslag button{ border:1px solid var(--line); background:var(--surface); color:var(--ink-soft); border-radius:7px; padding:5px 8px; font-size:11px; flex:none; }
.kost-row-forslag button:hover{ border-color:var(--accent, var(--line)); color:var(--ink); }

/* ---- Synlig AI-hint (f.eks. i Bilder -- kobling til Vurdering-AI-en uten
   at Bilder får en egen, separat AI-handling) ---- */
.ai-hint{ display:flex; align-items:flex-start; gap:6px; background:var(--blue-050); border:1px solid var(--blue-100); border-radius:9px; padding:8px 10px; margin-bottom:10px; font-size:12px; line-height:1.4; color:var(--ink-soft); }
.ai-hint b{ color:var(--ink); }

/* ---- Bildegalleri ---- */
.bilde-gal{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:10px; }
.bilde-thumb{ position:relative; width:84px; height:84px; border-radius:8px; overflow:hidden; border:1px solid var(--line); }
.bilde-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
/* v253: bildekort på sak/oppgave med tekst til bildet */
.sbk{ position:relative; width:200px; display:flex; flex-direction:column; gap:6px; padding:8px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.sbk img{ width:100%; height:150px; object-fit:cover; border-radius:6px; display:block; }
.sbk textarea{ width:100%; font-size:12.5px; resize:vertical; }
.sbk-rad{ display:flex; flex-wrap:wrap; gap:4px; }
.sbk-forside{ position:absolute; top:12px; left:12px; padding:2px 8px; border-radius:10px; background:var(--blue-700); color:#fff; font-size:11px; font-weight:700; }
.sbk-tekst{ font-size:12.5px; white-space:pre-wrap; }
.bilde-del{ position:absolute; top:3px; right:3px; width:20px; height:20px; border-radius:50%; border:none;
  background:rgba(0,0,0,.55); color:#fff; font-size:11px; line-height:1; display:flex; align-items:center; justify-content:center; }
.bilde-del:hover{ background:var(--bad); }
.bilde-markor-btn{ position:absolute; left:3px; bottom:3px; min-width:20px; height:20px; padding:0 5px; border-radius:10px; border:none;
  background:rgba(0,0,0,.55); color:#fff; font-size:10px; font-weight:700; line-height:20px; }
.bilde-markor-btn:hover{ background:var(--blue-700); }
.bilde-markor-dot{ position:absolute; width:22px; height:22px; border-radius:50%; background:#dc2626; color:#fff; font-size:11px;
  font-weight:700; display:flex; align-items:center; justify-content:center; transform:translate(-50%,-50%); cursor:move;
  box-shadow:0 1px 4px rgba(0,0,0,.4); z-index:2; }
/* v31: pil-markører -- endepunkt-håndtak (liten diamant) for å justere
   pilspissen uten å tegne pilen på nytt, pluss modusbryteren (Punkt/Pil)
   over bildet i markør-editoren. */
.bilde-markor-tip{ position:absolute; width:14px; height:14px; background:#dc2626; border:2px solid #fff;
  transform:translate(-50%,-50%) rotate(45deg); cursor:move; box-shadow:0 1px 4px rgba(0,0,0,.4); z-index:2; }
.bilde-markor-svg{ position:absolute; left:0; top:0; width:100%; height:100%; pointer-events:none; z-index:1; }
.bilde-markor-modus{ display:flex; gap:6px; margin-bottom:8px; }
.bilde-markor-modus button.sel{ background:var(--blue-700); color:#fff; border-color:var(--blue-700); }

.finn-list{ display:flex; flex-direction:column; gap:8px; margin-top:14px; }
.finn{ border:1px solid var(--line); border-radius:10px; padding:10px 12px; display:flex; gap:10px; align-items:flex-start; background:var(--paper); }
.finn .body{ flex:1; min-width:0; }
.finn .pt{ font-weight:700; font-size:12.8px; }
.finn .kom{ color:var(--ink-soft); font-size:12px; margin-top:2px; }

.rounde-item{ display:flex; align-items:center; gap:12px; padding:10px 4px; border-bottom:1px solid var(--line-soft); }
.rounde-item:last-child{border-bottom:none;}
.rounde-item .txt{ flex:1; min-width:0; }
.rounde-item .txt .t1{ font-weight:600; font-size:12.8px; }
.rounde-item .txt .t2{ font-size:11px; color:var(--ink-soft); }
.toggle3{ display:flex; border:1px solid var(--line); border-radius:8px; overflow:hidden; flex:none; }
.toggle3 button{ border:none; background:var(--surface); padding:6px 10px; font-size:11px; font-weight:700; color:var(--ink-soft); border-right:1px solid var(--line);}
.toggle3 button:last-child{border-right:none;}
.toggle3 button.ok.sel{ background:var(--good-bg); color:var(--good); }
.toggle3 button.av.sel{ background:var(--bad-bg); color:var(--bad); }
.toggle3 button.hp.sel{ background:var(--line-soft); color:var(--ink-soft); }

.section-title{ font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); font-weight:700; margin:22px 0 10px; }
.section-title:first-child{ margin-top:0; }

.callout{ border:1px dashed var(--line); border-radius:10px; padding:12px 14px; font-size:12.3px; color:var(--ink-soft); display:flex; gap:10px; align-items:flex-start;}
.callout b{ color:var(--ink); }
.empty{ color:var(--ink-soft); font-size:12.5px; padding:18px 4px; }

.report{ background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:22px; }
.report h2{ font-size:17px; margin:0 0 2px; color:var(--blue-800);}
.report .meta{ font-size:11.5px; color:var(--ink-soft); border-bottom:2px solid var(--blue-700); padding-bottom:10px; margin-bottom:14px;}
.report table{font-size:12px;}

.toast{
  position:fixed; bottom:20px; left:50%; transform:translateX(-50%) translateY(20px);
  background:var(--blue-900); color:#fff; padding:11px 18px; border-radius:10px; font-size:12.5px; font-weight:600;
  box-shadow:0 8px 24px rgba(0,0,0,.25); opacity:0; pointer-events:none; transition:.25s; z-index:50; display:flex; gap:8px; align-items:center;
}
.toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }
.toast.err{ background:var(--bad); }

/* ---- Tilstandsanalyser (liste + status) ---- */
.an-tabs{ display:flex; gap:6px; border-bottom:1px solid var(--line); margin-bottom:16px; }
.an-tabs button{ border:none; background:transparent; padding:9px 4px; font-size:13px; font-weight:600; color:var(--ink-soft);
  border-bottom:2px solid transparent; margin-bottom:-1px; }
.an-tabs button.active{ color:var(--blue-700); border-bottom-color:var(--blue-700); }
.badge.st-pagaende{ background:var(--warn-bg); color:var(--warn); }
.badge.st-fullfort{ background:var(--good-bg); color:var(--good); }
.badge.type-ns3424{ background:var(--line-soft); color:var(--ink-soft); }
.badge.type-ns3600{ background:var(--blue-100); color:var(--blue-700); }
.an-row-bygg{ font-weight:700; font-size:13px; }
.an-row-sub{ font-size:11.5px; color:var(--ink-soft); }

/* ---- Innstillinger (driftsiden) -- venstre fane-liste + høyre kort,
   samme oppbygning som Hemvar sin Innstillinger-side (se README). ---- */
.settings-layout{ display:flex; gap:22px; align-items:flex-start; flex-wrap:wrap; }
.settings-tabs{ display:flex; flex-direction:column; gap:2px; min-width:200px; }
.settings-tabs button{ text-align:left; border:none; background:transparent; padding:10px 12px; border-radius:8px;
  font-size:12.5px; font-weight:600; color:var(--ink-soft); }
.settings-tabs button:hover{ background:var(--blue-050); }
.settings-tabs button.active{ background:var(--blue-100); color:var(--blue-700); }
.settings-content{ flex:1; min-width:280px; }
.settings-field{ display:flex; justify-content:space-between; gap:16px; padding:10px 0; border-bottom:1px solid var(--line-soft); }
.settings-field:last-child{ border-bottom:none; }
.settings-field .k{ color:var(--ink-soft); font-size:12.5px; }
.settings-field .v{ font-weight:600; font-size:13px; text-align:right; }

/* ---- Dokumentasjon (forarbeid/etterarbeid) ---- */
.dok-banner{ font-size:13px; font-weight:700; color:var(--ink); margin:22px 0 10px; }
.dok-banner:first-child{ margin-top:0; }
.dok-banner .sub{ display:block; font-size:11.5px; font-weight:400; color:var(--ink-soft); margin-top:2px; }
.dok-collapse{ border:1px solid var(--line); border-radius:10px; margin-bottom:10px; overflow:hidden; background:var(--surface); }
.dok-collapse > summary{ list-style:none; cursor:pointer; padding:11px 14px; font-size:12.5px; font-weight:700; color:var(--ink);
  display:flex; align-items:center; justify-content:space-between; gap:10px; }
.dok-collapse > summary::-webkit-details-marker{ display:none; }
.dok-collapse > summary::after{ content:"›"; transform:rotate(90deg); color:var(--ink-soft); font-size:16px; transition:.15s; }
.dok-collapse[open] > summary::after{ transform:rotate(-90deg); }
.dok-collapse > summary:hover{ background:var(--blue-050); }
.dok-collapse > summary .sub{ display:block; font-size:11px; font-weight:400; color:var(--ink-soft); margin-top:2px; }
.dok-collapse-body{ padding:4px 14px 14px; border-top:1px solid var(--line-soft); }
.dok-collapse-body .form-row{ margin-top:12px; margin-bottom:0; }
.dok-collapse-body .form-row:first-child{ margin-top:12px; }
.dok-grid{ display:grid; grid-template-columns:1fr 1fr; gap:0 14px; }
.dok-sjekk-row{ display:flex; align-items:center; gap:10px; padding:7px 0; border-bottom:1px solid var(--line-soft); font-size:12.5px; }
.dok-sjekk-row:last-child{ border-bottom:none; }
.dok-sjekk-row input[type=checkbox]{ flex:none; width:15px; height:15px; }
.dok-sjekk-row .navn{ flex:0 0 230px; color:var(--ink); }
.dok-sjekk-row input[type=text]{ flex:1; min-width:0; border:1px solid var(--line); border-radius:7px; padding:6px 8px;
  background:var(--paper); color:var(--ink); font-size:12px; }
.dok-fil-kategori{ margin-bottom:14px; }
.dok-fil-kategori .kat-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:12.5px; font-weight:600; margin-bottom:6px; }
.dok-fil-rad{ display:flex; align-items:center; gap:8px; font-size:12px; padding:5px 0; color:var(--ink-soft); }
.dok-fil-rad .navn{ color:var(--ink); flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dok-fil-rad button{ border:1px solid var(--line); background:var(--surface); color:var(--ink-soft); border-radius:7px; padding:3px 7px; font-size:11px; flex:none; }
.dok-fil-rad button:hover{ border-color:var(--bad); color:var(--bad); }

/* ---- Modal ---- */
.modal-overlay{
  position:fixed; inset:0; background:rgba(15,23,32,.5); display:flex; align-items:center; justify-content:center;
  /* v33: Leaflet sitt kart (saksoversiktKart, .leaflet-top/.leaflet-bottom
     med zoom-knappene) bruker z-index opptil 1000 i sin egen CSS -- en
     modal åpnet over et kart (f.eks. "+ Ny sak" på Fagside -> Saker) må
     derfor ligge klart over det, ikke bare over vanlig sideinnhold. Fortsatt
     godt under hjelp-widgeten (9998/9999) og enhetsvisning (10000/10001),
     som skal flyte over absolutt alt, inkludert åpne modaler. */
  padding:20px; z-index:1500;
}
.modal-card{ background:var(--surface); border-radius:14px; padding:22px; width:100%; max-width:440px; max-height:88vh; overflow-y:auto;
  box-shadow:0 20px 60px rgba(0,0,0,.3); }
.modal-card h3{ margin:0 0 14px; font-size:16px; }
.modal-close{ position:absolute; }

/* ---- v100: Fellesarbeidskalender (koordinator-ukevisning) ---- */
.kal-wrap{ overflow-x:auto; }
.kal-head-row{ display:grid; grid-template-columns:160px repeat(7, minmax(110px, 1fr)); gap:2px; margin-bottom:6px; }
.kal-corner{ }
.kal-daycol{ font-size:11.5px; font-weight:700; color:var(--ink-soft); text-align:center; padding:4px 0; }
.kal-lane{ display:grid; grid-template-columns:160px repeat(7, minmax(110px, 1fr)); gap:2px; margin-bottom:8px; align-items:start; }
.kal-person{ font-size:12.5px; font-weight:700; padding:8px 8px 8px 0; }
.kal-person .badge{ font-weight:600; background:var(--blue-050,#F3F6F8); color:var(--ink-soft); margin-top:3px; }
.kal-days{ grid-column:2 / span 7; display:grid; grid-template-columns:repeat(7, 1fr); grid-auto-rows:34px; position:relative; gap:2px; }
.kal-daycell{ grid-row:1 / -1; border:1px solid var(--line); border-radius:4px; background:var(--surface); }
.kal-task{
  border-radius:6px; padding:4px 8px; font-size:12px; font-weight:600; color:#fff; overflow:hidden;
  white-space:nowrap; text-overflow:ellipsis; cursor:pointer; align-self:center; height:26px; line-height:18px;
}
/* v291: tjenestefarge = bakgrunn, status = stripe til venstre (box-shadow satt i JS) */
.kal-task{ padding-left:14px; }
.kal-task .kal-kode{ font-size:10.5px; letter-spacing:.02em; opacity:.95; }
.kal-task.kal-avlyst{ text-decoration:line-through; opacity:.6; }
.kal-task.kal-dimmet{ opacity:.18; }
.kal-chip{ display:inline-block; min-width:26px; padding:1px 6px; border-radius:5px; font-size:10.5px; font-weight:700; text-align:center; line-height:16px; vertical-align:middle; box-shadow:0 0 0 1px rgba(0,0,0,.18); }
.kal-type-chip-holder{ display:inline-block; margin-left:8px; vertical-align:middle; }
.kal-forklaring summary{ cursor:pointer; font-weight:700; font-size:13px; }
.kal-forkl-gruppe{ margin-top:10px; }
.kal-forkl-tittel{ font-size:11.5px; font-weight:700; color:var(--ink-soft); text-transform:uppercase; letter-spacing:.04em; margin-bottom:4px; }
.kal-forkl-liste{ display:flex; flex-wrap:wrap; gap:6px; }
.kal-forkl-knapp{ border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:8px; padding:4px 8px; font-size:12.5px; cursor:pointer; }
.kal-forkl-knapp.sel{ border-color:var(--blue-700); box-shadow:0 0 0 2px var(--blue-700) inset; }
.kal-forkl-status{ font-size:12.5px; display:inline-flex; align-items:center; gap:4px; margin-right:10px; }
.kal-forkl-stripe{ display:inline-block; width:7px; height:16px; border-radius:2px; }
.kal-task.kal-continues-left::before{ content:"\25c0 "; }
.kal-task.kal-continues-right::after{ content:" \25b6"; float:right; }
@media (max-width:820px){
  .kal-head-row, .kal-lane{ grid-template-columns:110px repeat(7, minmax(60px, 1fr)); }
  .kal-person{ font-size:11px; }
}

.seg-toggle{ display:flex; gap:6px; margin-bottom:14px; }
.seg-toggle button{ flex:1; border:1px solid var(--line); background:var(--surface); padding:8px 10px; border-radius:8px;
  font-size:12px; font-weight:600; color:var(--ink-soft); }
.seg-toggle button.sel{ border-color:var(--blue-700); background:var(--blue-050); color:var(--blue-700); }
.back-link{ display:inline-flex; align-items:center; gap:5px; font-size:12.5px; color:var(--ink-soft); border:none; background:transparent; padding:0 0 12px; }
.back-link:hover{ color:var(--blue-700); }

.mobile-tabs{ display:none; }
@media (max-width:820px){
  .rail{ display:none; }
  .mobile-tabs{
    display:flex; gap:4px; background:var(--surface); border-bottom:1px solid var(--line);
    padding:8px 14px; overflow-x:auto;
  }
  .mobile-tabs button{ border:1px solid var(--line); background:var(--paper); padding:7px 12px; border-radius:999px; font-size:12px; font-weight:600; color:var(--ink-soft); white-space:nowrap;}
  .mobile-tabs button.active{ background:var(--blue-700); color:#fff; border-color:var(--blue-700); }
}

/* ==========================================================================
   Driftsside-tema: TIDLIGERE hadde driftsiden (".app.tema-drift" / satt av
   setSide() i app.js, og "body.drift-domene" for innloggingsskjermen på
   drift.-adressen) en egen, varm Hemvar-inspirert fargedrakt. Etter at begge
   portaler ble redesignet til å speile den ekte markedsføringssiden
   https://takst-befaringssenteret.no, deler fag- og driftsiden nå SAMME
   navyblå palett (se :root øverst i denne filen) -- ingen egne
   overstyringsregler trengs lenger her, og selve klassene er fjernet fra
   app.js/setSide() siden de ikke lenger har noen visuell effekt.
   ========================================================================== */

/* ==========================================================================
   Landingssider (portal.* og drift.*) -- vises FØR innlogging, se
   "#landingWrap" i index.html og showLanding()/showLoginForm() i app.js.
   Fargepaletten er fortsatt den ekte navyblå fra https://takst-befaringssenteret.no
   (samme --blue-*-tokens som resten av appen -- bevisst IKKE byttet ut),
   men selve LAYOUT-mønstrene her er hentet fra en gjennomgang av hvordan
   konkurrenten Fagvar strukturerer sin landingsside: pille-formede knapper
   og badges, en tallrad som "flyter" over grensen mellom hero og neste
   seksjon, en egen "Slik fungerer det"-steg-seksjon med egne (rendyrkede
   CSS-baserte, ikke ekte skjermbilder) mock-ups av selve appen, mykere/
   fargede kort uten kantlinje, og en avsluttende fargepanel-CTA før bunnteksten.
   Ingen fotografi eller tekst er kopiert fra Fagvar -- kun de strukturelle
   layout-ideene, gjenskapt med vår egen navyblå palett og eget innhold.
   ========================================================================== */
.landing{ min-height:100%; background:var(--paper); }
.landing-topbar{ background:var(--blue-900); color:var(--landing-topbar-ink); font-size:14px; }
.landing-topbar-inner{
  max-width:1180px; margin:0 auto; padding:7px 26px; display:flex; gap:22px; flex-wrap:wrap;
}
.landing-header{ background:var(--surface); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:5; }
.landing-header-inner{
  max-width:1180px; margin:0 auto; padding:14px 26px; display:flex; align-items:center;
  justify-content:space-between; gap:18px; flex-wrap:wrap;
}
.landing-nav{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.landing-nav a{ font-size:14.4px; color:var(--ink-soft); font-weight:600; }
.landing-nav a:hover{ color:var(--blue-700); }
/* Pille-formede knapper -- kun på landingssiden, resten av appen (dashboard
   osv.) bruker fortsatt den vanlige .btn-formen med 8-10px radius. */
.landing .btn{ border-radius:999px; }

.landing-badge{
  display:inline-flex; align-items:center; gap:6px; background:var(--blue-100); color:var(--blue-700);
  font-size:14px; font-weight:700; letter-spacing:.02em; padding:6px 14px; border-radius:999px;
  margin-bottom:14px;
}
.landing-badge-light{ background:rgba(255,255,255,.14); color:#fff; }

.landing-hero{
  background:linear-gradient(155deg,var(--blue-900),var(--blue-700));
  color:#fff; padding:72px 26px 96px;
}
.landing-hero .landing-badge{ background:rgba(255,255,255,.14); color:#fff; }
.landing-hero h1{ font-size:40px; color:#fff; margin:0 0 14px; }
.landing-tagline{ font-size:18.4px; color:var(--landing-soft-ink); max-width:56ch; margin:0 auto 28px; line-height:1.55; }
.landing-cta-row{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.landing-trial-note{ margin:14px 0 0; font-size:14.4px; color:var(--landing-softer-ink); }

/* v72: hero i to kolonner (tekst + produktutsnitt) i stedet for sentrert
   tekstblokk -- gir et konkret bilde av produktet i hero i stedet for bare
   løfter, og lar Fag/Drift vise ulikt innhold i visningen. */
.landing-hero-inner{ max-width:1180px; margin:0 auto; display:grid; grid-template-columns:1.05fr .95fr; gap:48px; align-items:center; text-align:left; }
.landing-hero-copy .landing-cta-row{ justify-content:flex-start; }
.landing-hero-copy .landing-tagline{ margin:0 0 28px; }
.lhv-frame{ background:var(--blue-900); border-radius:16px; overflow:hidden; box-shadow:0 30px 60px rgba(8,31,53,.35); }
.lhv-dots{ display:flex; gap:6px; padding:12px 16px; background:rgba(0,0,0,.15); }
.lhv-dots span{ width:9px; height:9px; border-radius:50%; }
.lhv-dots span:nth-child(1){ background:#e06a5a; }
.lhv-dots span:nth-child(2){ background:#e0b65a; }
.lhv-dots span:nth-child(3){ background:#5ab87a; }
.lhv-body{ background:var(--blue-050); padding:22px; }
.lhv-label{ font-size:11px; font-weight:700; color:var(--ink-soft); letter-spacing:.04em; margin-bottom:10px; text-transform:uppercase; }
.lhv-row{ display:flex; align-items:center; justify-content:space-between; gap:8px; background:var(--surface); border:1px solid var(--line-soft); border-radius:9px; padding:11px 14px; margin-bottom:9px; }
.lhv-row:last-of-type{ margin-bottom:0; }
.lhv-row-label{ font-size:13px; font-weight:600; color:var(--ink); }
.lhv-pill{ font-size:11.5px; font-weight:700; padding:3px 10px; border-radius:999px; }
.lhv-pill.warn{ background:var(--warn-bg); color:var(--warn); }
.lhv-pill.good{ background:var(--good-bg); color:var(--good); }
.lhv-pill.bad{ background:var(--bad-bg); color:var(--bad); }
.lhv-foot{ margin-top:16px; display:flex; align-items:center; justify-content:space-between; gap:10px; background:var(--surface); border:1px dashed var(--line); border-radius:9px; padding:12px 14px; }
.lhv-foot-label{ font-size:12.5px; font-weight:700; color:var(--blue-700); }
@media (max-width:900px){
  .landing-hero-inner{ grid-template-columns:1fr; text-align:center; }
  .landing-hero-copy .landing-cta-row{ justify-content:center; }
  .landing-hero-visual{ max-width:460px; margin:0 auto; }
}
.btn-lg{ padding:13px 26px; font-size:13.5px; }
.btn-lg.btn{ background:rgba(255,255,255,.08); color:#fff; border-color:rgba(255,255,255,.35); }
.btn-lg.btn:hover{ border-color:#fff; }
.btn-lg.btn-primary{ background:#fff; color:var(--blue-800); border-color:#fff; }
.btn-lg.btn-primary:hover{ background:#e9f0f4; }

/* Tallrad rett under hero, "flytende" kort som overlapper grensen mellom
   hero (mørk) og seksjonen under (lys) -- samme trick som Fagvar bruker for
   sin 40%/87%-rad. */
.landing-stats-wrap{ padding:0 26px; margin-top:-48px; position:relative; z-index:2; }
.landing-stats{
  max-width:900px; margin:0 auto; display:flex; justify-content:center;
  gap:16px; flex-wrap:wrap;
}
.landing-stat{
  display:flex; align-items:center; gap:14px; text-align:left; min-width:220px;
  background:var(--blue-900); border:1px solid var(--blue-700); border-radius:20px;
  padding:14px 22px; box-shadow:0 12px 32px rgba(8,31,53,.18);
}
.landing-stat-icon{
  flex:0 0 44px; width:44px; height:44px; border-radius:12px;
  background:rgba(62,124,168,.18); color:var(--blue-600);
  display:flex; align-items:center; justify-content:center;
}
.landing-stat-icon svg{ width:24px; height:24px; }
.landing-stat-text{ display:block; }
.landing-stat b{ display:block; font-family:var(--disp); font-size:22px; line-height:1.15; color:#fff; }
.landing-stat span{ font-size:14px; color:var(--landing-softer-ink); }
/* Tre rubrikker på samme linje på bred skjerm; brytes på smalere skjermer. */
@media (min-width:1000px){
  .landing-stats{ max-width:1240px; flex-wrap:nowrap; }
  .landing-stat{ flex:1 1 0; min-width:0; padding:14px 20px; }
}

.landing-section{ padding:64px 26px 56px; }
.landing-section-inner{ max-width:1180px; margin:0 auto; }
.landing-section-head{ text-align:center; max-width:640px; margin:0 auto 40px; }
.landing-section-head .section-title{ margin:0; }

.landing-feature{
  text-align:left; background:var(--blue-050); border:none; border-radius:18px; padding:26px;
}
.landing-feature .lf-ic{
  width:44px; height:44px; border-radius:12px; background:var(--blue-100);
  display:flex; align-items:center; justify-content:center; font-size:20px; margin-bottom:14px;
}
.landing-feature .lf-eyebrow{
  display:block; font-size:14px; font-weight:700; letter-spacing:.05em; color:var(--blue-700);
  text-transform:uppercase; margin-bottom:8px;
}
.landing-feature h3{ font-size:17.8px; margin:0 0 6px; }
.landing-feature p{ margin:0 0 18px; font-size:14.7px; color:var(--ink-soft); line-height:1.55; }
/* Mini forhåndsvisning av selve appen nederst i hvert funksjonskort -- samme
   idé som Hemvar bruker under sine "Forvaltning/Drift/Vedlikehold"-kort:
   en liten, gjenkjennelig smakebit av det faktiske produktet, ikke bare et
   ikon. Egenprodusert CSS, ingen skjermbilder eller innhold hentet fra dem. */
.lf-mock{ background:var(--surface); border-radius:10px; padding:12px 14px; }
.lf-mock .lf-mock-row{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding:5px 0; border-bottom:1px solid var(--line-soft); }
.lf-mock .lf-mock-row:last-child{ border-bottom:none; }
.lf-mock .lf-mock-label{ font-size:11px; color:var(--ink); }
.lf-mock .lf-mock-pill{ font-size:9.5px; font-weight:700; padding:2px 8px; border-radius:999px; background:var(--blue-100); color:var(--blue-700); }
.lf-mock .lf-mock-pill.warn{ background:var(--warn-bg); color:var(--warn); }
.lf-mock .lf-mock-pill.good{ background:var(--good-bg); color:var(--good); }
.lf-mock-chart{ display:flex; align-items:flex-end; gap:8px; height:64px; padding:0 4px; }
.lf-mock-chart .bar{ flex:1; background:var(--blue-100); border-radius:4px 4px 0 0; }
.lf-mock-chart .bar.active{ background:var(--blue-700); }

/* ---- "Slik fungerer det" -- tre steg, hver med en liten CSS-tegnet
   mock-up av den faktiske appen (ikke ekte skjermbilder). ---- */
.landing-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.landing-step{ text-align:left; }
.landing-step .step-num{
  width:28px; height:28px; border-radius:50%; background:var(--blue-800); color:#fff;
  display:flex; align-items:center; justify-content:center; font-family:var(--disp); font-weight:700;
  font-size:14.9px; margin-bottom:16px;
}
.landing-step h3{ font-size:17.8px; margin:0 0 6px; }
.landing-step p{ margin:0; font-size:14.7px; color:var(--ink-soft); line-height:1.6; }
.step-mock{
  background:var(--blue-050); border-radius:16px; padding:18px; margin-bottom:18px; min-height:168px;
}
.step-mock-inner{ background:var(--surface); border-radius:10px; padding:14px; box-shadow:0 4px 14px rgba(8,31,53,.08); }
/* steg-mock: "opprett" (skjema-linjer) */
.step-mock-form .sm-line{ height:8px; border-radius:4px; background:var(--line-soft); margin-bottom:9px; }
.step-mock-form .sm-line.w60{ width:60%; }
.step-mock-form .sm-line.w80{ width:80%; }
.step-mock-form .sm-line.w40{ width:40%; }
.step-mock-form .sm-btn{
  margin-top:10px; display:inline-block; background:var(--blue-800); color:#fff; font-size:10.5px;
  font-weight:700; padding:6px 14px; border-radius:999px;
}
/* steg-mock: "gjennomfør befaringen" (TG-piller, gjenskaper kontrollpunkt-panelet) */
.step-mock-kontroll .sm-title{ font-size:11px; font-weight:700; color:var(--ink); margin-bottom:8px; }
.step-mock-kontroll .sm-tg-row{ display:flex; gap:5px; margin-bottom:10px; }
.step-mock-kontroll .sm-tg{
  font-size:9.5px; font-weight:700; padding:4px 8px; border-radius:999px; border:1px solid var(--line);
  color:var(--ink-soft);
}
.step-mock-kontroll .sm-tg.active{ background:var(--blue-700); border-color:var(--blue-700); color:#fff; }
.step-mock-kontroll .sm-line{ height:6px; border-radius:3px; background:var(--line-soft); margin-bottom:7px; }
.step-mock-kontroll .sm-line.w90{ width:90%; }
.step-mock-kontroll .sm-line.w70{ width:70%; }
/* steg-mock: "send rapport" (PDF-dokument) */
.step-mock-report{ display:flex; align-items:center; justify-content:center; }
.step-mock-report .sm-doc{
  background:var(--surface); border-radius:10px; padding:16px 20px; box-shadow:0 4px 14px rgba(8,31,53,.08);
  width:100%; text-align:center;
}
.step-mock-report .sm-doc-ic{ font-size:26px; margin-bottom:6px; }
.step-mock-report .sm-doc-label{ font-size:10px; font-weight:700; color:var(--blue-700); letter-spacing:.04em; }
/* steg-mock: "årshjul" (forenklet sirkel med prikker) */
.step-mock-wheel{ display:flex; align-items:center; justify-content:center; }
/* steg-mock: "avviksliste" */
.step-mock-list .sm-row{ display:flex; align-items:center; gap:8px; padding:6px 0; border-bottom:1px solid var(--line-soft); }
.step-mock-list .sm-row:last-child{ border-bottom:none; }
.step-mock-list .sm-dot{ width:7px; height:7px; border-radius:50%; flex:none; }
.step-mock-list .sm-dot.warn{ background:var(--warn); }
.step-mock-list .sm-dot.good{ background:var(--good); }
.step-mock-list .sm-line{ height:7px; border-radius:3px; background:var(--line-soft); flex:1; }

/* ---- "Priser" -- én sentrert prisplakat, beløpet i samme store,
   tall-fokuserte stil som .landing-stat, med en kort punktliste under. ---- */
.landing-pricing-card{
  max-width:460px; margin:0 auto; background:var(--surface); border:1px solid var(--line-soft);
  border-radius:20px; padding:36px 40px; text-align:center; box-shadow:0 12px 32px rgba(8,31,53,.08);
}
.landing-price{ display:flex; align-items:baseline; justify-content:center; gap:6px; margin-bottom:10px; }
.landing-price-amt{ font-family:var(--disp); font-size:40px; font-weight:700; color:var(--blue-800); }
.landing-price-period{ font-size:16.1px; font-weight:600; color:var(--ink-soft); }
.landing-price-lead{ font-size:14.9px; color:var(--ink-soft); margin:0 0 20px; line-height:1.5; }
.landing-price-list{ list-style:none; margin:0 0 4px; padding:18px 0 0; border-top:1px solid var(--line-soft); text-align:left; }
.landing-price-list li{
  font-size:14.9px; color:var(--ink); line-height:1.5; padding:6px 0 6px 22px; position:relative;
}
.landing-price-list li::before{
  content:"✓"; position:absolute; left:0; top:6px; color:var(--good); font-weight:700;
}
.landing-price-note{ margin:18px 0 0; padding-top:16px; border-top:1px solid var(--line-soft); font-size:14px; color:var(--ink-soft); line-height:1.5; }

.landing-about{ background:var(--blue-900); color:var(--landing-soft2-ink); padding:56px 26px; }
.landing-about-inner{ max-width:820px; margin:0 auto; text-align:center; }
.landing-about h2{ color:#fff; font-size:22px; margin:0 0 12px; }
.landing-about p{ color:var(--landing-soft2-ink); font-size:15.5px; line-height:1.6; margin:0; }
.landing-about p + p{ margin-top:12px; }

.landing-cross{ text-align:center; }
.landing-cross p{ margin:0; font-size:15.5px; color:var(--ink-soft); }
.landing-cross a{ color:var(--blue-700); font-weight:700; }
/* v72: Driftsportalens kryssalg til Fagportal nedtonet til en liten
   fotnote i stedet for en egen full banner-seksjon (se landing-section-tight
   under) -- en styreleder på Driftsportalen skal ikke få et "dette er
   egentlig samme produkt"-inntrykk midt i siden. Fagsidens kryssalg til
   Driftsportalen (#landingCrossFag) beholder derimot full vekt -- det er et
   legitimt mersalgsargument overfor et takstfirma, ikke en
   identitetsforveksling. */
.landing-section-tight{ padding:18px 26px; }
.landing-cross-subtle p{ font-size:14px; opacity:.7; }

/* v72: åpenhetsboks i fordelsprogrammet -- forklarer at partnerne betaler
   for en fast årsplass, ikke provisjon per salg, slik at programmet ikke
   leses som at Driftsportalen tjener på hva styret velger å kjøpe. */
.landing-disclosure{
  max-width:620px; margin:20px auto 0; background:var(--surface); border:1px solid var(--line-soft);
  border-radius:12px; padding:14px 18px; display:flex; gap:10px; align-items:flex-start;
}
.landing-disclosure span{ font-size:18.4px; line-height:1.4; }
.landing-disclosure p{ margin:0; font-size:14.4px; line-height:1.6; color:var(--ink-soft); }
.landing-disclosure p b{ color:var(--ink); }

/* ---- Avsluttende fargepanel-CTA før bunnteksten ---- */
.landing-cta-banner{ padding:56px 26px; }
.landing-cta-banner-inner{
  max-width:760px; margin:0 auto; text-align:center; background:linear-gradient(155deg,var(--blue-800),var(--blue-600));
  border-radius:26px; padding:52px 32px; color:#fff;
}
.landing-cta-banner-inner h2{ color:#fff; font-size:26px; margin:0 0 10px; }
.landing-cta-banner-inner p{ color:var(--landing-soft-ink); font-size:16.1px; margin:0 0 22px; }

/* Bunnpolstring 100px (ikke 22px) -- gir nok klaring i høyre hjørne til at
   PC/Nettbrett/Mobil-vekslingen (bottom:76px, se enhetsvisning.js) og
   Hjelp-knappen (bottom:20px, se hjelp.js) -- begge position:fixed relativt
   til vinduet, ikke siden -- ikke dekker footer-navigasjonen når siden er
   scrollet helt ned. Uten dette overlapper de "Slik fungerer det"/"Om
   oss"-lenkene på kortere skjermer/vinduer. */
.landing-footer{ background:var(--blue-800); color:var(--landing-soft2-ink); padding:40px 26px 100px; }
.landing-footer-inner{
  max-width:1180px; margin:0 auto; display:flex; justify-content:space-between; gap:24px;
  flex-wrap:wrap; align-items:flex-start;
}
.landing-footer-brand{ color:#fff; font-weight:700; font-family:var(--disp); margin-bottom:4px; }
.landing-footer-inner > div{ font-size:14px; line-height:1.7; }
.landing-footer-nav{ display:flex; flex-direction:column; gap:8px; }
.landing-footer-nav a{ color:var(--landing-soft2-ink); font-size:14.4px; font-weight:600; }
.landing-footer-nav a:hover{ color:#fff; }
.landing-footer-bottom{
  max-width:1180px; margin:26px auto 0; padding-top:16px; border-top:1px solid rgba(255,255,255,.1);
}
.landing-footer-copy{ font-size:14px; color:var(--landing-muted-ink); }
.landing-footer-copy a{ color:var(--landing-muted-ink); text-decoration:underline; }
.landing-footer-copy a:hover{ color:#fff; }

/* v72: Driftsportalens egen fargeprofil (dyp grønn/teal i stedet for TBS'
   navyblå) -- opprinnelig kun på landingssiden (#landingWrap, kun
   drift.-domenet, se ER_DRIFT_DOMENE i app.js). Alt landingssideinnhold over
   er bygget med var(--blue-*)/var(--landing-*-ink), aldri hardkodet navy,
   nettopp slik at HELE paletten kan tones om med denne ene regelen.
   v75 (Pål: "gjør hele driftsportalen grønn"): samme toning er nå utvidet
   til å gjelde body.tema-drift, som setSide() i app.js påfører/fjerner
   avhengig av om brukeren faktisk ER i Driftsportalen akkurat nå -- enten
   fordi de er et sameie/borettslag-firma (alltid Driftsportalen, uansett
   `side`) eller fordi en takstfirma-ansatt har valgt "Driftsside" med
   Fagside/Driftsside-bryteren. Siden #app (og login-/2FA-/signup-/
   glemt-passord-skjermene) allerede konsekvent bruker var(--blue-*) i stedet
   for hardkodet navy i hele stilarket, trengs ingen egne --app-overstyringer
   her -- CSS-variablene arves rett ned fra body. #landingWrap.tema-drift
   beholdes som egen, mer spesifikk regel med identiske verdier (satt av
   samme ER_DRIFT_DOMENE-kode som nå også setter body.tema-drift) -- rent
   historisk/redundant, ikke fjernet for å unngå å røre en allerede
   velfungerende regel. */
#landingWrap.tema-drift, body.tema-drift{
  --blue-900:#0b2e29;
  --blue-800:#0f6e63;
  --blue-700:#0f6e63;
  --blue-600:#267a6d;
  --blue-100:#dcece8;
  --blue-050:#f4f9f8;
  --landing-topbar-ink:#dff2ee;
  --landing-soft-ink:#d7f0ea;
  --landing-softer-ink:#cbe6e0;
  --landing-soft2-ink:#dff2ee;
  --landing-muted-ink:#d7ebe6;
}

/* v131: «Min bolig» (kjøperportalen) har egen tredje fargedrakt, en dyp plomme,
   slik at den skiller seg fra Fagportal (navy) og Driftsportal (grønn). Ligger
   etter tema-drift og vinner over den når begge klassene står på samme element. */
#landingWrap.tema-kjoper, body.tema-kjoper{
  --blue-900:#2a1740;
  --blue-800:#4b2d7a;
  --blue-700:#5b3a91;
  --blue-600:#7c5cb3;
  --blue-100:#e8e1f2;
  --blue-050:#f6f3fa;
  --landing-topbar-ink:#d9cdee;
  --landing-soft-ink:#e6dcf5;
  --landing-softer-ink:#d3c7ea;
  --landing-soft2-ink:#d9cdee;
  --landing-muted-ink:#a191c4;
}

@media (max-width:900px){
  .landing-steps{ grid-template-columns:1fr; }
}
@media (max-width:640px){
  .landing-hero{ padding:48px 20px 80px; }
  .landing-hero h1{ font-size:28px; }
  .landing-section{ padding:44px 20px; }
  .landing-stats{ gap:10px; }
  .landing-stat{ width:100%; min-width:0; }
  .landing-cta-banner-inner{ padding:36px 22px; }
}

/* ---- v95: dashbord ("Oversikt") -- fargerike, klikkbare moduskort og
   tjenestekort. Fargene under er bevisst egne, faste aksentfarger (ikke
   --blue-*/--good/--warn/--bad) -- de er rene kategori-skilletegn på tvers
   av modulene, ikke statusfarger, og skal se like ut uansett
   fagside/driftside-tema eller lys/mørk modus. ---- */
.dash-section-title{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin:28px 0 12px; }
.dash-section-title h2{ font-family:var(--disp); font-size:15.5px; font-weight:800; margin:0; }
.dash-section-title p{ margin:2px 0 0; font-size:12px; color:var(--ink-soft); }
.dash-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:14px; }
.mod-tile{ position:relative; display:flex; flex-direction:column; gap:10px; text-align:left;
  background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:16px 16px 14px;
  cursor:pointer; overflow:hidden; transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease; }
.mod-tile::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:5px; background:var(--mod-c, var(--blue-700)); }
.mod-tile:hover{ transform:translateY(-2px); box-shadow:0 8px 20px -10px rgba(14,42,62,.28); border-color:var(--mod-c, var(--blue-700)); }
.mod-tile:focus-visible{ outline:2px solid var(--mod-c, var(--blue-700)); outline-offset:2px; }
.mod-tile .mod-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.mod-tile .mod-icon{ width:34px; height:34px; border-radius:10px; display:flex; align-items:center; justify-content:center;
  font-size:17px; background:var(--mod-c-bg, var(--blue-050)); color:var(--mod-c, var(--blue-700)); flex:none; }
.mod-tile .mod-arrow{ color:var(--ink-soft); font-size:14px; opacity:.5; transition:opacity .12s ease, transform .12s ease; }
.mod-tile:hover .mod-arrow{ opacity:1; transform:translateX(2px); }
.mod-tile .mod-label{ font-size:12px; color:var(--ink-soft); font-weight:600; }
.mod-tile .mod-num{ font-family:var(--disp); font-size:24px; font-weight:800; line-height:1; color:var(--ink); }
.mod-tile .mod-num span{ font-family:var(--sans); font-size:12px; font-weight:600; color:var(--ink-soft); margin-left:4px; }
.mod-tile .mod-sub{ font-size:11.5px; color:var(--ink-soft); }
.mod-tile .mod-sub.hot{ color:var(--bad); font-weight:700; }

/* v100: driftsside-snarveiskort uten tall (dashSnarveiTile) -- samme
   .mod-tile-grunnlag som de tellende kortene over, men uten .mod-num/
   .mod-sub, så etiketten løftes opp og gis mer vekt siden den er eneste
   innhold. */
.mod-tile-enkel{ justify-content:center; min-height:84px; }
.mod-tile-enkel .mod-label-enkel{ font-size:14px; color:var(--ink); font-weight:700; }

.svc-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:12px; }
.svc-tile{ display:flex; align-items:center; gap:11px; background:var(--surface); border:1px solid var(--line);
  border-radius:12px; padding:12px 14px; text-decoration:none; color:var(--ink); transition:border-color .12s ease, transform .12s ease; }
.svc-tile:hover{ border-color:var(--mod-c, var(--blue-700)); transform:translateY(-1px); }
.svc-tile .svc-icon{ width:32px; height:32px; border-radius:9px; display:flex; align-items:center; justify-content:center;
  font-size:15px; background:var(--mod-c-bg, var(--blue-050)); color:var(--mod-c, var(--blue-700)); flex:none; }
.svc-tile .svc-body{ min-width:0; }
.svc-tile .svc-name{ font-size:12.8px; font-weight:700; }
.svc-tile .svc-desc{ font-size:11px; color:var(--ink-soft); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.svc-tile .svc-go{ margin-left:auto; color:var(--ink-soft); font-size:12px; flex:none; }
.svc-tile.disabled{ opacity:.55; cursor:default; }
.svc-tile.disabled:hover{ border-color:var(--line); transform:none; }

/* ---------- v118: Brukerveiledning ---------- */
.vl-knapper{ display:flex; gap:8px; flex-wrap:wrap; }
.vl-roller{ display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin-bottom:12px; }
.vl-rolle-chip{ border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:999px; padding:4px 11px; font-size:12px; cursor:pointer; font-family:inherit; }
.vl-rolle-chip.on{ background:var(--blue-700); border-color:var(--blue-700); color:#fff; }
.vl-sok{ width:100%; max-width:420px; padding:9px 12px; border:1px solid var(--line); border-radius:9px; background:var(--surface); color:var(--ink); font-family:inherit; font-size:13px; margin-bottom:14px; }
.vl-layout{ display:grid; grid-template-columns:230px minmax(0,1fr); gap:18px; align-items:start; }
.vl-toc{ position:sticky; top:12px; padding:12px; max-height:calc(100vh - 40px); overflow:auto; }
.vl-toc-tittel{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); margin-bottom:6px; }
.vl-toc-lenke{ display:flex; gap:8px; align-items:baseline; padding:5px 6px; border-radius:7px; color:var(--ink); text-decoration:none; font-size:12.5px; }
.vl-toc-lenke:hover{ background:var(--blue-050); }
.vl-nr{ display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; border-radius:50%; background:var(--blue-700); color:#fff; font-size:11px; font-weight:700; flex:none; }
.vl-innhold{ display:flex; flex-direction:column; gap:16px; }
.vl-kap{ padding:20px 22px; scroll-margin-top:12px; }
.vl-kap h2{ display:flex; gap:10px; align-items:center; font-size:19px; margin:0 0 6px; }
.vl-kap h2 .vl-nr{ width:26px; height:26px; font-size:13px; }
.vl-kap h3{ font-size:14.5px; margin:18px 0 6px; color:var(--blue-700); }
.vl-ingress{ color:var(--ink-soft); margin:0 0 8px; }
.vl-kap p{ margin:6px 0; line-height:1.6; }
.vl-steg{ margin:8px 0; padding:0; list-style:none; counter-reset:vlsteg; }
.vl-steg li{ counter-increment:vlsteg; position:relative; padding:4px 0 4px 34px; line-height:1.55; }
.vl-steg li::before{ content:counter(vlsteg); position:absolute; left:0; top:3px; width:23px; height:23px; border-radius:50%; background:var(--blue-700); color:#fff; font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.vl-liste{ margin:8px 0; padding-left:20px; line-height:1.55; }
.vl-boks{ border-radius:9px; padding:10px 13px; margin:10px 0; font-size:13px; line-height:1.55; }
.vl-boks b{ display:block; font-size:11px; text-transform:uppercase; letter-spacing:.06em; margin-bottom:2px; }
.vl-tips{ background:var(--good-bg); color:var(--good); }
.vl-tips{ color:var(--ink); border-left:4px solid var(--good); }
.vl-merk{ background:var(--warn-bg); color:var(--ink); border-left:4px solid var(--warn); }
.vl-tabell-wrap{ overflow-x:auto; margin:10px 0; }
.vl-tabell{ border-collapse:collapse; width:100%; font-size:12.5px; }
.vl-tabell th{ background:var(--blue-700); color:#fff; text-align:left; padding:7px 9px; font-weight:600; }
.vl-tabell td{ padding:7px 9px; border-bottom:1px solid var(--line); vertical-align:top; }
.vl-tabell tr:nth-child(even) td{ background:var(--blue-050); }
.vl-bilde{ margin:12px 0; }
.vl-bilde img{ display:block; max-width:100%; border:1px solid var(--line); border-radius:8px; }
.vl-bilde figcaption{ font-size:11.5px; color:var(--ink-soft); margin-top:4px; }
.vl-mott-boks{ max-height:260px; overflow:auto; border:1px solid var(--line); border-radius:9px; padding:6px 10px; }
.vl-mott-topp{ margin-bottom:6px; font-size:12.5px; }
.vl-mott-gruppe{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-soft); margin:8px 0 2px; }
.vl-mott-rad{ display:flex; gap:8px; align-items:baseline; padding:3px 0; font-size:13px; cursor:pointer; }
.vl-fri-rad{ display:grid; grid-template-columns:1fr 1.3fr 1fr auto; gap:6px; margin-bottom:6px; }
.vl-fri-rad input, .vl-fri-rad select{ min-width:0; }
.vl-res-rad{ font-size:12.5px; padding:3px 0; }
.vl-res-rad.ok{ color:var(--good); }
.vl-res-rad.feil{ color:var(--bad); }
.vl-resultat{ margin-top:12px; padding:10px 12px; border:1px solid var(--line); border-radius:9px; }
.vl-vedlegg{ display:flex; gap:8px; align-items:center; margin-top:12px; font-size:12.5px; cursor:pointer; }
@media (max-width:860px){
  .vl-layout{ grid-template-columns:1fr; }
  .vl-toc{ position:static; max-height:none; }
  .vl-fri-rad{ grid-template-columns:1fr; }
  .vl-kap{ padding:16px; }
}
@media print{ .vl-toc, .vl-knapper, .vl-sok, .vl-roller{ display:none !important; } .vl-layout{ display:block; } }

/* v122: prisvelger (moduler + boenheter + live pris), se public/prisvelger.js */
.tbsp{ text-align:left; }
.tbsp-moduler{ display:flex; flex-direction:column; gap:8px; margin-bottom:14px; }
.tbsp-modul{ display:flex; gap:10px; align-items:flex-start; padding:11px 13px; border:1px solid var(--line); border-radius:10px; background:var(--surface); cursor:pointer; }
.tbsp-modul.valgt{ border-color:var(--blue-600); background:var(--blue-050); }
.tbsp-modul input{ margin-top:3px; flex:none; }
.tbsp-modul-tekst{ flex:1; display:flex; flex-direction:column; gap:2px; font-size:13px; }
.tbsp-modul-tekst b{ font-size:14px; color:var(--blue-800); }
.tbsp-modul-tekst span{ color:var(--ink-soft); line-height:1.45; font-size:12.5px; }
.tbsp-modul-pris{ flex:none; font-size:12.5px; font-weight:600; color:var(--ink-soft); white-space:nowrap; }
.tbsp-felt{ max-width:280px; margin-bottom:14px; }
.tbsp-trinn{ margin-top:4px; }
.tbsp-pris{ border:1px solid var(--line); border-radius:12px; padding:16px 18px; background:var(--paper); }
.tbsp-stor{ font-family:var(--disp); font-size:30px; font-weight:700; color:var(--blue-800); }
.tbsp-stor span{ font-size:13px; font-weight:600; color:var(--ink-soft); }
.tbsp-liten{ font-size:12.5px; color:var(--ink-soft); margin-top:3px; line-height:1.5; }
.tbsp-linjer{ list-style:none; margin:12px 0 4px; padding:0; border-top:1px solid var(--line-soft); }
.tbsp-linjer li{ display:flex; justify-content:space-between; gap:12px; padding:6px 0; font-size:13px; border-bottom:1px solid var(--line-soft); }
.tbsp-linjer li.rabatt{ color:var(--good); }
.tbsp-vilkar{ margin-top:10px; font-size:11.5px; color:var(--ink-soft); line-height:1.5; }
.tbsp-laster{ font-size:13px; color:var(--ink-soft); }
.landing-pricing-wide{ max-width:640px; text-align:left; }
.landing-pricing-wide .landing-price-lead{ text-align:center; }
.tbsp-landing{ margin:6px 0 18px; }

/* ---------- v123: prisseksjoner (pakkekort) ---------- */
.landing-pricing-inner{ max-width:1120px; }
.pk-undertittel{ max-width:640px; margin:10px auto 0; font-size:15px; color:var(--ink-soft); line-height:1.6; }
.pk{ text-align:left; }
.pk-storrelse{
  display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
  background:var(--surface); border:1px solid var(--line-soft); border-radius:16px; padding:18px 24px; margin-bottom:26px;
  box-shadow:0 6px 18px rgba(8,31,53,.05);
}
.pk-storrelse-tekst{ display:flex; flex-direction:column; gap:3px; max-width:420px; }
.pk-storrelse-tekst label{ font-weight:700; font-size:15px; color:var(--ink); }
.pk-storrelse-tekst span{ font-size:12.5px; color:var(--ink-soft); line-height:1.5; }
.pk-storrelse-kontroll{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.pk-storrelse input[type=number]{
  width:110px; padding:10px 12px; font-size:18px; font-weight:700; text-align:center;
  border:2px solid var(--blue-600); border-radius:10px; background:var(--paper); color:var(--ink);
}
.pk-piller{ display:flex; gap:6px; flex-wrap:wrap; }
.pk-pill{
  border:1px solid var(--line); background:var(--paper); color:var(--ink-soft); border-radius:999px;
  padding:8px 14px; font-size:13px; font-weight:600; cursor:pointer; font-family:inherit;
}
.pk-pill:hover{ border-color:var(--blue-600); color:var(--blue-800); }
.pk-pill.aktiv{ background:var(--blue-800); border-color:var(--blue-800); color:#fff; }

.pk-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:22px; align-items:stretch; }
.pk-kort{
  position:relative; background:var(--surface); border:1px solid var(--line-soft); border-radius:20px;
  padding:34px 28px 28px; display:flex; flex-direction:column; text-align:left;
  box-shadow:0 10px 28px rgba(8,31,53,.07);
}
.pk-kort.fremhevet{ border:2px solid var(--blue-600); box-shadow:0 18px 44px rgba(8,31,53,.16); }
.pk-merke{
  position:absolute; top:-13px; left:28px; background:var(--blue-800); color:#fff; font-size:12px; font-weight:700;
  letter-spacing:.04em; text-transform:uppercase; padding:5px 13px; border-radius:999px;
}
.pk-navn{ margin:0 0 4px; font-family:var(--disp); font-size:22px; color:var(--blue-800); }
.pk-ingress{ margin:0 0 18px; font-size:14px; color:var(--ink-soft); line-height:1.5; min-height:42px; }
.pk-prisboks{ padding:16px 0 18px; border-top:1px solid var(--line-soft); }
.pk-pris-rad{ display:flex; align-items:baseline; gap:8px; }
.pk-pris-stor{ font-family:var(--disp); font-size:44px; font-weight:700; color:var(--ink); line-height:1.05; }
.pk-pris-tom{ font-size:22px; color:var(--ink-soft); }
.pk-pris-enhet{ font-size:14px; font-weight:600; color:var(--ink-soft); }
.pk-pris-liten{ font-size:12.5px; color:var(--ink-soft); margin-top:4px; }
.pk-pris-nok{ margin-top:6px; font-size:12.5px; font-weight:600; color:var(--ink-soft); }
.pk-valutanotat{ margin:18px auto 0; max-width:760px; text-align:center; font-size:12.5px; line-height:1.55; color:var(--ink-soft); }
.pk-pris-boenhet{ margin-top:10px; display:inline-block; font-size:13px; font-weight:600; color:var(--blue-800); background:var(--blue-050); padding:5px 10px; border-radius:8px; }
.pk-spar{ margin-top:10px; font-size:12.5px; color:var(--good); font-weight:600; line-height:1.5; }
.pk-spar s{ color:var(--ink-soft); font-weight:400; }
.pk-knapp{ width:100%; justify-content:center; text-align:center; margin-bottom:22px; display:inline-flex; align-items:center; text-decoration:none; box-sizing:border-box; }
.pk-intro{ font-size:13px; font-weight:700; color:var(--ink); margin-bottom:8px; }
.pk-liste{ list-style:none; margin:0; padding:0; }
.pk-liste li{ position:relative; padding:5px 0 5px 26px; font-size:13.5px; color:var(--ink); line-height:1.5; }
.pk-liste li::before{
  content:"\2713"; position:absolute; left:0; top:5px; width:18px; height:18px; border-radius:50%;
  background:var(--blue-050); color:var(--good); font-size:11px; font-weight:800; display:flex; align-items:center; justify-content:center;
}
.pk-feil{ padding:20px; text-align:center; color:var(--ink-soft); font-size:14px; }

.pk-trygghet{ display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; margin:34px 0 0; }
.pk-trygghet-punkt{ background:var(--surface); border:1px solid var(--line-soft); border-radius:14px; padding:16px 18px; display:flex; flex-direction:column; gap:4px; text-align:left; }
.pk-trygghet-punkt b{ font-size:14px; color:var(--blue-800); }
.pk-trygghet-punkt span{ font-size:12.5px; color:var(--ink-soft); line-height:1.5; }

.pk-kjoper-stripe{
  margin:26px 0 0; display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
  background:var(--blue-800); color:#fff; border-radius:16px; padding:22px 26px; text-align:left;
}
.pk-kjoper-stripe b{ display:block; font-size:16px; margin-bottom:3px; }
.pk-kjoper-stripe span{ font-size:13.5px; opacity:.9; line-height:1.5; }
.pk-kjoper-stripe .btn{ background:#fff; color:var(--blue-800); border-color:#fff; text-decoration:none; }

.pk-faq{ max-width:760px; margin:36px auto 0; text-align:left; }
.pk-faq h3{ font-family:var(--disp); font-size:20px; color:var(--blue-800); margin:0 0 12px; text-align:center; }
.pk-faq details{ background:var(--surface); border:1px solid var(--line-soft); border-radius:12px; padding:0 18px; margin-bottom:8px; }
.pk-faq summary{ cursor:pointer; padding:14px 0; font-weight:600; font-size:14.5px; color:var(--ink); list-style:none; }
.pk-faq summary::-webkit-details-marker{ display:none; }
.pk-faq summary::after{ content:"+"; float:right; font-size:18px; color:var(--blue-600); }
.pk-faq details[open] summary::after{ content:"\2212"; }
.pk-faq details p{ margin:0 0 14px; font-size:13.5px; color:var(--ink-soft); line-height:1.65; }

/* fag + kjøper: to kolonner (kort + regnestykke) */
.pk-fag{ display:grid; grid-template-columns:1.05fr .95fr; gap:22px; align-items:stretch; text-align:left; }
.pk-fag-kort .pk-prisboks{ border-top:1px solid var(--line-soft); }
.pk-regn{ background:var(--paper); }
.pk-slider-rad{ margin:6px 0 18px; display:flex; flex-direction:column; gap:10px; }
.pk-slider-rad label{ font-size:13.5px; font-weight:600; color:var(--ink); display:flex; justify-content:space-between; }
.pk-slider-verdi{ color:var(--blue-800); font-size:18px; }
.pk-slider-rad input[type=range]{ width:100%; accent-color:var(--blue-600); }
.pk-tallfelt{ width:150px; padding:10px 12px; font-size:20px; font-weight:700; border:2px solid var(--blue-600); border-radius:10px; background:var(--surface); color:var(--ink); }
.pk-resultat{ background:var(--surface); border:1px solid var(--line-soft); border-radius:14px; padding:18px 20px; margin-bottom:18px; }
.pk-tabell{ width:100%; margin-top:12px; border-collapse:collapse; font-size:13px; }
.pk-tabell td{ padding:7px 0; border-top:1px solid var(--line-soft); color:var(--ink); }
.pk-tabell td:last-child{ text-align:right; font-weight:600; white-space:nowrap; }
.pk-trygg .pk-liste li{ font-size:13px; }
.pk-innlogging{ max-width:760px; margin:0 auto; text-align:left; }
.pk-liten{ font-size:12.5px; color:var(--ink-soft); margin-top:14px; }

@media (max-width:960px){
  .pk-grid{ grid-template-columns:1fr; max-width:480px; margin:0 auto; }
  .pk-fag{ grid-template-columns:1fr; max-width:560px; margin:0 auto; }
  .pk-trygghet{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){
  .pk-trygghet{ grid-template-columns:1fr; }
  .pk-storrelse{ padding:16px; }
  .pk-pris-stor{ font-size:38px; }
}
.pk-knapp.btn-lg.btn{ background:var(--surface); color:var(--blue-800); border:2px solid var(--blue-700); font-weight:700; }
.pk-knapp.btn-lg.btn:hover{ background:var(--blue-050); border-color:var(--blue-800); }
.pk-knapp.btn-primary.btn-lg.btn{ background:var(--blue-700); color:#fff; border-color:var(--blue-700); }
.pk-knapp.btn-primary.btn-lg.btn:hover{ background:var(--blue-800); border-color:var(--blue-800); }
.pk-knapp.btn-lg.btn:disabled{ opacity:.45; }
.pk-kjoper-stripe .btn.btn-lg{ background:#fff; color:var(--blue-800); border-color:#fff; }
.pk-prisboks{ min-height:178px; }
.pk-fag-kort .pk-prisboks{ min-height:0; }
.pk-slider-rad input[type=range]{ padding:0; border:0; background:transparent; height:26px; box-shadow:none; }

/* v126: Min bolig (kjøper) dashbord */
.kj-hero{ background:linear-gradient(135deg,var(--blue-700) 0%,var(--blue-900) 100%); color:#fff; border-radius:16px; padding:22px 24px; margin-bottom:16px; }
.kj-hero-sub{ font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; opacity:.8; font-weight:700; }
.kj-hero-navn{ font-family:var(--disp); font-size:26px; font-weight:800; margin:2px 0; }
.kj-hero-adr{ font-size:14px; opacity:.92; }
.kj-hero-chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.kj-hero-chip{ background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.28); border-radius:999px; padding:5px 12px; font-size:12.5px; font-weight:600; }
.kj-bar{ height:8px; border-radius:99px; background:rgba(255,255,255,.22); margin-top:16px; overflow:hidden; }
.kj-bar-fyll{ height:100%; background:#fff; border-radius:99px; }
.kj-bar-tekst{ font-size:11.5px; opacity:.8; margin-top:5px; }
.kj-stats{ grid-template-columns:repeat(4,1fr); }
@media (max-width:900px){ .kj-stats{ grid-template-columns:1fr 1fr; } }
.kj-stats .stat .v{ font-size:22px; }
.kj-to{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:16px; }
@media (max-width:820px){ .kj-to{ grid-template-columns:1fr; } }
.kj-kort h3{ margin:0 0 2px; font-family:var(--disp); font-size:15px; }
.kj-rad{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px solid var(--line); }
.kj-rad:last-of-type{ border-bottom:0; }
.kj-rad-blokk{ padding:10px 0 0; font-size:13.5px; line-height:1.5; }
.kj-tom{ padding-top:10px; }
.kj-kort .t2, .kj-rad .t2, .kj-rad-blokk .t2{ font-size:12px; color:var(--ink-soft); font-weight:400; }
.kj-stats{ margin-bottom:4px; }
@media (max-width:600px){ .dash-grid.kj-grid{ grid-template-columns:1fr 1fr; gap:10px; } .kj-grid .mod-tile-enkel{ min-height:70px; } }

/* v128: landingssidenes overskrifter skal være ekte overskrifter, ikke små etiketter */
.landing-section-head{ max-width:760px; }
.landing-section-head .section-title{ font-family:var(--disp); font-size:32px; line-height:1.2; text-transform:none; letter-spacing:-.01em; color:var(--ink); font-weight:800; margin:10px 0 0; }
.landing-section-head .pk-undertittel{ font-size:19px; line-height:1.55; margin:12px auto 0; max-width:640px; }
@media (max-width:560px){ .landing-section-head .section-title{ font-size:25px; } }

.pk-vilkar{ max-width:760px; margin:34px auto 0; text-align:left; }
.pk-vilkar h3{ font-family:var(--disp); font-size:20px; color:var(--blue-800); margin:0 0 12px; text-align:center; }
.pk-vilkar table{ width:100%; border-collapse:collapse; background:var(--surface); border:1px solid var(--line-soft); border-radius:12px; overflow:hidden; }
.pk-vilkar th, .pk-vilkar td{ padding:11px 16px; font-size:14.5px; line-height:1.5; border-bottom:1px solid var(--line-soft); vertical-align:top; }
.pk-vilkar tr:last-child th, .pk-vilkar tr:last-child td{ border-bottom:0; }
.pk-vilkar th{ width:30%; font-weight:700; color:var(--blue-800); text-align:left; }
.pk-vilkar td{ color:var(--ink); }
@media (max-width:600px){ .pk-vilkar th{ width:36%; } }

/* v141 (U9): kortere driftsmeny -- seks hovedpunkter, resten under «Mer» */
.nav-mer-btn{
  display:flex; align-items:center; gap:9px; padding:8px 10px; border-radius:8px; border:none;
  background:transparent; color:#c4d3e0; font-size:13px; text-align:left; width:100%; cursor:pointer;
  margin-top:4px; border-top:1px solid rgba(255,255,255,.08); border-radius:0 0 8px 8px;
}
.nav-mer-btn .chev{ margin-left:auto; transition:transform .15s; font-size:11px; }
.nav-mer-btn[aria-expanded="true"] .chev{ transform:rotate(180deg); }
.nav-mer-btn:hover{ color:#fff; }
.nav-mer{ display:flex; flex-direction:column; gap:2px; }
.nav-mer[hidden], .nav-mer-btn[hidden]{ display:none; }
.mobile-tabs button.tab-mer{ font-style:normal; }

/* v141 (U10): registrering i tre steg */
.ss-fremdrift{ list-style:none; display:flex; gap:6px; margin:4px 0 18px; padding:0; }
.ss-fremdrift li{ flex:1; display:flex; align-items:center; gap:7px; font-size:13px; color:var(--ink-soft); padding-bottom:8px; border-bottom:3px solid var(--line-soft); }
.ss-fremdrift li .nr{ width:22px; height:22px; border-radius:50%; background:var(--line-soft); color:var(--ink); font-size:12px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; flex:none; }
.ss-fremdrift li.aktiv{ color:var(--ink); font-weight:700; border-bottom-color:var(--blue-700); }
.ss-fremdrift li.aktiv .nr, .ss-fremdrift li.ferdig .nr{ background:var(--blue-700); color:#fff; }
.ss-fremdrift li.ferdig{ border-bottom-color:var(--blue-700); }
.ss-steg-tittel{ font-size:17px; margin:0 0 12px; outline:none; }
.ss-pakke-hint{ margin:0 0 10px; }
.ss-knapper{ display:flex; gap:10px; margin-top:6px; }
.ss-knapper .btn-primary{ flex:1; justify-content:center; }

.landing-steps-mer{ text-align:center; margin:8px 0 28px; }

/* v142 (U4): Drift-forsiden. Fire store fordeler, resten under «Se alle funksjoner».
   Ingen oppdiktede eksempelkort; hero viser et ekte skjermbilde. */
.lf-store{ gap:20px; }
.landing-feature.lf-stor{ padding:34px 30px; }
.landing-feature.lf-stor h3{ font-size:26px; line-height:1.2; margin:0 0 10px; }
.landing-feature.lf-stor p{ font-size:16.5px; margin:0; }
.lf-alle{ margin-top:22px; text-align:left; }
.lf-alle summary{ cursor:pointer; font-weight:700; color:var(--blue-700); font-size:16px; padding:10px 0; }
.lf-alle summary:focus-visible{ outline:3px solid var(--blue-700); outline-offset:3px; border-radius:6px; }
.lf-alle-liste{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px 28px; margin-top:8px; }
.lf-alle-liste div{ font-size:15px; line-height:1.55; color:var(--ink-soft); }
.lf-alle-liste b{ color:var(--ink); }
@media (max-width:700px){ .lf-alle-liste{ grid-template-columns:1fr; } .landing-feature.lf-stor h3{ font-size:22px; } }
.lhv-skjerm{ margin:0; border-radius:16px; overflow:hidden; box-shadow:0 30px 60px rgba(8,31,53,.35); background:#fff; }
.lhv-skjerm img{ display:block; width:100%; height:auto; }
.lhv-skjerm figcaption{ font-size:12.5px; color:var(--ink-soft); padding:8px 14px; background:var(--surface); }
.landing-hero-inner.uten-visuell{ grid-template-columns:1fr; max-width:780px; }

/* v142: «Kom i gang» på tom Fagportal-oversikt */
.kig-panel{ margin:0 0 22px; padding:22px 24px; border-left:4px solid var(--blue-700); }
.kig-panel h2{ margin:0 0 4px; font-size:19px; }
.kig-panel > p{ margin:0 0 14px; color:var(--ink-soft); font-size:14px; }
.kig-liste{ list-style:none; counter-reset:kig; margin:0; padding:0; display:grid; gap:10px; }
.kig-liste li{ counter-increment:kig; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 14px; background:var(--blue-050); border-radius:10px; }
.kig-liste li::before{ content:counter(kig); flex:0 0 26px; height:26px; border-radius:50%; background:var(--blue-800); color:#fff; font-weight:700; font-size:13px; display:flex; align-items:center; justify-content:center; }
.kig-tekst{ flex:1; display:flex; flex-direction:column; gap:2px; font-size:14px; }
.kig-tekst span{ color:var(--ink-soft); font-size:13px; }
.kig-hjelp{ margin:14px 0 0; font-size:13px; color:var(--ink-soft); }
@media (max-width:560px){ .kig-liste li{ flex-wrap:wrap; } .kig-liste .btn{ width:100%; justify-content:center; } }
.kig-hjelp a{ color:var(--blue-700); font-weight:600; }

/* v142 (Bloom kap. 2B): tekststørrelser, treffflater og fokus på landingssidene.
   Minimum: brødtekst 18, ingress 20, hjelpetekst 15 (aldri under 14), knapper 17 px og 48 px høye,
   H1 40 til 52, H2 28 til 34. Ligger sist og vinner over eldre regler. */
:focus-visible{ outline:3px solid var(--blue-600); outline-offset:2px; }
#landingWrap{ font-size:18px; line-height:1.6; }
#landingWrap section[id]{ scroll-margin-top:84px; }
#landingWrap .landing-topbar{ font-size:15px; }
#landingWrap .landing-nav a{ font-size:16px; padding:10px 6px; display:inline-flex; align-items:center; min-height:48px; }
#landingWrap .login-brand .sub{ font-size:14px; }
#landingWrap .btn, #landingWrap .btn-lg, #landingWrap .pk-knapp, #landingWrap .landing-nav .btn{
  font-size:17px; min-height:48px; padding:10px 24px; display:inline-flex; align-items:center; justify-content:center; }
#landingWrap .landing-badge{ font-size:15px; }
#landingWrap .landing-hero h1{ font-size:48px; line-height:1.1; overflow-wrap:anywhere; }
#landingWrap .landing-tagline{ font-size:20px; line-height:1.6; max-width:60ch; }
#landingWrap .landing-trial-note{ font-size:16px; }
#landingWrap .lhv-skjerm figcaption{ font-size:15px; }
#landingWrap .landing-stat b{ font-size:22px; }
#landingWrap .landing-stat span{ font-size:16px; }
#landingWrap .landing-section .section-title, #landingWrap h2.section-title{ font-size:32px; text-transform:none; letter-spacing:-.01em; color:var(--ink); }
#landingWrap .landing-feature p, #landingWrap .landing-step p{ font-size:18px; line-height:1.6; }
#landingWrap .landing-step h3, #landingWrap .landing-feature h3{ font-size:22px; }
#landingWrap .landing-feature.lf-stor h3{ font-size:26px; }
#landingWrap .landing-feature.lf-stor p{ font-size:18px; }
#landingWrap .lf-alle summary{ font-size:18px; min-height:48px; display:flex; align-items:center; }
#landingWrap .lf-alle-liste div{ font-size:17px; }
#landingWrap .pk-undertittel{ font-size:20px; }
#landingWrap .pk-storrelse-tekst label{ font-size:17px; }
#landingWrap .pk-storrelse-tekst span{ font-size:15px; }
#landingWrap .pk-storrelse input[type=number]{ font-size:20px; min-height:48px; width:120px; }
#landingWrap .pk-pill{ font-size:17px; min-height:48px; padding:8px 18px; }
#landingWrap .pk-ingress{ font-size:18px; min-height:0; }
#landingWrap .pk-navn{ font-size:24px; }
#landingWrap .pk-pris-enhet{ font-size:17px; }
#landingWrap .pk-pris-liten{ font-size:15px; }
#landingWrap .pk-pris-boenhet{ font-size:15px; }
#landingWrap .pk-spar, #landingWrap .pk-spar s{ font-size:15px; }
#landingWrap .pk-merke{ font-size:14px; }
#landingWrap .pk-intro{ font-size:16px; }
#landingWrap .pk-liste li{ font-size:17px; padding-left:30px; }
#landingWrap .pk-feil{ font-size:16px; }
#landingWrap .pk-trygghet-punkt b{ font-size:17px; }
#landingWrap .pk-trygghet-punkt span{ font-size:15px; }
#landingWrap table th, #landingWrap table td{ font-size:16px; }
#landingWrap .landing-price-lead, #landingWrap .landing-price-note{ font-size:16px; }
#landingWrap .landing-about h2{ font-size:28px; }
#landingWrap .landing-about p, #landingWrap .landing-cross p{ font-size:17px; }
#landingWrap .landing-cross-subtle p{ font-size:16px; opacity:1; color:var(--ink-soft); }
#landingWrap .landing-disclosure p{ font-size:16px; }
#landingWrap .landing-cta-banner-inner h2{ font-size:30px; }
#landingWrap .landing-cta-banner-inner p{ font-size:18px; }
#landingWrap .landing-footer-inner > div, #landingWrap .landing-footer-nav a{ font-size:16px; }
#landingWrap .landing-footer-nav a{ padding:6px 0; min-height:44px; display:inline-flex; align-items:center; }
@media (max-width:640px){
  #landingWrap .landing-hero h1{ font-size:40px; }
  #landingWrap .landing-section .section-title, #landingWrap h2.section-title{ font-size:28px; }
  #landingWrap .landing-hero{ padding:40px 18px 80px; }
  #landingWrap .pk-grid{ grid-template-columns:1fr; }
}
#landingWrap .pk-faq h3{ font-size:22px; }
#landingWrap .pk-faq summary{ font-size:18px; min-height:48px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
#landingWrap .pk-faq summary::after{ float:none; font-size:24px; }
#landingWrap .pk-faq details p{ font-size:17px; }
#landingWrap .pk-tabell{ font-size:16px; }
#landingWrap .sub{ font-size:15px; }
#landingWrap .lf-eyebrow, #landingWrap .pk-merke{ font-size:15px; }
#landingWrap .landing-footer-copy, #landingWrap .landing-footer-copy a, #landingWrap .landing-footer-copy span{ font-size:15px; }
#landingWrap .landing-footer-copy a{ display:inline-flex; align-items:center; min-height:44px; padding:0 4px; }
#landingWrap #landingFooterSub{ font-size:15px !important; opacity:1 !important; }
#landingWrap .sm-btn{ font-size:15px; padding:6px 12px; }
#landingWrap #landingFordelIntro{ font-size:18px !important; }
#landingWrap .landing-section-tight p, #landingWrap .landing-section-tight a{ font-size:16px; }
.tbev-btn{ min-width:44px; min-height:44px; justify-content:center; }
#landingWrap .landing-fotnote{ font-size:15px; }
#landingWrap .pk-kjoper-stripe b{ font-size:20px; }
#landingWrap .pk-kjoper-stripe span{ font-size:17px; line-height:1.5; }
#landingWrap .sub, #landingWrap .login-brand .sub{ font-size:15px !important; }
.section-title{ font-size:15px; text-transform:none; letter-spacing:0; }
@media (max-width:520px){
  #landingWrap .pk-vilkar table, #landingWrap .pk-vilkar tbody, #landingWrap .pk-vilkar tr, #landingWrap .pk-vilkar th, #landingWrap .pk-vilkar td{ display:block; width:100%; }
  #landingWrap .pk-vilkar tr{ padding:10px 0; border-bottom:1px solid var(--line-soft); }
  #landingWrap .pk-vilkar th{ padding-bottom:2px; text-align:left; }
}
#landingWrap .landing-cta-banner .btn-lg{ margin:4px 6px; }
#landingWrap .pk-vilkar th, #landingWrap .pk-vilkar td{ text-transform:none; letter-spacing:0; }
#landingWrap .lhv-label, #landingWrap .lf-eyebrow, #landingWrap .pk-merke{ text-transform:none; letter-spacing:0; }

/* v142: lesbarhet inne i Driftsportalen og Min bolig (styre, vaktmester, beboer, kjøper) */
body.ikke-ansatt .tbev-wrap{ display:none !important; }body #app{ font-size:16px; line-height:1.55; }body #app *{ text-transform:none !important; letter-spacing:0 !important; }body #app .btn{ font-size:16px; min-height:44px; padding:8px 16px; }body #app .btn-sm{ font-size:15px; min-height:44px; padding:8px 14px; }body #app input:not([type=checkbox]):not([type=radio]):not([type=hidden]), body #app select, body #app textarea{ font-size:17px; min-height:44px; }body #app label{ font-size:16px; }body #app .nav-item{ font-size:16px; min-height:44px; display:flex; align-items:center; }
body #app .nav-label{ font-size:14px; }body #app .logout-btn, body #app #minKontoBtn, body #app #logoutBtn{ min-height:44px; font-size:15px; padding:8px 14px; }
body #app th{ font-size:15px; }
body #app td{ font-size:15.5px; }body #app .page-head h1, body #app h1{ font-size:32px; }
body #app h2{ font-size:24px; }body #app button, body #app [role=tab], body #app summary{ min-height:44px; }body #app .section-title{ font-size:20px; color:var(--ink); margin-top:28px; }body #app #minKontoBtn, body #app #logoutBtn{ white-space:nowrap; padding:8px 6px; }body #app .mod-tile, body #app .chip{ min-height:0; }
@media (max-width:820px){body .mobile-tabs button{ font-size:16px; min-height:44px; padding:8px 16px; white-space:nowrap; }body #app .page-head h1, body #app h1{ font-size:28px; }
}
.ah-legend i.ah-dot{ width:12px; height:12px; margin-right:6px; vertical-align:-1px; }
.ah-legend i.ah-dot.ah-forfalt{ background:var(--bad); }
.ah-legend i.ah-dot.ah-snart{ background:var(--warn); }
.ah-legend i.ah-dot.ah-kommende{ background:var(--good); }
.ah-legend i.ah-dot.ah-planlagt{ background:var(--blue-700); }
.ah-legend{ display:flex; gap:18px; flex-wrap:wrap; justify-content:center; font-size:15px; }

/* v142: innlogging, registrering og andre enkeltskjermer (Bloom: 16 til 18 px tekst, 48 px knapper) */
.login-wrap{ font-size:17px; line-height:1.55; }
.login-wrap .login-card{ max-width:480px; padding:32px 28px; }
.login-wrap .login-brand .name{ font-size:19px; }
.login-wrap .login-brand .sub{ font-size:15px; }
.login-wrap .login-card h1{ font-size:28px; margin-bottom:8px; }
.login-wrap .login-card p, .login-wrap p.lead{ font-size:17px; }
.login-wrap .login-err{ font-size:16px; padding:12px 14px; }
.login-wrap .login-note{ font-size:15px; }
.login-wrap .link-btn{ font-size:16px; min-height:48px; padding:12px 0; }
.login-wrap .back-link{ font-size:16px; min-height:44px; padding:10px 0; }
.login-wrap .form-row label, .login-wrap label{ font-size:16px; color:var(--ink); }
.login-wrap .form-row .hint, .login-wrap .hint{ font-size:15px; }
.login-wrap input:not([type=checkbox]):not([type=radio]), .login-wrap select, .login-wrap textarea{ font-size:18px; min-height:52px; padding:10px 14px; }
.login-wrap input[type=checkbox], .login-wrap input[type=radio]{ width:22px; height:22px; }
.login-wrap .btn, .login-wrap button.btn{ font-size:17px; min-height:48px; padding:10px 20px; }
.login-wrap .nr{ font-size:15px; }
.login-wrap li, .login-wrap td, .login-wrap th, .login-wrap .aktiv, .login-wrap small, .login-wrap .kom, .login-wrap .t2{ font-size:15px; }
.login-wrap *{ text-transform:none !important; letter-spacing:0 !important; }
.login-wrap .nr, .login-wrap .steg .nr{ font-size:15px !important; width:28px; height:28px; }
.tbsh-q{ font-size:15px !important; }
#landingWrap .sm-title, #landingWrap .lhv-row-label, #landingWrap .lhv-foot-label{ font-size:16px; }
#landingWrap .sm-doc-label, #landingWrap .lhv-label, #landingWrap .lhv-pill, #landingWrap .lf-mock-label, #landingWrap .lf-mock-pill{ font-size:15px; text-transform:none; letter-spacing:0; }
#landingWrap .pk-liten{ font-size:15px; }
#landingWrap label{ font-size:16px; }
#landingWrap .sm-btn, #landingWrap [class^="sm-"], #landingWrap [class*=" sm-"]{ font-size:15px; }
#landingWrap input[type=range]{ min-height:44px; }
#landingWrap .lhv-skjerm figcaption{ display:flex; flex-wrap:wrap; gap:6px 10px; align-items:center; justify-content:space-between; }
#landingWrap .lhv-forstor{ background:none; border:0; color:var(--blue-700); font:inherit; font-weight:700; text-decoration:underline; cursor:pointer; min-height:44px; padding:0 6px; }
#landingWrap .landing-about a{ color:#fff; text-decoration:underline; font-weight:600; }
#landingWrap #landingKomIGangWrap .btn-lg{ background:var(--blue-700); color:#fff; border-color:var(--blue-700); }
#landingWrap #landingKomIGangWrap .btn-lg:hover{ background:var(--blue-800); }
#landingWrap .landing-footer-copy, #landingWrap .landing-footer-copy a{ color:var(--landing-soft2-ink); }

.nav-label{ color:#9db3c4; }
.svc-tile.disabled{ opacity:1; }
.svc-tile.disabled .svc-name{ color:#4a5a66; }
.svc-tile.disabled .svc-desc{ color:#566570; }
.svc-tile.disabled .svc-icon{ background:#dfe4e8; color:#4a5a66; filter:grayscale(1); }
.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* v143: Min bolig-landingen har samme mål som Fag og Drift. Det kodede eksempelet
   ligger i samme figur-ramme som skjermbildene (samme bredde, høyde og bildetekst). */
#landingWrap .lhv-skjerm .lhv-frame{ border-radius:0; box-shadow:none; aspect-ratio:1280 / 800; display:flex; flex-direction:column; }
#landingWrap .lhv-skjerm .lhv-body{ flex:1; padding:20px 22px; display:flex; flex-direction:column; justify-content:center; }
#landingWrap a.btn, #landingWrap a.btn:hover{ text-decoration:none; }
#landingWrap .lhv-skjerm figcaption{ min-height:60px; box-sizing:border-box; display:flex; align-items:center; }
#landingWrap .landing-cta-row > .btn{ box-sizing:border-box; height:48px; display:inline-flex; align-items:center; justify-content:center; }
@media (max-width:480px){ #landingWrap .lhv-skjerm figcaption{ min-height:90px; } }
#landingWrap .lhv-skjerm .lhv-dots{ padding:9px 14px; }
#landingWrap .lhv-skjerm .lhv-body{ padding:12px 20px; }
#landingWrap .lhv-skjerm .lhv-label{ margin-bottom:6px; line-height:1.3; }
#landingWrap .lhv-skjerm .lhv-row{ padding:6px 14px; margin-bottom:6px; line-height:1.3; }
#landingWrap .lhv-skjerm .lhv-foot{ margin-top:8px; padding:8px 14px; line-height:1.3; }
#landingWrap .landing-footer-inner{ min-height:252px; }

/* v143: webinarstripe, vises først når public/webinar.json er aktivert */
.landing-webinar[hidden]{ display:none; }
.landing-webinar{ background:var(--landing-softer-ink, #e8f1f6); color:#10222f; border-bottom:1px solid rgba(0,0,0,.12); }
.landing-webinar-inner{ max-width:1180px; margin:0 auto; padding:10px 26px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:10px 18px; font-size:17px; font-weight:600; }
.landing-webinar .btn{ min-height:44px; display:inline-flex; align-items:center; text-decoration:none; }

/* v294: påmeldingsskjema til webinar (modal på landingssidene) */
.wb-overlay{ position:fixed; inset:0; z-index:1000; background:rgba(8,20,32,.62); display:flex; align-items:flex-start; justify-content:center; padding:24px 16px; overflow-y:auto; }
.wb-boks{ background:#fff; color:#10222f; width:100%; max-width:520px; border-radius:14px; padding:24px 24px 22px; box-shadow:0 18px 50px rgba(0,0,0,.35); margin:auto 0; }
.wb-topp{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.wb-topp h2{ margin:0; font-size:22px; line-height:1.25; color:#10222f; }
.wb-lukk{ border:0; background:transparent; font-size:28px; line-height:1; width:44px; height:44px; margin:-8px -10px 0 0; cursor:pointer; color:#3d4f5e; border-radius:8px; }
.wb-lukk:hover{ background:#eef2f6; }
.wb-dato{ margin:6px 0 16px; font-size:16px; color:#33485a; }
.wb-felt{ margin-bottom:12px; }
.wb-felt label{ display:block; font-weight:600; font-size:15px; margin-bottom:4px; }
.wb-felt input,.wb-felt select{ width:100%; box-sizing:border-box; min-height:44px; padding:8px 12px; font:inherit; font-size:16px; border:1px solid #9fb0bf; border-radius:8px; background:#fff; color:#10222f; }
.wb-felt input[aria-invalid="true"]{ border-color:#b42318; }
.wb-feil{ color:#b42318; font-size:14.5px; min-height:0; margin-top:3px; }
.wb-feil:empty{ display:none; }
.wb-honning{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.wb-samtykke{ display:flex; gap:10px; align-items:flex-start; font-size:14.5px; line-height:1.45; color:#33485a; margin:6px 0 4px; }
.wb-samtykke input{ width:22px; height:22px; flex:none; margin-top:1px; }
.wb-send{ color:#fff; border:1px solid transparent; font-weight:700; }
.wb-send:hover{ filter:brightness(1.15); }
.wb-send:disabled{ opacity:.7; cursor:default; }
.wb-avbryt{ background:#fff; color:#10222f; border:1px solid #9fb0bf; }
.wb-avbryt:hover{ background:#eef2f6; }
.wb-samtykke a{ color:#1b4f7a; text-decoration:underline; }
.wb-knapper{ display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }
.wb-ok h3{ margin:18px 0 8px; font-size:20px; }
.wb-ok p{ margin:0 0 16px; font-size:16px; line-height:1.5; }
@media (max-width:520px){ .wb-boks{ padding:20px 16px; } .wb-knapper .btn{ flex:1 1 100%; } }

/* v150: byggherrens logo i Min bolig (hvit flate, logoen vises hel og uten beskjæring) */
.brand-mark.har-logo{ background:#fff; box-shadow:inset 0 0 0 1px rgba(0,0,0,.08); }
.brand-mark.har-logo .brand-mark-img{ width:84%; height:84%; object-fit:contain; }
.merke-forhandsvisning{ display:flex; align-items:center; gap:10px; margin:10px 0; padding:10px 12px; border:1px solid var(--line); border-radius:10px; }
.merke-forhandsvisning .merke-boks{ width:40px; height:40px; border-radius:9px; background:#fff; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; overflow:hidden; flex:none; }
.merke-forhandsvisning .merke-boks img{ max-width:88%; max-height:88%; object-fit:contain; }
.merke-forhandsvisning .merke-farge{ width:28px; height:28px; border-radius:50%; border:1px solid var(--line); flex:none; }

/* v151: språkvelger på sider før innlogging */
#sprakVelgerFast{ position:fixed; top:10px; right:12px; z-index:9000; }
#sprakVelgerFast select{ font-size:12.5px; padding:5px 8px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); }
body:has(#app.show) #sprakVelgerFast{ display:none; }

/* v153: Plinth-logo i menyen */
.brand-mark.plinth-logo{ background:transparent; box-shadow:none; overflow:hidden; }
.brand-mark.plinth-logo .brand-mark-img{ width:100%; height:100%; object-fit:cover; }
.brand-mark:has(> .brand-mark-img[src^="/plinth-mark"]){ background:transparent; box-shadow:none; overflow:hidden; }
.brand-mark:has(> .brand-mark-img[src^="/plinth-mark"]) > .brand-mark-img{ width:100%; height:100%; object-fit:cover; }

/* v165: sekundære lenker under hovedknappene (booking, demo, webinar) */
.landing-sekundar{ margin:10px 0 0; display:flex; flex-wrap:wrap; gap:6px 18px; font-size:15px; }
.landing-sekundar[hidden], .landing-sekundar a[hidden]{ display:none; }
.landing-sekundar a{ color:inherit; font-weight:600; text-decoration:underline; text-underline-offset:3px; }
@media (max-width:760px){ .landing-hero-copy .landing-sekundar{ justify-content:center; } }


/* ---- v168: Tydelig bookingseksjon rett under toppen av forsiden ---- */
.landing-book{ padding:46px 26px 8px; }
.landing-book[hidden]{ display:none; }
.landing-book-inner{
  max-width:1040px; margin:0 auto; display:grid; grid-template-columns:auto 1fr auto; gap:28px; align-items:center;
  background:linear-gradient(155deg,var(--blue-800),var(--blue-600)); color:#fff;
  border-radius:26px; padding:38px 40px; box-shadow:0 18px 44px rgba(8,31,53,.22);
}
.landing-book-ikon{
  width:76px; height:76px; border-radius:20px; background:rgba(255,255,255,.16); color:#fff;
  display:flex; align-items:center; justify-content:center;
}
.landing-book-ikon svg{ width:42px; height:42px; }
.landing-book-tekst h2{ color:#fff; font-size:30px; line-height:1.18; margin:10px 0 10px; }
.landing-book-tekst p{ color:var(--landing-soft-ink); font-size:17px; line-height:1.55; margin:0; max-width:56ch; }
.landing-book-handling{ display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center; min-width:250px; }
.landing-book-knapp{ width:100%; font-size:19px; padding:16px 26px; background:#fff; color:var(--blue-900); border-color:#fff; font-weight:700; box-shadow:0 8px 22px rgba(0,0,0,.2); }
.landing-book-knapp:hover{ background:var(--blue-050); color:var(--blue-900); transform:translateY(-1px); }
.landing-book-knapp[hidden], .landing-book-alt[hidden]{ display:none; }
.landing-book-note{ font-size:14px; color:var(--landing-softer-ink); }
.landing-book-alt{ font-size:14.5px; color:#fff; text-decoration:underline; text-underline-offset:3px; }
.landing-book-alt:hover{ color:#fff; opacity:.85; }
@media (max-width:860px){
  .landing-book{ padding:34px 16px 4px; }
  .landing-book-inner{ grid-template-columns:1fr; text-align:center; padding:30px 22px; gap:20px; justify-items:center; }
  .landing-book-tekst h2{ font-size:25px; }
  .landing-book-tekst p{ margin:0 auto; }
  .landing-book-handling{ width:100%; min-width:0; }
}
/* hero: bookinglenken som tydelig knapp */
.landing-sekundar a[data-cta="book"]:not([hidden]){
  display:inline-block; padding:9px 18px; border:2px solid currentColor; border-radius:999px; text-decoration:none;
}
.landing-sekundar a[data-cta="book"]:not([hidden]):hover{ background:rgba(255,255,255,.14); }
.landing-book-banner{ margin:14px 0 0; }
#landingWrap .landing-book-banner a[hidden], #landingWrap .landing-book-knapp[hidden], #landingWrap .landing-book-alt[hidden]{ display:none; }

/* v221: klikkbare rader i lister (Oppdrag, Tilstandsanalyser, Overtakelser, Ferdigbefaringer, Saker) */
tr.rad-klikk{ cursor:pointer; }
tr.rad-klikk:hover td{ background:var(--blue-050); }
tr.rad-klikk:hover .an-row-bygg, tr.rad-klikk:hover td b{ text-decoration:underline; }
tr.rad-klikk:focus-visible{ outline:2px solid var(--blue-600); outline-offset:-2px; }

/* ---- v235: kamera i portalen (Ta bilde) ---- */
.kamera-overlay{ position:fixed; inset:0; background:#000; z-index:10002; display:flex; flex-direction:column; }
.kamera-video{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; background:#000; }
.kamera-flash{ position:absolute; inset:0; background:#fff; opacity:0; pointer-events:none; transition:opacity .12s; }
.kamera-info{ position:absolute; top:0; left:0; right:0; padding:calc(env(safe-area-inset-top,0px) + 10px) 14px 8px; text-align:center; color:#fff; font-size:14px; background:linear-gradient(rgba(0,0,0,.55),rgba(0,0,0,0)); }
.kamera-strip{ position:absolute; left:0; right:0; bottom:calc(env(safe-area-inset-bottom,0px) + 118px); display:flex; gap:8px; overflow-x:auto; padding:0 14px; }
.kamera-thumb{ position:relative; flex:none; width:58px; height:58px; border-radius:8px; overflow:hidden; border:2px solid rgba(255,255,255,.6); cursor:default; }
.kamera-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.kamera-thumb.ventende{ opacity:.6; }
.kamera-thumb.ok{ border-color:#3ca66b; }
.kamera-thumb.feil{ border-color:#d64545; cursor:pointer; }
.kamera-thumb.feil::after{ content:"!"; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(214,69,69,.55); color:#fff; font-weight:800; font-size:24px; }
.kamera-bar{ position:absolute; left:0; right:0; bottom:0; display:flex; align-items:center; justify-content:space-between; padding:14px 18px calc(env(safe-area-inset-bottom,0px) + 18px); background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.65)); }
.kamera-side{ flex:1; display:flex; }
.kamera-side:last-child{ justify-content:flex-end; }
.kamera-midt{ flex:none; }
.kamera-lukker{ width:76px; height:76px; border-radius:50%; border:5px solid #fff; background:rgba(255,255,255,.25); box-shadow:inset 0 0 0 4px #fff; cursor:pointer; padding:0; }
.kamera-lukker:active{ background:#fff; }
.kamera-knapp{ border:1px solid rgba(255,255,255,.7); background:rgba(0,0,0,.45); color:#fff; border-radius:999px; padding:12px 20px; font-size:15px; font-weight:600; cursor:pointer; }
.kamera-knapp:disabled{ opacity:.6; }

/* ---- v238: skjemafelt uten egen stil (iPad) ----
   Felt som ikke har egen klasse (f.eks. Ansvarlig, E-post og Frist under en
   sak, nedtrekk, dato) fikk nettleserens standardstil. På iPad ga det svake,
   nesten usynlige felt og blåtonet tekst på blå flate (særlig i mørk modus).
   Her får de tydelig bakgrunn, ramme og plassholdertekst i begge moduser.
   :where() gir null spesifisitet, så alle felt med egen stil beholder den. */
:where(#appMain, .modal-overlay) :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]):not([type=button]):not([type=submit]):not([type=image]), select, textarea){
  background-color:var(--paper); color:var(--ink); border:1px solid var(--ink-soft); border-radius:8px;
}
:where(#appMain, .modal-overlay) :is(input[type=date], input[type=time], input[type=datetime-local], input[type=month]){ min-height:38px; }
:where(#appMain, .modal-overlay) :is(input, textarea)::placeholder{ color:var(--ink-soft); opacity:.85; }

/* v258: rød markering for manglende konsekvens ved TG2/TG3 i NS 3600 */
.kons-mangler{ border:1px solid #DC2626; background:rgba(220,38,38,.10); color:#B91C1C; font-weight:700; font-size:12.5px; padding:8px 10px; border-radius:8px; margin:0 0 8px; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .kons-mangler{ color:#FCA5A5; border-color:#F87171; background:rgba(248,113,113,.14); } }
:root[data-theme="dark"] .kons-mangler{ color:#FCA5A5; border-color:#F87171; background:rgba(248,113,113,.14); }

/* v259: myk varsling om tynn TG2-begrunnelse */
.tg2-svak{ border:1px solid #D97706; background:rgba(217,119,6,.10); color:#92400E; font-size:12.5px; padding:7px 10px; border-radius:8px; margin:-4px 0 8px; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .tg2-svak{ color:#FCD34D; border-color:#F59E0B; background:rgba(245,158,11,.14); } }
:root[data-theme="dark"] .tg2-svak{ color:#FCD34D; border-color:#F59E0B; background:rgba(245,158,11,.14); }

/* v267: mer luft på landingssidene (Fagportal, Driftsportalen og Min bolig deler oppsettet).
   Én felles verdi for avstand over og under alle seksjoner, ekstra rom øverst mot toppmenyen og nederst mot bunnen,
   og mer avstand mellom overskrift og brødtekst. --luft-liten brukes bare på de smale lenkebåndene. */
#landingWrap{ --luft:104px; --luft-liten:56px; --luft-hode:56px; }
@media (max-width:960px){ #landingWrap{ --luft:80px; --luft-liten:44px; --luft-hode:44px; } }
@media (max-width:560px){ #landingWrap{ --luft:64px; --luft-liten:36px; --luft-hode:36px; } }
#landingWrap .landing-section,
#landingWrap .landing-about,
#landingWrap .landing-cta-banner,
#landingWrap .landing-hero{ padding-top:var(--luft); padding-bottom:var(--luft); }
#landingWrap .landing-footer{ padding-top:calc(var(--luft) * .6); padding-bottom:calc(var(--luft) + 36px); }
#landingWrap .landing-section.landing-section-tight,
#landingWrap #landingCrossFag{ padding-top:var(--luft-liten); padding-bottom:var(--luft-liten); }
#landingWrap .landing-section-head{ margin-bottom:var(--luft-hode); }
#landingWrap .landing-section-head .pk-undertittel{ margin-top:18px; }
#landingWrap .landing-about h2{ margin-bottom:22px; }
#landingWrap .landing-about p{ line-height:1.7; }
#landingWrap .landing-about p + p{ margin-top:18px; }
/* v267b: de tre boksene under hero overlapper hero med 48 px. Legg overlappet oppå vanlig luft,
   så avstanden mellom knappene og boksene blir like stor som mellom seksjonene. */
#landingWrap .landing-hero{ padding-bottom:calc(var(--luft) + 48px); }

/* ---- v271: Salg (CRM) ---- */
.salg-tabs{ display:flex; gap:6px; flex-wrap:wrap; margin:0 0 16px; }
.salg-tabs button{ border:1px solid var(--line); background:var(--surface); padding:7px 14px; border-radius:999px; font-size:12.5px; font-weight:600; color:var(--ink-soft); cursor:pointer; }
.salg-tabs button.sel{ border-color:var(--blue-700); background:var(--blue-700); color:#fff; }
.salg-filter{ display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end; margin:0 0 14px; }
.salg-filter .form-row{ margin:0; min-width:170px; }
.salg-board{ display:grid; grid-auto-flow:column; grid-auto-columns:minmax(220px,1fr); gap:12px; overflow-x:auto; padding-bottom:10px; align-items:start; }
.salg-kol{ background:var(--blue-050); border:1px solid var(--line-soft); border-radius:12px; padding:10px; min-height:140px; }
.salg-kol.over{ outline:2px dashed var(--blue-600); }
.salg-kol-h{ display:flex; justify-content:space-between; align-items:baseline; gap:6px; margin:0 2px 8px; font-size:12px; font-weight:700; color:var(--blue-800); }
.salg-kol-h small{ font-weight:600; color:var(--ink-soft); font-size:11px; }
.salg-kort{ background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:10px; margin-bottom:8px; cursor:pointer; }
.salg-kort:hover{ border-color:var(--blue-600); }
.salg-kort.drar{ opacity:.45; }
.salg-kort .t{ font-weight:700; font-size:13px; margin-bottom:3px; }
.salg-kort .s, .salg-kort .m{ font-size:11.5px; color:var(--ink-soft); }
.salg-kort .m.bad{ color:var(--bad); font-weight:700; }
.salg-kort .pil{ display:flex; justify-content:space-between; margin-top:6px; }
.salg-kort .pil button{ border:1px solid var(--line); background:var(--surface); border-radius:6px; padding:1px 9px; font-size:13px; cursor:pointer; color:var(--ink-soft); }
.salg-kort .pil button:hover{ border-color:var(--blue-600); color:var(--blue-700); }
.salg-steg{ display:inline-block; padding:2px 8px; border-radius:999px; font-size:11px; font-weight:700; background:var(--blue-100); color:var(--blue-700); }
.salg-akt{ border-top:1px solid var(--line-soft); padding:10px 0; }
.salg-akt .h{ font-size:11.5px; color:var(--ink-soft); margin-bottom:3px; }
.salg-akt .tx{ white-space:pre-wrap; font-size:13px; }
.salg-2kol{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:16px; align-items:start; }
@media (max-width:900px){ .salg-2kol{ grid-template-columns:1fr; } }
.salg-rad{ cursor:pointer; }
.salg-rad:hover td{ background:var(--blue-050); }
.salg-2kol .grid, .modal-card .grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.salg-2kol input, .salg-2kol select, .salg-2kol textarea, .modal-card input, .modal-card select, .modal-card textarea{ min-width:0; width:100%; box-sizing:border-box; }
.salg-filter input, .salg-filter select{ width:100%; box-sizing:border-box; }
.salg-lenke{ color:var(--blue-700); font-weight:600; }
@media (max-width:640px){ .salg-2kol .grid, .modal-card .grid{ grid-template-columns:1fr; } }
.salg-kort .m.salg-ingen{ color:var(--warn); }

/* v273: tilbud i Salg */
.salg-tlinjer { margin: 8px 0; }
.salg-tlinje { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 0.8fr) minmax(0, 0.9fr) minmax(0, 1.2fr) minmax(0, 0.9fr) 36px; gap: 6px; margin-bottom: 6px; align-items: center; }
.salg-tlinje input { width: 100%; box-sizing: border-box; min-width: 0; }
.salg-tlinje-h { font-size: 11px; font-weight: 700; color: var(--ink-soft, #6E8CA0); text-transform: uppercase; }
.salg-tsum { margin: 10px 0; text-align: right; line-height: 1.7; }
.salg-tsum .tot { font-size: 16px; }
.salg-tilbudrad .tx { margin-bottom: 2px; }
@media (max-width: 640px) { .salg-tlinje { grid-template-columns: 1fr 1fr; } .salg-tlinje-h { display: none; } .salg-tlinje > :first-child { grid-column: 1 / -1; } }

/* v274: rapporter i Salg */
.salg-rbar{ height:6px; background:var(--line,#C9D8E0); border-radius:3px; margin-bottom:4px; min-width:60px; }
.salg-rbar span{ display:block; height:100%; background:var(--brand,#1F4E79); border-radius:3px; }
.salg-maaneder{ display:flex; gap:6px; align-items:flex-end; overflow-x:auto; padding-bottom:4px; }
.salg-mkol{ flex:1 0 44px; text-align:center; font-size:11px; color:var(--ink-soft,#6E8CA0); }
.salg-mkol .v{ height:14px; font-size:10px; }
.salg-mkol .b{ height:110px; display:flex; align-items:flex-end; background:var(--bg-soft,rgba(0,0,0,.03)); border-radius:4px; }
.salg-mkol .b span{ display:block; width:100%; background:var(--brand,#1F4E79); border-radius:4px 4px 0 0; min-height:0; }
.salg-mkol .n{ margin-top:4px; line-height:1.1; }
.salg-mkol .t{ font-size:10px; margin-top:2px; }
.salg-rtab th, .salg-rtab td{ white-space:nowrap; }
.salg-rtab .salg-rbar{ width:140px; }

/* v277: anleggsregister */
.anl-verktoy{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin:12px 0 14px; }
.anl-verktoy .anl-sok{ flex:1 1 220px; min-width:180px; max-width:340px; }
.anl-verktoy select{ max-width:220px; }
.anl-liste{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:12px; }
.anl-liste .empty{ grid-column:1/-1; }
.anl-kort{ display:flex; flex-direction:column; justify-content:flex-start; align-items:stretch; text-align:left; background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:12px 14px; cursor:pointer; font:inherit; color:inherit; width:100%; }
.anl-kort:hover{ border-color:var(--blue-600); }
.anl-kort-topp{ display:flex; justify-content:space-between; align-items:baseline; gap:8px; }
.anl-kort-topp h2{ margin:0; font-size:20px; }
.anl-kat{ font-size:11px; font-weight:700; color:var(--blue-700); background:var(--blue-100); border-radius:999px; padding:2px 8px; white-space:nowrap; }
.anl-linje{ font-size:12.5px; color:var(--ink-soft); margin-top:4px; }
.anl-merker{ display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.anl-merke{ font-size:11px; font-weight:700; border-radius:999px; padding:2px 8px; white-space:nowrap; }
.anl-bra{ background:var(--good-bg); color:var(--good); }
.anl-snart{ background:var(--warn-bg); color:var(--warn); }
.anl-darlig{ background:var(--bad-bg); color:var(--bad); }
.anl-stille{ background:var(--blue-100); color:var(--ink-soft); }
.anl-tallrad{ display:flex; gap:10px; flex-wrap:wrap; margin-top:8px; font-size:11.5px; color:var(--ink-soft); }
.anl-tall-avvik{ color:var(--bad); font-weight:700; }
.anl-detalj-topp{ margin:12px 0; }
.anl-hode{ padding:16px; margin-bottom:12px; }
.anl-spes{ display:grid; grid-template-columns:max-content 1fr; gap:4px 16px; margin:12px 0 0; font-size:13px; }
.anl-spes dt{ color:var(--ink-soft); }
.anl-spes dd{ margin:0; font-weight:600; }
.anl-notat{ margin:12px 0 0; font-size:13px; white-space:pre-wrap; }
.anl-knapper{ display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }
.anl-seksjon{ padding:14px 16px; margin-bottom:12px; }
.anl-seksjon-topp{ display:flex; justify-content:space-between; align-items:center; gap:8px; margin-bottom:6px; }
.anl-seksjon-topp h3{ margin:0; font-size:15px; }
.anl-tom, .anl-hint{ color:var(--ink-soft); font-size:12px; margin:4px 0; }
.anl-hendelse{ border-top:1px solid var(--line-soft); padding:8px 0; font-size:13px; }
.anl-hendelse-topp{ display:flex; justify-content:space-between; gap:8px; }
.anl-koblet{ display:flex; justify-content:space-between; align-items:center; gap:8px; border-top:1px solid var(--line-soft); padding:8px 0; font-size:13px; }
.anl-koblet-tekst{ min-width:0; overflow-wrap:anywhere; }
.btn.anl-slett{ color:var(--bad); border-color:var(--bad); }
.btn.anl-slett:hover{ background:var(--bad-bg); }
.anl-koblet a{ color:var(--blue-700); }
.anl-stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:10px; margin-bottom:12px; }
.anl-stat{ display:flex; flex-direction:column; align-items:flex-start; text-align:left; gap:2px; background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:10px 14px; cursor:pointer; font:inherit; color:inherit; }
.anl-stat:hover, .anl-stat.valgt{ border-color:var(--blue-600); }
.anl-stat.valgt{ box-shadow:0 0 0 1px var(--blue-600) inset; }
.anl-stat-tall{ font-size:22px; font-weight:800; }
.anl-stat-darlig .anl-stat-tall{ color:var(--bad); }
.anl-stat-snart .anl-stat-tall{ color:var(--warn); }
.anl-stat-tekst{ font-size:12px; color:var(--ink-soft); }
.anl-frist{ display:flex; align-items:center; gap:10px; width:100%; text-align:left; background:none; border:0; border-top:1px solid var(--line-soft); padding:8px 0; cursor:pointer; font:inherit; color:inherit; flex-wrap:wrap; }
.anl-frist:hover .anl-frist-navn{ text-decoration:underline; }
.anl-frist-dato{ font-size:12.5px; font-weight:700; min-width:78px; }
.anl-frist-navn{ font-size:13px; min-width:0; overflow-wrap:anywhere; }

/* v280: import av anlegg og AI-lesing av PDF */
.anl-tabell-wrap{ overflow-x:auto; border:1px solid var(--line); border-radius:10px; margin:10px 0; max-height:360px; overflow-y:auto; }
.anl-tabell{ border-collapse:collapse; width:100%; font-size:12.5px; }
.anl-tabell th{ position:sticky; top:0; background:var(--blue-100); text-align:left; padding:6px 8px; white-space:nowrap; }
.anl-tabell td{ padding:5px 8px; border-top:1px solid var(--line-soft); vertical-align:top; }
.anl-feil{ color:var(--bad); font-size:13px; }
.anl-ai-info{ background:var(--blue-100); color:var(--ink-soft); border-radius:10px; padding:8px 12px; font-size:12.5px; margin:0 0 10px; }
.anl-ai-info.anl-ai-av{ background:var(--warn-bg); color:var(--warn); }
.anl-ai-vent{ color:var(--ink-soft); font-size:13px; }
.anl-ai-sammendrag{ font-size:13px; margin:10px 0 4px; }
.anl-forslag-liste{ display:flex; flex-direction:column; gap:10px; margin-top:8px; }
.anl-forslag{ border:1px solid var(--line); border-radius:12px; padding:10px 12px; background:var(--surface); }
.anl-forslag-topp{ display:flex; justify-content:space-between; align-items:center; gap:8px; }
.anl-forslag-felt{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 12px; margin-top:6px; }
.anl-forslag-felt .anl-bred{ grid-column:1/-1; }
.anl-avkryss{ display:flex; align-items:center; gap:6px; font-size:12.5px; margin-top:6px; }
.anl-avkryss input{ width:auto; }
@media (max-width:560px){ .anl-forslag-felt{ grid-template-columns:1fr; } }

/* v281: søk i portalen (Ctrl+K) */
.sok-knapp{ margin-left:auto; display:flex; align-items:center; gap:8px; border:1px solid var(--line); background:var(--surface); color:var(--ink-soft);
  border-radius:8px; padding:6px 10px; font:inherit; font-size:13px; cursor:text; min-height:36px; width:min(100%,380px); flex:0 1 380px; text-align:left; }
.sok-knapp-tekst{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bygg-filter{ margin:0 0 10px; }
.bygg-filter input{ width:100%; max-width:240px; }
.sok-knapp:hover{ border-color:var(--blue-600); color:var(--ink); }
.sok-knapp kbd{ font-family:var(--mono); font-size:10.5px; border:1px solid var(--line); border-radius:5px; padding:1px 5px; background:var(--surface); color:var(--ink-soft); }
.sok-overlay{ position:fixed; inset:0; z-index:1200; background:rgba(8,31,53,.45); display:flex; align-items:flex-start; justify-content:center; padding:10vh 16px 16px; }
.sok-boks{ width:100%; max-width:640px; max-height:76vh; display:flex; flex-direction:column; background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:12px; box-shadow:0 18px 50px rgba(8,31,53,.35); overflow:hidden; }
.sok-input-rad{ display:flex; align-items:center; gap:8px; padding:10px 12px; border-bottom:1px solid var(--line); }
.sok-input{ flex:1; min-width:0; border:0; outline:0; background:transparent; color:var(--ink); font:inherit; font-size:15px; padding:6px 4px; }
.sok-input:focus-visible{ outline:0; }
.sok-input-rad:focus-within{ box-shadow:inset 0 -2px 0 var(--blue-600); }
.sok-lukk{ border:1px solid var(--line); background:var(--paper); color:var(--ink-soft); border-radius:6px; font-family:var(--mono); font-size:10.5px; padding:3px 7px; cursor:pointer; }
.sok-liste{ overflow-y:auto; padding:6px 0; flex:1; min-height:60px; }
.sok-gruppe{ padding:8px 16px 4px; font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); }
.sok-antall{ font-weight:400; text-transform:none; letter-spacing:0; margin-left:6px; }
.sok-rad{ display:flex; flex-direction:column; gap:1px; padding:8px 16px; cursor:pointer; border-left:3px solid transparent; }
.sok-rad.aktiv{ background:var(--paper); border-left-color:var(--blue-600); }
.sok-tittel{ font-size:13.5px; font-weight:600; overflow-wrap:anywhere; }
.sok-under{ font-size:11.5px; color:var(--ink-soft); overflow-wrap:anywhere; }
.sok-tom{ padding:18px 16px; font-size:13px; color:var(--ink-soft); }
.sok-status{ padding:7px 16px; font-size:11.5px; color:var(--ink-soft); border-top:1px solid var(--line-soft); min-height:18px; }
@media (max-width:760px){
  .sok-knapp kbd{ display:none; }
  .sok-overlay{ padding-top:max(10px, env(safe-area-inset-top)); }
  .sok-boks{ max-height:88vh; }
  .sok-input{ font-size:16px; }
}

/* v283: enklere oversikt, og farger som betyr noe.
   Fargespråk for bokser: blå = informasjon, grønn = i orden, gul = venter eller bør følges opp, rød = krever handling, grå = ingenting å gjøre.
   Fargen står på tall, venstrekant og flate, så status leses uten å lese teksten. */
.tone-good{ --tone:var(--good); --tone-bg:var(--good-bg); }
.tone-warn{ --tone:var(--warn); --tone-bg:var(--warn-bg); }
.tone-bad{ --tone:var(--bad); --tone-bg:var(--bad-bg); }
.tone-info{ --tone:var(--blue-600); --tone-bg:var(--blue-050); }
.card.stat[class*="tone-"]{ position:relative; overflow:hidden; padding-left:22px; background:var(--tone-bg); border-color:var(--tone); }
.card.stat[class*="tone-"]::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:6px; background:var(--tone); }
.card.stat.tone-info .v{ color:var(--blue-700); }
.card.stat[class*="tone-"] .k{ color:var(--tone); font-weight:700; }
:root[data-theme="dark"] .card.stat.tone-info .v{ color:#a9cdee; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .card.stat.tone-info .v{ color:#a9cdee; } }

/* Modulkort: farget flate bare når det er aktivitet, ellers dempet grått */
.mod-tile.mod-aktiv{ background:linear-gradient(var(--mod-c-bg), var(--mod-c-bg)), var(--surface); border-color:var(--mod-c); }
.mod-tile.mod-aktiv .mod-num{ color:var(--mod-c); font-size:30px; }
.mod-tile.mod-aktiv .mod-label{ color:var(--ink); font-size:13.5px; font-weight:700; }
.mod-tile.mod-tom{ background:var(--blue-050); }
.mod-tile.mod-tom::before{ background:var(--line); }
.mod-tile.mod-tom .mod-num{ color:var(--ink-soft); font-size:30px; opacity:.7; }
.mod-tile.mod-tom .mod-icon{ background:var(--blue-100); filter:grayscale(1); opacity:.65; }
.mod-tile.mod-tom .mod-label{ font-size:13.5px; font-weight:700; opacity:.8; }
.mod-tile .mod-sub{ display:flex; gap:6px; flex-wrap:wrap; }
.mod-tile .mod-tot::before{ content:"·"; margin-right:6px; }

/* Avslutt bygg er sjelden og irreversibel i listene: stille tekstknapp i stedet for en full knapp på hver rad */
.btn.btn-quiet{ background:transparent; border-color:transparent; color:var(--ink-soft); font-weight:600; }
.btn.btn-quiet:hover, .btn.btn-quiet:focus-visible{ background:var(--bad-bg); border-color:var(--bad); color:var(--bad); }
.dash-section-title{ margin-top:38px; }

/* v283: «Krever handling nå» øverst i Oversikt */
.akt-panel{ margin:0 0 6px; }
.akt-tittel{ margin:22px 0 10px; }
.akt-liste{ display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:10px; }
.akt-boks{ position:relative; overflow:hidden; display:flex; align-items:center; gap:14px; text-align:left; cursor:pointer;
  background:var(--tone-bg); border:1px solid var(--tone); border-radius:12px; padding:12px 16px 12px 22px; color:var(--ink);
  font:inherit; transition:transform .12s ease, box-shadow .12s ease; }
.akt-boks::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:6px; background:var(--tone); }
.akt-boks:hover{ transform:translateY(-1px); box-shadow:0 6px 16px -10px rgba(14,42,62,.35); }
.akt-boks:focus-visible{ outline:2px solid var(--tone); outline-offset:2px; }
.akt-tall{ font-family:var(--disp); font-size:28px; font-weight:800; color:var(--tone); min-width:34px; line-height:1; }
.akt-tekst{ flex:1; font-size:13.5px; font-weight:600; line-height:1.35; }
.akt-pil{ color:var(--tone); font-size:15px; opacity:.7; }
.akt-boks:hover .akt-pil{ opacity:1; }
.akt-ok{ grid-column:1 / -1; position:relative; overflow:hidden; border:1px solid var(--tone); background:var(--tone-bg); border-radius:12px; padding:14px 18px 14px 24px; font-size:14px; }
.akt-ok::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:6px; background:var(--tone); }
.akt-ok b{ color:var(--tone); }

/* v283: gruppeoverskrifter i menyen */
.nav-seksjon{ font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:#8aa0b2; padding:12px 10px 3px; font-weight:700; }
.nav-seksjon[hidden]{ display:none; }
body #app .nav-seksjon{ font-size:13px; }

/* v283: analyseskjermen */
.card.an-hode{ position:relative; overflow:hidden; padding-left:24px; border-color:var(--tone); }
.card.an-hode::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:6px; background:var(--tone); }
.an-prog{ display:inline-block; width:110px; height:8px; border-radius:99px; background:var(--line-soft); overflow:hidden; vertical-align:middle; }
.an-prog-fyll{ display:block; height:100%; background:var(--tone, var(--blue-600)); border-radius:99px; }
.an-lagre-info{ position:relative; overflow:hidden; margin:18px 0 4px; padding:12px 16px 12px 22px; border:1px solid var(--tone); background:var(--tone-bg); border-radius:10px; font-size:13.5px; }
.an-lagre-info::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:5px; background:var(--tone); }
.an-lagre-info b{ color:var(--blue-700); }
:root[data-theme="dark"] .an-lagre-info b{ color:#a9cdee; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .an-lagre-info b{ color:#a9cdee; } }
details.an-sek{ margin-top:16px; border-top:1px solid var(--line); padding-top:6px; }
details.an-sek > summary{ cursor:pointer; list-style:none; font-family:var(--disp); font-size:15.5px; font-weight:800; padding:8px 0; color:var(--ink); display:flex; align-items:center; gap:8px; }
details.an-sek > summary::-webkit-details-marker{ display:none; }
details.an-sek > summary::before{ content:"›"; display:inline-block; transition:transform .12s; color:var(--ink-soft); font-size:18px; width:14px; }
details.an-sek[open] > summary::before{ transform:rotate(90deg); }

/* v286: pipelines i Salg, med farger etter FASE (se FASER i server/crm-pipelines.js).
   Farge og ikon følger stegets fase, ikke pipelinen eller stegets navn. Dermed betyr samme farge det samme i alle pipelines, også de som kommer senere.
   Åpne faser er en ordnet skala (ordinal): én blå fargetone som blir mørkere i lys modus og lysere i mørk modus jo lenger saken er kommet.
   Lukkede faser er utfall med reserverte statusfarger (grønn, rød, grå). Fase vises aldri med farge alene: ikon, tekst og tittelattributt følger alltid med.
   Ikonene: kvart, halv og tre kvart sirkel for de tre åpne fasene, hake, kryss og strek for utfallene.
   Fargene er validert med scripts/validate_palette.js (ordinal skala, ≥ 3:1 mot kolonne- og kortflate, i lys og mørk modus) og målt i scripts/t286ui.js.
   Tekst står alltid i vanlig tekstfarge (--ink), aldri i fasefargen; fargen bæres av ikon, toppkant og kant. */
:root{
  --fase-inntak:#3987e5; --fase-arbeid:#1c5cab; --fase-beslutning:#0d366b;
  --fase-vunnet:#2a7050; --fase-tapt:#b23b3b; --fase-avsluttet:#5f666c;
  --fase-pa:#ffffff;
  --fase-vunnet-bg:#e7f3ec; --fase-tapt-bg:#fbe9e9; --fase-avsluttet-bg:#eceef0;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --fase-inntak:#3987e5; --fase-arbeid:#6da7ec; --fase-beslutning:#b7d3f6;
  --fase-vunnet:#7fd6a4; --fase-tapt:#f59a9a; --fase-avsluttet:#a9b4bd;
  --fase-pa:#0b1c2c;
  --fase-vunnet-bg:#12352a; --fase-tapt-bg:#3a1f23; --fase-avsluttet-bg:#1b2d3f;
} }
:root[data-theme="dark"]{
  --fase-inntak:#3987e5; --fase-arbeid:#6da7ec; --fase-beslutning:#b7d3f6;
  --fase-vunnet:#7fd6a4; --fase-tapt:#f59a9a; --fase-avsluttet:#a9b4bd;
  --fase-pa:#0b1c2c;
  --fase-vunnet-bg:#12352a; --fase-tapt-bg:#3a1f23; --fase-avsluttet-bg:#1b2d3f;
}
.salg-fase-inntak{ --f:var(--fase-inntak); }
.salg-fase-arbeid{ --f:var(--fase-arbeid); }
.salg-fase-beslutning{ --f:var(--fase-beslutning); }
.salg-fase-vunnet{ --f:var(--fase-vunnet); --f-bg:var(--fase-vunnet-bg); }
.salg-fase-tapt{ --f:var(--fase-tapt); --f-bg:var(--fase-tapt-bg); }
.salg-fase-avsluttet{ --f:var(--fase-avsluttet); --f-bg:var(--fase-avsluttet-bg); }
.salg-fikon{ color:var(--f, var(--ink-soft)); flex:none; display:inline-block; vertical-align:-2px; }
/* kolonner i brettet: toppkant i fasefarge, utfallskolonner har tonet bakgrunn og kant */
.salg-kol{ background:var(--f-bg, var(--blue-050)); border-top:4px solid var(--f, var(--line-soft)); }
.salg-kol.over{ outline-color:var(--f, var(--blue-600)); }
.salg-fase-vunnet.salg-kol, .salg-fase-tapt.salg-kol, .salg-fase-avsluttet.salg-kol{ border-color:var(--f); }
.salg-kol-h{ color:var(--ink); }
.salg-kol-h small{ color:var(--ink-soft); }
.salg-kol-navn{ display:inline-flex; align-items:center; gap:6px; }
.salg-fase-vunnet .salg-kort, .salg-fase-tapt .salg-kort, .salg-fase-avsluttet .salg-kort{ border-left:4px solid var(--f); }
/* stegmerker i lister og saksvisning */
.salg-steg{ display:inline-flex; align-items:center; gap:5px; padding:2px 9px 2px 7px; border-radius:999px; font-size:11px; font-weight:700; background:var(--f-bg, var(--blue-100)); color:var(--ink); border:1px solid var(--f, var(--line)); }
/* fargeforklaring under brett og liste */
.salg-fase-forklaring{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 16px; margin:14px 2px 0; font-size:12px; color:var(--ink-soft); }
.salg-fase-forklaring .salg-fase-tittel{ font-weight:600; }
.salg-fase-punkt{ display:inline-flex; align-items:center; gap:6px; color:var(--ink); font-weight:600; }
/* pipeline-faner: nøytrale. Pipelinens identitet er navnet, ikke en farge, slik at ingen farge betyr to ting. */
.salg-pipetabs{ display:flex; gap:8px; flex-wrap:wrap; margin:0 0 6px; }
.salg-pipetab{ display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line); background:var(--surface); color:var(--ink);
  padding:8px 14px; border-radius:10px; font:inherit; font-size:13px; font-weight:700; cursor:pointer; min-height:38px; }
.salg-pipetab:hover{ border-color:var(--blue-600); }
.salg-pipetab.sel{ background:var(--blue-700); border-color:var(--blue-700); color:#fff; }
.salg-pipetab .tall{ min-width:22px; text-align:center; padding:1px 7px; border-radius:999px; font-size:11.5px; font-weight:700; background:var(--blue-100); color:var(--ink); }
.salg-pipetab.sel .tall{ background:#fff; color:var(--blue-800); }
/* «N nye» = venter på første handling. Gult er reservert for «krever oppmerksomhet», ikke for en fase. */
.salg-pipetab .venter{ padding:1px 8px; border-radius:999px; font-size:11px; font-weight:700; background:var(--warn-bg); color:var(--warn); border:1px solid var(--warn); }
.salg-pipetab.sel .venter{ background:#fff; color:#6b3a07; border-color:#fff; }
.salg-pipe-besk{ margin:0 0 12px; }
.salg-pipechip{ display:inline-block; padding:2px 9px; border-radius:999px; font-size:11px; font-weight:700; background:var(--surface); color:var(--ink); border:1px solid var(--ink-soft); }
.salg-kort .pil .salg-tilsalg{ font-size:11.5px; font-weight:700; padding:2px 9px; color:var(--ink); border-color:var(--blue-600); }
.salg-kort .pil .salg-tilsalg:hover{ background:var(--blue-100); color:var(--ink); }
@media (max-width:560px){ .salg-pipetab{ flex:1 1 100%; justify-content:space-between; } }
/* mørk modus for det som ikke følger faretokenene */
@media (prefers-color-scheme: dark){
:root:not([data-theme="light"]) .salg-pipetab{ border-color:#3d5368; }
:root:not([data-theme="light"]) .salg-pipetab.sel{ border-color:var(--blue-700); }
:root:not([data-theme="light"]) .salg-pipetab:not(.sel) .venter{ background:#3a2a0e; color:#f2b866; border-color:#f2b866; }
:root:not([data-theme="light"]) .salg-pipetab.sel .venter{ background:#fff; color:#6b3a07; border-color:#fff; }
:root:not([data-theme="light"]) .salg-kort .pil .salg-tilsalg{ border-color:#6fa4cf; }
:root:not([data-theme="light"]) .salg-kort .m.bad{ color:#f59a9a; }
:root:not([data-theme="light"]) .salg-kort .m.salg-ingen{ color:#f2b866; }
}
:root[data-theme="dark"] .salg-pipetab{ border-color:#3d5368; }
:root[data-theme="dark"] .salg-pipetab.sel{ border-color:var(--blue-700); }
:root[data-theme="dark"] .salg-pipetab:not(.sel) .venter{ background:#3a2a0e; color:#f2b866; border-color:#f2b866; }
:root[data-theme="dark"] .salg-pipetab.sel .venter{ background:#fff; color:#6b3a07; border-color:#fff; }
:root[data-theme="dark"] .salg-kort .pil .salg-tilsalg{ border-color:#6fa4cf; }
:root[data-theme="dark"] .salg-kort .m.bad{ color:#f59a9a; }
:root[data-theme="dark"] .salg-kort .m.salg-ingen{ color:#f2b866; }
/* v286: pene linjeskift */
.salg-steg{ white-space:nowrap; }
.salg-kol-h{ flex-wrap:wrap; }
.salg-kol-navn > span{ white-space:nowrap; }

/* v292: e-post i CRM */
.salg-akt-epost{ border-left:3px solid var(--line); padding-left:10px; margin-left:-2px; }
.chip.salg-epost-inn{ background:#e8f3ec; color:#1d5b36; }
.chip.salg-epost-ut{ background:#e6eef7; color:#1e4a78; }
:root[data-theme="dark"] .chip.salg-epost-inn{ background:#1d3a2a; color:#9fd8b4; }
:root[data-theme="dark"] .chip.salg-epost-ut{ background:#1b3350; color:#a9c8ea; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .chip.salg-epost-inn{ background:#1d3a2a; color:#9fd8b4; } :root:not([data-theme="light"]) .chip.salg-epost-ut{ background:#1b3350; color:#a9c8ea; } }
.salg-epost-tekst{ white-space:pre-wrap; font-size:13px; border:1px solid var(--line); border-radius:8px; padding:10px 12px; background:var(--surface); margin-top:6px; max-height:360px; overflow:auto; overflow-wrap:anywhere; }
.salg-epost-hele{ margin-top:8px; }
.salg-epost-merke{ display:inline-block; margin-left:6px; min-width:18px; padding:0 6px; border-radius:999px; background:var(--bad); color:#fff; font-size:11px; font-weight:700; line-height:18px; text-align:center; }
.salg-epost-adr{ user-select:all; }

/* v293: vedlikeholdsplan med tidslinje, forslag og kostnad per år */
.vp-verktoy{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:12px; }
.vp-vis{ margin-left:auto; display:inline-flex; border:1px solid var(--line); border-radius:8px; overflow:hidden; }
.vp-vis-knapp{ border:0; background:var(--surface); color:var(--ink-soft); padding:7px 14px; font:inherit; font-size:13px; cursor:pointer; }
.vp-vis-knapp + .vp-vis-knapp{ border-left:1px solid var(--line); }
.vp-vis-knapp.aktiv{ background:var(--blue-700); color:#fff; }
.vp-filter{ display:flex; gap:14px; align-items:center; flex-wrap:wrap; margin-bottom:14px; }
.vp-filter input[type=text]{ max-width:360px; width:100%; }
.vp-sjekk{ font-size:13px; color:var(--ink-soft); display:inline-flex; align-items:center; gap:6px; cursor:pointer; }
.vp-forslag{ border:1px solid var(--warn); background:var(--warn-bg); border-radius:12px; padding:14px 16px; margin-bottom:16px; }
.vp-forslag-topp{ display:flex; gap:12px; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; margin-bottom:6px; }
.vp-forslag-rad{ display:flex; gap:12px; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; padding:10px 0; border-top:1px solid color-mix(in srgb, var(--warn) 30%, transparent); }
.vp-forslag-tekst{ flex:1 1 320px; min-width:0; }
.vp-forslag-tekst details{ margin-top:4px; font-size:13px; }
.vp-forslag-tekst summary{ cursor:pointer; color:var(--blue-700); }
.vp-forslag-knapper{ display:flex; gap:6px; flex-wrap:wrap; }
.vp-nokkel{ display:grid; grid-template-columns:repeat(auto-fit, minmax(190px, 1fr)); gap:10px; margin-bottom:18px; }
.vp-kort{ background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:12px 14px; }
.vp-kort-t{ font-size:12px; color:var(--ink-soft); margin-bottom:4px; }
.vp-kort-v{ font-size:18px; font-weight:700; color:var(--ink); overflow-wrap:anywhere; }
.vp-kort.vp-forfalt{ border-color:var(--bad); }
.vp-kort.vp-forfalt .vp-kort-v{ color:var(--bad); }
.vp-h{ font-size:14px; margin:0 0 8px; color:var(--ink); }
.vp-soyler{ background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:12px 14px; margin-bottom:18px; display:grid; gap:6px; }
.vp-soyle-rad{ display:grid; grid-template-columns:64px 1fr minmax(120px, auto); gap:10px; align-items:center; }
.vp-soyle-navn{ font-size:13px; font-weight:600; color:var(--ink); }
.vp-soyle-spor{ height:12px; }
.vp-soyle-fyll{ height:12px; background:var(--blue-600); border-radius:2px 6px 6px 2px; min-width:3px; }
.vp-soyle-fyll.forfalt{ background:var(--bad); }
.vp-soyle-sum{ font-size:12.5px; color:var(--ink-soft); text-align:right; white-space:nowrap; }
.vp-aar{ background:var(--surface); border:1px solid var(--line); border-radius:12px; margin-bottom:12px; overflow:hidden; }
.vp-aar.forfalt{ border-color:var(--bad); }
.vp-aar-hode{ display:flex; justify-content:space-between; gap:10px; align-items:baseline; flex-wrap:wrap; padding:10px 14px; background:var(--paper); border-bottom:1px solid var(--line-soft); }
.vp-aar-hode h3{ margin:0; font-size:15px; }
.vp-aar.forfalt .vp-aar-hode h3{ color:var(--bad); }
.vp-tiltak{ display:grid; grid-template-columns:minmax(0, 1fr) minmax(130px, auto) 130px auto; gap:10px 14px; align-items:center; padding:10px 14px; border-top:1px solid var(--line-soft); }
.vp-tiltak:first-of-type{ border-top:0; }
.vp-aar-hode + .vp-tiltak{ border-top:0; }
.vp-tiltak.utfort .vp-tiltak-tittel{ text-decoration:line-through; color:var(--ink-soft); }
.vp-tiltak-tittel{ font-weight:600; overflow-wrap:anywhere; }
.vp-tiltak-belop{ font-size:13.5px; text-align:right; }
.vp-status-valg{ width:100%; font-size:13px; padding:5px 6px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); }
.chip.vp-tg{ background:var(--warn-bg); color:var(--warn); }
.chip.vp-tg3{ background:var(--bad-bg); color:var(--bad); }
.chip.vp-kg{ background:var(--blue-100); color:var(--blue-700); }
@media (max-width:720px){
  .vp-vis{ margin-left:0; }
  .vp-tiltak{ grid-template-columns:1fr auto; }
  .vp-tiltak-belop{ text-align:left; grid-column:1; }
  .vp-tiltak-status{ grid-column:1 / -1; }
  .vp-soyle-rad{ grid-template-columns:52px 1fr; }
  .vp-soyle-sum{ grid-column:1 / -1; text-align:left; }
}
.vp-sep{ margin:0 2px; color:var(--ink-soft); }
.vp-verktoy a.btn{ text-decoration:none; }
.vp-tiltak .btn{ justify-self:start; }

/* v306: enklere hero, fordelsprogram bare på driftssiden, kortere funksjonsliste i prisboksen */
body:not(.landing-drift) .landing-kun-drift{ display:none !important; }
.landing-hero-copy .landing-cta-row{ align-items:center; gap:12px 22px; }
.landing-tekstlenke{
  background:none; border:0; padding:6px 2px; margin:0; font:inherit; font-size:16px; font-weight:600; color:#fff;
  text-decoration:underline; text-underline-offset:4px; cursor:pointer;
}
.landing-tekstlenke:hover{ text-decoration-thickness:2px; }
.landing-tekstlenke:focus-visible{ outline:2px solid #fff; outline-offset:3px; border-radius:4px; }
.landing-sekundar.landing-eksempel{ margin-top:6px; }
.pk-mer[hidden]{ display:none; }
.pk-mer-knapp{
  background:none; border:0; padding:8px 0 0; margin:0; font:inherit; font-size:15px; font-weight:600; color:var(--blue-700);
  text-decoration:underline; text-underline-offset:3px; cursor:pointer;
}
.pk-mer-knapp:focus-visible{ outline:2px solid var(--blue-700); outline-offset:3px; border-radius:4px; }
.pk-mer-knapp{ align-self:flex-start; }

/* v307: to eksempelrapporter (NS 3600 og NS 3424) */
.landing-sekundar.landing-eksempel{ align-items:center; }
.landing-sekundar.landing-eksempel span{ opacity:.85; font-weight:500; }
.landing-feature .lf-eksempel{ display:inline-block; margin-top:-6px; font-size:15px; font-weight:600; color:var(--blue-700); text-decoration:underline; text-underline-offset:3px; }

/* v308: fagområder under Funksjoner på Fagportal-forsiden */
.lf-fagomr-wrap{ margin:56px 0 36px; text-align:center; }
.lf-fagomr-wrap h3{ font-size:26px; margin:0 0 8px; color:var(--ink); }
.lf-fagomr-wrap > p{ max-width:60ch; margin:0 auto 34px; color:var(--ink-soft); line-height:1.6; font-size:17px; }
.lf-fagomr{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:30px 22px; text-align:left; }
.lf-fagomr li{ display:flex; flex-direction:column; gap:4px; }
.lf-fagomr .ik{ display:flex; width:56px; height:56px; border-radius:15px; background:#e8eef6; color:var(--blue-700); align-items:center; justify-content:center; margin-bottom:10px; }
.lf-fagomr b{ font-size:18px; color:var(--ink); }
.lf-fagomr li > span:last-child{ color:var(--ink-soft); font-size:15px; line-height:1.5; }
@media (max-width:900px){ .lf-fagomr{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px 16px; } }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .lf-fagomr .ik{ background:rgba(255,255,255,.08); color:#9fc3ee; } }
:root[data-theme="dark"] .lf-fagomr .ik{ background:rgba(255,255,255,.08); color:#9fc3ee; }

/* v309: Driftsportalens forside: nytt hero, funksjonsrader med skjermbilder, anbefalt pakke, fordelsprogram kun for styret */
.landing-hero-copy .landing-cta-row .btn.landing-btn-demo{ background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.7); }
.landing-hero-copy .landing-cta-row .btn.landing-btn-demo:hover{ background:rgba(255,255,255,.12); }
.landing-hero-copy .landing-cta-row .btn.landing-btn-demo[hidden]{ display:none; }
.lf-rad{ display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:44px; align-items:center; margin:0 0 56px; }
.lf-rad-omvendt .lf-rad-tekst{ order:2; }
.lf-rad-omvendt .lf-rad-bilde{ order:1; }
.lf-rad-omvendt{ grid-template-columns:minmax(0,7fr) minmax(0,5fr); }
.lf-rad-tekst .lf-eyebrow{ display:inline-block; margin-bottom:8px; }
.lf-rad-tekst h3{ font-size:28px; line-height:1.2; margin:0 0 12px; color:var(--ink); }
.lf-rad-tekst p{ font-size:17px; line-height:1.6; color:var(--ink-soft); margin:0 0 14px; }
.lf-rad-punkter{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; }
.lf-rad-punkter li{ position:relative; padding-left:28px; font-size:16px; line-height:1.5; color:var(--ink); }
.lf-rad-punkter li::before{
  content:""; position:absolute; left:0; top:3px; width:18px; height:18px; border-radius:50%; background:var(--blue-700);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat;
}
.lf-rad-bilde{ margin:0; border-radius:16px; overflow:hidden; border:1px solid var(--line-soft); box-shadow:0 18px 44px rgba(8,31,53,.14); background:var(--surface); }
.lf-rad-bilde img{ display:block; width:100%; height:auto; }
.lf-rad-bilde figcaption{ font-size:13px; color:var(--ink-soft); padding:8px 14px; background:var(--surface); border-top:1px solid var(--line-soft); }
.lf-flere{ gap:20px; margin-bottom:12px; }
@media (max-width:900px){
  .lf-rad, .lf-rad-omvendt{ grid-template-columns:1fr; gap:22px; margin-bottom:44px; }
  .lf-rad-omvendt .lf-rad-tekst, .lf-rad-omvendt .lf-rad-bilde{ order:0; }
  .lf-rad-tekst h3{ font-size:24px; }
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .lf-rad-punkter li::before{ background:#9fc3ee; } }
:root[data-theme="dark"] .lf-rad-punkter li::before{ background:#9fc3ee; }
/* Komplett som anbefalt pakke, de andre bak «Se alle pakker» */
.pk-kort[hidden]{ display:none; }
.pk-grid.pk-grid-en{ grid-template-columns:minmax(0,520px); justify-content:center; }
.pk .pk-alle-knapp{ display:block; margin:18px auto 0; }
.lf-fordel-en{ max-width:560px; margin:0 auto; }
.lf-rad-tekst .lf-eyebrow{ display:block; font-size:14px; font-weight:700; letter-spacing:.05em; color:var(--blue-700); text-transform:uppercase; margin-bottom:8px; }

/* v311: oppslag i registreringen (Enhetsregisteret og Kartverket) */
.ss-oppslag-hint.ss-oppslag-feil{ color:var(--bad, #b3261e); }
.ss-forslag{ list-style:none; margin:4px 0 0; padding:4px; border:1px solid var(--line-soft); border-radius:10px; background:var(--surface); box-shadow:0 8px 22px rgba(8,31,53,.12); }
.ss-forslag[hidden]{ display:none; }
.ss-forslag li{ margin:0; }
.ss-forslag button{ display:block; width:100%; text-align:left; background:none; border:0; border-radius:8px; padding:9px 10px; font:inherit; font-size:15px; color:var(--ink); cursor:pointer; }
.ss-forslag button:hover, .ss-forslag button:focus-visible{ background:var(--bg, #f2f6fa); outline:none; }

/* v312: valg mellom boenheter og areal i prisvelgeren */
.tbsp-enhet{ display:inline-flex; border:1px solid var(--line-soft); border-radius:999px; padding:3px; background:var(--surface); margin:0 0 10px; }
.tbsp-enhet button{ border:0; background:none; font:inherit; font-size:14px; font-weight:600; color:var(--ink-soft); padding:6px 14px; border-radius:999px; cursor:pointer; }
.tbsp-enhet button.aktiv{ background:var(--blue-700); color:#fff; }
.tbsp-enhet button:focus-visible{ outline:2px solid var(--blue-700); outline-offset:2px; }
.pk-enhet{ margin-top:8px; align-self:flex-start; }
.tbsp-felt .tbsp-enhet{ display:flex; width:fit-content; }