/* ==========================================================================
   Okay Okay – Golfmagasin
   Design: "Modern broadsheet" · Pine #14342B + Sand #CBB799
   Ingen tredjeparts-CDN. Alle assets er lokale og kan pege paa eget CDN.
   ========================================================================== */

/* ---------- 1. Fonte ----------------------------------------------------- */
/* Fraunces og Manrope indlaeses af WordPress' Font Library (wp-content/uploads/fonts).
   Temaet definerer derfor ikke selv @font-face — to saet regler for samme familie
   ville konkurrere. Skal temaet baere fontene selv, laeg woff2-filerne i
   assets/fonts/ og genindfoer @font-face her. Fallback staar i --font-display/--font-sans. */

/* ---------- 2. Tokens ---------------------------------------------------- */
:root{
  --pine:#14342B; --pine-700:#1C4738; --pine-600:#2A5943; --pine-500:#3E6B52; --pine-400:#5C8B70;
  --sand:#CBB799; --sand-300:#DCCDB6; --sand-200:#EAE0D0; --sand-100:#F3ECE0;
  --bone:#FDFBF7; --bone-200:#F6F2EA; --white:#FFFFFF;
  --ink:#2A2926; --ink-600:#5A5852; --ink-400:#8A877F;
  --font-display:"Fraunces",Georgia,"Times New Roman",serif;
  --font-sans:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --shell:1240px; --gutter:20px; --radius:3px; --radius-lg:8px;
  --t:.35s cubic-bezier(.2,.6,.2,1);
}

/* ---------- 3. Reset ----------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bone);color:var(--ink);font-family:var(--font-sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4,p,figure,blockquote,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
address{font-style:normal}
:focus-visible{outline:2px solid var(--pine-500);outline-offset:3px}
[hidden],.is-hidden{display:none !important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:0;z-index:100}
.skip-link:focus{left:12px;top:12px;background:var(--pine);color:var(--bone);padding:10px 16px;border-radius:var(--radius)}

/* ---------- 4. Layout ---------------------------------------------------- */
.shell{max-width:var(--shell);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-top:64px}
.section--flush{padding-top:0}
.section--dark{background:var(--pine);color:var(--bone);padding-block:64px;margin-top:64px}
.split{display:grid;gap:48px}
.icon{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.icon--sm{width:15px;height:15px}
.icon--lg{width:28px;height:28px}

/* ---------- 5. Typografi ------------------------------------------------- */
.kicker{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--pine-500);margin:0}
.kicker--sand{color:var(--sand)}
.rule{height:2px;background-image:linear-gradient(to right,var(--sand) 0 44px,rgba(203,183,153,.35) 44px 100%);margin:20px 0 40px}
.rule--tight{margin:16px 0 32px}
.rule--dark{background:rgba(253,251,247,.2);background-image:none;height:1px}
.h-hero{font-family:var(--font-display);font-weight:600;font-size:clamp(34px,5.4vw,52px);line-height:1.05;letter-spacing:-.01em;color:var(--pine);margin:0}
.h-section{font-family:var(--font-display);font-weight:600;font-size:clamp(28px,3.6vw,40px);line-height:1.1;letter-spacing:-.01em;color:var(--pine);margin:8px 0 0}
.h-card{font-family:var(--font-display);font-weight:500;font-size:20px;line-height:1.28;color:var(--pine);margin:8px 0 0}
.h-card--lg{font-weight:600;font-size:clamp(24px,3vw,30px);margin-top:12px}
.h-card--sm{font-size:18px}
.lede{font-size:17px;line-height:1.75;color:var(--ink-600);margin-top:20px;max-width:34em}
.dek{font-size:15px;line-height:1.65;color:var(--ink-600);margin-top:10px}
.meta{font-size:13px;color:var(--ink-400);margin-top:12px}
.section--dark .h-section,.section--dark .h-card,.section--dark .h-hero{color:var(--bone)}
.section--dark .lede,.section--dark .dek{color:rgba(253,251,247,.7)}
.section--dark .meta{color:rgba(253,251,247,.5)}
.link-u{background-image:linear-gradient(var(--sand),var(--sand));background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size var(--t)}
.link-u:hover{background-size:100% 1px}
.tag{display:inline-block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--sand-300);background:var(--pine);padding:4px 10px;border-radius:var(--radius)}

