/* stil.css — Naturejendom.dk: "landinspektørens kort".
   Hvid grund, tynde skellinjer som gennemgående motiv, dyb markgrøn som accent og stråfarvet gul som lille fremhævning.
   Zilla Slab til overskrifter, Atkinson Hyperlegible til brødtekst (lavet til læsbarhed). Kun lyst tema.
   Målgruppe: ejere af landejendomme, ofte 55+: stor grundskrift, høj kontrast, tydelige knapper. */

:root {
  /* Farver */
  --papir: #ffffff;            /* grunden */
  --kortpapir: #f4f6f1;        /* afsnit, der skal skilles ud, og bundlinjen */
  --ink: #17261b;              /* tekst (kontrast mod hvid ca. 15:1) */
  --muted: #47564b;            /* sekundær tekst (ca. 7,8:1) */
  --line: #d2dacd;             /* skillelinjer */
  --skel: #8ea393;             /* tynde kortlinjer */
  --mark: #2d5a32;             /* markgrøn: knapper, skel, markører (hvid tekst ca. 7,9:1) */
  --mark-hover: #224727;
  --straa: #e6be4f;            /* strå: lille fremhævning */
  --straa-lys: #faf1d4;
  --fejl: #a3261a;

  /* Skrift */
  --font-head: "Zilla Slab", Rockwell, "Roboto Slab", Georgia, serif;
  --font-body: "Atkinson Hyperlegible", Verdana, "Segoe UI", sans-serif;
  --fs-h1: clamp(2.375rem, 1.6rem + 3vw, 3.75rem);     /* 38 -> 60 px */
  --fs-h2: clamp(1.875rem, 1.4rem + 1.8vw, 2.625rem);  /* 30 -> 42 px */
  --fs-h3: clamp(1.5rem, 1.25rem + 0.9vw, 1.875rem);   /* 24 -> 30 px */
  --fs-lead: clamp(1.25rem, 1.15rem + 0.4vw, 1.4375rem);
  --fs-body: 1.1875rem;                                  /* 19 px */
  --fs-small: 1.0625rem;                                 /* 17 px, aldrig mindre til læsetekst */

  /* Afstande */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 88px;
  --section-y: clamp(56px, 3.5rem + 3vw, 104px);
  --gutter: clamp(16px, 4vw, 64px);
  --max: 1200px;
  --max-text: 760px;
  --r: 10px;
}

/* Grundlag */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; background: var(--papir); }
body {
  margin: 0; background: var(--papir); color: var(--ink);
  font-family: var(--font-body); font-size: var(--fs-body); line-height: 1.6;
  overflow-x: hidden;
}
h1, h2, h3 { font-family: var(--font-head); font-weight: 700; line-height: 1.12; margin: 0 0 var(--s-4); color: var(--ink); }
h1 { font-size: var(--fs-h1); letter-spacing: -0.01em; }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); font-weight: 600; }
p { margin: 0 0 var(--s-4); }
a { color: var(--mark); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--mark-hover); text-decoration-thickness: 2px; }
b, strong { font-weight: 700; }
img, svg { max-width: 100%; display: block; }
[id] { scroll-margin-top: 96px; }
:focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; box-shadow: 0 0 0 7px var(--straa); border-radius: 4px; }

.wrap { max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); }
.wrap--text { max-width: calc(var(--max-text) + 2 * var(--gutter)); }
.section { padding: var(--section-y) 0; border-top: 1px solid var(--line); }
.section--surface { background: var(--kortpapir); }
.section__head { max-width: var(--max-text); margin: 0 0 var(--s-7); }
.section__head h2::after {     /* et kort markskel under hver sektionsoverskrift */
  content: ""; display: block; width: 72px; margin-top: var(--s-3);
  border-top: 3px dashed var(--mark);
}
.lead { font-size: var(--fs-lead); line-height: 1.5; color: var(--ink); }
.muted { color: var(--muted); }
.center { text-align: center; }

