/* Delt styling for PackReports statiske indholdssider (guides, om os, viden) */
:root{ --paper:#F3F6F3; --surface:#FFFFFF; --border:#E0E8E2; --ink:#152220; --ink-2:#3B4A43; --ink-3:#6B7772; --accent:#1C6E4A; --accent-2:#134E34; }
*{box-sizing:border-box}
body{ margin:0; background:var(--paper); color:var(--ink); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; line-height:1.65; -webkit-font-smoothing:antialiased; }
a{ color:var(--accent); }
.wrap{ max-width:760px; margin:0 auto; padding:0 24px; }
header.top{ background:var(--surface); border-bottom:1px solid var(--border); position:sticky; top:0; z-index:10; }
header.top .wrap{ display:flex; align-items:center; justify-content:space-between; height:62px; }
.brand{ display:flex; align-items:center; gap:11px; text-decoration:none; color:var(--ink); }
.mark{ width:30px; height:30px; border-radius:8px; background:linear-gradient(150deg,var(--accent),var(--accent-2)); display:grid; place-items:center; flex:0 0 auto; }
.mark svg{ width:17px; height:17px; }
.brand b{ font-weight:750; font-size:16px; }
.nav-links{ display:flex; align-items:center; gap:18px; }
.nav-links a{ color:var(--ink-2); text-decoration:none; font-size:14px; font-weight:600; }
.nav-links a:hover{ color:var(--ink); }
.cta-top{ background:var(--accent); color:#fff !important; text-decoration:none; font-weight:650; font-size:14px; padding:9px 15px; border-radius:10px; }
main{ padding:44px 0 40px; }
.breadcrumb{ font-size:13px; color:var(--ink-3); margin:0 0 18px; }
.breadcrumb a{ color:var(--ink-2); text-decoration:none; }
.breadcrumb a:hover{ color:var(--accent); text-decoration:underline; }
.breadcrumb span[aria-current]{ color:var(--ink); font-weight:600; }
.breadcrumb .sep{ margin:0 6px; color:var(--ink-3); }
.eyebrow{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--accent); font-weight:700; margin:0 0 12px; }
h1{ font-family:Georgia,'Iowan Old Style',serif; font-weight:600; font-size:34px; line-height:1.15; letter-spacing:-.015em; margin:0 0 14px; }
.lead{ font-size:18px; color:var(--ink-2); margin:0 0 10px; }
h2{ font-family:Georgia,serif; font-weight:600; font-size:25px; letter-spacing:-.01em; margin:42px 0 12px; padding-top:10px; }
h3{ font-size:18px; margin:26px 0 6px; }
p{ margin:0 0 16px; color:var(--ink-2); }
ul,ol{ color:var(--ink-2); padding-left:22px; margin:0 0 16px; }
li{ margin:6px 0; }
b,strong{ color:var(--ink); }
.toc{ background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:20px 24px; margin:28px 0; }
.toc h2{ font-family:inherit; font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-3); margin:0 0 10px; padding:0; }
.toc ol{ margin:0; }
.callout{ background:#E5F0EA; border-left:3px solid var(--accent); border-radius:0 12px 12px 0; padding:16px 18px; margin:22px 0; }
.callout p:last-child{ margin:0; }
.calc{ background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:20px 24px; margin:22px 0; font-size:16px; }
.calc .row{ display:flex; flex-wrap:wrap; gap:8px 14px; align-items:baseline; }
.calc b{ font-variant-numeric:tabular-nums; }
/* Ja/nej-scenarier (Er du omfattet) */
.scenario{ display:flex; gap:13px; align-items:flex-start; background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:15px 17px; margin:12px 0; }
.scenario .badge{ flex:0 0 auto; width:24px; height:24px; border-radius:50%; display:grid; place-items:center; font-weight:800; font-size:14px; margin-top:1px; }
.scenario.yes .badge{ background:#E5F0EA; color:var(--accent); }
.scenario.no .badge{ background:#F0F4F1; color:var(--ink-3); }
.scenario p{ margin:0; font-size:15px; }
.scenario b{ display:block; margin-bottom:2px; }
/* Hub-kort (viden) */
.cards{ display:grid; grid-template-columns:1fr; gap:16px; margin:28px 0; }
.card{ display:block; background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:20px 22px; text-decoration:none; color:var(--ink); transition:border-color .15s; }
.card:hover{ border-color:var(--accent); }
.card h3{ margin:0 0 6px; font-size:18px; }
.card p{ margin:0; font-size:14.5px; color:var(--ink-2); }
/* Interaktiv tjek (lead magnet) */
.quiz{ background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:24px 26px; margin:26px 0 34px; box-shadow:0 10px 30px -18px rgba(18,40,30,.2); }
.quiz > h2{ margin:0 0 4px; padding:0; font-size:21px; }
.quiz > p.sub{ margin:0 0 16px; font-size:14.5px; color:var(--ink-3); }
.q{ padding:14px 0; border-top:1px solid var(--border); }
.q:first-of-type{ border-top:0; }
.q .qt{ display:block; font-weight:600; color:var(--ink); margin-bottom:9px; font-size:15px; }
.opts{ display:flex; gap:9px; }
.opts button{ flex:1; font-family:inherit; font-size:14px; font-weight:650; padding:9px 12px; border-radius:10px; border:1px solid var(--border-strong,#CFDAD2); background:var(--paper); color:var(--ink-2); cursor:pointer; }
.opts button.sel{ background:var(--accent); color:#fff; border-color:var(--accent); }
.quiz-cta{ margin-top:18px; }
.quiz-cta button{ width:100%; font-family:inherit; font-size:15px; font-weight:700; padding:12px; border-radius:12px; border:0; background:var(--accent); color:#fff; cursor:pointer; }
.quiz-cta button:disabled{ background:#CFDAD2; color:#fff; cursor:not-allowed; }
.result{ margin-top:6px; }
.result .verdict{ font-family:Georgia,serif; font-size:20px; font-weight:600; margin:0 0 6px; }
.result .verdict.yes{ color:var(--accent); }
.result .lead-form{ display:flex; gap:9px; margin-top:14px; flex-wrap:wrap; }
.result .lead-form input{ flex:1; min-width:180px; font-family:inherit; font-size:15px; padding:11px 13px; border:1px solid var(--border-strong,#CFDAD2); border-radius:10px; }
.result .lead-form button{ font-family:inherit; font-size:15px; font-weight:700; padding:11px 18px; border-radius:10px; border:0; background:var(--accent); color:#fff; cursor:pointer; white-space:nowrap; }
.result .note{ font-size:12.5px; color:var(--ink-3); margin:9px 0 0; }
.result .thanks{ background:#E5F0EA; border:1px solid rgba(28,110,74,.2); border-radius:12px; padding:14px 16px; font-size:14.5px; color:var(--ink); }
.cta-box{ background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:26px; margin:40px 0 8px; text-align:center; }
.cta-box h2{ margin:0 0 8px; padding:0; }
.cta-box a.btn, .cta-box button.btn{ display:inline-block; background:var(--accent); color:#fff !important; text-decoration:none; font-weight:700; padding:12px 22px; border-radius:12px; margin-top:8px; border:0; cursor:pointer; font-family:inherit; font-size:15px; }
.cta-box button.btn:hover{ background:var(--accent-2); }
.cta-box button.btn:disabled{ background:#CFDAD2; cursor:not-allowed; }
.disclaimer{ font-size:13.5px; color:var(--ink-3); border-top:1px solid var(--border); padding-top:20px; margin-top:40px; }
footer{ border-top:1px solid var(--border); background:var(--surface); color:var(--ink-3); font-size:13px; }
footer .wrap{ padding:22px 24px; text-align:center; }
footer a{ color:var(--ink-3); }
footer .fnav{ margin-bottom:6px; display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
@media (max-width:560px){ h1{font-size:27px} h2{font-size:22px} .nav-links a:not(.cta-top){display:none} }