/* ---------- 6. Knapper --------------------------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 28px;border-radius:999px;font-size:14px;font-weight:600;transition:background var(--t),color var(--t),border-color var(--t)}
.btn--solid{background:var(--pine);color:var(--bone)}
.btn--solid:hover{background:var(--pine-700)}
.btn--ghost{border:1px solid rgba(20,52,43,.25);color:var(--pine)}
.btn--ghost:hover{background:var(--pine);color:var(--bone)}
.btn--sand{background:var(--sand);color:var(--pine);font-weight:700}
.btn--sand:hover{background:var(--sand-300)}
.btn--sm{height:40px;padding:0 20px;font-size:13px}
.btn--block{width:100%}
.icon-btn{width:40px;height:40px;display:inline-grid;place-items:center;border-radius:999px;transition:background var(--t)}
.icon-btn:hover{background:var(--bone-200)}
.icon-btn--outline{border:1px solid var(--sand-200);width:36px;height:36px}
.icon-btn--outline:hover{background:var(--sand-100)}
.icon-btn--onDark{border:1px solid rgba(253,251,247,.25)}
.icon-btn--onDark:hover{background:var(--sand);color:var(--pine);border-color:var(--sand)}

/* ---------- 7. Header ---------------------------------------------------- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(253,251,247,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--sand-200)}
.topbar{background:var(--pine);color:rgba(253,251,247,.9);font-size:11px}
.topbar .shell{height:32px;display:flex;align-items:center;justify-content:space-between}
.topbar p{letter-spacing:.16em;text-transform:uppercase;margin:0}
.topbar .topbar__note{display:none}
.header-bar{height:68px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:12px;flex:none}
.brand__mark{width:40px;height:40px;border-radius:999px;background:var(--pine);color:var(--sand);display:grid;place-items:center;font-family:var(--font-display);font-weight:600;font-size:15px}
.brand__name{display:block;font-family:var(--font-display);font-weight:600;font-size:22px;color:var(--pine);line-height:1;letter-spacing:-.01em}
.brand__sub{display:block;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-400);margin-top:3px}
.nav{display:none;align-items:center;gap:28px;font-size:14px;font-weight:500}
.nav a{padding-bottom:4px;transition:color var(--t)}
.nav a:hover{color:var(--pine)}
.nav a.is-active{color:var(--pine);background-image:linear-gradient(var(--sand),var(--sand));background-size:100% 2px;background-repeat:no-repeat;background-position:0 100%}
.header-actions{display:flex;align-items:center;gap:8px}
.lang{position:relative;display:none}
.lang__btn{display:flex;align-items:center;gap:6px;height:40px;padding:0 12px;border-radius:999px;font-size:13px;font-weight:600;transition:background var(--t)}
.lang__btn:hover{background:var(--bone-200)}
.dropdown{position:absolute;right:0;top:100%;margin-top:12px;min-width:176px;background:var(--white);border:1px solid var(--sand-200);border-radius:var(--radius-lg);box-shadow:0 18px 40px rgba(20,52,43,.10);padding:6px 0;font-size:14px;z-index:60}
.dropdown button{display:block;width:100%;text-align:left;padding:9px 16px}
.dropdown button:hover{background:var(--bone-200)}
.header-cta{display:none}
.burger{display:inline-grid}
.search-panel{border-top:1px solid var(--sand-200);background:var(--white)}
.search-form{display:flex;align-items:center;gap:12px;padding-top:20px}
.search-form input{flex:1;border:0;background:none;font-size:16px;padding:8px 0;outline:none}
.search-hint{font-size:13px;color:var(--ink-600);padding:12px 0 20px;margin:0}
.mobile-nav{border-top:1px solid var(--sand-200);background:var(--white)}
.mobile-nav ul{padding:12px 0}
.mobile-nav a{display:block;padding:12px 0;border-bottom:1px solid var(--sand-100);font-size:15px}
.mobile-nav__foot{display:flex;align-items:center;gap:12px;padding:16px 0 24px}
.lang-pills{display:flex;gap:4px}
.lang-pills button{width:44px;height:44px;border:1px solid var(--sand-200);border-radius:999px;font-size:12px;font-weight:600}

/* ---------- 8. Hero ------------------------------------------------------ */
.hero{padding:40px 0 56px}
.hero__grid{display:grid;gap:40px;align-items:center}
.hero__figure{overflow:hidden;border-radius:var(--radius)}
.hero__img{width:100%;height:300px;object-fit:cover;transition:transform .7s cubic-bezier(.2,.6,.2,1)}
.hero__figure:hover .hero__img{transform:scale(1.04)}
figcaption{font-size:12px;color:var(--ink-400);font-style:italic;margin-top:12px}
.byline{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;font-size:13px;color:var(--ink-600);margin-top:28px}
.byline span{display:flex;align-items:center;gap:8px}
.byline .icon{color:var(--sand)}
.avatar{width:32px;height:32px;border-radius:999px;background:var(--pine-500);color:var(--bone);display:grid;place-items:center;font-size:11px;font-weight:700}
.avatar--lg{width:56px;height:56px;font-family:var(--font-display);font-size:16px;font-weight:600;background:var(--pine);color:var(--sand)}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}

/* ---------- 9. Trust ----------------------------------------------------- */
.trust{display:grid;gap:40px}
.trust .icon{color:var(--sand)}
.trust h3{font-family:var(--font-display);font-weight:500;font-size:22px;margin:20px 0 0}
.trust p{font-size:15px;line-height:1.7;color:rgba(253,251,247,.7);margin-top:12px}