/* Knapper: store og tydelige */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--s-2);
  min-height: 54px; padding: 0 var(--s-5); border-radius: var(--r); border: 2px solid var(--mark);
  font: 700 1.125rem/1.2 var(--font-body); text-decoration: none; cursor: pointer; text-align: center;
  background: var(--mark); color: #fff;
}
.btn:hover { background: var(--mark-hover); border-color: var(--mark-hover); color: #fff; text-decoration: none; }
.btn--stor { min-height: 60px; padding: 0 var(--s-6); font-size: 1.25rem; }
.btn--lille { min-height: 46px; padding: 0 var(--s-4); font-size: 1.0625rem; }
.btn--ghost { background: var(--papir); color: var(--mark); }
.btn--ghost:hover { background: var(--kortpapir); color: var(--mark-hover); }

/* Topmenu */
.top { position: sticky; top: 0; z-index: 10; background: var(--papir); border-bottom: 1px solid var(--line); }
.top.is-scrolled { border-bottom-color: var(--skel); }
.top__in { display: flex; align-items: center; gap: var(--s-6); min-height: 80px; }
.logo { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; font: 700 1.625rem/1 var(--font-head); color: var(--ink); }
.logo:hover { color: var(--ink); }
.logo__mark { width: 28px; height: 28px; flex: none; color: var(--ink); }
.nav { display: flex; gap: var(--s-6); font-size: 1.125rem; }
.nav a { color: var(--ink); text-decoration: none; padding: var(--s-2) 0; }
.nav a:hover { text-decoration: underline; text-decoration-color: var(--mark); text-decoration-thickness: 2px; text-underline-offset: 6px; }
.top__cta { margin-left: auto; display: flex; align-items: center; gap: var(--s-3); }
.kort-tekst { display: none; }
@media (max-width: 860px) {
  .nav { display: none; }
  .top__in { min-height: 66px; gap: var(--s-4); }
}
@media (max-width: 600px) {
  .top__cta .lang-tekst { display: none; }
  .top__cta .kort-tekst { display: inline; }
  .logo { font-size: 1.4375rem; }
}

/* Hero */
.hero { padding: clamp(40px, 5vw, 88px) 0 var(--section-y); }
.hero h1 { max-width: 20ch; }
.hero .lead { max-width: 36rem; }
.hero__grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); gap: var(--s-6) var(--s-8); align-items: start; }
.hero__grid > .parcel { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--s-3); align-items: center; margin-top: var(--s-5); }
.trust-line { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); margin: var(--s-5) 0 0; padding: 0; list-style: none; font-size: var(--fs-small); color: var(--muted); }
.trust-line li { display: inline-flex; align-items: center; gap: var(--s-2); }
.trust-line li::before { content: ""; width: 9px; height: 9px; flex: none; border: 2px solid var(--mark); border-radius: 50%; } /* skelpæl */
@media (max-width: 900px) {
  .hero__grid { grid-template-columns: minmax(0, 1fr); }
  .hero__grid > .parcel { grid-column: 1; grid-row: auto; }
  .hero__actions .btn { flex: 1 1 100%; }
}

/* Valget i heroen: to tal side om side, skilt af et markskel */
.valget__eks { font-size: var(--fs-small); color: var(--muted); margin-bottom: var(--s-4); max-width: 36rem; }
.maerke { display: inline-block; background: var(--straa); color: var(--ink); font-weight: 700; padding: 1px 8px; border-radius: 4px; margin-right: 6px; }
.valget__tal { display: grid; grid-template-columns: 1fr 1fr; margin: 0; border-top: 2px solid var(--ink); border-bottom: 1px solid var(--line); }
.valget__side { padding: var(--s-4) var(--s-5) var(--s-4) 0; }
.valget__side + .valget__side { padding: var(--s-4) 0 var(--s-4) var(--s-5); border-left: 3px dashed var(--mark); }
.valget__tal dt { font: 600 1.25rem/1.25 var(--font-head); margin-bottom: var(--s-2); }
.valget__tal dd { margin: 0; }
.valget__tal .kr { font: 700 clamp(2rem, 1.5rem + 2vw, 3rem)/1.05 var(--font-head); white-space: nowrap; }
.valget__tal .pr { font-size: 1.125rem; color: var(--muted); margin-left: 2px; }
.valget__forskel { margin: var(--s-3) 0 0; font-size: 1.125rem; }
.valget__forskel b { font-variant-numeric: tabular-nums; background: var(--straa-lys); box-shadow: inset 0 -4px 0 var(--straa); padding: 0 3px; }
@media (max-width: 420px) {
  .valget__side { padding-right: var(--s-3); }
  .valget__side + .valget__side { padding-left: var(--s-3); }
  .valget__tal dt { font-size: 1.0625rem; }
}

