/* ===========
   Design tokens
   =========== */
:root{
  --bg:#fff;
  --bg-soft:#F4F8F6;
  --text:#000;
  --muted:#444;
  --border:#E2EBE6;
  --shadow:0 8px 30px rgba(0,0,0,.06);
  --radius:14px;
  --accent:#3A875E;
  --hover:#E8F4EE;
  --header-offset:120px;
  --measure:54ch;
  --heading:"Lora", Georgia, "Times New Roman", serif;
}
@media (max-width:640px){ :root{ --header-offset:20px; } }

/* Base */
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial;
  color:var(--text); background:var(--bg); line-height:1.68;
}
a{ color:var(--accent); }
a:hover{ text-decoration:underline; }
.container{ width:min(980px,92vw); margin:0 auto; }
:where(section[id], .section-card, h2[id]){ scroll-margin-top:var(--header-offset); }
h1,h2,h3,.hero-title-mobile,.hero-mobile-heading{ font-family:var(--heading); }
h1{ font-weight:700; } h2{ font-weight:700; } h3{ font-weight:600; }
.prose{ max-width:none; margin:0; }
@media (min-width:1000px){ .section-card .prose{ column-count:2; column-gap:3rem; } }
.prose.no-columns{ column-count:1 !important; }
.mt-s{ margin-top:.8rem; }

/* Header */
.site-header{
  position:sticky; top:0; z-index:10;
  backdrop-filter:saturate(120%) blur(8px);
  background:color-mix(in oklab, var(--bg), transparent 10%);
  border-bottom:1px solid var(--border);
}
.nav-wrap{ display:flex; align-items:center; justify-content:space-between; gap:.8rem; padding:.7rem 0; }
.brand-logo{ height:72px; width:auto; display:block; }

/* Desktop topmenu i Lora + bold */
.nav{ display:flex; align-items:center; gap:.2rem; flex-wrap:wrap; }
.nav a{
  color:var(--text);
  text-decoration:none;
  padding:.45rem .65rem;
  border-radius:10px;
  font-size:.96rem;
  font-family:var(--heading);
  font-weight:700;
  letter-spacing:.01em;
}
.nav a:hover{ background:var(--bg-soft); text-decoration:none; }

.menu-toggle{ display:none; border:none; background:transparent; padding:.4rem; line-height:0; cursor:pointer; color:var(--text); }
.menu-toggle svg{ width:28px; height:28px; }
.contact-quick{ display:none; color:var(--text); text-decoration:none; padding:.35rem; border-radius:12px; border:1px solid transparent; }
.contact-quick svg{ width:28px; height:28px; display:block; }
.contact-quick:hover{ background:var(--bg-soft); border-color:var(--border); }

/* Mobil drawer */
.drawer-backdrop,.mobile-drawer{ display:none; }
.drawer-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.35); transition:opacity .25s; z-index:9998; }
.mobile-drawer{
  position:fixed; inset:0; background:#fff; transform:translate3d(0,-110%,0);
  transition:transform .28s, opacity .2s; z-index:9999;
  display:grid; grid-template-rows:auto 1fr; opacity:0; visibility:hidden; pointer-events:none;
}
body.drawer-open .mobile-drawer{ transform:translate3d(0,0,0); opacity:1; visibility:visible; pointer-events:auto; }
.drawer-backdrop{ opacity:0; pointer-events:none; }
body.drawer-open .drawer-backdrop{ opacity:1; pointer-events:auto; }
.drawer-header{ display:flex; align-items:center; justify-content:space-between; padding:.9rem 1rem; border-bottom:1px solid var(--border); font-weight:600; }
.drawer-close{ border:none; background:transparent; padding:.4rem; line-height:0; cursor:pointer; }
.drawer-close svg{ width:26px; height:26px; }
.drawer-list{ list-style:none; margin:0; padding:.4rem .4rem 1rem; display:grid; gap:.25rem; }
.drawer-list a{
  display:flex; align-items:center; gap:.6rem; padding:.9rem 1rem; border-radius:12px;
  text-decoration:none; color:var(--text); font-size:1.05rem; font-weight:600; border:1px solid transparent;
}
.drawer-list a:hover{ background:var(--bg-soft); border-color:var(--border); }