/* ---------- 10. Kort ----------------------------------------------------- */
.section-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px}
.section-head__link{font-size:13px;font-weight:600;color:var(--pine);display:inline-flex;align-items:center;gap:6px}
.section--dark .section-head__link{color:var(--sand)}
.thumb{display:block;overflow:hidden;border-radius:var(--radius)}
.thumb img{width:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.6,.2,1)}
.thumb:hover img{transform:scale(1.05)}
.card__img{height:220px}
.card__img--lead{height:300px}
.card__img--side{height:180px}
.card--row{display:flex;gap:20px}
.card--row .thumb{width:130px;flex:none}
.card--row img{height:100px}
.card--boxed{background:var(--white);border:1px solid var(--sand-200);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}
.card--boxed .card__body{padding:24px;display:flex;flex-direction:column;flex:1}
.card--boxed .dek{flex:1}
.grid{display:grid;gap:32px}
.grid--2{grid-template-columns:1fr}
.grid--3{grid-template-columns:1fr}
.grid--4{grid-template-columns:1fr}
.stack{display:grid;gap:32px}

/* ---------- 11. Community ------------------------------------------------ */
.community{background:var(--sand-100);border:1px solid var(--sand-200);border-radius:var(--radius);padding:48px 24px}
.community__grid{display:grid;gap:40px;align-items:center}
.checklist{margin-top:24px;display:grid;gap:10px}
.checklist li{display:flex;gap:12px;font-size:15px;color:var(--ink-600)}
.checklist .icon{color:var(--pine-500);margin-top:3px}
.quote-card{background:var(--white);border:1px solid var(--sand-200);border-radius:var(--radius);padding:28px}
.quote-card p{font-family:var(--font-display);font-size:20px;line-height:1.5;color:var(--pine);font-style:italic;margin:0}
.quote-card footer{display:flex;align-items:center;gap:12px;margin-top:20px;font-size:13px;color:var(--ink-600)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;text-align:center;margin-top:20px}
.stats strong{display:block;font-family:var(--font-display);font-size:26px;font-weight:600;color:var(--pine)}
.stats span{font-size:12px;color:var(--ink-400)}

/* ---------- 12. Filter --------------------------------------------------- */
.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:40px}
.filter{height:40px;padding:0 20px;border-radius:999px;border:1px solid rgba(20,52,43,.25);color:var(--pine);font-size:13px;font-weight:600;transition:background var(--t),color var(--t)}
.filter:hover{background:var(--bone-200)}
.filter[aria-pressed="true"]{background:var(--pine);color:var(--bone);border-color:var(--pine)}
.empty{text-align:center;font-size:15px;color:var(--ink-400);margin-top:40px}

/* ---------- 13. Artikel / prose ------------------------------------------ */
.progress-track{position:sticky;top:100px;z-index:40;height:3px}
.progress{height:100%;width:0;background:var(--sand)}
.crumbs{font-size:13px;color:var(--ink-600)}
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.crumbs li{display:flex;align-items:center;gap:8px}
.crumbs .icon{color:var(--sand)}
.crumbs--dark{color:rgba(253,251,247,.6)}
.article-head{max-width:none;margin-top:32px}
.article-meta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;font-size:13px;color:var(--ink-600);border-top:1px solid var(--sand-200);margin-top:32px;padding-top:24px}
.share{display:flex;gap:8px;margin-left:auto}
.article-hero{margin-top:40px}
.article-hero img{width:100%;height:300px;object-fit:cover;border-radius:var(--radius)}
.prose{max-width:660px}
.prose p{font-size:18px;line-height:1.85;color:var(--ink-600);margin:0 0 1.35em}
.prose h2{font-family:var(--font-display);font-size:28px;font-weight:600;color:var(--pine);line-height:1.25;margin:2.2em 0 .6em}
.prose h3{font-family:var(--font-display);font-size:21px;font-weight:600;color:var(--pine);margin:1.8em 0 .5em}
.prose ul{list-style:disc;padding-left:1.2em;margin:0 0 1.35em}
.prose li{font-size:18px;line-height:1.8;color:var(--ink-600);margin-bottom:.5em}
.prose a{color:var(--pine);font-weight:600;text-decoration:underline;text-decoration-color:var(--sand);text-underline-offset:3px}
.prose strong{color:var(--ink);font-weight:600}
.prose blockquote{border-left:2px solid var(--sand);padding-left:24px;margin:36px 0}
.prose blockquote p{font-family:var(--font-display);font-size:24px;line-height:1.45;color:var(--pine);font-style:italic;margin:0}
.factbox{background:var(--sand-100);border:1px solid var(--sand-200);border-radius:var(--radius);padding:28px;margin-top:48px;max-width:660px}
.author-box{display:flex;flex-wrap:wrap;align-items:center;gap:20px;border-top:1px solid var(--sand-200);border-bottom:1px solid var(--sand-200);padding:28px 0;margin-top:48px;max-width:660px}
.author-box__body{flex:1;min-width:240px}
.author-box__body p:first-child{font-family:var(--font-display);font-size:19px;font-weight:600;color:var(--pine);margin:0}
.cta-box{background:var(--pine);color:var(--bone);border-radius:var(--radius);padding:32px;margin-top:48px;max-width:660px}
.cta-box h2{font-family:var(--font-display);font-size:24px;font-weight:600;margin:0}
.cta-box p{font-size:15px;line-height:1.7;color:rgba(253,251,247,.7);margin:12px 0 0}
.pagination{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--sand-200);padding-top:28px;margin-top:56px}
.pagination__pages{display:flex;gap:8px}
.pagination__pages a,.pagination__pages span{width:40px;height:40px;display:grid;place-items:center;border-radius:999px;font-size:13px;font-weight:600;border:1px solid var(--sand-200)}
.pagination__pages [aria-current]{background:var(--pine);color:var(--bone);border-color:var(--pine)}