/* Matrikelkortet: lys tegning i tynde linjer */
.parcel { margin: 0; }
.parcel svg { width: 100%; height: auto; overflow: visible; }
.parcel .p-nabo path { stroke: var(--skel); stroke-width: 1; fill: none; }
.parcel .p-nr text { fill: var(--muted); font: italic 400 14px var(--font-body); }
.parcel .p-graense { fill: var(--papir); stroke: var(--ink); stroke-width: 1.6; }
.parcel .p-fure path { stroke: #c4d0c0; stroke-width: 1; fill: none; }
.parcel .p-skov circle { fill: var(--papir); stroke: var(--mark); stroke-width: 1.3; }
.parcel .p-have { fill: var(--straa-lys); }
.parcel .p-hus { fill: url(#p-skravering); stroke: var(--ink); stroke-width: 1.4; }
.parcel .p-skrav { stroke: var(--ink); stroke-width: 1; }
.parcel .p-skel { fill: none; stroke: var(--mark); stroke-width: 2.4; stroke-dasharray: 8 6; }
.parcel .p-matr { fill: var(--ink); font: italic 400 18px var(--font-body); }
.parcel .p-tekst { fill: var(--ink); font: 700 22px var(--font-head); paint-order: stroke; stroke: var(--papir); stroke-width: 6px; }
.parcel .p-lille { fill: var(--muted); font: 400 16px var(--font-body); paint-order: stroke; stroke: var(--papir); stroke-width: 6px; }
.parcel .p-kompas path { fill: var(--ink); }
.parcel .p-kompas text, .parcel .p-maal text { fill: var(--ink); font: 700 13px var(--font-body); }
.parcel .p-maal path { stroke: var(--ink); stroke-width: 1.4; fill: none; }
.parcel figcaption { font-size: var(--fs-small); color: var(--muted); margin-top: var(--s-4); max-width: 40rem; }

/* Kort om ændringen: opslagsliste med tynde linjer */
.facts dl { margin: 0; max-width: 980px; }
.facts dl > div { display: grid; grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); gap: var(--s-2) var(--s-6); padding: var(--s-5) 0; border-top: 1px solid var(--skel); }
.facts dl > div:last-child { border-bottom: 1px solid var(--skel); }
.facts dt { font: 700 1.375rem/1.25 var(--font-head); }
.facts dd { margin: 0; max-width: 62ch; }
@media (max-width: 700px) { .facts dl > div { grid-template-columns: minmax(0, 1fr); } }

/* Sådan virker det: tre trin langs et markskel (indholdet er en rækkefølge) */
.steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-6); counter-reset: step; list-style: none; margin: 0; padding: 0; position: relative; }
.steps::before { content: ""; position: absolute; top: 28px; left: 28px; right: 10%; border-top: 3px dashed var(--mark); }
.step { position: relative; }
.step__num { counter-increment: step; position: relative; width: 56px; height: 56px; margin-bottom: var(--s-4); border-radius: 50%; border: 3px solid var(--mark); background: var(--papir); color: var(--mark); display: grid; place-items: center; font: 700 1.75rem/1 var(--font-head); }
.step__num::before { content: counter(step); }
.step h3 { margin-bottom: var(--s-2); }
.step p { color: var(--muted); max-width: 32ch; margin: 0; }
@media (max-width: 760px) {
  .steps { grid-template-columns: minmax(0, 1fr); gap: var(--s-6); }
  .steps::before { top: 28px; bottom: 28px; left: 26px; right: auto; border-top: 0; border-left: 3px dashed var(--mark); }
  .step { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 0 var(--s-4); }
  .step__num { margin: 0; grid-row: span 2; }
}

