/* CookiePopup Cookietjek — frontend.
   Farver, typografi og rundinger er 1:1 med designsystemet i Figma
   (side "01 Design system"). Aendrer du en vaerdi her, saa aendr ogsaa
   variablen i Figma, ellers glider de to fra hinanden.

   Alt er scoped under .ct-app, saa temaet og Elementor ikke paavirkes. */

.ct-app{
  /* brand */
  --ct-orange:#DE712E;
  --ct-orange-600:#C25F22;
  --ct-orange-700:#A34D18;
  --ct-orange-100:#FBEDE4;
  --ct-orange-50:#FDF7F2;
  --ct-ink-900:#132B33;
  --ct-ink-700:#1E4049;
  --ct-ink-500:#35606B;
  --ct-ink-100:#E7EDEE;
  /* neutral */
  --ct-hvid:#FFFFFF;
  --ct-n50:#FAFAF9;
  --ct-n100:#F4F4F2;
  --ct-n200:#E6E6E3;
  --ct-n400:#A8A8A3;
  /* semantisk */
  --ct-ok:#1F7A5C;
  --ct-ok-50:#E8F3EF;
  --ct-advarsel:#B8850F;
  --ct-advarsel-50:#FBF3E2;
  --ct-fejl:#C0392B;
  --ct-fejl-50:#FBEAE8;

  --ct-radius:12px;
  --ct-radius-s:8px;

  color:var(--ct-ink-900);
  font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  line-height:1.6;
}
.ct-app *,.ct-app *::before,.ct-app *::after{box-sizing:border-box}

/* ---------- byggeklodser ---------- */

.ct-kort{
  background:var(--ct-hvid);
  border:2px solid var(--ct-orange-100);
  border-radius:var(--ct-radius);
  padding:22px 18px;
}
@media(min-width:768px){ .ct-kort{padding:28px 32px} }

.ct-eyebrow{
  margin:0 0 8px;
  font-size:12px; font-weight:600; line-height:1.35;
  letter-spacing:.06em; text-transform:uppercase;
  color:var(--ct-orange-600);
}
.ct-h2{
  margin:0 0 8px;
  font-size:20px; font-weight:600; line-height:1.35;
  letter-spacing:-.01em; color:var(--ct-ink-900);
}
@media(min-width:768px){ .ct-h2{font-size:24px} }

.ct-sektion-tekst{ margin:0 0 18px; font-size:15px; color:var(--ct-ink-500) }
@media(min-width:768px){ .ct-sektion-tekst{font-size:16px; max-width:70ch} }

.ct-label{
  display:block; margin:0 0 6px;
  font-size:14px; font-weight:600; color:var(--ct-ink-700);
}
.ct-hint{ margin:10px 0 0; font-size:14px; color:var(--ct-ink-500) }
.ct-hint--lille{ font-size:13px }
.ct-hint a{ color:var(--ct-orange-600) }

.ct-fejl{
  margin:12px 0 0; padding:10px 12px;
  border-radius:var(--ct-radius-s);
  background:var(--ct-fejl-50); color:var(--ct-fejl);
  font-size:14px; font-weight:600;
}

/* Loeser en konflikt med Elementors globale display-regler: [hidden] er en
   UA-regel og taber til enhver author-erklaering. Uden !important blinkede
   loaderen frem ved sideindlaesning. */
.ct-app [hidden]{ display:none!important }

/* ---------- felter og knapper ---------- */

.ct-row{ display:flex; flex-direction:column; gap:10px }
@media(min-width:600px){ .ct-row{flex-direction:row; align-items:stretch} }

.ct-input{
  flex:1 1 auto; width:100%;
  min-height:52px; padding:14px 16px;
  border:2px solid var(--ct-n200); border-radius:var(--ct-radius-s);
  background:var(--ct-n50);
  font-family:inherit; font-size:16px; color:var(--ct-ink-900);
}
.ct-input::placeholder{ color:var(--ct-n400) }
.ct-input:focus{ outline:none; border-color:var(--ct-orange); background:var(--ct-hvid) }
.ct-input[aria-invalid=true]{ border-color:var(--ct-fejl) }

