/* Accrivo Lead Intelligence – offentlig hjemmeside. Bygger på tokens i style.css. */
.pub { background: var(--land); font-size: 17px; line-height: 1.6; color: var(--tekst); }
.pub main { display: block; }
.wrap { max-width: 1240px; margin: 0 auto; padding: 0 40px; }
.skip { position: absolute; left: -9999px; top: 8px; background: var(--skifer); color: #fff; padding: 10px 14px; border-radius: 8px; z-index: 100; }
.skip:focus { left: 12px; }
.pub h1 { font-size: clamp(44px, 6.2vw, 80px); line-height: .98; letter-spacing: -0.038em; word-spacing: .03em; font-weight: 780; margin: 0; }
.pub h2 { font-size: clamp(30px, 3.4vw, 44px); line-height: 1.06; letter-spacing: -0.035em; font-weight: 740; margin: 0; }
.pub h3 { font-size: 20px; letter-spacing: -0.015em; font-weight: 680; margin: 0; }
.pub p { margin: 0; }
.pub .lead { font-size: 20px; line-height: 1.5; color: var(--tekst-2); max-width: 34em; }
.pub .btn-stor { height: 56px; font-size: 16.5px; padding: 0 26px; }
.tekstlink { font-weight: 600; text-decoration: underline; text-decoration-color: var(--linje-2); text-underline-offset: 5px; text-decoration-thickness: 1.5px; }
.tekstlink:hover { text-decoration-color: var(--tekst); }

/* ---------- Topbjælke ---------- */
.ph { position: sticky; top: 0; z-index: 30; background: rgba(255, 255, 255, .94); border-bottom: 1px solid transparent; transition: border-color .2s; }
.forside .ph { background: rgba(238, 241, 242, .94); }
.ph.scrolled { border-bottom-color: var(--linje); }
.ph .wrap { display: flex; align-items: center; height: 76px; gap: 36px; }
.logo { display: inline-flex; align-items: baseline; gap: 8px; font-weight: 800; font-size: 21px; letter-spacing: -0.035em; color: var(--tekst); }
.logo span { font-weight: 450; font-size: 14.5px; letter-spacing: 0; color: var(--sten); }
.pnav { display: flex; gap: 4px; flex: 1; }
.pnav > a, .pnav .dd > button { display: inline-flex; align-items: center; color: var(--tekst-2); font-size: 15.5px; font-weight: 520; line-height: 1.5; padding: 8px 12px; border-radius: 8px;
  background: none; border: 0; font-family: inherit; cursor: pointer; }
.pnav > a:hover, .pnav .dd > button:hover { color: var(--tekst); background: rgba(23, 35, 45, .05); }
.pnav > a.on, .pnav .dd > button.on { color: var(--tekst); font-weight: 650; }
.dd { position: relative; }
.dd-menu { position: absolute; top: calc(100% + 10px); left: -14px; width: 440px; background: #fff; border: 1px solid var(--linje);
  border-radius: 14px; box-shadow: var(--skygge-stor); padding: 10px; display: none; }
.dd:hover .dd-menu, .dd:focus-within .dd-menu { display: block; }
.dd-menu::before { content: ""; position: absolute; top: -12px; left: 0; right: 0; height: 12px; }
.dd-menu a { display: block; padding: 11px 14px; border-radius: 9px; }
.dd-menu a:hover { background: var(--flade); }
.dd-menu b { display: block; font-size: 15.5px; font-weight: 650; }
.dd-menu span { font-size: 14px; color: var(--sten); }
.ph-cta { display: flex; gap: 22px; align-items: center; }
.ph-log { font-weight: 600; font-size: 15.5px; color: var(--tekst-2); }
.ph-log:hover { color: var(--tekst); }
.ph-menu { display: none; }

/* ---------- Forsiden: kortet ---------- */
.hero { background: var(--hav); padding: 40px 0 0; overflow: hidden; }
.hero-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 40px; align-items: start; }
.hero-tekst { padding: 48px 0 64px; }
.hero h1 { font-size: clamp(40px, 4.6vw, 62px); line-height: 1.02; }
.vaerk { margin-top: 34px; border-top: 1.5px solid var(--skifer); padding-top: 22px; max-width: 600px; }
.v-felt { display: block; margin-bottom: 18px; }
.v-felt > span { display: block; font-size: 14px; font-weight: 600; margin-bottom: 8px; }
.v-felt select { height: 50px; font-size: 16.5px; font-weight: 550; border-radius: 10px; }
.v-felt em { display: block; font-style: normal; font-size: 14px; color: var(--sten); margin-top: 8px; min-height: 21px; }
.v-reg { display: flex; flex-wrap: wrap; gap: 6px; }
.v-reg button { height: 38px; padding: 0 13px; border-radius: 8px; border: 1px solid var(--linje-2); background: var(--land); font: inherit; font-size: 14.5px; font-weight: 550; color: var(--tekst-2); cursor: pointer; }
.v-reg button:hover { border-color: var(--sten); color: var(--tekst); }
.v-reg button.on { background: var(--skifer); border-color: var(--skifer); color: #fff; }
.v-tal { margin: 6px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.v-tal dt { font-size: 13.5px; color: var(--sten); }
.v-tal dd { margin: 2px 0 0; font-size: 30px; font-weight: 740; letter-spacing: -0.035em; font-variant-numeric: tabular-nums; }
.v-dage { margin-top: 10px !important; font-size: 16px; color: var(--tekst-2); min-height: 26px; }
.vaerk .hero-cta { margin-top: 22px; }
.v-note { margin-top: 22px !important; font-size: 13px; color: var(--sten); max-width: 34em; }
.kort-tip { position: absolute; z-index: 4; pointer-events: none; background: var(--skifer); color: #fff; border-radius: 8px; padding: 9px 12px; font-size: 13.5px; line-height: 1.4; max-width: 230px; }
.kort-tip b { display: block; font-size: 14.5px; }
.kort-tip span { color: #b9c4ca; }
#prikkort .hit use { cursor: pointer !important; }
/* Film */
.film-vindue { position: relative; border-radius: 14px; overflow: hidden; border: 1px solid var(--linje-2); background: var(--hav); box-shadow: 0 30px 70px -30px rgba(23, 35, 45, .35); aspect-ratio: 1280 / 800; }
.film-vindue video { display: block; width: 100%; height: 100%; object-fit: cover; cursor: pointer; }
.film-play[hidden] { display: none; }
.film-play { position: absolute; left: 50%; top: 50%; width: 76px; height: 76px; margin: -38px 0 0 -38px; border-radius: 50%; border: 0; background: var(--skifer); color: #fff; display: grid; place-items: center; cursor: pointer; }
.film-play svg { width: 28px; height: 28px; margin-left: 4px; }
.film-trin { list-style: none; margin: 28px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.film-trin button { display: block; width: 100%; text-align: left; background: none; border: 0; padding: 0; font: inherit; color: var(--sten); cursor: pointer; }
.film-trin b { display: block; font-size: 18px; font-weight: 680; color: var(--tekst-2); margin: 16px 0 4px; }
.film-trin span { font-size: 15.5px; }
.film-trin button.on b { color: var(--tekst); }
.film-trin button.on span { color: var(--tekst-2); }
.fremdrift { display: block; height: 3px; background: var(--linje); border-radius: 2px; overflow: hidden; }
.fremdrift i { display: block; height: 100%; width: 0; background: var(--skifer); }
.hero-tekst .lead { margin-top: 28px; }
.hero-cta { display: flex; align-items: center; gap: 28px; margin-top: 36px; flex-wrap: wrap; }
.aflaes { margin-top: 64px; border-top: 1.5px solid var(--skifer); padding-top: 18px; max-width: 460px; }
.aflaes-sted { font-size: 15px; font-weight: 650; }
.aflaes dl { margin: 12px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 24px; }
.aflaes dt { font-size: 13.5px; color: var(--sten); }
.aflaes dd { margin: 2px 0 0; font-size: 26px; font-weight: 720; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.aflaes p { margin-top: 16px; font-size: 14px; color: var(--sten); }
.hero-kort { margin: 0 -24px 0 0; position: relative; }
.hero-kort svg { display: block; width: 100%; height: auto; max-height: 860px; }
.hero-kort figcaption { position: absolute; left: 2%; top: 6%; max-width: 230px; font-size: 13.5px; color: var(--sten); }
#prikkort .prikker use { fill: none; stroke: var(--skifer); stroke-width: 2.4; stroke-linecap: round; transition: stroke .2s, stroke-width .45s cubic-bezier(.2,.7,.2,1), opacity .2s; }
#prikkort.har-valg .prikker use { opacity: .28; }
#prikkort .prikker use.valgt { stroke: var(--fjord); opacity: 1; }
#prikkort .prikker use.hov { stroke: var(--fjord); opacity: 1; }
#prikkort .prikker use.on { stroke: var(--fjord); }
#prikkort .hit use { fill: none; stroke: transparent; stroke-width: 9; stroke-linecap: square; pointer-events: stroke; cursor: crosshair; }
#prikkort .ramme { fill: none; stroke: #c5ced3; stroke-width: 1; }
@media (prefers-reduced-motion: no-preference) {
  #prikkort .prikker use { animation: prik-ind .7s cubic-bezier(.2, .7, .2, 1) both; animation-delay: calc(var(--x) * 1.1ms); }
  @keyframes prik-ind { from { opacity: 0; } to { opacity: 1; } }
}

/* ---------- Sektioner ---------- */
.sek { padding: 120px 0; }
.sek-hav { background: var(--hav); }
.sek-skifer { background: var(--skifer); color: #e7ecee; }
.sek-hoved { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 40px; align-items: end; margin-bottom: 56px; }
.sek-hoved p { color: var(--tekst-2); font-size: 18px; max-width: 36em; }
.sek-hoved > h2:only-child { grid-column: 1 / -1; }
.skud { margin: 0; border-radius: 14px; overflow: hidden; border: 1px solid var(--linje-2); background: var(--hav); box-shadow: 0 30px 70px -30px rgba(23, 35, 45, .35); }
.skud img { display: block; width: 100%; height: auto; }
.vis { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 3fr); gap: 48px; align-items: start; }
.trin { list-style: none; margin: 0; padding: 0; counter-reset: trin; }
.skud-bred { margin-bottom: 48px; }
.trin-vandret { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
.trin-vandret li { padding-bottom: 0; }
.trin li { counter-increment: trin; position: relative; padding: 0 0 30px 46px; font-size: 16px; color: var(--tekst-2); }
.trin li::before { content: counter(trin); position: absolute; left: 0; top: -1px; width: 30px; height: 30px; border-radius: 50%;
  border: 1.5px solid var(--skifer); display: grid; place-items: center; font-weight: 700; font-size: 14px; color: var(--tekst); }
.trin b { display: block; color: var(--tekst); font-size: 18px; font-weight: 680; margin-bottom: 4px; }

.opstart { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 72px; align-items: start; }
.opstart > div p { margin: 24px 0 32px; color: var(--tekst-2); font-size: 18px; }
.tabel-to { width: 100%; border-collapse: collapse; font-size: 17px; }
.tabel-to th { background: none; text-align: left; font-size: 14px; font-weight: 600; color: var(--sten); padding: 0 0 12px; border-bottom: 1.5px solid var(--skifer); }
.tabel-to td { padding: 18px 24px 18px 0; border-bottom: 1px solid var(--linje-2); vertical-align: top; background: none !important; }
.tabel-to td:first-child { font-weight: 650; width: 42%; }
.tabel-to tr:last-child td { border-bottom: 0; }

table.brancher { width: 100%; border-collapse: collapse; font-size: 16.5px; }
table.brancher th { background: none; font-size: 14px; font-weight: 600; color: var(--sten); padding: 0 24px 12px 0; border-bottom: 1.5px solid var(--skifer); }
table.brancher td { padding: 20px 24px 20px 0; border-bottom: 1px solid var(--linje); vertical-align: top; color: var(--tekst-2); background: none !important; }
table.brancher td:first-child { width: 26%; }
table.brancher td:first-child a { font-weight: 680; color: var(--tekst); font-size: 18px; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 4px; }
table.brancher td:first-child a:hover { text-decoration-color: var(--tekst); }

.delt { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 72px; align-items: center; }
.delt p { margin-top: 22px; color: var(--tekst-2); font-size: 18px; }
.delt.omvendt { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); }

.garantier { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px; margin: 0; }
.garantier div { border-top: 1.5px solid var(--skifer); padding-top: 18px; }
.garantier dt { font-weight: 680; font-size: 18px; }
.garantier dd { margin: 8px 0 0; color: var(--tekst-2); font-size: 16px; }

.slut { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 4fr); gap: 80px; align-items: center; }
.sek-skifer h2 { color: #fff; }
.slut > div > p { margin-top: 22px; font-size: 19px; color: #b9c4ca; max-width: 32em; }
.slut .pris-linje { font-size: 16px; color: #e7ecee; margin-top: 36px; }
.slut .pris-linje a { color: #fff; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; text-decoration-color: rgba(255,255,255,.35); margin-left: 6px; }
.ring-mig { background: var(--land); color: var(--tekst); border-radius: 16px; padding: 32px; position: relative; }
.ring-mig h3 { font-size: 22px; margin-bottom: 20px; }
.ring-mig .btn { margin-top: 22px; }
.ring-mig > p { margin-top: 12px; font-size: 14px; color: var(--sten); text-align: center; }

/* ---------- Undersider ---------- */
.side-top { background: var(--hav); padding: 96px 0 88px; }
.side-top .lead { margin-top: 24px; }
.side-top .hero-cta { margin-top: 32px; }
.side-top h1 { max-width: 15em; font-size: clamp(40px, 5vw, 66px); }
.forloeb { display: flex; flex-direction: column; gap: 120px; }
.punkter { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px 64px; margin: 0; }
.punkter div { border-top: 1.5px solid var(--skifer); padding-top: 18px; }
.punkter dt { font-weight: 680; font-size: 20px; letter-spacing: -0.01em; }
.punkter dd { margin: 10px 0 0; color: var(--tekst-2); }
.anl-liste { list-style: none; margin: 28px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.anl-liste li { background: var(--land); border-radius: 8px; padding: 8px 14px; font-size: 15.5px; font-weight: 550; }
.andre { columns: 3; column-gap: 40px; margin: 0; padding: 0; list-style: none; }
.andre li { break-inside: avoid; padding: 14px 0; border-bottom: 1px solid var(--linje); }
.andre a { font-weight: 650; }
.andre span { display: block; color: var(--sten); font-size: 15px; }

/* Priser */
.priser { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 1.5px solid var(--skifer); }
.pris { padding: 32px 32px 36px; border-right: 1px solid var(--linje); display: flex; flex-direction: column; }
.pris:last-child { border-right: 0; }
.pris.hl { background: var(--hav); }
.pris h3 { font-size: 22px; }
.pris .til { color: var(--sten); font-size: 15.5px; margin-top: 4px; }
.pris .beloeb { font-size: 46px; font-weight: 760; letter-spacing: -0.04em; margin-top: 26px; line-height: 1; }
.pris .enhed { color: var(--sten); font-size: 15px; margin-top: 8px; min-height: 24px; }
.pris ul { list-style: none; margin: 26px 0 32px; padding: 0; flex: 1; }
.pris li { padding: 9px 0 9px 26px; position: relative; font-size: 16px; border-top: 1px solid var(--linje); }
.pris.hl li { border-top-color: var(--linje-2); }
.pris li::before { content: ""; position: absolute; left: 3px; top: 15px; width: 9px; height: 5px; border-left: 2px solid var(--fjord); border-bottom: 2px solid var(--fjord); transform: rotate(-45deg); }
.spm { margin: 0; max-width: 820px; }
.spm div { padding: 24px 0; border-bottom: 1px solid var(--linje); }
.spm dt { font-weight: 680; font-size: 19px; }
.spm dd { margin: 8px 0 0; color: var(--tekst-2); }

/* Kontakt */
.kontakt-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 5fr); gap: 80px; align-items: start; }
.kontakt-grid .lead { margin-top: 24px; }
.person { margin-top: 48px; display: flex; gap: 18px; align-items: center; border-top: 1.5px solid var(--skifer); padding-top: 22px; }
.person .avatar { width: 56px; height: 56px; font-size: 20px; background: var(--land); }
.person b { display: block; font-size: 18px; }
.person span { color: var(--sten); font-size: 15px; }
.formular { background: var(--land); border: 1px solid var(--linje); border-radius: 16px; padding: 36px; }
.formular .pair { gap: 14px; }
.formular .field + .field, .formular .pair + .field, .formular .field + .pair, .formular .pair + .pair { margin-top: 16px; }
.formular textarea { min-height: 120px; resize: vertical; }
.note { background: var(--advar-bg); color: var(--advar); padding: 12px 16px; border-radius: 10px; margin-bottom: 20px; font-size: 15px; }

/* Tekstsider */
.prose { max-width: 720px; }
.prose h2 { font-size: 24px; margin: 40px 0 10px; letter-spacing: -0.02em; }
.prose p { margin: 0 0 14px; color: var(--tekst-2); }

/* Virksomhedsregister */
.krumme { font-size: 15px; color: var(--sten); margin-bottom: 22px; }
.krumme a { color: var(--sten); text-decoration: underline; text-decoration-color: var(--linje-2); text-underline-offset: 3px; }
.krumme a:hover { color: var(--tekst); }
.soeg-stor { display: flex; gap: 12px; max-width: 720px; margin-top: 32px; }
.soeg-stor input { height: 60px; font-size: 18px; padding: 0 20px; border-radius: 12px; }
.soeg-stor .btn { height: 60px; padding: 0 28px; font-size: 16.5px; border-radius: 12px; }
.liste-tabel { border-top: 1.5px solid var(--skifer); }
.liste-tabel table { font-size: 16px; }
.liste-tabel th { padding: 14px 20px 14px 0; background: none; }
.liste-tabel td { padding: 16px 20px 16px 0; }
.liste-tabel td a { font-weight: 650; }
.liste-tabel td a:hover { text-decoration: underline; text-underline-offset: 3px; }
.liste-tabel .pager { padding: 18px 0; border-top: 1px solid var(--linje); }
.kolonner { columns: 3; column-gap: 40px; }
.kolonner a { display: flex; justify-content: space-between; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--linje); break-inside: avoid; font-size: 16px; }
.kolonner a:hover { color: var(--fjord); }
.kolonner a span { color: var(--graa); font-variant-numeric: tabular-nums; flex: none; }
.fakta { display: grid; grid-template-columns: 200px 1fr; margin: 0; border-top: 1.5px solid var(--skifer); }
.fakta dt, .fakta dd { padding: 14px 0; border-bottom: 1px solid var(--linje); margin: 0; }
.fakta dt { color: var(--sten); }
.laast { background: var(--hav); border-radius: 16px; padding: 28px; }
.laast h3 { font-size: 20px; }
.laast .rk { display: flex; justify-content: space-between; padding: 11px 0; border-bottom: 1px solid var(--linje-2); font-size: 15.5px; }
.laast .rk span:first-child { color: var(--sten); }
.sloeret { filter: blur(4.5px); user-select: none; }
.laast .btn { margin-top: 22px; }
.laast p { margin-top: 12px; font-size: 14px; color: var(--sten); }
.lignende { margin-top: 36px; }
.lignende a { display: flex; justify-content: space-between; padding: 11px 0; border-bottom: 1px solid var(--linje); font-size: 15.5px; }
.lignende a span { color: var(--graa); }
.to-kol { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 72px; align-items: start; }

/* ---------- Sidefod ---------- */
.pf { background: var(--land); border-top: 1px solid var(--linje); padding: 72px 0 40px; font-size: 15.5px; }
.pf-top { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 48px; }
.pf-om p { color: var(--sten); margin-top: 16px; max-width: 300px; }
.pf-nav { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
.pf h4 { margin: 0 0 14px; font-size: 15px; font-weight: 650; }
.pf-nav a { display: block; color: var(--sten); padding: 4px 0; }
.pf-nav a:hover { color: var(--tekst); }
.pf-bund { display: flex; justify-content: space-between; gap: 20px; margin-top: 64px; padding-top: 24px; border-top: 1px solid var(--linje); color: var(--sten); font-size: 14px; flex-wrap: wrap; }

/* ---------- Mindre skærme ---------- */
@media (max-width: 1100px) {
  .wrap { padding: 0 28px; }
  .pnav { display: none; }
  .ph-menu { display: flex; flex-direction: column; gap: 6px; background: none; border: 0; padding: 10px; cursor: pointer; margin-left: 4px; }
  .ph-menu i { display: block; width: 22px; height: 2px; background: var(--tekst); border-radius: 1px; }
  .ph .wrap { gap: 16px; } .ph-cta { margin-left: auto; }
  .menu-aaben .pnav { display: flex; flex-direction: column; position: absolute; top: 76px; left: 0; right: 0; background: #fff; padding: 12px 20px 20px; border-bottom: 1px solid var(--linje); }
  .menu-aaben .dd-menu { position: static; display: block; box-shadow: none; border: 0; width: auto; padding: 0 0 0 8px; }
  .hero-grid, .sek-hoved, .vis, .opstart, .delt, .delt.omvendt, .slut, .kontakt-grid, .to-kol, .pf-top { grid-template-columns: 1fr; gap: 40px; }
  .hero-tekst { padding: 40px 0 0; }
  .hero-kort { margin: 0 -28px; } .hero-kort figcaption { position: static; padding: 0 28px 28px; max-width: none; }
  .aflaes { margin-top: 44px; }
  .garantier { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .priser { grid-template-columns: 1fr; } .pris { border-right: 0; border-bottom: 1px solid var(--linje); }
  .sek { padding: 84px 0; }
  .kolonner, .andre { columns: 2; }
}
@media (max-width: 640px) {
  .wrap { padding: 0 20px; }
  .film-trin { grid-template-columns: 1fr; gap: 14px; }
  .v-tal dd { font-size: 24px; }
  .trin-vandret { grid-template-columns: 1fr; gap: 24px; }
  .ph-log { display: none; } .ph .btn { height: 40px; padding: 0 14px; font-size: 14.5px; }
  .logo span { display: none; }
  .aflaes dl { grid-template-columns: 1fr 1fr; }
  .garantier, .punkter, .pf-nav { grid-template-columns: 1fr 1fr; }
  .kolonner, .andre { columns: 1; }
  .fakta { grid-template-columns: 130px 1fr; }
  .soeg-stor { flex-direction: column; }
  table.brancher td:nth-child(3), table.brancher th:nth-child(3) { display: none; }
  .sek { padding: 64px 0; }
  .pub .lead { font-size: 18px; }
}
.lignende a span:first-child { color: var(--tekst); font-weight: 550; }

/* Forside v6: nye virksomheder, eksempelkort og estimat */
#prikkort .nye path { fill: none; stroke: var(--fjord); stroke-width: 4.6; stroke-linecap: round; pointer-events: none; }
@media (prefers-reduced-motion: no-preference) {
  #prikkort .nye path { animation: prik-ind .9s ease-out both; animation-delay: .9s; }
}
.hero-kort { position: relative; }
.eksempel { position: absolute; right: 0; top: 4%; width: 310px; height: 188px; }
.eks { position: absolute; inset: 0; background: var(--land); border-radius: 12px; padding: 16px 18px; box-shadow: 0 18px 40px -18px rgba(23, 35, 45, .35), 0 0 0 1px var(--linje);
  opacity: 0; transform: translateY(6px); transition: opacity .5s, transform .5s; }
.eks.on { opacity: 1; transform: none; }
.eks-top { font-size: 13px; color: var(--fjord); font-weight: 650; }
.eks h3 { font-size: 17px !important; margin-top: 6px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.eks p { font-size: 14px; line-height: 1.4; color: var(--sten); margin-top: 2px !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.eks ul { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 5px; }
.eks li { font-size: 12.5px; font-weight: 550; background: var(--hav); border-radius: 6px; padding: 3px 8px; color: var(--tekst-2); }
.eks li:first-child { background: var(--fjord-lys); color: var(--fjord); }

.est { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 72px; align-items: start; }
.est-intro { margin-top: 16px !important; font-size: 19px; color: #b9c4ca; }
.est fieldset { border: 0; padding: 0; margin: 36px 0 0; }
.est legend { font-size: 16px; font-weight: 650; color: #fff; margin-bottom: 12px; padding: 0; }
.est-valg { display: flex; flex-wrap: wrap; gap: 8px; }
.est-valg button { height: 42px; padding: 0 15px; border-radius: 8px; border: 1px solid #3a4853; background: transparent; color: #dfe5e8;
  font: inherit; font-size: 15px; font-weight: 520; cursor: pointer; transition: background .12s, border-color .12s; }
.est-valg button:hover { border-color: #8b979f; color: #fff; }
.est-valg button.on { background: #fff; border-color: #fff; color: var(--skifer); font-weight: 600; }
.est-svar { position: sticky; top: 100px; }
.est-tal { color: #b9c4ca; font-size: 16px; }
.est-tal b { display: block; color: #fff; font-size: clamp(56px, 6vw, 84px); font-weight: 780; letter-spacing: -0.045em; line-height: 1; margin: 6px 0 8px; }
.est-dage { color: #dfe5e8; font-size: 16px; margin-top: 10px !important; min-height: 26px; }
.est-form { background: var(--land); color: var(--tekst); border-radius: 16px; padding: 28px; margin-top: 28px; position: relative; }
.est-form h3 { font-size: 20px; margin-bottom: 16px !important; }
.est-form .pair { margin-top: 14px; gap: 12px; }
.est-form .btn { margin-top: 20px; }
.est-form > p { margin-top: 12px !important; font-size: 14px; color: var(--sten); text-align: center; }
@media (max-width: 1100px) { .est { grid-template-columns: 1fr; gap: 40px; } .est-svar { position: static; } .eksempel { position: relative; top: auto; right: auto; margin: 0 28px 28px; width: auto; } }

/* ===================== v7: farve, analyse, integrationer, tilbud ===================== */
.pub { --sand: #f4efe7; --sand-2: #e7dfd2; --fjord-dyb: #143e44; --fjord-mid: #2c6d74; --rav: #c0703a; --rav-lys: #f3e2d3; }
.hl-tal { color: var(--fjord); }

/* Menu med beskrivelser (inspireret af Lasso) */
.pnav .dd > button svg { width: 12px; height: 12px; margin-left: 5px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; transition: transform .15s; }
.dd:hover > button svg, .dd:focus-within > button svg { transform: rotate(180deg); }
.dd-menu { top: calc(100% + 14px); left: 50%; transform: translateX(-50%); width: 360px; padding: 12px; border-radius: 16px; border-color: rgba(23, 35, 45, .08);
  box-shadow: 0 30px 60px -20px rgba(23, 35, 45, .28), 0 2px 6px rgba(23, 35, 45, .06); }
.dd-menu::after { content: ""; position: absolute; top: -7px; left: 50%; width: 14px; height: 14px; background: #fff; transform: translateX(-50%) rotate(45deg);
  border-left: 1px solid rgba(23, 35, 45, .08); border-top: 1px solid rgba(23, 35, 45, .08); border-radius: 3px 0 0 0; }
.dd-menu::before { top: -16px; height: 16px; }
.dd-menu a { padding: 13px 16px; border-radius: 10px; }
.dd-menu a + a { margin-top: 2px; }
.dd-menu b { font-size: 16.5px; font-weight: 700; letter-spacing: -0.01em; color: var(--tekst); }
.dd-menu span { display: block; margin-top: 3px; font-size: 14.5px; line-height: 1.45; color: var(--sten); }
.dd-menu a:hover { background: var(--sand); }
@media (prefers-reduced-motion: no-preference) {
  .dd:hover .dd-menu, .dd:focus-within .dd-menu { animation: dd-ind .16s ease-out; }
  @keyframes dd-ind { from { opacity: 0; margin-top: 6px; } to { opacity: 1; margin-top: 0; } }
}

.sek-sand { background: var(--sand); }
.sek-sand .tabel-to td { border-bottom-color: var(--sand-2); }
.sek-lille { padding: 72px 0; }
.est2-spm h2 { margin-bottom: 4px; }

/* Analyse */
.sek-fjord { background: var(--fjord-dyb); color: #d6e3e4; }
.sek-fjord h2 { color: #fff; }
.analyse { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 80px; align-items: center; }
.analyse-tekst > p { margin-top: 22px; font-size: 18px; color: #c4d5d7; max-width: 34em; }
.analyse-trin { list-style: none; margin: 40px 0 0; padding: 0; counter-reset: a; }
.analyse-trin li { counter-increment: a; position: relative; padding: 0 0 22px 48px; }
.analyse-trin li::before { content: counter(a); position: absolute; left: 0; top: 0; width: 30px; height: 30px; border-radius: 50%; background: var(--rav); color: #fff;
  display: grid; place-items: center; font-weight: 700; font-size: 14px; }
.analyse-trin b { display: block; color: #fff; font-size: 17.5px; font-weight: 680; }
.analyse-trin span { font-size: 15.5px; color: #b2c7ca; }
.analyse-kort { margin: 0; background: #fff; color: var(--tekst); border-radius: 18px; padding: 32px 34px 28px; box-shadow: 0 40px 80px -40px rgba(0, 0, 0, .55); }
.analyse-kort figcaption b { display: block; font-size: 18px; font-weight: 700; letter-spacing: -0.01em; }
.analyse-kort figcaption span { display: block; margin-top: 2px; font-size: 14.5px; color: var(--sten); }
.ak-raekke { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--linje); }
.ak-top { display: flex; justify-content: space-between; gap: 16px; align-items: baseline; margin-bottom: 10px; }
.ak-top span { font-weight: 650; font-size: 16px; }
.ak-top b { font-size: 14px; font-weight: 650; color: var(--rav); white-space: nowrap; }
.ak-top b.ned { color: var(--sten); }
.ak-bar { position: relative; height: 22px; display: flex; align-items: center; gap: 10px; }
.ak-bar + .ak-bar { margin-top: 6px; }
.ak-bar i { display: block; height: 10px; border-radius: 5px; flex: none; }
.ak-bar.marked i { background: var(--linje-2); }
.ak-bar.moeder i { background: var(--rav); }
.ak-bar em { font-style: normal; font-size: 13.5px; color: var(--sten); white-space: nowrap; font-variant-numeric: tabular-nums; }
.ak-bar.moeder em { color: var(--tekst); font-weight: 600; }
@media (prefers-reduced-motion: no-preference) {
  .ak-bar i { animation: bar-ind 1s cubic-bezier(.2, .7, .2, 1) both; transform-origin: left; }
  @keyframes bar-ind { from { transform: scaleX(0); } to { transform: scaleX(1); } }
}
.ak-note { margin-top: 22px !important; padding-top: 18px; border-top: 1px solid var(--linje); font-size: 14.5px; color: var(--tekst-2); }

/* Integrationer */
.integ-navne { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.integ-navne li { background: var(--land); border: 1px solid var(--linje); border-radius: 12px; height: 72px; display: grid; place-items: center; text-align: center;
  font-weight: 680; font-size: 16.5px; letter-spacing: -0.015em; color: var(--tekst); padding: 0 12px; }
.sek-hoved p .tekstlink { display: inline-block; margin-top: 10px; }
.integ-to { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; margin-bottom: 88px; }
.integ-to > div { border-top: 2px solid var(--rav); padding-top: 18px; }
.integ-to h3 { font-size: 19px; }
.integ-to p { margin-top: 8px !important; color: var(--tekst-2); font-size: 16px; }
.integ-gruppe + .integ-gruppe { margin-top: 64px; }
.integ-gruppe h2 { font-size: clamp(24px, 2.4vw, 30px); margin-bottom: 22px; }
.integ-kort { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.integ-kort li { border: 1px solid var(--linje); border-radius: 14px; padding: 22px 22px 20px; background: var(--land); }
.integ-kort b { display: block; font-size: 19px; font-weight: 720; letter-spacing: -0.02em; }
.integ-kort span { display: block; margin-top: 6px; font-size: 15px; color: var(--sten); line-height: 1.5; }
.integ-mangler { margin-top: 56px !important; font-size: 17px; color: var(--tekst-2); }

/* Estimat, kompakt */
.est2 { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); background: var(--land); border-radius: 20px;
  box-shadow: 0 1px 0 rgba(23, 35, 45, .04), 0 30px 60px -40px rgba(23, 35, 45, .35); overflow: hidden; }
.est2-spm { padding: 34px 40px 36px; }
.est2-spm h2 { font-size: clamp(26px, 2.6vw, 34px); }
.est2 fieldset { border: 0; padding: 0; margin: 20px 0 0; }
.est2 legend { font-size: 14.5px; font-weight: 650; color: var(--tekst); margin-bottom: 10px; padding: 0; }
.est2 .est-valg { gap: 6px; }
.est2 .est-valg button { height: 34px; padding: 0 12px; font-size: 14px; border-color: var(--linje-2); color: var(--tekst-2); background: var(--land); border-radius: 999px; }
.est2 .est-valg button:hover { border-color: var(--sten); color: var(--tekst); }
.est2 .est-valg button.on { background: var(--fjord); border-color: var(--fjord); color: #fff; }
.est2-svar { background: var(--fjord-dyb); color: #c4d5d7; padding: 34px 34px; display: flex; flex-direction: column; justify-content: center; }
.est2-lbl { font-size: 15px; }
.est2-svar b { display: block; color: #fff; font-size: clamp(52px, 5.4vw, 76px); font-weight: 780; letter-spacing: -0.045em; line-height: 1; margin: 8px 0 10px; font-variant-numeric: tabular-nums; }
.est2-svar p { margin-top: 14px !important; font-size: 14.5px; min-height: 44px; color: #b2c7ca; }
.est2-svar .btn { margin-top: 20px; background: #fff; border-color: #fff; color: var(--tekst); height: 50px; font-size: 15.5px; }
.est2-svar .btn:hover { background: var(--sand); border-color: var(--sand); }

/* Tilbud med William */
.tilbud { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 72px; align-items: start; }
.kp-foto { margin: 0; position: relative; border-radius: 20px; overflow: hidden; aspect-ratio: 4 / 5; background: var(--sand); }
.kp-foto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.kp-tom { position: absolute; inset: 0; display: grid; place-items: center; font-size: 96px; font-weight: 760; letter-spacing: -0.05em; color: var(--sand-2);
  background: linear-gradient(160deg, var(--sand) 0%, #ece3d6 100%); }
.kp-foto figcaption { position: absolute; left: 16px; right: 16px; bottom: 16px; background: rgba(255, 255, 255, .94); backdrop-filter: blur(6px); border-radius: 12px; padding: 12px 16px; }
.kp-foto figcaption b { display: block; font-size: 16.5px; font-weight: 700; }
.kp-foto figcaption span { font-size: 14px; color: var(--sten); }
.tilbud-intro { margin-top: 18px !important; font-size: 18px; color: var(--tekst-2); max-width: 36em; }
.tilbud-punkter { list-style: none; margin: 22px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; }
.tilbud-punkter li { position: relative; padding-left: 22px; font-size: 15.5px; font-weight: 550; }
.tilbud-punkter li::before { content: ""; position: absolute; left: 2px; top: 7px; width: 10px; height: 5px; border-left: 2px solid var(--rav); border-bottom: 2px solid var(--rav); transform: rotate(-45deg); }
.tilbud-form { margin-top: 30px; background: var(--land); border: 1px solid var(--linje); border-radius: 18px; padding: 28px; }
.sek-hav .tilbud-form, .side-top .tilbud-form { border-color: transparent; box-shadow: 0 30px 60px -40px rgba(23, 35, 45, .35); }
.tilbud-form .pair { gap: 14px; }
.tilbud-form .pair .field { margin-top: 0; }
.tilbud-form .pair + .pair, .tilbud-form .pair + .field { margin-top: 14px; }
.tilbud-form textarea { min-height: 84px; resize: vertical; }
.tilbud-form .btn { margin-top: 18px; }
.tilbud-note { margin-top: 12px !important; font-size: 13.5px; color: var(--sten); }
.tilbud-note a { text-decoration: underline; text-underline-offset: 3px; }
.kontakt-top { padding-bottom: 110px; }
.kontakt-top .tilbud h2 { font-size: clamp(36px, 4.2vw, 54px); }
.tak { max-width: 720px; }

/* Priser */
.forloeb-trin { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; counter-reset: f; }
.forloeb-trin li { counter-increment: f; border-top: 2px solid var(--skifer); padding-top: 20px; }
.forloeb-trin li::before { content: counter(f); display: block; font-size: 40px; font-weight: 760; letter-spacing: -0.04em; line-height: 1; color: var(--rav); margin-bottom: 14px; }
.forloeb-trin b { display: block; font-size: 18.5px; font-weight: 700; }
.forloeb-trin span { display: block; margin-top: 6px; color: var(--tekst-2); font-size: 16px; }
.to-lige { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 80px; align-items: start; }
.afhaenger, .med { list-style: none; margin: 28px 0 0; padding: 0; }
.afhaenger li { padding: 16px 0; border-bottom: 1px solid var(--sand-2); }
.afhaenger b { display: block; font-size: 17.5px; font-weight: 680; }
.afhaenger span { color: var(--tekst-2); font-size: 16px; }
.med li { position: relative; padding: 13px 0 13px 30px; border-bottom: 1px solid var(--sand-2); font-size: 16.5px; }
.med li::before { content: ""; position: absolute; left: 3px; top: 21px; width: 11px; height: 6px; border-left: 2px solid var(--fjord); border-bottom: 2px solid var(--fjord); transform: rotate(-45deg); }

/* FAQ som fold-ud */
.faq { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 80px; align-items: start; }
.faq-side { position: sticky; top: 110px; }
.faq-side p { margin-top: 18px !important; font-size: 17.5px; color: var(--tekst-2); max-width: 26em; }
.faq-side .tekstlink { display: inline-block; margin-top: 22px; }
.faq-liste { border-top: 2px solid var(--skifer); }
.faq-liste details { border-bottom: 1px solid var(--linje); }
.faq-liste summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 24px 4px 24px 0;
  font-size: 19px; font-weight: 680; letter-spacing: -0.01em; }
.faq-liste summary::-webkit-details-marker { display: none; }
.faq-liste summary:hover { color: var(--fjord); }
.faq-liste summary i { position: relative; flex: none; width: 32px; height: 32px; border-radius: 50%; background: var(--sand); transition: background .15s, transform .2s; }
.faq-liste summary i::before, .faq-liste summary i::after { content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 2px; margin: -1px 0 0 -6px; background: var(--tekst); border-radius: 1px; }
.faq-liste summary i::after { transform: rotate(90deg); transition: transform .2s; }
.faq-liste details[open] summary i { background: var(--fjord); }
.faq-liste details[open] summary i::before, .faq-liste details[open] summary i::after { background: #fff; }
.faq-liste details[open] summary i::after { transform: rotate(0deg); }
.faq-liste details p { padding: 0 64px 26px 0; color: var(--tekst-2); font-size: 17px; }

@media (max-width: 1100px) {
  .analyse, .tilbud, .faq, .to-lige { grid-template-columns: 1fr; gap: 48px; }
  .faq-side { position: static; }
  .integ-navne { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .integ-kort, .integ-to { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .forloeb-trin { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .est2 { grid-template-columns: 1fr; }
  .kp-foto { max-width: 360px; }
  .menu-aaben .dd-menu { transform: none; } .menu-aaben .dd-menu::after { display: none; }
}
@media (max-width: 640px) {
  .integ-navne, .integ-kort, .integ-to, .forloeb-trin { grid-template-columns: 1fr 1fr; }
  .integ-kort, .integ-to { grid-template-columns: 1fr; }
  .est2-spm, .est2-svar { padding: 28px 24px; }
  .faq-liste details p { padding-right: 0; }
  .tilbud-form { padding: 20px; }
}

/* ===================== v8: varmere, rundere ===================== */
.pub { --hav: #f4efe8; --sand: #efe6d9; --sand-2: #e3d7c6; --varm-hvid: #fcfaf7; background: var(--varm-hvid); }
.pub .ph { background: rgba(252, 250, 247, .94); }
.forside .ph { background: rgba(252, 250, 247, .94); }
.pub .btn { border-radius: 12px; }
.pub input, .pub textarea, .pub select { border-radius: 10px; }
.pf { background: var(--varm-hvid); }

/* Farvede flader bliver til bløde, runde rum */
.hero, .side-top { margin: 0 16px; border-radius: 0 0 36px 36px; }
.sek-hav, .sek-sand, .sek-fjord, .sek-skifer { margin: 16px; border-radius: 36px; }
.hero-kort { margin-right: 0; }
.skud, .film-vindue { border-radius: 20px; }
.integ-kort li { border-radius: 18px; }
.tilbud-form { border-radius: 22px; }
.kp-foto { border-radius: 26px; }
.analyse-kort { border-radius: 24px; }
.est2 { border-radius: 28px; }
.sek-fjord { background: #1c4a50; }

/* Analysen, generel */
.ak-felter { list-style: none; margin: 18px 0 0; padding: 0; }
.ak-felter li { padding: 14px 0; border-top: 1px solid var(--linje); }
.ak-felter b { display: block; font-size: 16.5px; font-weight: 680; }
.ak-felter span { display: block; margin-top: 2px; font-size: 14.5px; color: var(--sten); line-height: 1.5; }
.ak-illu { margin-top: 6px; background: var(--hav); border-radius: 16px; padding: 18px 20px 20px; }
.ak-illu-top { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 12px; font-size: 13.5px; font-weight: 600; color: var(--tekst-2); }
.ak-illu-top em { font-style: normal; font-weight: 500; color: var(--graa); }
.ak-s { display: grid; grid-template-columns: 170px 1fr; align-items: center; gap: 12px; font-size: 13.5px; color: var(--tekst-2); }
.ak-s + .ak-s { margin-top: 8px; }
.ak-s i { display: block; height: 10px; border-radius: 5px; background: var(--rav); }
.ak-s.mid i { background: #c9b9a3; }
.ak-s.lav i { background: var(--linje-2); }
@media (prefers-reduced-motion: no-preference) {
  .ak-s i { animation: bar-ind 1.1s cubic-bezier(.2, .7, .2, 1) both; transform-origin: left; }
}

/* Logobånd */
.logo-baand { overflow: hidden; margin-top: 8px; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.lb-spor { display: flex; width: max-content; gap: 14px; animation: baand 60s linear infinite; }
.logo-baand:hover .lb-spor { animation-play-state: paused; }
.lb-el { flex: none; height: 84px; min-width: 190px; padding: 0 30px; display: grid; place-items: center; background: var(--land); border-radius: 20px;
  font-weight: 720; font-size: 19px; letter-spacing: -0.02em; color: var(--tekst-2); white-space: nowrap; box-shadow: 0 1px 0 rgba(23, 35, 45, .04); }
.lb-el img { max-height: 34px; max-width: 150px; width: auto; display: block; filter: grayscale(1); opacity: .8; transition: filter .2s, opacity .2s; }
.lb-el:hover img { filter: none; opacity: 1; }
@keyframes baand { from { transform: translateX(0); } to { transform: translateX(calc(-50% - 7px)); } }
@media (prefers-reduced-motion: reduce) { .lb-spor { animation: none; flex-wrap: wrap; width: auto; justify-content: center; padding: 0 28px; } .lb-el[aria-hidden] { display: none; } }
.ik-logo { display: block; max-height: 28px; max-width: 140px; margin-bottom: 14px; }

/* Estimat: varme farver */
.est2 { background: var(--land); box-shadow: 0 1px 0 rgba(23, 35, 45, .04), 0 30px 60px -40px rgba(80, 60, 30, .35); }
.est2 .est-valg button.on { background: var(--skifer); border-color: var(--skifer); color: #fff; }
.est2-svar { background: var(--sand); color: var(--tekst-2); }
.est2-svar b { color: var(--tekst); }
.est2-svar b::after { content: ""; display: block; width: 44px; height: 4px; border-radius: 2px; background: var(--rav); margin-top: 14px; }
.est2-svar p { color: var(--tekst-2); }
.est2-svar .btn { background: var(--skifer); border-color: var(--skifer); color: #fff; }
.est2-svar .btn:hover { background: var(--skifer-2); border-color: var(--skifer-2); }
.sek-sand .est2-svar { background: #f6f0e7; }
#estimat.sek-sand { background: var(--sand); }

@media (max-width: 640px) {
  .hero, .side-top { margin: 0 8px; border-radius: 0 0 26px 26px; }
  .sek-hav, .sek-sand, .sek-fjord, .sek-skifer { margin: 8px; border-radius: 26px; }
  .ak-s { grid-template-columns: 120px 1fr; }
}

/* Logoer i farver */
.lb-el img { filter: none; opacity: 1; max-height: 36px; max-width: 160px; }
.lb-el.ikon { display: flex; gap: 12px; align-items: center; justify-content: center; }
.lb-el.ikon img { max-height: 34px; max-width: 34px; border-radius: 8px; }
.ik-logo { max-height: 30px; max-width: 150px; object-fit: contain; object-position: left center; }
@media (prefers-reduced-motion: reduce) { .lb-el[aria-hidden] { display: none !important; } }
.lb-el img[src*="salesforce"] { max-height: 44px; }