/* Sammenligningstabel */
.tabelrul { overflow-x: auto; }
.compare { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.compare th, .compare td { text-align: right; padding: 14px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
.compare th:first-child, .compare td:first-child { text-align: left; padding-left: 0; }
.compare td:not(:first-child), .compare th:not(:first-child) { white-space: nowrap; }
.compare thead th { font: 600 1.125rem/1.3 var(--font-head); color: var(--ink); border-bottom: 2px solid var(--ink); }
.compare tfoot td { font: 700 1.25rem/1.3 var(--font-head); border-bottom: 0; border-top: 3px solid var(--ink); }
.compare .note { display: block; font-size: 1rem; color: var(--muted); }
@media (max-width: 600px) {
  .compare { font-size: 1.0625rem; }
  .compare th, .compare td { padding: 12px 4px; }
}

/* Pris: ikke et kort, men en opstilling i to spalter */
.price { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 0 var(--s-8); border-top: 2px solid var(--ink); padding-top: var(--s-6); max-width: 980px; }
.price > * { grid-column: 1; }
.price .price__list { grid-column: 2; grid-row: 1 / span 5; }
.price__name { font: 600 1.25rem/1.3 var(--font-head); margin: 0 0 var(--s-2); }
.price__amount { font: 700 clamp(3rem, 2.4rem + 2.4vw, 4.25rem)/1 var(--font-head); margin: 0; }
.price__unit { color: var(--muted); margin: var(--s-2) 0 var(--s-5); }
.price__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; align-content: start; }
.price__list li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: var(--s-3); padding: var(--s-3) 0; border-bottom: 1px solid var(--line); }
.price__list li::before { content: ""; width: 12px; height: 12px; margin-top: 9px; border: 2.5px solid var(--mark); border-radius: 50%; }
.price .btn { justify-self: start; }
.price__note { font-size: var(--fs-small); color: var(--muted); margin: var(--s-4) 0 0; }
@media (max-width: 760px) {
  .price { grid-template-columns: minmax(0, 1fr); }
  .price .price__list { grid-column: 1; grid-row: auto; margin-bottom: var(--s-6); }
  .price .btn { width: 100%; }
}

/* Tillidsrække: kun ting, der er sande og kan dokumenteres */
.trust { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--s-6); margin: 0; padding: 0; list-style: none; }
.trust li { padding-top: var(--s-4); border-top: 3px dashed var(--mark); }
.trust strong { display: block; font: 700 1.375rem/1.25 var(--font-head); margin-bottom: var(--s-2); }
.trust span { color: var(--muted); }

/* FAQ uden JavaScript */
.faq { max-width: var(--max-text); border-top: 2px solid var(--ink); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: var(--s-4); padding: var(--s-5) 0; font: 600 1.3125rem/1.35 var(--font-head); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; flex: none; width: 34px; height: 34px; display: grid; place-items: center; border: 2px solid var(--mark); border-radius: 50%; color: var(--mark); font: 700 1.375rem/1 var(--font-body); }
.faq details[open] summary::after { content: "\2212"; }
.faq summary:hover { color: var(--mark); }
.faq details > div { padding: 0 0 var(--s-5); max-width: 64ch; }
.faq details > div p:last-child { margin: 0; }

/* Tekstsider */
.prose { max-width: var(--max-text); }
.prose h2 { font-size: var(--fs-h3); margin-top: var(--s-7); }
.prose h2:first-child { margin-top: 0; }
.prose p { max-width: 66ch; }