.ct-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  min-height:52px; padding:14px 24px;
  border:0; border-radius:var(--ct-radius-s);
  font-family:inherit; font-size:16px; font-weight:600; line-height:1.5;
  text-align:center; text-decoration:none; cursor:pointer;
  transition:background-color .15s ease;
}
.ct-btn--primary{ background:var(--ct-orange); color:#fff }
.ct-btn--primary:hover{ background:var(--ct-orange-600) }
.ct-btn--primary:disabled{ background:var(--ct-n400); cursor:default }
.ct-btn--affiliate{ background:var(--ct-orange); color:#fff; width:100% }
.ct-btn--affiliate:hover{ background:var(--ct-orange-600); color:#fff }
.ct-link{
  border:0; background:none; padding:0;
  color:var(--ct-orange-600); font:inherit; font-weight:600;
  text-decoration:underline; cursor:pointer;
}

/* ---------- tilstand 2: scanner ---------- */

.ct-scanner-top{ display:flex; align-items:center; gap:12px; margin-bottom:18px }
.ct-scanner-nu{ margin:0; font-size:16px; font-weight:600; color:var(--ct-ink-900) }

.ct-arc{
  flex:0 0 auto; width:26px; height:26px; border-radius:50%;
  border:3px solid var(--ct-orange-100);
  border-top-color:var(--ct-orange);
  animation:ct-spin .9s linear infinite;
}
@keyframes ct-spin{ to{transform:rotate(360deg)} }
@media(prefers-reduced-motion:reduce){ .ct-arc{animation-duration:2.4s} }

.ct-trin{ list-style:none; margin:0; padding:0; display:grid; gap:12px }
.ct-trin-punkt{ display:flex; align-items:center; gap:10px; font-size:14px }
.ct-trin-ikon{
  flex:0 0 auto; width:18px; height:18px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:700; line-height:1;
}
.ct-trin-punkt.er-faerdig .ct-trin-navn{ color:var(--ct-ink-700) }
.ct-trin-punkt.er-faerdig .ct-trin-ikon{ background:var(--ct-ok-50); color:var(--ct-ok) }
.ct-trin-punkt.er-faerdig .ct-trin-ikon::before{ content:'✓' }
.ct-trin-punkt.er-aktiv .ct-trin-navn{ color:var(--ct-ink-900); font-weight:600 }
.ct-trin-punkt.er-aktiv .ct-trin-ikon::before{
  content:''; width:10px; height:10px; border-radius:50%; background:var(--ct-orange);
}
.ct-trin-punkt.er-kommende .ct-trin-navn{ color:var(--ct-n400) }
.ct-trin-punkt.er-kommende .ct-trin-ikon::before{
  content:''; width:10px; height:10px; border-radius:50%; background:var(--ct-n200);
}

/* ---------- tilstand 3: resultat ---------- */

.ct-resultat{ display:grid; gap:20px }

.ct-score-kort{ text-align:left }
.ct-score-tal{ display:flex; align-items:baseline; gap:6px; line-height:1 }
.ct-score-tal>span:first-child{
  font-size:44px; font-weight:800; letter-spacing:-.03em; color:var(--ct-advarsel);
}
@media(min-width:768px){ .ct-score-tal>span:first-child{font-size:56px} }
.ct-score-max{ font-size:20px; font-weight:600; color:var(--ct-ink-500) }
.ct-score-kort.er-god    .ct-score-tal>span:first-child{ color:var(--ct-ok) }
.ct-score-kort.er-mellem .ct-score-tal>span:first-child{ color:var(--ct-advarsel) }
.ct-score-kort.er-daarlig .ct-score-tal>span:first-child{ color:var(--ct-fejl) }

.ct-karakter{ margin-top:6px; font-size:20px; font-weight:600; color:var(--ct-ink-900) }
@media(min-width:768px){ .ct-karakter{font-size:24px} }
.ct-meta{ margin-top:4px; font-size:14px; color:var(--ct-ink-500); max-width:82ch }

.ct-noegletal{ display:grid; gap:10px }
@media(min-width:768px){ .ct-noegletal{grid-template-columns:repeat(3,1fr)} }
.ct-tal{
  display:flex; align-items:center; gap:12px;
  padding:14px 16px; border-radius:10px;
  background:var(--ct-n50); border:1px solid var(--ct-n200);
}
@media(min-width:768px){ .ct-tal{flex-direction:column; align-items:flex-start; gap:2px} }
.ct-tal-vaerdi{ font-size:24px; font-weight:700; line-height:1.2; color:var(--ct-ink-900) }
.ct-tal.er-alvorlig .ct-tal-vaerdi{ color:var(--ct-fejl) }
.ct-tal-navn{ font-size:14px; color:var(--ct-ink-500) }

/* fund */
.ct-fund{ list-style:none; margin:0; padding:0; display:grid; gap:10px }
.ct-fund-punkt{
  display:grid; grid-template-columns:20px 1fr auto; gap:10px;
  align-items:start; padding:14px; border-radius:10px;
}
.ct-fund-punkt.er-fejl{ background:var(--ct-fejl-50) }
.ct-fund-punkt.er-ok{ background:var(--ct-ok-50) }
.ct-fund-ikon{ font-size:14px; font-weight:700; line-height:1.6 }
.ct-fund-punkt.er-fejl .ct-fund-ikon{ color:var(--ct-fejl) }
.ct-fund-punkt.er-ok   .ct-fund-ikon{ color:var(--ct-ok) }
.ct-fund-navn{ font-size:16px; font-weight:600; color:var(--ct-ink-900) }
.ct-fund-tekst{ margin-top:2px; font-size:14px; color:var(--ct-ink-700); max-width:82ch }
.ct-fund-kilde{ margin-top:6px; font-size:12px; color:var(--ct-ink-500) }
.ct-point{
  display:flex; flex-direction:column; align-items:flex-end;
  gap:4px; text-align:right;
}
.ct-mangler,.ct-opnaaet{
  padding:3px 9px; border-radius:999px;
  font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  white-space:nowrap; background:rgba(255,255,255,.8);
}
.ct-mangler{ color:var(--ct-fejl) }
.ct-opnaaet{ color:var(--ct-ok) }
.ct-hente{ font-size:12px; color:var(--ct-ink-500); white-space:nowrap }

@media(max-width:599px){
  /* Paa mobil er der ikke plads til badgen ved siden af navnet uden at
     kvase teksten. Den flytter under broedteksten og laegger sig paa linje
     med den, saa venstrekanten er den samme hele vejen ned. */
  .ct-fund-punkt{ grid-template-columns:20px 1fr }
  .ct-point{
    grid-column:2; flex-direction:row; align-items:center;
    gap:8px; margin-top:8px;
  }
}

/* Mailgate — den primaere handling, saa den faar orange flade.
   BEMAERK: ingen negativ margin. Foerst brugte jeg margin:0 -20px for at
   give baggrunden fuld bredde paa mobil, men saa laa mailgate og
   partnersektionen paa 0 px, mens resten af siden holdt sidens 20 px
   gutter. Blokken saa dermed ud til at have en mindre margin end alt
   andet — og et element der bryder sidens grid tiltraekker oejet som en
   fejl, ikke som en fremhaevning. */
.ct-gate{
  margin:0; padding:22px 18px;
  border-radius:var(--ct-radius);
  background:var(--ct-orange-50);
}
@media(min-width:768px){ .ct-gate{padding:32px} }
.ct-gate .ct-kort{ border-width:2px }
.ct-form2{ margin-top:6px }

.ct-checkbox{
  display:flex; align-items:flex-start; gap:10px;
  margin-top:16px; font-size:14px; color:var(--ct-ink-500);
}
.ct-checkbox input{
  flex:0 0 auto; width:20px; height:20px; margin:2px 0 0;
  accent-color:var(--ct-orange); cursor:pointer;
}
.ct-checkbox strong{ color:var(--ct-ink-700) }

.ct-frivillig{
  margin:12px 0 0; font-size:14px; font-weight:600; color:var(--ct-ok);
}

.ct-tak{
  padding:14px 16px; border-radius:var(--ct-radius-s);
  background:var(--ct-ok-50); color:var(--ct-ok);
  font-size:15px; font-weight:600;
}

/* partnere — samme regel som mailgate: hold sidens gutter */
.ct-partnere{
  margin:0; padding:26px 18px;
  border-radius:var(--ct-radius);
  background:var(--ct-n50);
}
@media(min-width:768px){ .ct-partnere{padding:32px} }

.ct-partner-grid{ display:grid; gap:16px; margin-bottom:18px }
@media(min-width:600px){ .ct-partner-grid{grid-template-columns:repeat(2,1fr)} }

.ct-partner{
  display:flex; flex-direction:column; gap:12px;
  padding:20px; border-radius:var(--ct-radius);
  background:var(--ct-hvid); border:1px solid var(--ct-n200);
}
.ct-badge{
  align-self:flex-start;
  padding:4px 10px; border-radius:999px;
  background:var(--ct-orange-100); color:var(--ct-orange-700);
  font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase;
}
.ct-partner-logo{ min-height:32px; display:flex; align-items:center }
.ct-partner-logo img{ max-height:28px; width:auto; max-width:150px }
.ct-partner-navn{ margin:0; font-size:18px; font-weight:600; color:var(--ct-ink-900) }
.ct-partner-punkter{ list-style:none; margin:0; padding:0; display:grid; gap:8px; flex:1 1 auto }
.ct-partner-punkter li{
  display:grid; grid-template-columns:16px 1fr; gap:8px;
  font-size:14px; color:var(--ct-ink-700);
}
.ct-partner-punkter span{ color:var(--ct-ok); font-weight:700 }
.ct-partner-pris{
  padding-top:12px; border-top:1px solid var(--ct-n200);
  font-size:14px; color:var(--ct-ink-500);
}
.ct-partner-pris strong{ font-size:20px; color:var(--ct-ink-900) }

.ct-opsaetning{ background:var(--ct-hvid) }

.ct-alle{ margin:0 0 14px }
.ct-alle a{ color:var(--ct-orange-600); font-weight:600; text-decoration:none }
.ct-alle a:hover{ text-decoration:underline }
.ct-alle a::after{ content:' →' }

.ct-affiliate{ margin:0; font-size:13px; color:var(--ct-ink-500) }

/* forbehold */
.ct-note{
  padding:16px; border-radius:10px;
  border-left:4px solid var(--ct-advarsel);
  background:var(--ct-advarsel-50);
  font-size:14px; color:var(--ct-ink-700);
}
.ct-note strong{ color:var(--ct-ink-900) }

/* Venstrestillet: knappen er en sekundaer handling, og et centreret
   element midt paa siden laeser som en afslutning frem for som et valg. */
.ct-igen{ margin:0; text-align:left }

/* ---------- metodesektion ([cookietjek_metode]) ---------- */

.ct-metode-liste{
  list-style:none; margin:0 0 16px; padding:0;
  display:grid; gap:0;
  border:1px solid var(--ct-n200); border-radius:10px;
  background:var(--ct-hvid); overflow:hidden;
}
@media(min-width:900px){
  /* To kolonner. Grid-flow raekke for raekke, saa den tungeste vaegt staar
     oeverst til venstre — samme laeseretning som i resultatet. */
  .ct-metode-liste{grid-template-columns:1fr 1fr}
}
.ct-metode-punkt{
  display:grid; grid-template-columns:auto 1fr; gap:12px;
  align-items:baseline;
  padding:13px 16px;
  border-top:1px solid var(--ct-n200);
}
.ct-metode-punkt:first-child{ border-top:0 }
@media(min-width:900px){
  .ct-metode-punkt:nth-child(2){ border-top:0 }
  .ct-metode-punkt:nth-child(even){ border-left:1px solid var(--ct-n200) }
}
.ct-vaegt{
  min-width:34px; padding:2px 8px; border-radius:999px;
  background:var(--ct-orange-50); color:var(--ct-orange-600);
  font-size:12px; font-weight:600; text-align:center;
}
.ct-metode-krop{ display:block }
.ct-metode-navn{ display:block; font-size:15px; font-weight:600; color:var(--ct-ink-900) }
.ct-metode-kilde{ display:block; margin-top:2px; font-size:12px; color:var(--ct-ink-500) }
.ct-metode-sum{ margin:0; font-size:14px; color:var(--ct-ink-500) }

/* Fyldcellen har kun kanter, intet indhold. Paa mobil er listen én kolonne,
   saa der er ingen tom celle at lukke — og saa skal den vaere vaek. */
.ct-metode-fyld{ display:none }
@media(min-width:900px){ .ct-metode-fyld{ display:block; min-height:1px } }

/* Kolonnen paa siden er 900 px, fordi resultatet — 11 fund og to
   partnerkort side om side — har brug for pladsen. Men et enkelt inputfelt
   paa 900 px signalerer "formular" frem for "ét spoergsmaal", saa de to
   smalle tilstande holdes paa 760. */
.ct-form,.ct-scanner{ max-width:760px }

/* Scorekortet fylder hele indholdsbredden, saa dets kant flugter med
   sektionsoverskrifterne paa resten af siden. Tallet staar til venstre og
   noegletallene ved siden af paa desktop, saa de 1200 px bliver brugt til
   noget frem for at staa tomme. */
@media(min-width:900px){
  .ct-score-kort{
    display:grid;
    grid-template-columns:minmax(220px,auto) 1fr;
    grid-template-areas:'eyebrow eyebrow' 'tal karakter';
    column-gap:32px; align-items:end;
  }
  .ct-score-kort .ct-eyebrow{ grid-area:eyebrow }
  .ct-score-kort .ct-score-tal{ grid-area:tal }
  .ct-score-kort .ct-karakter{ grid-area:karakter; margin:0 }
  .ct-score-kort .ct-meta{ grid-column:1 / -1; margin-top:10px }
}

/* Affiliate-knappen er et <a>, og Elementors globale linkfarve fra kittet
   slaar min .ct-btn--affiliate{color:#fff}. Resultatet var #C25F22-tekst paa
   #DE712E-baggrund — et kontrastforhold omkring 1,3:1, altsaa praktisk taget
   ulaeseligt. Derfor baade hoejere specificitet OG !important: vi kan ikke
   vide hvilken vaegt kittet bruger, og en CTA der ikke kan laeses er en fejl,
   ikke en detalje. */
.ct-app a.ct-btn--affiliate,
.ct-app a.ct-btn--affiliate:hover,
.ct-app a.ct-btn--affiliate:focus,
.ct-app a.ct-btn--affiliate:visited{ color:#fff!important; text-decoration:none!important }

/* Tredje tilstand: punktet kunne ikke maales udefra. Neutral graa — ikke
   groen, for vi ved ikke om det er i orden, og ikke roed, for vi kan ikke
   paastaa at det mangler. */
.ct-fund-punkt.er-uvurderet{ background:var(--ct-n100) }
.ct-fund-punkt.er-uvurderet .ct-fund-ikon{ color:var(--ct-neutral-600, #6B6B66) }
.ct-uvurderet{
  padding:3px 9px; border-radius:999px;
  font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  white-space:nowrap; background:rgba(255,255,255,.8); color:#6B6B66;
}

/* ---------- priser for det scannede site ---------- */

.ct-priser{
  margin:0; padding:26px 18px;
  border-radius:var(--ct-radius);
  background:var(--ct-orange-50);
}
@media(min-width:768px){ .ct-priser{padding:32px} }

.ct-pris-advarsel{
  display:inline-block; margin:0 0 16px;
  padding:3px 9px; border-radius:999px;
  background:var(--ct-advarsel-50); color:var(--ct-advarsel);
  font-size:12px; font-weight:600;
}

/* ---------- kaaring: tre maader at vaelge paa ---------- */

.ct-aks-knapper{ display:flex; flex-wrap:wrap; gap:8px; margin:18px 0 0 }
.ct-kaaring .ct-aks-knapper .ct-aks-knap{
  min-height:0; padding:10px 18px;
  border:2px solid var(--ct-n200);
  border-radius:999px;
  background:var(--ct-hvid) !important;
  color:var(--ct-ink-700) !important;
  font-family:inherit; font-size:15px; font-weight:600; line-height:1.5;
  cursor:pointer; box-shadow:none;
  transition:border-color .15s ease, background-color .15s ease, color .15s ease;
}
.ct-kaaring .ct-aks-knapper .ct-aks-knap:hover{ border-color:var(--ct-ok) }
.ct-kaaring .ct-aks-knapper .ct-aks-knap.er-valgt{
  border-color:var(--ct-ok);
  background:var(--ct-ok) !important;
  color:#fff !important;
}
.ct-aks-kort{
  margin-top:18px; padding:22px 18px;
  background:var(--ct-hvid);
  border:2px solid var(--ct-orange-100);
  border-radius:var(--ct-radius);
}
@media(min-width:768px){ .ct-aks-kort{padding:28px 32px} }
.ct-aks-hjaelp{ margin:0 0 18px; font-size:15px; color:var(--ct-ink-500) }
.ct-aks-vinder{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:14px }
.ct-aks-logo{ max-height:26px; width:auto }
.ct-aks-svar{ margin:0; font-size:20px; font-weight:600; line-height:1.35 }
.ct-aks-svar.er-tom{ font-weight:600; color:var(--ct-ink-500) }
.ct-aks-hvorfor{ margin:0 0 18px; font-size:15px }
.ct-aks-liste{
  list-style:none; margin:0 0 16px; padding:0;
  border:1px solid var(--ct-n200); border-radius:var(--ct-radius-s); overflow:hidden;
}
.ct-aks-liste li{
  display:flex; justify-content:space-between; gap:16px;
  padding:11px 14px; border-top:1px solid var(--ct-n200);
  font-size:15px; color:var(--ct-ink-500);
}
.ct-aks-liste li:first-child{ border-top:0 }
.ct-aks-liste li.er-vinder{ background:var(--ct-ok-50); color:var(--ct-ink-900); font-weight:600 }
.ct-aks-kilde{ margin:0 0 16px; font-size:13px; color:var(--ct-ink-500) }
.ct-aks-kort .ct-btn--affiliate{ width:auto }
@media(max-width:520px){ .ct-aks-kort .ct-btn--affiliate{width:100%} }
@media(max-width:640px){
  .ct-kaaring .ct-aks-knapper .ct-aks-knap{ padding:9px 15px; font-size:14px }
  .ct-aks-svar{ font-size:18px }
}

/* ---------- jeres loesning i dag ---------- */

.ct-nuvaerende{
  margin:18px 0 0; padding:16px 18px;
  background:var(--ct-hvid);
  border:1px solid var(--ct-n200);
  border-radius:var(--ct-radius-s);
}
.ct-nuvaerende-hat{
  margin:0 0 4px;
  font-size:12px; font-weight:600; line-height:1.35;
  letter-spacing:.06em; text-transform:uppercase;
  color:var(--ct-ink-500);
}
.ct-nuvaerende-tekst{ margin:0; font-size:15px }

/* ---------- prisen i akse-kortet ---------- */

.ct-aks-sporgsmaal{ margin:26px 0 0; font-size:16px; font-weight:600 }
.ct-aks-prishat{
  margin:0 0 2px;
  font-size:12px; font-weight:600; line-height:1.35;
  letter-spacing:.06em; text-transform:uppercase;
  color:var(--ct-ink-500);
}
.ct-aks-original{ margin:0 0 12px; font-size:13px; color:var(--ct-ink-500) }
.ct-aks-pris{
  display:flex; align-items:baseline; gap:12px; flex-wrap:wrap;
  margin:0 0 4px;
}
.ct-aks-belob{ margin:0; font-size:15px; color:var(--ct-ink-500) }
.ct-aks-belob strong{ font-size:28px; color:var(--ct-ink-900); font-weight:600 }
.ct-aks-enhed{ font-size:14px }
.ct-aks-plan{
  margin:0; padding:3px 9px; border-radius:999px;
  background:var(--ct-n100); color:var(--ct-ink-700);
  font-size:12px; font-weight:600;
}
.ct-aks-prisnote{ margin:0 0 16px; font-size:13px; color:var(--ct-ink-500) }

/* ---------- sammenligningstabel i blogindlaeg ---------- */

.cp-sam{ margin:28px 0 }
.cp-sam__t{
  width:100%; border-collapse:collapse;
  background:var(--ct-hvid, #fff);
  border:1px solid var(--ct-n200, #E6E6E3);
  border-radius:var(--ct-radius, 12px);
  overflow:hidden;
  font-size:15px; line-height:1.5;
}
.cp-sam__t th, .cp-sam__t td{
  padding:14px 16px; text-align:left; vertical-align:top;
  border-top:1px solid var(--ct-n200, #E6E6E3);
}
.cp-sam__t thead th{
  border-top:0; background:var(--ct-n50, #FAFAF9);
  font-size:15px; font-weight:600; color:var(--ct-ink-900, #132B33);
}
.cp-sam__t tbody th{ font-weight:600; color:var(--ct-ink-900, #132B33); width:34% }
.cp-sam__note{ display:block; margin-top:3px; font-size:13px; font-weight:400; color:var(--ct-ink-500, #35606B) }
.cp-sam__ikon{ font-weight:700; margin-right:6px }
.cp-sam__ikon.er-ja{ color:var(--ct-ok, #1F7A5C) }
.cp-sam__ikon.er-nej{ color:var(--ct-fejl, #C0392B) }
.cp-sam__ikon.er-delvis{ color:var(--ct-advarsel, #B8850F) }
.cp-sam__vaerdi{ font-weight:600 }
.cp-sam__under{ display:block; margin-top:3px; font-size:13px; color:var(--ct-ink-500, #35606B) }
.cp-sam__kilde{ margin:12px 0 0; font-size:13px; line-height:1.6; color:var(--ct-ink-500, #35606B) }

/* Paa mobil giver tre kolonner for lidt plads. Raekken bliver til et kort,
   hvor hver vaerdi faar udbyderens navn som sin egen etiket. */
@media(max-width:600px){
  .cp-sam__t thead{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0) }
  .cp-sam__t, .cp-sam__t tbody, .cp-sam__t tr, .cp-sam__t th, .cp-sam__t td{ display:block; width:auto }
  .cp-sam__t tr{ border-top:1px solid var(--ct-n200, #E6E6E3); padding:6px 0 10px }
  .cp-sam__t tr:first-child{ border-top:0 }
  .cp-sam__t tbody th{ width:auto; border-top:0; padding-bottom:6px }
  .cp-sam__t td{ border-top:0; padding:4px 16px 4px 32px; position:relative }
  .cp-sam__t td::before{
    content:attr(data-kolonne);
    display:block; font-size:12px; font-weight:600;
    letter-spacing:.04em; text-transform:uppercase;
    color:var(--ct-ink-500, #35606B); margin-bottom:2px;
  }
}

/* ---------- henvisning til vaerktoejet fra et indlaeg ----------
   Sammenligningsindlaeggene skal kunne laeses holistisk, uden at
   vaerktoejets resultat fylder siden. Derfor kun en henvisning. */

.cp-cta{
  margin:28px 0;
  padding:24px;
  border:2px solid var(--ct-orange-100, #FBEDE4);
  border-radius:var(--ct-radius, 12px);
  background:var(--ct-orange-50, #FDF7F2);
}
.cp-cta__t{
  margin:0 0 8px;
  font-size:19px; font-weight:600; line-height:1.35;
  color:var(--ct-ink-900, #132B33);
}
.cp-cta p{ margin:0 0 16px; font-size:15px; line-height:1.7 }
.cp-cta__b{
  display:inline-block;
  padding:14px 24px;
  border-radius:var(--ct-radius-s, 8px);
  background:var(--ct-orange, #DE712E) !important;
  color:#fff !important;
  font-size:16px; font-weight:600; line-height:1.5;
  text-decoration:none;
}
.cp-cta__b:hover{ background:var(--ct-orange-600, #C25F22) !important; color:#fff !important }
@media(max-width:520px){ .cp-cta__b{ display:block; text-align:center } }