/* Hero – baggrund */
.hero{ position:relative; }
.hero-css{
  background:
    radial-gradient(1200px 600px at 10% 10%, color-mix(in srgb, var(--accent) 22%, white) 0%, transparent 60%),
    radial-gradient(1000px 500px at 90% 0%,  color-mix(in srgb, var(--accent) 18%, white) 0%, transparent 55%),
    linear-gradient(180deg, color-mix(in srgb, var(--accent) 6%, white) 0%, #FFF 100%);
}
.hero-css::before{
  content:""; position:absolute; inset:0; opacity:.25; pointer-events:none;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><circle cx='20' cy='20' r='2' fill='%233A875E' fill-opacity='0.12'/><circle cx='80' cy='40' r='2' fill='%233A875E' fill-opacity='0.12'/><circle cx='60' cy='90' r='2' fill='%233A875E' fill-opacity='0.12'/></svg>");
  background-size:240px 240px;
}
.hero .container{
  position:relative;
  width:min(1140px,95vw);
}
.hero-content{ position:relative; padding:clamp(2rem,5.5vw,3.5rem) 0 2rem; }

/* === DESKTOP HERO: 3 kolonner (2 tekst + 1 billede) === */
.hero-desktop-box{ display:none; }
@media (min-width:641px){
  .hero-desktop-box{ display:block; }
  .hero-desktop-grid{
    display:grid;
    grid-template-columns:1fr 1fr 1.15fr;  /* to tekstspalter + billedkolonne */
    gap:1.4rem;
    align-items:stretch;                   /* gør celler lige høje */
  }

  /* Venstre område spænder over de to første kolonner */
  .hero-desktop-left{
    grid-column:1 / span 2;
    display:flex; flex-direction:column;
  }
  .hero-desktop-title{
    margin:0 0 .6rem;
    font-size:clamp(1.35rem, 1.9vw, 1.75rem);
    line-height:1.2;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  }
  /* Brødtekst i to spalter inde i venstre område */
  .hero-desktop-prose{
    column-count:2;
    column-gap:2rem;
    column-fill:balance;
    line-height:1.68;
  }
  .hero-desktop-prose p{
    break-inside:avoid-column;
    -webkit-column-break-inside:avoid;
    widows:2; orphans:2;
  }

  /* Højre kolonne = billede der følger teksthøjden */
  .hero-desktop-media{
    grid-column:3;
    position:relative;
    display:block;
  }
  .portrait-desktop{
    width:100%;
    height:100%;               /* matcher teksthøjden */
    object-fit:cover;          /* pæn beskæring */
    border-radius:14px; border:1px solid var(--border); box-shadow:var(--shadow);
    min-height:320px;
    aspect-ratio:auto;
  }
  /* Skjul CTA i hero på desktop for at bevare 1:1 højde */
  .hero-desktop-cta{ display:none; }

  /* Skjul mobil-hero elementer på desktop, så de ikke vises under kassen */
  .hero-media-row,
  .portrait-mobile,
  .hero-mobile-heading,
  .hero-mobile-card,
  .hero-cta{
    display:none !important;
  }
}

/* (Float fallback – ikke i brug på desktop) */
.portrait-float{
  float:right; width:clamp(200px,28%,280px); height:auto; margin:.2rem 0 1rem 1.1rem;
  border-radius:14px; border:1px solid var(--border); box-shadow:var(--shadow); object-fit:cover; aspect-ratio:4/5;
}
.hero-content::after{ content:""; display:block; clear:both; }
.hero-cta{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:.2rem; }
.btn{ appearance:none; border:1px solid var(--accent); background:var(--accent); color:#fff; padding:.65rem .95rem; border-radius:12px; text-decoration:none; font-weight:600; cursor:pointer; }
.btn-ghost{ background:transparent; color:var(--accent); }

/* Sektioner & kort */
.section{ padding:clamp(1.8rem,5vw,3rem) 0; }
.cards-4{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:clamp(1rem,2vw,1.2rem);
}
.card{
  background:var(--bg); border:1px solid var(--border); border-radius:var(--radius);
  padding:1rem; box-shadow:var(--shadow);
  transition:background .2s, border-color .2s, transform .2s, box-shadow .2s;
}
.card h3{ margin:0 0 .35rem; font-size:1.06rem; }
.card p{ margin:0; color:var(--text); }

/* Hele boksen er link – UDEN underline ved hover (desktop) */
.card-link{ text-decoration:none; color:inherit; display:block; cursor:pointer; }
@media (hover:hover) and (pointer:fine) and (min-width:641px){
  .card-link:hover{
    background:var(--hover);
    border-color:color-mix(in oklab, var(--accent), white 75%);
    transform:translateY(-2px);
    box-shadow:0 10px 26px rgba(0,0,0,.08);
    text-decoration:none;
  }
  .card-link *:hover{ text-decoration:none; }
  .card-link:focus-visible{ outline:3px solid color-mix(in oklab, var(--accent), white 70%); outline-offset:2px; }
}

.section-card{
  border:1px solid var(--border); border-radius:var(--radius);
  padding:clamp(1rem,3vw,1.5rem); background:var(--bg); box-shadow:var(--shadow); margin-bottom:1.2rem;
}
.prose p{ margin:0 0 .9rem; }
.prose h2{ margin:0 0 .8rem; }
.prose h3{ margin:1.1rem 0 .4rem; font-size:1.12rem; }
.prose .note, .info-tile{
  background:var(--bg-soft); border:1px solid var(--border); border-radius:10px; color:var(--text);
}
.prose .note{ font-size:.95rem; padding:.8rem 1rem; }
.info-tile{ padding:.6rem .9rem; }
.small{ font-size:.92rem; }

/* Udredning */
.udredning-grid{ display:grid; grid-template-columns:minmax(0,var(--measure)) 1fr; gap:1rem; align-items:start; }
.grid-wide-img{
  grid-column:1 / -1; justify-self:stretch; margin:.8rem 0 0;
  border:1px solid var(--border); border-radius:12px; overflow:hidden; background:var(--bg-soft);
}
.grid-wide-img img{ width:100%; height:auto; display:block; aspect-ratio:16/9; min-height:320px; object-fit:cover; }

/* Behandling */
.behandling-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; align-items:start; }
.be-right h3{ margin-top:clamp(1.6rem,2.2vw,2.4rem); }
.two-up-images{ grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; gap:.6rem; margin-top:.6rem; }
.two-up-images figure{ margin:0; border:1px solid var(--border); border-radius:12px; overflow:hidden; background:var(--bg-soft); }
.two-up-images img{ width:100%; height:auto; display:block; }

/* Supervision */
.supervision-grid{ display:grid; grid-template-columns:minmax(0,var(--measure)) auto; gap:1rem; align-items:start; }
.sup-media{ display:flex; justify-content:center; }
.sup-media img{
  width:320px; max-width:28vw; height:auto;
  border:1px solid var(--border); border-radius:10px; box-shadow:var(--shadow);
}

/* Hvem er jeg */
.info-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; margin-top:1rem; }
.about-banner{ margin-top:1rem; border:1px solid var(--border); border-radius:12px; overflow:hidden; background:var(--bg-soft); }
.about-banner img{ width:100%; height:auto; display:block; aspect-ratio:21/9; object-fit:cover; }
.about-prose{ max-width:min(100%, calc(var(--measure)*2)); }