/* ---------- 14. Sidebar -------------------------------------------------- */
.sidebar{display:grid;gap:40px;align-content:start}
.sidebar__catlinks{display:grid;gap:8px;margin-top:16px}
.sidebar__catlinks a{display:flex;align-items:center;gap:10px;height:44px;padding:0 16px;border:1px solid var(--sand-200);border-radius:var(--radius);font-size:14px;font-weight:500;color:var(--pine);transition:background var(--t)}
.sidebar__catlinks a:hover{background:var(--sand-100)}
.sidebar__catlinks a.is-active{background:var(--pine);color:var(--bone);border-color:var(--pine)}
.toplist{margin-top:16px;display:grid;gap:16px}
.toplist li{display:flex;gap:16px;padding-bottom:16px;border-bottom:1px solid var(--sand-200)}
.toplist li:last-child{border-bottom:0;padding-bottom:0}
.toplist strong{font-family:var(--font-display);font-size:24px;font-weight:600;color:var(--sand);width:24px;flex:none;line-height:1}
.toplist a{font-size:15px;line-height:1.35;color:var(--pine);font-weight:500}
.panel-dark{background:var(--pine);color:var(--bone);border-radius:var(--radius);padding:28px}
.panel-dark h2{font-family:var(--font-display);font-size:22px;font-weight:600;margin:0}
.panel-dark p{font-size:14px;line-height:1.7;color:rgba(253,251,247,.7);margin:12px 0 20px}
.panel-ad{background:var(--white);border:1px solid var(--sand-200);border-radius:var(--radius);padding:24px}
.panel-ad p:nth-of-type(1){font-family:var(--font-display);font-size:19px;font-weight:500;color:var(--pine);margin-top:16px}

/* ---------- 15. Footer --------------------------------------------------- */
.site-footer{background:var(--pine);color:var(--bone);margin-top:64px;padding:64px 0}
.footer-grid{display:grid;gap:48px}
.site-footer h2{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--sand);margin:0}
.site-footer ul{margin-top:20px;display:grid;gap:10px;font-size:14px;color:rgba(253,251,247,.7)}
.site-footer a:hover{color:var(--sand)}
.footer-about p{font-size:15px;line-height:1.7;color:rgba(253,251,247,.7);margin-top:20px;max-width:34em}
.socials{display:flex;gap:12px;margin-top:28px}
.footer-contact{margin-top:20px;display:grid;gap:12px;font-size:14px;color:rgba(253,251,247,.7)}
.footer-contact p{display:flex;gap:12px}
.footer-contact .icon{color:var(--sand);margin-top:2px}
.field{width:100%;height:44px;padding:0 16px;border-radius:var(--radius);background:rgba(253,251,247,.1);border:1px solid rgba(253,251,247,.2);color:var(--bone);font-size:14px;outline:none}
.field::placeholder{color:rgba(253,251,247,.45)}
.field:focus{border-color:var(--sand)}
textarea.field{height:auto;padding:12px 16px;resize:vertical}
.footer-form{margin-top:20px;display:grid;gap:12px}
.form-status{font-size:13px;color:var(--sand);margin:0}
.footer-bottom{margin-top:56px;padding-top:28px;border-top:1px solid rgba(253,251,247,.15);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;font-size:13px;color:rgba(253,251,247,.55)}
.footer-bottom ul{display:flex;flex-wrap:wrap;gap:8px 24px;margin:0}

/* ---------- 16. Modal ---------------------------------------------------- */
.modal{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:32px 16px;overflow-y:auto}
.modal__backdrop{position:absolute;inset:0;background:rgba(20,52,43,.7);backdrop-filter:blur(4px)}
.modal__dialog{position:relative;width:100%;max-width:440px;background:var(--bone);border:1px solid var(--sand-200);border-radius:var(--radius);padding:32px;box-shadow:0 30px 60px rgba(20,52,43,.35)}
.modal__close{position:absolute;top:14px;right:14px}
.modal__dialog h2{font-family:var(--font-display);font-size:28px;font-weight:600;color:var(--pine);line-height:1.2;margin:20px 0 0}
.modal__dialog>p{font-size:15px;line-height:1.7;color:var(--ink-600);margin-top:12px}
.form{margin-top:28px;display:grid;gap:12px}
.form label{display:block;font-size:13px;font-weight:600;margin-bottom:6px}
.input{width:100%;height:44px;padding:0 16px;border:1px solid var(--sand-200);border-radius:var(--radius);background:var(--white);font-size:14px;outline:none}
.input:focus{border-color:var(--pine-500)}
.consent{display:flex;gap:12px;font-size:13px;color:var(--ink-600);align-items:flex-start;font-weight:400}
.consent input{width:16px;height:16px;margin-top:3px;accent-color:var(--pine)}
.modal__foot{text-align:center;font-size:13px;color:var(--ink-400);margin-top:20px}

