/*
 Theme Name:   Kadence Child - Voksenmanualen
 Theme URI:    https://voksenmanualen.dk
 Description:  Child theme til Kadence. Bærer Voksenmanualens designsystem 1:1 fra
               voksenmanualen.html: blæk-sort/off-white/stempel-rød, Archivo +
               IBM Plex Mono, skarpe kanter, checkbox-motiver, "TJEKKET MOD
               LOVEN"-segl. Header/footer er bygget som faste templates (se
               header.php/footer.php), ikke Kadence's Header/Footer Builder —
               det giver pixel-præcist match, men betyder at header/footer
               redigeres i kode, ikke i Customizer.
 Author:       Voksenmanualen
 Template:     kadence
 Version:      2.0.0
*/

/* =========================================================
   1. DESIGN TOKENS
   Ét sted at ændre farver/fonte — alt andet arver herfra.
   ========================================================= */
:root{
  --ink:#17171A;
  --paper:#EEECE4;
  --paper-2:#E7E4D9;
  --manila:#E3D7B8;
  --stamp:#E02D22;
  --stamp-ink:#C0261C;
  --line:#C9C5B8;
  --line-dk:#3a372f;
  --muted:#6C685C;
  --disp:'Archivo','Helvetica Neue',Arial,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,Menlo,Consolas,monospace;
}

/* =========================================================
   2. BASE
   ========================================================= */