/* Privatliv */
#privacy .prose{ column-count:1 !important; }
#privacy .prose p{ color:var(--muted); font-style:italic; font-size:.82rem; margin:0; }

/* Lister */
ul.checklist, ul.dash{ list-style:none; padding-left:0; }
ul.checklist li, ul.dash li{ margin:.35rem 0; padding-left:1.6rem; position:relative; }
ul.checklist li::before, ul.dash li::before{ content:"✔"; position:absolute; left:0; top:0; color:var(--accent); }

/* Priser */
.price-list{ display:grid; gap:.6rem; grid-template-columns:1fr; }
.price-item{
  display:grid; grid-template-columns:1fr auto; gap:.8rem; align-items:center;
  padding:.75rem 1rem; border:1px solid var(--border); border-radius:12px; background:var(--bg-soft);
}
.pi-title{ font-weight:600; }
.pi-price{ font-variant-numeric:tabular-nums; }

/* Kontakt */
.contact-grid{
  display:grid; grid-template-columns:1.1fr 1fr;
  grid-template-areas:"title title" "left right";
  gap:clamp(1.2rem,3vw,2rem); align-items:start;
}
.contact-grid > .section-title{ grid-area:title; margin:0 0 .2rem; }
.contact-left{ grid-area:left; display:grid; gap:1rem; }
.contact-right{ grid-area:right; display:grid; gap:1rem; }
.contact-info p{ margin:.2rem 0; }
.map-card{ padding:0; overflow:hidden; align-self:start; width:100%; }
.map-card .map-embed{ width:100%; border-radius:12px; overflow:hidden; aspect-ratio:4/3; min-height:260px; background:var(--bg-soft); }
.map-card .map-embed iframe{ width:100%; height:100%; border:0; display:block; }
.address-card p strong{ font-weight:700; } /* Adresse label samme vægt som telefonboksen */