/* ---------- 17. Animation ------------------------------------------------ */
.fade{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.fade.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .fade{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
  .thumb img,.hero__img{transition:none}
}

/* ---------- 18. Responsivt ----------------------------------------------- */
@media (min-width:640px){
  .topbar .topbar__note{display:block}
  .header-cta{display:inline-flex}
  .lang{display:block}
  .hero__img{height:420px}
  .article-hero img{height:420px}
  .grid--2,.grid--3,.grid--4{grid-template-columns:repeat(2,1fr)}
  .card--row .thumb{width:150px}
  .card--row img{height:120px}
  .card__img--lead{height:380px}
  .community{padding:48px}
}
@media (min-width:900px){
  .grid--3{grid-template-columns:repeat(3,1fr)}
  .trust{grid-template-columns:repeat(3,1fr)}
  .footer-grid{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:1024px){
  :root{--gutter:20px}
  .section{padding-top:96px}
  .section--dark{padding-block:96px;margin-top:96px}
  .nav{display:flex}
  .burger{display:none}
  .hero{padding:64px 0 80px}
  .hero__grid{grid-template-columns:5fr 7fr;gap:56px}
  .hero__img{height:560px}
  .article-hero img{height:560px}
  .grid--4{grid-template-columns:repeat(4,1fr)}
  .split{grid-template-columns:8fr 4fr;gap:64px}
  .split--7-5{grid-template-columns:7fr 5fr;gap:40px}
  .split--2-1{grid-template-columns:2fr 1fr;gap:40px}
  .community__grid{grid-template-columns:7fr 5fr}
  .footer-grid{grid-template-columns:4fr 2fr 2fr 2fr 2fr}
  .site-footer{margin-top:96px;padding:80px 0}
}
@media (min-width:1024px){
  .hero__grid>.hero__figure{order:2}
  .hero__grid>.hero__text{order:1}
}

/* ---------- 19. Forfatterarkiv ------------------------------------------- */
.author-hero{display:flex;flex-wrap:wrap;gap:28px;margin-top:32px;align-items:flex-start}
.author-hero .lede{color:rgba(253,251,247,.7)}
.author-hero .meta{color:rgba(253,251,247,.5)}
.author-hero__role{font-family:var(--font-display);font-size:19px;font-weight:500;color:var(--sand);margin-top:10px}
.avatar--xl{width:104px;height:104px;font-family:var(--font-display);font-size:30px;font-weight:600;background:var(--sand);color:var(--pine);flex:none}
.author-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px;padding-top:28px;border-top:1px solid rgba(253,251,247,.15);max-width:520px}
.author-stats strong{display:block;font-family:var(--font-display);font-size:28px;font-weight:600;color:var(--sand)}
.author-stats span{font-size:12px;color:rgba(253,251,247,.55)}

/* ---------- 20. Søgeside -------------------------------------------------- */
.bigsearch{display:flex;align-items:center;gap:12px;margin-top:28px;max-width:640px;background:rgba(253,251,247,.1);border:1px solid rgba(253,251,247,.25);border-radius:999px;padding:6px 8px 6px 20px}
.bigsearch:focus-within{border-color:var(--sand)}
.bigsearch .icon{color:var(--sand)}
.bigsearch input{flex:1;min-width:0;background:none;border:0;outline:none;color:var(--bone);font-size:16px;padding:12px 0}
.bigsearch input::placeholder{color:rgba(253,251,247,.45)}
.results{display:grid;gap:28px}
.result{display:flex;gap:20px;padding-bottom:28px;border-bottom:1px solid var(--sand-200)}
.result:last-child{border-bottom:0;padding-bottom:0}
.result .thumb{width:120px;flex:none}
.result__img{height:96px}
.result__body{flex:1;min-width:0}
.result__body .h-card{margin-top:6px}
.empty-state{text-align:center;padding:56px 24px;border:1px dashed var(--sand-200);border-radius:var(--radius);background:var(--white)}
.empty-state .icon{color:var(--sand)}
.empty-state .dek{margin-bottom:24px}

/* ---------- 21. 404 ------------------------------------------------------ */
.notfound{padding-block:72px}
.notfound__inner{text-align:center;max-width:760px}
.notfound__code{font-family:var(--font-display);font-size:clamp(90px,18vw,180px);font-weight:600;line-height:.85;color:rgba(203,183,153,.22);margin:0 0 12px}
.notfound .lede{max-width:44ch}
.notfound__cats{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:40px;padding-top:32px;border-top:1px solid rgba(253,251,247,.15)}
.notfound__cats a{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 20px;border-radius:999px;border:1px solid rgba(253,251,247,.25);font-size:13px;font-weight:600;transition:background var(--t),color var(--t)}
.notfound__cats a:hover{background:var(--sand);color:var(--pine);border-color:var(--sand)}

@media (min-width:640px){
  .result .thumb{width:170px}
  .result__img{height:120px}
}
@media (min-width:1024px){
  .notfound{padding-block:104px}
  .notfound__inner{margin-inline:auto}
}

/* ---------- 19. Forfatterarkiv ------------------------------------------- */
.author-hero{display:flex;flex-wrap:wrap;gap:28px;margin-top:32px;align-items:flex-start}
.author-hero .lede{color:rgba(253,251,247,.7)}
.author-hero .meta{color:rgba(253,251,247,.5)}
.author-hero__role{font-family:var(--font-display);font-size:19px;font-weight:500;color:var(--sand);margin-top:10px}
.avatar--xl{width:104px;height:104px;font-family:var(--font-display);font-size:30px;font-weight:600;background:var(--sand);color:var(--pine);flex:none}
.author-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px;padding-top:28px;border-top:1px solid rgba(253,251,247,.15);max-width:520px}
.author-stats strong{display:block;font-family:var(--font-display);font-size:28px;font-weight:600;color:var(--sand)}
.author-stats span{font-size:12px;color:rgba(253,251,247,.55)}