/* Afsluttende opfordring */
.cta-end h2 { max-width: 22ch; }
.cta-end p { color: var(--muted); max-width: 40rem; margin: 0 0 var(--s-6); }

/* Resultatet af beregningen */
.svar { border-left: 6px solid var(--mark); padding: var(--s-2) 0 var(--s-2) var(--s-5); margin: 0 0 var(--s-7); }
.svar h2 { font-size: var(--fs-h3); margin-bottom: var(--s-3); }
.svar ul { margin: 0; padding-left: 1.2em; }
.svar--naeppe, .svar--nej { border-left-color: var(--skel); }
.tal-stor { font: 700 clamp(2.25rem, 1.8rem + 2vw, 3.25rem)/1.1 var(--font-head); margin: 0 0 var(--s-3); }
.tal-stor { text-decoration: underline; text-decoration-color: var(--straa); text-decoration-thickness: 6px; text-underline-offset: 8px; text-decoration-skip-ink: none; }
.formel { border: 1px solid var(--skel); border-left: 6px solid var(--straa); border-radius: 0 var(--r) var(--r) 0; background: var(--papir); padding: var(--s-5); font-size: 1.0625rem; }
.formel ul { margin: 0; padding-left: 1.2em; display: grid; gap: var(--s-2); }

/* Formularer */
.form { display: grid; gap: var(--s-7); max-width: 760px; }
.form fieldset { border: 0; border-top: 2px solid var(--ink); padding: var(--s-5) 0 0; margin: 0; display: grid; gap: var(--s-5); min-width: 0; }
.form legend { float: left; width: 100%; font: 700 var(--fs-h3)/1.2 var(--font-head); margin: 0 0 var(--s-2); padding: 0; }
.form legend + * { clear: both; }
.felt { display: grid; gap: 6px; min-width: 0; }
.felt label, .felt .lbl { font-weight: 700; }
.felt small { color: var(--muted); font-size: var(--fs-small); }
.felt input[type=text], .felt input[type=number], .felt input[type=email], .felt select {
  font: inherit; font-size: 1.1875rem; min-height: 54px; padding: 0 14px; border: 2px solid var(--skel);
  border-radius: 8px; background: var(--papir); color: var(--ink); width: 100%; max-width: 420px; font-variant-numeric: tabular-nums; }
.felt input:hover, .felt select:hover { border-color: var(--muted); }
.felt input:focus-visible, .felt select:focus-visible { border-color: var(--mark); outline: 3px solid var(--ink); outline-offset: 2px; box-shadow: 0 0 0 7px var(--straa); }
.felt input[aria-invalid="true"] { border-color: var(--fejl); }
.felt input::placeholder { color: #6d7a70; }
.fejl, .felt .fejl { color: var(--fejl); font-size: var(--fs-small); font-weight: 700; }
.valg { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); }
.valg label { display: inline-flex; gap: 10px; align-items: center; font-weight: 400; min-height: 44px; cursor: pointer; }
.valg input, .tjek input { width: 22px; height: 22px; accent-color: var(--mark); margin: 0; flex: none; }
.tjek { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: var(--s-3); align-items: start; }
.tjek input { margin-top: 4px; }
.to-kol { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--s-5) var(--s-6); }
details.mere { border-top: 1px dashed var(--mark); padding-top: var(--s-4); }
details.mere summary { cursor: pointer; font-weight: 700; color: var(--mark); min-height: 44px; display: flex; align-items: center; }
details.mere[open] summary { margin-bottom: var(--s-4); }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Frister */
.frister { list-style: none; padding: 0; margin: 0; max-width: var(--max-text); }
.frister li { display: grid; grid-template-columns: minmax(150px, 1fr) 2fr; gap: var(--s-4); padding: var(--s-4) 0; border-top: 1px solid var(--skel); }
.frister b { font-family: var(--font-head); font-weight: 700; font-size: 1.25rem; }
@media (max-width: 600px) { .frister li { grid-template-columns: minmax(0, 1fr); gap: var(--s-1); } }

