/*
Theme Name: Sommerhuse er noget vi deler
Theme URI: https://sommerhuseernogetvideler.dk/
Author: Sommerhuse er noget vi deler
Description: Tema til sommerhuseernogetvideler.dk – ordningen for sommerhusejere, der deler deres sommerhus, når de ikke selv er der. Drives i samarbejde med nybyggethus.dk.
Version: 1.5.2
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: sommerhuse-vi-deler
License: GNU General Public License v2 or later
*/
:root{
  --gron:#2F5D50; --gron-mork:#234840; --sol:#F2B544; --hav:#7FA7BC;
  --sand:#EFE4CF; --sand-lys:#F8F3E8; --tjaere:#1F2A2A; --graa:#5B6866;
  --hvid:#ffffff; --kant:#DED3BD; --radius:18px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Figtree',system-ui,sans-serif;color:var(--tjaere);background:var(--sand-lys);line-height:1.6;font-size:17px}
h1,h2,h3{font-family:'Outfit',system-ui,sans-serif;font-weight:700;letter-spacing:-.01em;line-height:1.15;color:var(--tjaere)}
a{color:var(--gron)}
.wrap{max-width:1140px;margin:0 auto;padding:0 20px}
section{scroll-margin-top:80px}

/* Header */
header{position:sticky;top:0;z-index:20;background:rgba(248,243,232,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--kant)}
.head{display:flex;align-items:center;justify-content:space-between;height:72px;gap:16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--tjaere)}
.brand .logo-svg{height:46px;width:auto;display:block}
@media(max-width:480px){.brand .logo-svg{height:38px}}
.fod-logo .logo-svg{height:52px;width:auto;margin-bottom:16px}
nav ul{display:flex;gap:24px;list-style:none}
nav a{text-decoration:none;color:var(--tjaere);font-weight:500;font-size:15px}
nav a:hover{color:var(--gron)}
.btn{display:inline-block;background:var(--gron);color:#fff !important;text-decoration:none;font-weight:600;padding:13px 24px;border-radius:999px;border:0;cursor:pointer;font-size:16px;font-family:inherit;transition:background .2s}
.btn:hover{background:var(--gron-mork)}
.btn-lys{background:transparent;color:var(--gron) !important;border:2px solid var(--gron)}
.btn-lys:hover{background:var(--gron);color:#fff !important}
.head .btn{padding:10px 18px;font-size:15px;white-space:nowrap}
@media(max-width:480px){.head .btn{padding:9px 14px;font-size:14px}}
@media(max-width:860px){nav{display:none}}

/* Hero */
.hero{padding:72px 0 56px;background:linear-gradient(180deg,var(--sand) 0%,var(--sand-lys) 100%)}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
.eyebrow{display:inline-block;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gron);background:#fff;border:1px solid var(--kant);padding:6px 14px;border-radius:999px;margin-bottom:20px}
.hero h1{font-weight:800;font-size:clamp(40px,6vw,66px);margin-bottom:20px}
.hero h1 em{font-style:normal;color:var(--gron)}
.hero p.lead{font-size:20px;color:var(--graa);max-width:540px;margin-bottom:30px}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px}
.hero-art{display:flex;flex-direction:column;align-items:center}
.hero-art .maerkat{width:100%;max-width:400px;height:auto;filter:drop-shadow(0 18px 30px rgba(31,42,42,.22));transform:rotate(-6deg)}
.maerkat-tekst{margin-top:18px;font-size:14px;font-weight:600;color:var(--graa)}
@media(max-width:860px){.hero-grid{grid-template-columns:1fr}.hero-art{order:-1}.hero-art .maerkat{max-width:230px}.hero{padding:40px 0}}

/* Kort svar + jump-nav */
.kortsvar-sek{padding:28px 0 0}
.jumpnav{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.jumpnav a{display:inline-block;text-decoration:none;font-size:14px;font-weight:600;color:var(--gron);background:#fff;border:1px solid var(--kant);padding:7px 14px;border-radius:999px}
.jumpnav a.fremhaev{background:var(--gron);color:#fff;border-color:var(--gron)}
.kortsvar{background:#fff;border:1px solid var(--kant);border-left:5px solid var(--sol);border-radius:14px;padding:22px 26px}
.kortsvar b.label{display:block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gron);margin-bottom:6px}
.kortsvar p{font-size:17.5px}
.svar{font-size:18px;color:var(--tjaere) !important;margin-bottom:12px}
.svar strong{font-weight:700}
/* Mærkat-krav */
.krav{display:grid;grid-template-columns:.8fr 1.2fr;gap:44px;align-items:center}
.krav .maerkat-lille{width:100%;max-width:320px;height:auto;justify-self:center;filter:drop-shadow(0 14px 24px rgba(31,42,42,.2))}
.krav ol{list-style:none;counter-reset:k;margin-top:18px}
.krav li{counter-increment:k;display:grid;grid-template-columns:38px 1fr;gap:12px;margin-bottom:16px}
.krav li::before{content:counter(k);display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--gron);color:#fff;font-weight:700;font-size:15px}
.krav li b{display:block}
.krav li span{color:var(--graa)}
@media(max-width:860px){.krav{grid-template-columns:1fr;gap:20px}.krav .maerkat-lille{max-width:200px}}

/* Tæller */
.counter{background:var(--gron);color:#fff;padding:22px 0}
.counter .wrap{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;text-align:center}
.counter strong{font-family:'Outfit',sans-serif;font-size:26px;font-weight:400}
.counter span{opacity:.9}

/* Sektioner */
.sek{padding:80px 0}
.sek-head{max-width:680px;margin-bottom:44px}
.sek-head h2{font-size:clamp(32px,4vw,44px);margin-bottom:14px}
.sek-head p{color:var(--graa);font-size:18px}

/* Formular */
.tilmeld{background:#fff;border:1px solid var(--kant);border-radius:24px;padding:40px;display:grid;grid-template-columns:.9fr 1.1fr;gap:44px;box-shadow:0 20px 50px -30px rgba(31,42,42,.35)}
.tilmeld h2{font-size:36px;margin-bottom:14px}
.tilmeld .intro p{color:var(--graa);margin-bottom:16px}
.tjek{list-style:none;margin-top:20px}
.tjek li{display:grid;grid-template-columns:24px 1fr;gap:10px;margin-bottom:12px;font-weight:500}
.tjek svg{width:22px;height:22px;margin-top:2px}
.steps{display:flex;gap:8px;margin-bottom:24px}
.steps div{flex:1;font-size:13px;font-weight:600;color:var(--graa);padding-top:10px;border-top:4px solid var(--kant)}
.steps div.aktiv{color:var(--gron);border-color:var(--gron)}
.steps div.faerdig{color:var(--gron);border-color:var(--hav)}
.trin{display:none}
.trin.aktiv{display:block}
.felt{margin-bottom:16px}
.felt label{display:block;font-weight:600;font-size:15px;margin-bottom:6px}
.felt input,.felt select,.felt textarea{width:100%;font:inherit;font-size:16px;padding:12px 14px;border:1.5px solid var(--kant);border-radius:12px;background:var(--sand-lys);color:var(--tjaere)}
.felt input:focus,.felt select:focus,.felt textarea:focus{outline:none;border-color:var(--gron);background:#fff}
.felt .fejl{border-color:#c0392b}
.to{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips label{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--kant);border-radius:999px;padding:8px 14px;font-weight:500;cursor:pointer;background:var(--sand-lys);font-size:15px}
.chips input{accent-color:var(--gron)}
.samtykke{display:grid;grid-template-columns:22px 1fr;gap:10px;font-size:14.5px;color:var(--graa);margin-bottom:12px;align-items:start}
.samtykke input{width:18px;height:18px;margin-top:3px;accent-color:var(--gron)}
.valgfri{font-size:13px;color:var(--graa);font-weight:500}
.knapper{display:flex;justify-content:space-between;gap:12px;margin-top:22px}
.tak{display:none;text-align:center;padding:30px 0}
.tak.vis{display:block}
.tak svg{width:64px;height:64px;margin-bottom:12px}
.tak h3{font-size:30px;margin-bottom:8px}
.fejltekst{color:#c0392b;font-size:14px;margin-top:8px;display:none}
@media(max-width:860px){.tilmeld{grid-template-columns:1fr;padding:26px 20px;gap:26px}.to{grid-template-columns:1fr}}

/* Søjler */
.soejler{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.soejle{background:#fff;border:1px solid var(--kant);border-radius:var(--radius);padding:30px}
.soejle .ikon{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;margin-bottom:18px}
.soejle .ikon svg{width:28px;height:28px}
.soejle h3{font-size:25px;margin-bottom:10px}
.soejle p{color:var(--graa)}
@media(max-width:860px){.soejler{grid-template-columns:1fr}}

/* Tal */
.tal-bg{background:var(--sand)}
.tal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.tal{background:var(--sand-lys);border-radius:var(--radius);padding:26px;border:1px solid var(--kant)}
.tal strong{display:block;font-family:'Outfit',sans-serif;font-size:40px;font-weight:800;color:var(--gron);line-height:1.1;margin-bottom:8px}
.tal span{color:var(--graa);font-size:15px}
.kilde{font-size:13px;color:var(--graa);margin-top:22px}
@media(max-width:860px){.tal-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.tal-grid{grid-template-columns:1fr}}

/* Sådan */
.saadan{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;counter-reset:trin}
.saadan div{position:relative;padding:28px 24px 24px;border-top:3px solid var(--gron);background:#fff;border-radius:0 0 var(--radius) var(--radius)}
.saadan div::before{counter-increment:trin;content:counter(trin);font-family:'Outfit',sans-serif;font-size:44px;color:var(--sol);line-height:1;display:block;margin-bottom:10px}
.saadan h3{font-size:22px;margin-bottom:8px}
.saadan p{color:var(--graa)}
@media(max-width:860px){.saadan{grid-template-columns:1fr}}

/* Koglemærket */
.kogle{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;background:var(--gron);color:#fff;border-radius:24px;padding:48px}
.kogle h2{color:#fff;font-size:38px;margin-bottom:14px}
.kogle p{opacity:.92;margin-bottom:14px}
.kogle a.btn{background:var(--sol);color:var(--tjaere) !important}
.kogle a.btn:hover{background:#e6a52e}
.kogle-tal{display:grid;gap:14px}
.kogle-tal div{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:16px;padding:20px}
.kogle-tal strong{font-family:'Outfit',sans-serif;font-size:32px;font-weight:400;color:var(--sol);display:block}
@media(max-width:860px){.kogle{grid-template-columns:1fr;padding:30px 22px}}

/* Listen */
.liste-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
.liste{background:#fff;border:1px solid var(--kant);border-radius:var(--radius);padding:10px 24px}
.liste-raekke{display:flex;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid var(--kant)}
.liste-raekke:last-child{border-bottom:0}
.liste-raekke b{font-weight:600}
.liste-raekke span{color:var(--graa);font-size:15px}
.eksempel{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--sol);color:var(--tjaere);padding:4px 10px;border-radius:6px;margin-bottom:12px}
.badge-boks{background:var(--sand);border-radius:var(--radius);padding:30px;display:grid;grid-template-columns:110px 1fr;gap:22px;align-items:center}
.badge-boks h3{font-size:24px;margin-bottom:8px}
.badge-boks p{color:var(--graa);font-size:15.5px}
@media(max-width:860px){.liste-grid{grid-template-columns:1fr}.badge-boks{grid-template-columns:1fr;text-align:center}.badge-boks svg{margin:0 auto}}

/* Prisen */
.pris{text-align:center;max-width:760px;margin:0 auto}
.pris svg{width:72px;height:72px;margin-bottom:16px}
.pris h2{font-size:clamp(32px,4vw,44px);margin-bottom:14px}
.pris p{color:var(--graa);font-size:18px;margin-bottom:24px}

/* FAQ */
.faq{max-width:820px}
.faq details{background:#fff;border:1px solid var(--kant);border-radius:14px;margin-bottom:12px;padding:0 22px}
.faq summary{cursor:pointer;font-weight:600;padding:18px 0;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:22px;color:var(--gron);line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{color:var(--graa);padding-bottom:18px}

/* Footer */
footer{background:var(--tjaere);color:#cfd6d4;padding:56px 0 30px;font-size:15px}
.fod{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:36px;margin-bottom:36px}
footer h4{color:#fff;font-family:'Outfit',sans-serif;font-weight:400;font-size:20px;margin-bottom:12px}
footer a{color:#fff}
footer ul{list-style:none}
footer li{margin-bottom:8px}
.fod-bund{border-top:1px solid rgba(255,255,255,.12);padding-top:20px;font-size:13.5px;opacity:.8}
@media(max-width:860px){.fod{grid-template-columns:1fr}}

/* Honeypot */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
/* Indholdssider (privatlivspolitik, artikler) */
.indhold{max-width:780px;margin:0 auto;padding:56px 20px 80px}
.indhold h1{font-size:clamp(34px,5vw,50px);font-weight:800;margin-bottom:24px}
.indhold h2{font-size:30px;margin:40px 0 14px}
.indhold h3{font-size:22px;margin:28px 0 10px}
.indhold p,.indhold ul,.indhold ol{margin-bottom:18px}
.indhold ul,.indhold ol{padding-left:22px}
.indhold img{max-width:100%;height:auto;border-radius:14px}
.indhold a{color:var(--gron)}
.screen-reader-text{position:absolute;left:-9999px}

/* Bureauer i ordningen */
.bureau-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px}
.bureau{background:#fff;border:1px solid var(--kant);border-radius:var(--radius);padding:24px 18px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:140px;text-align:center;text-decoration:none;transition:border-color .2s,box-shadow .2s}
a.bureau:hover{border-color:var(--gron);box-shadow:0 10px 24px -16px rgba(31,42,42,.4)}
.bureau img{max-width:150px;max-height:60px;width:auto;height:auto;object-fit:contain}
.bureau span{font-size:13.5px;font-weight:600;color:var(--gron)}
.bureau-navn{font-family:'Outfit',sans-serif;font-size:20px;color:var(--tjaere)}

/* Værktøjer fra nybyggethus.dk */
.vaerktoejer{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.vaerktoej{display:flex;flex-direction:column;gap:10px;background:#fff;border:1px solid var(--kant);border-radius:var(--radius);padding:28px;text-decoration:none;color:var(--tjaere);transition:border-color .2s,box-shadow .2s}
.vaerktoej:hover{border-color:var(--gron);box-shadow:0 12px 28px -18px rgba(31,42,42,.45)}
.vaerktoej .v-ikon{width:48px;height:48px;border-radius:12px;background:#E1ECE7;display:grid;place-items:center}
.vaerktoej .v-ikon svg{width:26px;height:26px}
.vaerktoej b{font-family:'Outfit',sans-serif;font-size:22px;line-height:1.2}
.vaerktoej span{color:var(--graa)}
.vaerktoej em{font-style:normal;font-weight:700;color:var(--gron);margin-top:auto}
.vaerktoej em::after{content:" →"}
@media(max-width:860px){.vaerktoejer{grid-template-columns:1fr}}
.kogle .lys-link{color:var(--sol);font-weight:600}
.kogle-knapper{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.kogle a.btn-hvid{background:transparent;color:#fff !important;border:2px solid rgba(255,255,255,.7)}
.kogle a.btn-hvid:hover{background:#fff;color:var(--gron) !important}

/* Strategi 2030 */
.tal-fremhaev{background:var(--gron) !important;border-color:var(--gron) !important}
.tal-fremhaev strong{color:var(--sol) !important}
.tal-fremhaev span{color:#fff !important}
.landsdele{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center;margin-top:52px;background:var(--sand-lys);border:1px solid var(--kant);border-radius:24px;padding:36px}
.landsdele h3{font-size:28px;margin-bottom:12px}
.landsdele p{color:var(--graa);margin-bottom:14px}
.soejler-graf{display:grid;gap:12px}
.graf-raekke{display:grid;grid-template-columns:100px 1fr 72px;align-items:center;gap:12px;font-size:15px}
.graf-raekke span{font-weight:600}
.graf-raekke i{display:block;height:22px;border-radius:6px;background:var(--hav);width:calc(var(--v) / 44 * 100%)}
.graf-raekke b{font-weight:700;color:var(--tjaere)}
.graf-raekke.sjaelland i{background:var(--sol)}
.graf-raekke.sjaelland span,.graf-raekke.sjaelland b{color:var(--gron)}
.graf-kilde{font-size:13px;color:var(--graa);margin-top:4px}
@media(max-width:860px){.landsdele{grid-template-columns:1fr;padding:24px 18px;gap:24px}.graf-raekke{grid-template-columns:86px 1fr 64px;gap:8px}}
/* Idéer */
.ide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ide{background:#fff;border:1px solid var(--kant);border-radius:var(--radius);padding:26px;border-top:4px solid var(--hav)}
.ide h3{font-size:21px;margin-bottom:8px}
.ide p{color:var(--graa)}
.ide-citat{border-top-color:var(--sol);background:#FFF9EC}
.ide .citat{font-family:'Outfit',sans-serif;font-size:19px;font-weight:600;color:var(--gron);margin-bottom:10px;line-height:1.35}
@media(max-width:960px){.ide-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.ide-grid{grid-template-columns:1fr}}
@media(max-width:1000px){.fod{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.fod{grid-template-columns:1fr}}
.bureau-felt{background:var(--sand-lys);border:1px solid var(--kant);border-radius:12px;padding:16px 16px 4px;margin-bottom:16px}
.bureau-felt[hidden]{display:none}
.payoff{margin:0 0 40px;padding:26px 30px;background:#fff;border:1px solid var(--kant);border-left:5px solid var(--gron);border-radius:14px;max-width:820px}
.payoff blockquote{font-family:'Outfit',sans-serif;font-size:clamp(21px,2.6vw,27px);font-weight:700;line-height:1.3;color:var(--gron);margin:0 0 10px}
.payoff figcaption{font-size:14.5px;color:var(--graa)}