/* ---------- 20. Søgeside -------------------------------------------------- */
.bigsearch{display:flex;align-items:center;gap:12px;margin-top:28px;max-width:640px;background:rgba(253,251,247,.1);border:1px solid rgba(253,251,247,.25);border-radius:999px;padding:6px 8px 6px 20px}
.bigsearch:focus-within{border-color:var(--sand)}
.bigsearch .icon{color:var(--sand)}
.bigsearch input{flex:1;min-width:0;background:none;border:0;outline:none;color:var(--bone);font-size:16px;padding:12px 0}
.bigsearch input::placeholder{color:rgba(253,251,247,.45)}
.results{display:grid;gap:28px}
.result{display:flex;gap:20px;padding-bottom:28px;border-bottom:1px solid var(--sand-200)}
.result:last-child{border-bottom:0;padding-bottom:0}
.result .thumb{width:120px;flex:none}
.result__img{height:96px}
.result__body{flex:1;min-width:0}
.result__body .h-card{margin-top:6px}
.empty-state{text-align:center;padding:56px 24px;border:1px dashed var(--sand-200);border-radius:var(--radius);background:var(--white)}
.empty-state .icon{color:var(--sand)}
.empty-state .dek{margin-bottom:24px}

/* ---------- 21. 404 ------------------------------------------------------ */
.notfound{padding-block:72px}
.notfound__inner{text-align:center;max-width:760px}
.notfound__code{font-family:var(--font-display);font-size:clamp(90px,18vw,180px);font-weight:600;line-height:.85;color:rgba(203,183,153,.22);margin:0 0 12px}
.notfound .lede{max-width:44ch}
.notfound__cats{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:40px;padding-top:32px;border-top:1px solid rgba(253,251,247,.15)}
.notfound__cats a{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 20px;border-radius:999px;border:1px solid rgba(253,251,247,.25);font-size:13px;font-weight:600;transition:background var(--t),color var(--t)}
.notfound__cats a:hover{background:var(--sand);color:var(--pine);border-color:var(--sand)}

@media (min-width:640px){
  .result .thumb{width:170px}
  .result__img{height:120px}
}
@media (min-width:1024px){
  .notfound{padding-block:104px}
  .notfound__inner{margin-inline:auto}
}

/* ---------- 22. Blokmønstre og Gutenberg-indhold ------------------------- */
.page-canvas{display:block}
.page-canvas>.wp-block-group:first-child{padding-top:40px}
.oo-section{padding-top:64px}
.oo-section-dark{background:var(--pine);color:var(--bone);padding-block:64px;margin-top:64px}
.oo-section-dark h1,.oo-section-dark h2,.oo-section-dark h3{color:var(--bone)}
.oo-section-dark .lede,.oo-section-dark p{color:rgba(253,251,247,.72)}
.oo-section-dark .kicker{color:var(--sand)}
.rule.wp-block-separator{border:0;opacity:1;width:100%;max-width:none}

/* Knapper i blokke */
.wp-block-button.oo-solid .wp-block-button__link{background:var(--pine);color:var(--bone);border-radius:999px;height:48px;padding:0 28px;display:inline-flex;align-items:center;font-size:14px;font-weight:600;transition:background var(--t)}
.wp-block-button.oo-solid .wp-block-button__link:hover{background:var(--pine-700)}
.wp-block-button.oo-ghost .wp-block-button__link{background:transparent;color:var(--pine);border:1px solid rgba(20,52,43,.25);border-radius:999px;height:48px;padding:0 28px;display:inline-flex;align-items:center;font-size:14px;font-weight:600}
.wp-block-button.oo-ghost .wp-block-button__link:hover{background:var(--pine);color:var(--bone)}
.wp-block-button.oo-sand .wp-block-button__link{background:var(--sand);color:var(--pine);border-radius:999px;height:48px;padding:0 28px;display:inline-flex;align-items:center;font-size:14px;font-weight:700}
.wp-block-button.oo-sand .wp-block-button__link:hover{background:var(--sand-300)}
.wp-block-buttons.actions{margin-top:36px;gap:12px}