/* Find klinik */
.find-grid{ display:grid; grid-template-columns:minmax(0,var(--measure)) 1fr; gap:1rem; align-items:start; }
.clinic-banner{ grid-column:1/-1; margin-top:.5rem; border:1px solid var(--border); border-radius:12px; overflow:hidden; background:var(--bg-soft); }
.clinic-banner img{ width:100%; height:auto; display:block; aspect-ratio:21/9; object-fit:cover; }

/* Partner */
.partner-card{ border:1px solid var(--border); border-radius:12px; background:var(--bg); box-shadow:var(--shadow); }
.partner-ultra-compact{ display:grid; grid-template-columns:auto 1fr; align-items:center; gap:.6rem; padding:.5rem .6rem; }
.partner-ultra-compact .partner-photo{ width:84px; height:84px; border-radius:50%; overflow:hidden; border:1px solid var(--border); background:#DFEAE4; }
.partner-ultra-compact .partner-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.partner-ultra-compact .partner-info{ display:grid; align-content:start; justify-items:start; gap:.15rem; }
.partner-ultra-compact .partner-info h3{ margin:0; font-size:1.05rem; }
.partner-ultra-compact .partner-info p{ margin:0 0 .2rem; color:var(--muted); }
.partner-contact{ width:auto; display:inline-flex; align-items:center; justify-content:center; padding:.35rem .6rem; border-radius:10px; line-height:1; text-decoration:none; }

/* Footer & cookies */
.site-footer{ border-top:1px solid var(--border); background:var(--bg); }
.footer-inner{ display:grid; grid-template-columns:1fr auto; align-items:center; gap:.8rem; padding:1rem 0; }
.footer-left p{ font-size:.9rem; margin:0; }
.footer-right{ display:flex; align-items:center; gap:.6rem; justify-self:end; margin-right:0; }
.memberof{ color:var(--text); font-weight:400; font-size:.9rem; }
.footer-badge img{ height:28px; width:auto; display:block; max-width:100%; filter:saturate(95%); }
.cookie-banner{
  position:fixed; left:50%; transform:translateX(-50%); bottom:1rem;
  width:min(820px,92vw); background:var(--bg); border:1px solid var(--border);
  box-shadow:var(--shadow); border-radius:12px; padding:.8rem .9rem; display:flex; gap:.8rem; z-index:60;
}
.cookie-banner p{ margin:0; flex:1 1 auto; color:var(--muted); }
.btn{ cursor:pointer; }
.addr-break{ display:none; }

/* ===== Mobil ≤640px (urørt) ===== */
@media (max-width:640px){
  .site-header{ position:static; }
  .nav-wrap{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; padding:.5rem 0; gap:.25rem; }
  .header-menu-toggle{ display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; border-radius:12px; border:1px solid var(--border); background:#fff; box-shadow:var(--shadow); }
  .header-menu-toggle svg{ width:24px; height:24px; }
  .brand{ justify-self:center; }
  .brand-logo{ height:auto; width:clamp(220px,58vw,340px); display:block; }
  .contact-quick{ display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; border-radius:12px; border:1px solid var(--border); background:#fff; box-shadow:var(--shadow); }
  .contact-quick svg{ width:22px; height:22px; }
  .nav{ display:none; }

  .hero-media-row{ display:block; margin:0 0 .6rem; text-align:center; }
  .portrait-mobile{
    display:block; width:clamp(160px,60vw,280px); height:auto; border-radius:14px; border:1px solid var(--border); box-shadow:var(--shadow);
    object-fit:cover; aspect-ratio:4/5; margin:0 auto 1rem;
  }

  .hero-mobile-heading{
    display:grid; place-items:center; text-align:center;
    margin:0 0 2.4rem;
    line-height:1.12; gap:.25rem;
  }
  .hero-mobile-heading .overline{
    text-transform:uppercase; font-weight:700; font-size:clamp(1rem,4.1vw,1.15rem); letter-spacing:.14em;
    color:color-mix(in oklab, var(--text), #000 10%);
  }
  .hero-mobile-heading .name{ font-weight:700; font-size:clamp(1.6rem,7.4vw,2.2rem); }

  .hero-mobile-card{ display:block; padding-top:.2rem; }
  .hero-mobile-prose{ font-size:1.07rem; line-height:1.7; }

  .hero-content{ padding-bottom:.8rem; }
  .hero + .section{ padding-top:.6rem; }

  .cards-4{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:.6rem; justify-items:stretch; }
  @media (max-width:360px){ .cards-4{ grid-template-columns:1fr; } }
  .cards-4 .card{ background:var(--bg-soft) !important; border-color:var(--border) !important; box-shadow:none !important; padding:.85rem .9rem; }

  .udredning-grid, .find-grid, .behandling-grid, .supervision-grid{ grid-template-columns:1fr; }
  #udredning .udredning-grid > *{ min-width:0; width:100%; }
  #udredning .grid-wide-img img{
    aspect-ratio:20/9 !important;
    min-height:190px !important;
    object-fit:cover; object-position:center;
  }

  #supervision .sup-media{ display:block !important; grid-column:1 / -1; margin-top:.8rem; }
  #supervision .sup-media img{
    width:100% !important; max-width:100% !important; height:auto;
    max-height:260px;
    object-fit:cover; object-position:center; display:block;
  }

  .two-up-images{ grid-template-columns:1fr; }
  .be-right h3{ margin-top:.8rem; }

  .contact-grid{
    grid-template-columns:1fr !important;
    grid-template-areas:"title" "left" "right" !important;
  }
  #contact .contact-left{ grid-area:left; }
  #contact .contact-right{ grid-area:right; margin-top:.8rem; }
  #contact .contact-grid > *{ min-width:0; }
  #contact .card, #contact .address-card, #contact .contact-info{ width:100%; }
  .address-card h3{ font-size:1rem; font-weight:700; margin:0 0 .35rem; }
  .addr-break{ display:block; }

  #about .info-grid{ grid-template-columns:1fr !important; }
  #about .info-grid .info-tile{ padding:.65rem .85rem; }

  /* Grønne flueben på mobil */
  ul.checklist li::before{
    content:"";
    width:1.05em; height:1.05em; position:absolute; left:0; top:.15em;
    background:no-repeat center / contain
      url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='%233A875E' d='M6.3 12.3L1.7 7.7l1.4-1.4 3.2 3.2 6.6-6.6 1.4 1.4-8 8c-.4.4-1 .4-1.4 0z'/></svg>");
  }

  .footer-inner{ padding:1rem 0; }
  .footer-right{ justify-self:end; }
  .footer-badge img{ height:28px; display:block; }
}

/* Mobil landscape ≤1024px – skjul desktop-nav så den ikke overlapper */
@media (max-width:1024px) and (orientation:landscape){
  .site-header{ position:static; }
  .site-header .nav{ display:none !important; visibility:hidden !important; height:0 !important; overflow:hidden !important; }
  .nav-wrap{ display:grid !important; grid-template-columns:auto 1fr auto !important; align-items:center; gap:.25rem; padding:.5rem 0; }
  .header-menu-toggle,.contact-quick{ display:inline-flex !important; }
  .brand{ justify-self:center; }
  .brand-logo{ width:clamp(240px,50vw,380px); height:auto; display:block; }
  .mobile-drawer{ display:grid !important; }
  .drawer-backdrop{ display:block !important; }
}
/* Touch fallback */
@media (hover:none), (pointer:coarse){
  .site-header .nav{ display:none !important; visibility:hidden !important; height:0 !important; overflow:hidden !important; }
}

/* === HERO SPACING JUSTERING (DESKTOP) — halvt så meget luft over hero === */
@media (min-width: 900px){
  .hero .hero-content{
    padding-top: clamp(1rem, 2.75vw, 1.75rem) !important; /* var clamp(2rem, 5.5vw, 3.5rem) */
  }
}

/* === SPACING: 4-kasse sektionen (DESKTOP) — halvt så meget luft over/under === */
@media (min-width: 900px){
  /* Halv luft både over og under de 4 kasser */
  .hero + .section{
    padding-top: clamp(0.9rem, 2.5vw, 1.5rem) !important;
    padding-bottom: clamp(0.9rem, 2.5vw, 1.5rem) !important;
  }
  /* Sørg for, at "Udredning" ikke får ekstra top-luft oveni */
  .hero + .section + main .section:first-of-type{
    padding-top: 0 !important;
    margin-top: 0 !important;
  }
}

/* === EKSTRA STRAMNING (DESKTOP) — halver igen afstanden mellem hero-kasse og 4 kasser === */
@media (min-width: 900px){
  /* Mindre bund-padding under heroens indhold */
  .hero .hero-content{ padding-bottom: 1rem !important; }       /* var 2rem */

  /* Mindre margin under selve hvide kasse i heroen */
  .hero .hero-desktop-box.section-card{ margin-bottom: .6rem !important; } /* var 1.2rem */

  /* Endnu strammere topafstand før 4-kasse sektionen */
  .hero + .section{ padding-top: clamp(0.45rem, 1.2vw, 0.75rem) !important; }
}
/* === SLUT === */