/* Rapport og knaprækker */
.rapport-ramme { border: 1px solid var(--skel); border-radius: var(--r); overflow: hidden; }
.rapport-ramme iframe { width: 100%; height: 80vh; border: 0; background: #fff; display: block; }
.knap-raekke { display: flex; flex-wrap: wrap; gap: var(--s-3); align-items: center; }
@media (max-width: 600px) { .knap-raekke .btn { flex: 1 1 100%; } }

/* Bundlinje: lys */
.foot { background: var(--kortpapir); color: var(--ink); border-top: 3px dashed var(--mark); padding: var(--s-8) 0 var(--s-6); font-size: var(--fs-small); }
.foot .logo { color: var(--ink); }
.foot__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-6); }
.foot__grid > * { min-width: 0; }
.foot a { color: var(--ink); text-decoration: none; overflow-wrap: anywhere; }
.foot a:hover { color: var(--mark); text-decoration: underline; }
.foot__h { font: 700 1.1875rem/1.3 var(--font-head); margin: 0 0 var(--s-3); }
.foot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-2); }
.foot__about { max-width: 34ch; color: var(--muted); margin-top: var(--s-4); }
.foot__legal { margin-top: var(--s-7); padding-top: var(--s-5); border-top: 1px solid var(--skel); display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); color: var(--muted); }
@media (min-width: 600px) { .foot__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .foot__brand { grid-column: 1 / -1; } }
@media (min-width: 900px) { .foot__grid { grid-template-columns: minmax(0, 2fr); grid-auto-columns: minmax(0, 1fr); grid-auto-flow: column; } .foot__brand { grid-column: auto; } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

/* Rettelser efter første skærmbillede 7. okt. 2026: større korttekst og tabel uden sidelæns rulning på telefon */
@media (max-width: 600px) {
  .parcel .p-tekst { font-size: 27px; }
  .parcel .p-lille { font-size: 21px; }
  .parcel .p-nr text, .parcel .p-matr { font-size: 20px; }
  .parcel .p-kompas text, .parcel .p-maal text { font-size: 17px; }
  .compare th:not(:first-child) { white-space: normal; }
}

/* Regel 2 (8. okt. 2026): hvad du får / hvad det koster ikke at have det. To kolonner langs et skel, ikke kort. */
.hvorfor { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: var(--s-6) var(--s-8); border-top: 1px solid var(--line); padding-top: var(--s-5); margin: var(--s-6) 0; }
.hvorfor h3 { font-size: 1.125rem; margin: 0 0 var(--s-3); }
.hvorfor ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-2); }
.hvorfor li { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: var(--s-2); }
.hvorfor__faar li::before { content: ""; width: 10px; height: 10px; margin-top: 9px; border: 2.5px solid var(--mark); border-radius: 50%; }
.hvorfor__uden li::before { content: ""; width: 12px; height: 0; margin-top: 13px; border-top: 2.5px dashed var(--straa); }
.koeb { border: 2px solid var(--ink); border-radius: var(--r); padding: var(--s-5); margin: var(--s-6) 0 var(--s-7); background: #fff; }
.koeb__overslag { font: 600 1.125rem/1.45 var(--font-head); margin: 0 0 var(--s-2); }
.koeb .hvorfor { margin: var(--s-4) 0; }
.koeb__pris { font-size: var(--fs-small); color: var(--muted); margin: var(--s-3) 0 0; }
@media (max-width: 760px) { .hvorfor { grid-template-columns: minmax(0, 1fr); } }
.price .hvorfor { grid-column: 2; grid-row: 1 / span 6; grid-template-columns: minmax(0, 1fr); border-top: 0; padding-top: 0; margin: 0; }
@media (max-width: 760px) { .price .hvorfor { grid-column: 1; grid-row: auto; margin-top: var(--s-6); } }