/* Query Loop som redaktionelle kort */
.oo-cards .wp-block-post-template{display:grid;gap:32px;margin:0;padding:0;list-style:none}
.oo-cards .wp-block-post-template>li{margin:0;max-width:none}
.oo-cards .wp-block-post-featured-image{margin:0 0 16px;border-radius:var(--radius);overflow:hidden}
.oo-cards .wp-block-post-featured-image img{width:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.6,.2,1)}
.oo-cards>.wp-block-post-template>li:hover .wp-block-post-featured-image img{transform:scale(1.05)}
.oo-cards .wp-block-post-terms{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--pine-500);margin:0 0 8px}
.oo-cards .wp-block-post-terms a{text-decoration:none}
.oo-cards .wp-block-post-title{font-family:var(--font-display);font-size:20px;font-weight:500;line-height:1.28;margin:0;color:var(--pine)}
.oo-cards .wp-block-post-title a{color:inherit;text-decoration:none;background-image:linear-gradient(var(--sand),var(--sand));background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size var(--t)}
.oo-cards .wp-block-post-title a:hover{background-size:100% 1px}
.oo-cards .wp-block-post-excerpt{margin:10px 0 0}
.oo-cards .wp-block-post-excerpt p,.oo-cards .wp-block-post-excerpt__excerpt{font-size:15px;line-height:1.65;color:var(--ink-600);margin:0}
.oo-cards .wp-block-post-excerpt__more-text{display:none}
.oo-cards .wp-block-post-date{font-size:13px;color:var(--ink-400);margin:12px 0 0}
.oo-section-dark .oo-cards .wp-block-post-title,.oo-section-dark .oo-cards .wp-block-post-title a{color:var(--bone)}
.oo-section-dark .oo-cards .wp-block-post-terms{color:var(--sand)}
.oo-section-dark .oo-cards .wp-block-post-excerpt p,.oo-section-dark .oo-cards .wp-block-post-date{color:rgba(253,251,247,.6)}
.oo-cards--lead .wp-block-post-featured-image img{height:380px}
.oo-cards--lead .wp-block-post-title{font-size:clamp(24px,3vw,30px);font-weight:600}

/* Faktaboks, citat og annoncekort som mønstre */
.oo-factbox{background:var(--sand-100);border:1px solid var(--sand-200);border-radius:var(--radius);padding:28px;margin-top:40px}
.oo-factbox p{margin:0}
.oo-pullquote{border-left:2px solid var(--sand);padding:0 0 0 24px;margin:36px 0}
.oo-pullquote p{font-family:var(--font-display);font-size:24px;line-height:1.45;color:var(--pine);font-style:italic;margin:0}
.oo-adcard{background:var(--white);border:1px solid var(--sand-200);border-radius:var(--radius);overflow:hidden;height:100%}
.oo-adcard .wp-block-image{margin:0}
.oo-adcard .wp-block-image img{width:100%;height:190px;object-fit:cover}
.oo-adcard>.wp-block-group{padding:24px}
.oo-community{background:var(--sand-100);border:1px solid var(--sand-200);border-radius:var(--radius);padding:48px 24px}
.oo-community .wp-block-list{list-style:none;padding:0;margin:24px 0 0}
.oo-community .wp-block-list li{position:relative;padding-left:28px;font-size:15px;color:var(--ink-600);margin-bottom:10px}
.oo-community .wp-block-list li::before{content:"";position:absolute;left:0;top:9px;width:14px;height:8px;border-left:2px solid var(--pine-500);border-bottom:2px solid var(--pine-500);transform:rotate(-45deg)}
.oo-quotecard{background:var(--white);border:1px solid var(--sand-200);border-radius:var(--radius);padding:28px}
.oo-quotecard p{font-family:var(--font-display);font-size:20px;line-height:1.5;color:var(--pine);font-style:italic;margin:0}
.oo-stats{margin-top:20px;text-align:center}
.oo-stats .wp-block-column p:first-child{font-family:var(--font-display);font-size:26px;font-weight:600;color:var(--pine);margin:0}
.oo-stats .wp-block-column p:last-child{font-size:12px;color:var(--ink-400);margin:4px 0 0}

@media (min-width:640px){
  .oo-cards--2 .wp-block-post-template,.oo-cards--3 .wp-block-post-template,.oo-cards--4 .wp-block-post-template{grid-template-columns:repeat(2,1fr)}
  .oo-community{padding:48px}
}
@media (min-width:900px){
  .oo-cards--3 .wp-block-post-template{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:1024px){
  .oo-section{padding-top:96px}
  .oo-section-dark{padding-block:96px;margin-top:96px}
  .oo-cards--4 .wp-block-post-template{grid-template-columns:repeat(4,1fr)}
}
/* ---------- 23. Logo ----------------------------------------------------- */
.brand__logo{display:block;height:24px;width:auto;max-width:190px}
.brand__sub--logo{display:block;margin-top:4px}
.brand__logo--footer{height:28px}
.site-footer .brand{align-items:flex-start}
@media (min-width:640px){.brand__logo{height:28px}.brand__logo--footer{height:32px}}

/* ---------- 24. Dynamisk hero (Query Loop) -------------------------------- */
.oo-hero .wp-block-post-template{display:block;list-style:none;margin:0;padding:0}
.oo-hero .wp-block-post-template>li{margin:0;max-width:none}
.oo-hero .wp-block-post-terms{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--pine-500);margin:0}
.oo-hero .wp-block-post-terms a{text-decoration:none;color:inherit}
.oo-hero .wp-block-post-title{font-family:var(--font-display);font-weight:600;font-size:clamp(34px,5.4vw,52px);line-height:1.05;letter-spacing:-.01em;color:var(--pine);margin:20px 0 0}
.oo-hero .wp-block-post-title a{color:inherit;text-decoration:none;background-image:linear-gradient(var(--sand),var(--sand));background-size:0 2px;background-repeat:no-repeat;background-position:0 100%;transition:background-size var(--t)}
.oo-hero .wp-block-post-title a:hover{background-size:100% 2px}
.oo-hero .wp-block-post-excerpt p{font-size:17px;line-height:1.75;color:var(--ink-600);margin:20px 0 0;max-width:34em}
.oo-hero .wp-block-post-date{font-size:13px;color:var(--ink-400);margin:20px 0 0}
.oo-hero .wp-block-read-more{display:inline-flex;align-items:center;height:48px;padding:0 28px;border-radius:999px;background:var(--pine);color:var(--bone);font-size:14px;font-weight:600;text-decoration:none;margin-top:28px;transition:background var(--t)}
.oo-hero .wp-block-read-more:hover{background:var(--pine-700);color:var(--bone)}
.oo-hero .wp-block-post-featured-image{margin:0;border-radius:var(--radius);overflow:hidden}
.oo-hero .wp-block-post-featured-image img{width:100%;height:300px;object-fit:cover;transition:transform .7s cubic-bezier(.2,.6,.2,1)}
.oo-hero .wp-block-post-featured-image:hover img{transform:scale(1.03)}
@media (min-width:640px){.oo-hero .wp-block-post-featured-image img{height:420px}}
@media (min-width:1024px){.oo-hero .wp-block-post-featured-image img{height:560px}}