*{box-sizing:border-box}
body{
  font-family:var(--disp);
  background:var(--paper);
  color:var(--ink);
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
a{ color:inherit; text-decoration:none; }
.mono{ font-family:var(--mono); }
html{ scroll-behavior:smooth; }
@media(prefers-reduced-motion:reduce){
  *{ transition:none!important; scroll-behavior:auto!important; animation:none!important; }
}
:focus-visible{ outline:3px solid var(--stamp); outline-offset:2px; }
::selection{ background:var(--stamp); color:#fff; }

.wrap{ max-width:1140px; margin:0 auto; padding:0 28px; }
img{ max-width:100%; height:auto; }

/* =========================================================
   3. EYEBROW / KICKER LABELS
   ========================================================= */
.eyebrow, .kick{
  font-family:var(--mono);
  font-size:11.5px;
  letter-spacing:2.5px;
  text-transform:uppercase;
  color:var(--stamp-ink);
  font-weight:500;
  display:inline-flex;
  align-items:center;
  gap:9px;
}
.eyebrow::before, .kick::before{
  content:"";
  width:22px;
  height:2px;
  background:var(--stamp);
}

/* =========================================================
   4. BUTTONS
   ========================================================= */
.btn{
  font-family:var(--mono);
  font-size:13px;
  font-weight:600;
  letter-spacing:.5px;
  border:1.5px solid var(--ink);
  border-radius:8px;
  padding:14px 22px;
  background:var(--ink);
  color:var(--paper);
  cursor:pointer;
  transition:transform .12s ease;
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.btn:hover{ transform:translateY(-1px); }
.btn.stamp, .btn.red{ background:var(--stamp); border-color:var(--stamp); color:#fff; }
.btn.dark{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
.btn.ghost{ background:transparent; color:var(--ink); }
.btn.ghost:hover{ background:var(--ink); color:var(--paper); }
.btn.sm{ font-size:12px; padding:9px 15px; }

/* =========================================================
   5. TOP BAR / HEADER  (header.php)
   ========================================================= */
header.bar{
  position:sticky; top:0; z-index:50;
  background:rgba(238,236,228,.9);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.bar-in{ display:flex; align-items:center; justify-content:space-between; height:62px; }
.brand{ display:flex; align-items:center; gap:11px; font-weight:800; font-size:17px; letter-spacing:-.3px; }
.mark, .mk{
  width:30px; height:30px; border:2px solid var(--ink); border-radius:5px;
  display:grid; place-items:center; font-family:var(--mono); font-weight:600; font-size:13px;
  background:var(--stamp); color:var(--paper); border-color:var(--stamp);
}
nav.top{ display:flex; gap:26px; align-items:center; }
nav.top a{ font-family:var(--mono); font-size:12.5px; letter-spacing:.5px; color:var(--muted); }
nav.top a:hover{ color:var(--ink); }
.bar .back{ font-family:var(--mono); font-size:12px; color:var(--muted); }
.bar .back:hover{ color:var(--ink); }
@media(max-width:720px){ nav.top a:not(.navcta){ display:none; } }
@media(max-width:620px){ .bar .back{ display:none; } }

/* =========================================================
   6. HERO
   ========================================================= */
.hero{ padding:76px 0 20px; position:relative; }
.hero h1{
  font-size:clamp(46px,9vw,104px);
  line-height:.94;
  font-weight:900;
  letter-spacing:-2.5px;
  margin:20px 0 0;
  max-width:14ch;
}
.hero h1 .r, .hero h1 .u{ color:var(--stamp); }
.hero .sub{ font-size:clamp(17px,2.2vw,21px); color:#3a382f; max-width:52ch; margin:26px 0 0; line-height:1.5; }
.hero .cta{ display:flex; gap:12px; flex-wrap:wrap; margin-top:30px; }
.hero .cta .btn{ font-size:13.5px; padding:13px 20px; }

/* Dark/salgsside hero-variant */
.hero.dark{
  background:var(--ink); color:var(--paper); border-bottom:1px solid var(--ink);
  padding:0; margin:0 0 0; border-radius:0;
}
.hero.dark .wrap.hero-in{
  display:grid; grid-template-columns:1.15fr .85fr; gap:52px; padding:66px 28px; align-items:center; max-width:1140px; margin:0 auto;
}
.hero.dark .eyebrow{ color:#ff6a5f; }
.hero.dark .eyebrow::before{ background:var(--stamp); }
.hero.dark h1{ font-size:clamp(38px,5.6vw,60px); font-weight:800; letter-spacing:-2px; line-height:.98; margin:20px 0 0; max-width:none; }
.hero.dark .sub{ color:#D8D2C6; margin-top:22px; max-width:42ch; }
.hero.dark .buyrow{ display:flex; align-items:center; gap:20px; margin-top:30px; flex-wrap:wrap; }
.hero.dark .price{ font-size:40px; font-weight:900; letter-spacing:-1.5px; }
.hero.dark .price small{ font-family:var(--mono); font-size:12px; font-weight:500; color:#8f897d; letter-spacing:.5px; display:block; margin-top:-4px; }
.hero.dark .trust{ font-family:var(--mono); font-size:11.5px; color:#8f897d; letter-spacing:.4px; margin-top:18px; display:flex; gap:14px; flex-wrap:wrap; }
.hero.dark .trust b{ color:#D8D2C6; font-weight:500; }
@media(max-width:820px){ .hero.dark .wrap.hero-in{ grid-template-columns:1fr; gap:38px; } }

/* Produkt-cover (bruges i salgsside-hero, uafhængig af .product-modulet) */
.cover{
  background:#0f0f11; border:1px solid var(--line-dk); border-radius:12px; padding:30px 28px;
  position:relative; box-shadow:0 20px 40px rgba(0,0,0,.35); color:var(--paper);
}
.cover .k{ font-family:var(--mono); font-size:10.5px; letter-spacing:2px; color:var(--stamp); text-transform:uppercase; }
.cover .big{ font-size:40px; font-weight:900; letter-spacing:-2px; line-height:.95; margin-top:12px; }
.cover .rule{ height:2px; background:var(--stamp); width:44px; margin:20px 0; }
.cover .meta{ font-family:var(--mono); font-size:11px; color:#9a9488; line-height:1.85; }
.cover .seal{
  position:absolute; right:22px; bottom:22px; width:78px; height:78px; border-radius:50%;
  border:2px solid var(--stamp); color:var(--stamp); display:grid; place-items:center; text-align:center;
  font-family:var(--mono); font-size:10px; line-height:1.25; font-weight:600; letter-spacing:.5px; transform:rotate(-11deg);
}
@media(max-width:820px){ .cover{ max-width:360px; } }

/* =========================================================
   7. STAMP STRIP (checkbox-motiv, forsidens signaturmoment)
   ========================================================= */
.stamp-strip{
  margin:44px 0 8px;
  border-top:1.5px solid var(--ink);
  border-bottom:1.5px solid var(--ink);
  display:flex; flex-wrap:wrap; gap:0;
}
.stamp-strip .cell{
  flex:1 1 25%; min-width:180px; padding:16px 18px;
  border-right:1px solid var(--line);
  display:flex; align-items:center; gap:12px;
}
.stamp-strip .cell:last-child{ border-right:none; }
.chk{
  width:19px; height:19px; border:2px solid var(--ink); border-radius:4px;
  flex:0 0 auto; position:relative;
}
.chk.done{ background:var(--stamp); border-color:var(--stamp); }
.chk.done::after{
  content:""; position:absolute; left:5px; top:1px; width:6px; height:11px;
  border:solid #fff; border-width:0 2.5px 2.5px 0; transform:rotate(43deg);
}
.stamp-strip .t{ font-family:var(--mono); font-size:12.5px; letter-spacing:.3px; line-height:1.3; }
.stamp-strip .t small{ display:block; color:var(--muted); font-size:11px; letter-spacing:.2px; }

/* =========================================================
   8. SECTION FRAME
   ========================================================= */
section.blk, section{ padding:64px 0; }
.sec-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:20px; margin-bottom:30px; flex-wrap:wrap; }
.sec-head h2, h2.sec{ font-size:clamp(26px,3.6vw,40px); font-weight:800; letter-spacing:-1px; line-height:1.05; max-width:20ch; }
.sec-head p, .lead{ color:var(--muted); max-width:40ch; font-size:15px; }
.lead{ font-size:17px; color:#39362f; max-width:60ch; margin-top:16px; line-height:1.6; }
.lead b{ font-weight:700; }

/* =========================================================
   9. TABLE OF CONTENTS / KAPITEL-LISTE (forsiden)
   ========================================================= */
.toc{ border-top:1.5px solid var(--ink); }
.ch{
  display:grid; grid-template-columns:64px 1fr auto; gap:22px; align-items:center;
  padding:20px 6px; border-bottom:1px solid var(--line); cursor:pointer;
  transition:background .14s ease, padding-left .14s ease;
}
.ch:hover{ background:var(--paper-2); padding-left:16px; }
.ch .no{ font-family:var(--mono); font-size:14px; color:var(--stamp-ink); font-weight:600; letter-spacing:1px; }
.ch .body h3{ font-size:19px; font-weight:700; letter-spacing:-.3px; }
.ch .body p{ color:var(--muted); font-size:14.5px; margin-top:2px; }
.ch .go{ font-family:var(--mono); font-size:12px; color:var(--muted); opacity:0; transition:opacity .14s; }
.ch:hover .go{ opacity:1; }
.ch .tag-soon{ font-family:var(--mono); font-size:10.5px; color:var(--muted); border:1px solid var(--line); border-radius:20px; padding:3px 9px; letter-spacing:.5px; white-space:nowrap; }
@media(max-width:560px){ .ch{ grid-template-columns:40px 1fr; gap:14px; } .ch .go, .ch .tag-soon{ display:none; } }

/* Alternativ toc-liste med checkbox (salgsside "Hvad er der i pakken") */
.inside{ background:var(--ink); color:var(--paper); }
.inside .kick, .inside .eyebrow{ color:#ff6a5f; }
.inside h2.sec{ color:var(--paper); }
.toc.checklist{ display:grid; grid-template-columns:1fr 1fr; gap:0 44px; border-top:1px solid var(--line-dk); margin-top:34px; }
@media(max-width:680px){ .toc.checklist{ grid-template-columns:1fr; } }
.toc.checklist .row{ display:flex; gap:14px; align-items:flex-start; padding:15px 0; border-bottom:1px solid var(--line-dk); }
.toc.checklist .box{
  width:16px; height:16px; border:2px solid var(--stamp); border-radius:3px;
  flex:0 0 auto; margin-top:2px; position:relative; background:var(--stamp);
}
.toc.checklist .box::after{
  content:""; position:absolute; left:4px; top:0; width:5px; height:9px;
  border:solid #fff; border-width:0 2px 2px 0; transform:rotate(43deg);
}
.toc.checklist .no{ font-family:var(--mono); font-size:12px; color:#8f897d; flex:0 0 auto; width:22px; }
.toc.checklist .t{ font-size:14.5px; }
.toc.checklist .t b{ font-weight:700; }
.toc.checklist .t small{ display:block; color:#948e82; font-size:12.5px; margin-top:2px; }

/* =========================================================
   10. PROBLEM / PAIN BULLETS
   ========================================================= */
.pains{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:34px; }
@media(max-width:760px){ .pains{ grid-template-columns:1fr; } }
.pain{ border-top:2px solid var(--ink); padding-top:14px; }
.pain .n{ font-family:var(--mono); font-size:12px; color:var(--stamp-ink); font-weight:600; }
.pain p{ font-size:14.5px; color:#4a463c; margin-top:6px; }

/* =========================================================
   11. FLAGSHIP PRODUCT MODULE (forsiden + sidebar)
   ========================================================= */
.product{
  background:var(--manila); border:1.5px solid var(--ink); border-radius:14px; overflow:hidden;
  display:grid; grid-template-columns:300px 1fr;
}
.product .cover{
  background:var(--ink); color:var(--paper); padding:34px 30px; border:none; border-radius:0; box-shadow:none;
  display:flex; flex-direction:column; justify-content:space-between; position:relative;
}
.product .cover .k{ font-family:var(--mono); font-size:11px; letter-spacing:2px; color:var(--stamp); text-transform:uppercase; }
.product .cover .big{ font-size:38px; font-weight:900; letter-spacing:-1.5px; line-height:.98; margin-top:14px; }
.product .cover .meta{ font-family:var(--mono); font-size:11.5px; color:#B9B4A5; margin-top:20px; line-height:1.7; }
.product .cover .seal{
  position:absolute; right:24px; bottom:24px; width:74px; height:74px; border-radius:50%;
  border:2px solid var(--stamp); color:var(--stamp); display:grid; place-items:center; text-align:center;
  font-family:var(--mono); font-size:10px; line-height:1.25; transform:rotate(-11deg); font-weight:600; letter-spacing:.5px;
}
.product .info{ padding:34px 34px 30px; display:flex; flex-direction:column; }
.product .info .tag{ font-family:var(--mono); font-size:11.5px; letter-spacing:1.5px; color:var(--stamp-ink); text-transform:uppercase; }
.product .info h3{ font-size:26px; font-weight:800; letter-spacing:-.6px; margin:8px 0 10px; }
.product .info>p{ color:#413f36; font-size:15px; max-width:46ch; }
.plist{ list-style:none; margin:18px 0 0; display:grid; grid-template-columns:1fr 1fr; gap:8px 22px; }
.plist li{ font-size:13.5px; display:flex; gap:9px; align-items:flex-start; color:#413f36; }
.plist li::before{
  content:""; width:14px; height:14px; margin-top:3px; flex:0 0 auto;
  border:1.6px solid var(--stamp); border-radius:3px;
  background:linear-gradient(135deg,transparent 46%,var(--stamp) 46%,var(--stamp) 60%,transparent 60%);
}
.buy{ display:flex; align-items:center; gap:18px; margin-top:auto; padding-top:24px; flex-wrap:wrap; }
.price{ font-size:34px; font-weight:900; letter-spacing:-1px; }
.price small{ font-family:var(--mono); font-size:13px; font-weight:500; color:var(--muted); letter-spacing:.5px; }
@media(max-width:760px){ .product{ grid-template-columns:1fr; } .plist{ grid-template-columns:1fr; } }

/* =========================================================
   12. TRUST / "TJEKKET MOD LOVEN"-BOKS
   ========================================================= */
.trustbox{
  border:1.5px solid var(--ink); border-radius:14px; background:var(--manila);
  padding:38px 40px; display:grid; grid-template-columns:auto 1fr; gap:30px; align-items:center;
}
.trustbox .seal2{
  width:110px; height:110px; border-radius:50%; border:2.5px solid var(--ink);
  display:grid; place-items:center; text-align:center; font-family:var(--mono);
  font-size:12px; font-weight:600; line-height:1.3; letter-spacing:1px; transform:rotate(-8deg); flex:0 0 auto;
}
.trustbox h3{ font-size:22px; font-weight:800; letter-spacing:-.5px; }
.trustbox p{ font-size:14.5px; color:#4a3f2c; margin-top:8px; max-width:60ch; }
.trustbox .f{ font-family:var(--mono); font-size:12px; color:#6b5f45; margin-top:12px; display:flex; gap:16px; flex-wrap:wrap; }
@media(max-width:620px){ .trustbox{ grid-template-columns:1fr; gap:20px; text-align:center; } .trustbox .seal2{ margin:0 auto; } }

/* =========================================================
   13. OFFER / KØB-BLOK (salgsside CTA)
   ========================================================= */
.offer{ background:var(--ink); color:var(--paper); text-align:center; border-radius:16px; padding:56px 40px; }
.offer .kick, .offer .eyebrow{ color:#ff6a5f; justify-content:center; display:flex; }
.offer h2{ font-size:clamp(28px,4vw,42px); font-weight:800; letter-spacing:-1.2px; margin:6px auto 0; max-width:20ch; }
.offer .price{ font-size:64px; font-weight:900; letter-spacing:-3px; margin:22px 0 4px; }
.offer .sm{ font-family:var(--mono); font-size:12px; color:#8f897d; letter-spacing:.5px; }
.offer .btn{ margin-top:24px; font-size:14px; padding:16px 30px; }
.offer .fine{ font-family:var(--mono); font-size:11px; color:#6f695d; margin-top:16px; letter-spacing:.3px; }

/* =========================================================
   14. FAQ
   ========================================================= */
.faq{ border-top:2px solid var(--ink); }
.faq details{ border-bottom:1px solid var(--line); padding:20px 0; }
.faq summary{
  font-weight:700; font-size:17px; cursor:pointer; list-style:none;
  display:flex; justify-content:space-between; gap:16px; align-items:center;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; font-family:var(--mono); color:var(--stamp); font-size:22px; font-weight:400; }
.faq details[open] summary::after{ content:"–"; }
.faq p{ font-size:14.5px; color:#4a463c; margin-top:12px; max-width:70ch; line-height:1.6; }

/* =========================================================
   15. NEWSLETTER / VOKSENPOSTEN
   ========================================================= */
.post{ background:var(--ink); color:var(--paper); border-radius:14px; padding:48px 44px; position:relative; overflow:hidden; }
.post .eyebrow{ color:#ff6a5f; }
.post .eyebrow::before{ background:var(--stamp); }
.post h2{ font-size:clamp(26px,4vw,40px); font-weight:800; letter-spacing:-1px; margin:16px 0 10px; max-width:16ch; }
.post p{ color:#C4BFB2; max-width:44ch; font-size:15px; }
.form{ display:flex; gap:10px; margin-top:26px; max-width:460px; flex-wrap:wrap; }
.form input{
  flex:1; min-width:200px; background:transparent; border:1.5px solid #4b4740; border-radius:8px;
  padding:13px 15px; color:var(--paper); font-family:var(--mono); font-size:13.5px;
}
.form input::placeholder{ color:#8a857a; }
.form input:focus{ outline:none; border-color:var(--stamp); }
.post .note{ font-family:var(--mono); font-size:11px; color:#8a857a; margin-top:14px; letter-spacing:.3px; }
.post .seal2{ position:absolute; right:-30px; top:-30px; width:200px; height:200px; border-radius:50%; border:1.5px dashed #3b3830; opacity:.6; }

/* =========================================================
   16. FOOTER (footer.php)
   ========================================================= */
footer.site-footer{ border-top:1.5px solid var(--ink); margin-top:20px; padding:40px 0 60px; }
.foot{ display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; align-items:flex-start; }
.foot .disc, .disc{ max-width:56ch; font-size:12.5px; color:var(--muted); line-height:1.65; }
.foot .disc b, .disc b{ color:var(--ink); }
.foot .cols{ display:flex; gap:50px; flex-wrap:wrap; }
.foot .col h4{ font-family:var(--mono); font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--muted); margin-bottom:12px; }
.foot .col a{ display:block; font-size:13.5px; color:#3a382f; padding:3px 0; }
.foot .col a:hover{ color:var(--stamp-ink); }
.copy{
  margin-top:34px; font-family:var(--mono); font-size:11.5px; color:var(--muted);
  letter-spacing:.4px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px;
}

/* =========================================================
   17. WORDPRESS-SPECIFIKKE JUSTERINGER
   ========================================================= */
.wp-block-button__link{ font-family:var(--mono)!important; border-radius:8px!important; letter-spacing:.5px; }
.wp-block-quote{ border-left:3px solid var(--stamp); padding-left:20px; font-style:normal; }

/* =========================================================
   18. KAPITEL / ARTIKEL-SIDER (page-kapitel.php)
   Nyt i v2.0 — bruges af de otte kapitler. Samme tokens og
   greb som resten (checkbox-lister, mono-labels, skarpe
   kanter), men tilpasset løbende læsetekst.
   ========================================================= */
.kapitel-hero{ padding:52px 0 40px; border-bottom:1.5px solid var(--ink); }
.kapitel-hero .crumb{ font-family:var(--mono); font-size:12px; color:var(--muted); margin-bottom:18px; display:block; }
.kapitel-hero .crumb a:hover{ color:var(--stamp-ink); }
.kapitel-hero h1{
  font-size:clamp(32px,5vw,52px); font-weight:800; letter-spacing:-1.3px; line-height:1.04; margin-top:16px; max-width:18ch;
}
.kapitel-hero .lead{ margin-top:18px; }
.kapitel-meta{
  display:flex; gap:18px; flex-wrap:wrap; margin-top:22px; font-family:var(--mono);
  font-size:12px; color:var(--muted); letter-spacing:.3px;
}
.kapitel-meta b{ color:var(--ink); font-weight:600; }

.article{ max-width:72ch; margin:0 auto; padding:56px 0 20px; }
.article h2{
  font-size:clamp(22px,3vw,30px); font-weight:800; letter-spacing:-.6px; line-height:1.15;
  margin:48px 0 16px; padding-top:20px; border-top:2px solid var(--ink);
}
.article h2:first-child{ margin-top:0; padding-top:0; border-top:none; }
.article h3{ font-size:19px; font-weight:700; letter-spacing:-.3px; margin:28px 0 10px; }
.article p{ font-size:16px; color:#2c2a26; margin:0 0 18px; line-height:1.7; }
.article p:last-child{ margin-bottom:0; }
.article b, .article strong{ font-weight:700; color:var(--ink); }
.article ul, .article ol{ margin:0 0 20px; padding:0; list-style:none; }
.article ul li, .article ol li{
  font-size:15.5px; line-height:1.6; color:#2c2a26; padding:8px 0 8px 30px; position:relative;
  border-bottom:1px solid var(--line);
}
.article ul li:last-child, .article ol li:last-child{ border-bottom:none; }
.article ul li::before{
  content:""; position:absolute; left:0; top:12px; width:15px; height:15px;
  border:1.6px solid var(--stamp); border-radius:3px;
  background:linear-gradient(135deg,transparent 46%,var(--stamp) 46%,var(--stamp) 60%,transparent 60%);
}
.article ol{ counter-reset:kap; }
.article ol li{ counter-increment:kap; }
.article ol li::before{
  content:counter(kap); position:absolute; left:0; top:7px; width:20px; height:20px;
  border:1.6px solid var(--ink); border-radius:4px; font-family:var(--mono); font-size:11px;
  font-weight:600; display:grid; place-items:center; color:var(--ink);
}
.article a:not(.btn){ color:var(--stamp-ink); text-decoration:underline; text-underline-offset:2px; }
.article table{ width:100%; border-collapse:collapse; margin:0 0 24px; font-size:14.5px; }
.article th, .article td{ text-align:left; padding:10px 14px; border-bottom:1px solid var(--line); }
.article th{ font-family:var(--mono); font-size:11.5px; letter-spacing:.5px; text-transform:uppercase; color:var(--muted); font-weight:600; }

/* Callout-bokse i artikler: tip (neutral) og pas-på (advarsel) */
.callout{ border-radius:12px; padding:22px 24px; margin:0 0 24px; }
.callout .lbl{ font-family:var(--mono); font-size:11px; letter-spacing:1.5px; text-transform:uppercase; font-weight:600; display:block; margin-bottom:8px; }
.callout p{ font-size:14.5px; margin:0; color:inherit; }
.callout.tip{ background:var(--manila); border:1.5px solid var(--ink); }
.callout.tip .lbl{ color:#6b5f45; }
.callout.tip p{ color:#3a3226; }
.callout.warn{ background:var(--paper-2); border-left:4px solid var(--stamp); }
.callout.warn .lbl{ color:var(--stamp-ink); }
.callout.warn p{ color:#3a382f; }

/* Kilde-note nederst i hvert kapitel */
.source-note{
  font-family:var(--mono); font-size:11.5px; color:var(--muted); line-height:1.7;
  border-top:1px solid var(--line); margin-top:40px; padding-top:20px;
}
.source-note b{ color:var(--ink); }
.source-note ul{ margin:8px 0 0; padding-left:18px; }
.source-note li{ margin-bottom:3px; }

/* Mini-CTA: produkt-plug midt i en artikel (bruges i Bolig & flytning) */
.mini-cta{
  display:flex; align-items:center; gap:20px; background:var(--ink); color:var(--paper);
  border-radius:14px; padding:26px 28px; margin:8px 0 30px; flex-wrap:wrap;
}
.mini-cta .txt{ flex:1 1 260px; }
.mini-cta .tag{ font-family:var(--mono); font-size:10.5px; letter-spacing:1.5px; text-transform:uppercase; color:#ff6a5f; }
.mini-cta h4{ font-size:19px; font-weight:800; letter-spacing:-.4px; margin:6px 0 6px; }
.mini-cta p{ color:#C4BFB2; font-size:13.5px; margin:0; }
.mini-cta .side{ display:flex; align-items:center; gap:14px; flex:0 0 auto; }
.mini-cta .p{ font-size:22px; font-weight:900; }

/* Kapitel-navigation: forrige/næste + tilbage til indhold */
.chapter-nav{ border-top:1.5px solid var(--ink); padding:30px 0 0; margin-top:20px; }
.chapter-nav .back-toc{ font-family:var(--mono); font-size:12.5px; color:var(--muted); display:inline-block; margin-bottom:24px; }
.chapter-nav .back-toc:hover{ color:var(--stamp-ink); }
.chapter-nav .pair{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media(max-width:640px){ .chapter-nav .pair{ grid-template-columns:1fr; } }
.chapter-nav .card{
  border:1.5px solid var(--ink); border-radius:12px; padding:18px 20px; transition:background .14s ease;
}
.chapter-nav .card:hover{ background:var(--paper-2); }
.chapter-nav .card.next{ text-align:right; }
.chapter-nav .card .dir{ font-family:var(--mono); font-size:10.5px; letter-spacing:1.5px; text-transform:uppercase; color:var(--stamp-ink); display:block; margin-bottom:6px; }
.chapter-nav .card .ttl{ font-size:16px; font-weight:700; letter-spacing:-.2px; }

/* Produkt-side (page-produkt.php) — samme klasser som forsidens .hero.dark/.cover/.pains osv. genbruges 1:1 */