/* ---------- 25. Footer-widgets -------------------------------------------- */
.footer-col{min-width:0}
.footer-widget+.footer-widget{margin-top:28px}
.footer-about .footer-widget p{font-size:15px;line-height:1.7;color:rgba(253,251,247,.7);margin-top:20px;max-width:34em}
.site-footer .wp-block-list{list-style:none;padding:0}
.site-footer .footer-widget .socials{margin-top:24px}

/* ---------- 26. Artikeltop i sidebredde ----------------------------------- */
/* Rubrik, streger og byline flugter med artikelbilledet.
   Manchetten holdes på laesbar linjelaengde. */
.article-head .lede{max-width:46em}
.article-head .h-hero{max-width:22ch;font-size:clamp(34px,5.4vw,52px)}
@media (min-width:1024px){
  .article-head .h-hero{max-width:none;font-size:clamp(44px,4.6vw,62px)}
  .article-head .lede{font-size:20px;max-width:44em}
  .article-meta{padding-top:28px}
}

/* ---------- 27. Byline paa én linje ------------------------------------- */
/* Avataren er display:grid og braekker linjen uden en flex-kontekst omkring sig. */
.article-meta{gap:12px 26px}
.article-meta>span{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.article-meta>span>a{white-space:nowrap}
.article-meta .avatar{flex:none}
.article-meta .icon{flex:none;color:var(--sand)}
.article-meta .share{white-space:normal;gap:8px}
@media (max-width:520px){
  .article-meta{gap:12px 18px}
  .article-meta .share{margin-left:0;width:100%}
}

/* ---------- 28. Sidepanel-widgets ----------------------------------------- */
.sidebar-widget+.sidebar-widget{margin-top:40px}
.sidebar .wp-block-heading{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--pine-500);margin:0}

/* Nummereret liste — mest laeste */
.oo-sidelist .wp-block-post-template{list-style:none;margin:16px 0 0;padding:0;counter-reset:oo}
.oo-sidelist .wp-block-post-template>li{display:flex;gap:16px;margin:0;padding-bottom:16px;border-bottom:1px solid var(--sand-200)}
.oo-sidelist .wp-block-post-template>li:last-child{border-bottom:0;padding-bottom:0}
.oo-sidelist .wp-block-post-template>li::before{counter-increment:oo;content:counter(oo);font-family:var(--font-display);font-size:24px;font-weight:600;color:var(--sand);width:24px;flex:none;line-height:1}
.oo-sidelist .wp-block-post-title{font-size:15px;line-height:1.35;font-weight:500;margin:0;color:var(--pine)}
.oo-sidelist .wp-block-post-title a{color:inherit;text-decoration:none;background-image:linear-gradient(var(--sand),var(--sand));background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size var(--t)}
.oo-sidelist .wp-block-post-title a:hover{background-size:100% 1px}

/* Miniaturekort — nye artikler */
.oo-sidecards .wp-block-post-template{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:18px}
.oo-sidecards .wp-block-post-template>li{display:flex;gap:14px;margin:0;max-width:none}
.oo-sidecards .wp-block-post-featured-image{margin:0;width:76px;flex:none;border-radius:var(--radius);overflow:hidden}
.oo-sidecards .wp-block-post-featured-image img{width:76px;height:58px;object-fit:cover}
.oo-sidecards .wp-block-post-title{font-size:14px;line-height:1.35;font-weight:500;margin:0;color:var(--pine)}
.oo-sidecards .wp-block-post-title a{color:inherit;text-decoration:none}
.oo-sidecards .wp-block-post-title a:hover{color:var(--pine-500)}
.oo-sidecards .wp-block-post-date{font-size:12px;color:var(--ink-400);margin:5px 0 0}
