/* ============================================================
   POWERadhdMIND – fælles styling (flaskegrøn udgave).
   ============================================================ */

:root{
  --aubergine:#15452F;   /* hovedfarve (flaskegrøn) */
  --aubergine-lys:#1e5d40;
  --sage:#8D9B86;
  --ochre:#C8A45D;
  --cream:#f4f1ea;
  --tekst:#33323a;
  --graa:#666;
  --maxbredde:1040px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; background:#e7e3db; }
body{
  margin:0 auto; max-width:1200px; background:#fff;
  box-shadow:0 0 40px rgba(0,0,0,0.14);
  font-family:"Segoe UI", Candara, "Optima", system-ui, sans-serif;
  color:var(--tekst); line-height:1.7;
}
h1,h2,h3{ font-weight:400; color:var(--aubergine); line-height:1.25; }
a{ color:var(--aubergine); }
img{ max-width:100%; height:auto; display:block; }
.wrap{ max-width:var(--maxbredde); margin:0 auto; padding:0 22px; }

/* ---------- Knapper ---------- */
.btn{ display:inline-block; background:var(--aubergine); color:#fff; text-decoration:none;
  padding:13px 26px; border-radius:8px; font-size:15px; transition:background .2s; border:none; cursor:pointer; }
.btn:hover{ background:var(--aubergine-lys); }
.btn-ochre{ background:var(--ochre); color:#3a2a10; }
.btn-ochre:hover{ background:#d8b573; }
.btn-ghost{ background:transparent; border:1px solid #ffffff88; color:#fff; }
.btn-ghost:hover{ background:#ffffff1a; }

/* ---------- Header / menu ---------- */
header{ border-bottom:1px solid #ececec; position:sticky; top:0; background:#fff; z-index:50; }
.topbar{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding:14px 0; flex-wrap:wrap; }
.logo img{ height:100px; width:auto; }
nav{ display:flex; flex-wrap:wrap; }
nav a{ text-decoration:none; color:#252525; font-size:18px; margin-left:26px; padding-bottom:3px; }
nav a:hover{ color:var(--aubergine); }
nav a.active{ color:var(--aubergine); border-bottom:2px solid var(--ochre); }

/* Burger-knap – skjult på desktop, vises under 470px (se nederst) */
.menu-toggle{ display:none; }
.burger{ display:none; cursor:pointer; font-size:30px; line-height:1; color:var(--aubergine);
  padding:4px 10px; user-select:none; -webkit-user-select:none; }
.burger::before{ content:"\2630"; }                      /* ☰ */
.menu-toggle:checked ~ .burger::before{ content:"\2715"; } /* ✕ */

/* ---------- Hero ---------- */
.hero{ background:var(--cream); }
.hero-inner{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:40px; align-items:center; padding:56px 0; }
.hero h1{ font-size:40px; margin:0 0 22px; }
.hero-foto img{ border-radius:14px; width:100%; max-width:330px; margin:0 auto; }

/* ---------- Sideoverskrift ---------- */
.page-hero{ background:var(--aubergine); color:#fff; text-align:center; padding:46px 20px; }
.page-hero h1{ color:#fff; font-size:32px; margin:0; }
.page-hero p{ color:#d7e2da; margin:10px 0 0; }

/* ---------- Sektioner ---------- */
section{ padding:52px 0; }
section.alt{ background:var(--cream); }
.center{ text-align:center; }
.lead{ max-width:720px; margin:0 auto; }

/* ---------- Velkomst-intro (ensartet, kursiv) ---------- */
.velkomst{ max-width:720px; margin:0 auto; text-align:center; }
.velkomst p{ font-size:22px; font-style:italic; line-height:1.7; color:var(--aubergine); margin:0 0 22px; }

/* ---------- Citat som egen sektion ---------- */
.citat-sektion{ background:var(--aubergine); color:#fff; text-align:center; padding:56px 24px; }
.citat-sektion blockquote{ max-width:760px; margin:0 auto; border:none; padding:0;
  font-style:italic; font-size:23px; line-height:1.55; color:#fff; }
.citat-sektion blockquote::before{ content:"\201C"; display:block; font-size:58px; line-height:0.5; color:var(--sage); margin-bottom:18px; }

/* ---------- Artikel-indhold ---------- */
.article{ max-width:760px; margin:0 auto; }
.article h2{ font-size:24px; margin:34px 0 10px; }
.article h3{ font-size:19px; margin:26px 0 6px; color:var(--aubergine-lys); }
.article ul{ padding-left:22px; }
.article li{ margin:6px 0; }

/* ---------- Pris ---------- */
.priskort{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin:30px 0; }
.pris{ border:2px solid var(--ochre); border-radius:12px; padding:26px; text-align:center; background:#fff; }
.pris h3{ font-size:18px; margin:0 0 6px; }
.pris .belob{ font-size:30px; color:var(--aubergine); margin:8px 0; }
.pris .note{ font-size:14px; color:var(--graa); margin:0; }
.pris-links{ margin:14px 0 0; display:flex; flex-direction:column; gap:6px; }
.pris-links a{ font-size:14px; color:var(--aubergine-lys); text-decoration:none; font-weight:500; }
.pris-links a:hover{ text-decoration:underline; }

/* ---------- Om mig ---------- */
.ommig{ display:grid; grid-template-columns:230px 1fr; gap:40px; align-items:start; }
.ommig img{ border-radius:14px; position:sticky; top:120px; width:100%; }

/* ---------- Kontaktformular ---------- */
form.kontakt{ max-width:560px; margin:0 auto; }
form.kontakt label{ display:block; margin:16px 0 6px; font-size:14px; color:var(--aubergine); }
form.kontakt input, form.kontakt textarea{ width:100%; padding:12px 14px; border:1px solid #ccc; border-radius:8px; font-family:inherit; font-size:15px; }
form.kontakt textarea{ min-height:140px; resize:vertical; }
form.kontakt .btn{ margin-top:22px; }

/* ---------- Afslutnings-CTA ---------- */
.cta{ background:var(--aubergine); color:#fff; text-align:center; padding:58px 20px; }
.cta h2{ color:#fff; font-size:28px; margin:0 0 20px; }
.cta .btn{ margin:0 6px 8px; }

/* ---------- Fold ud-kasser: enkelt kolonne ---------- */
.accordion{ max-width:780px; margin:32px auto 0; }
.accordion details{ border:1px solid #e7e7e7; border-radius:12px; margin-bottom:14px; background:#fff; overflow:hidden; }
.accordion details[open]{ border-color:var(--sage); }
.accordion summary{ list-style:none; cursor:pointer; padding:18px 22px; font-size:18px; color:var(--aubergine);
  display:flex; align-items:center; justify-content:space-between; gap:14px; }
.accordion summary::-webkit-details-marker{ display:none; }
.accordion summary::after{ content:"+"; font-size:26px; color:var(--sage); line-height:1; flex:none; }
.accordion details[open] summary::after{ content:"\2013"; }
.accordion summary:hover{ color:var(--aubergine-lys); }
.accordion .body{ padding:2px 22px 22px; }
.accordion .body p:first-child{ margin-top:0; }
.accordion .body ul{ padding-left:20px; }
.accordion .body li{ margin:6px 0; }

/* ---------- Fold ud-kasser: tre kort side om side ---------- */
.accordion.cols{ max-width:none; display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:start; margin-top:34px; }
.accordion.cols details{ margin:0; border:1px solid #e3e3e3; border-radius:14px; background:#fff; box-shadow:0 1px 4px rgba(0,0,0,0.05); }
.accordion.cols details[open]{ border-color:var(--sage); box-shadow:0 6px 18px rgba(0,0,0,0.09); }
.accordion.cols summary{ flex-direction:column; align-items:center; text-align:center; gap:14px; padding:26px 20px; font-size:22px; font-style:italic; }
.accordion.cols summary::after{ display:flex; align-items:center; justify-content:center; width:34px; height:34px;
  border-radius:50%; background:var(--cream); color:var(--aubergine); font-size:22px; transition:all .15s; }
.accordion.cols details[open] summary::after,
.accordion.cols summary:hover::after{ background:var(--sage); color:#fff; }
.accordion.cols .body{ padding:0 22px 24px; text-align:left; }

/* ---------- Footer ---------- */
footer{ background:#102b22; color:#cdd8d1; text-align:center; padding:30px 20px; font-size:14px; }
footer .logo-tekst{ color:#fff; letter-spacing:1px; font-size:20px; }
footer nav{ justify-content:center; margin:10px 0 0; }
footer a{ color:#cdd8d1; text-decoration:none; margin:0 8px; }
footer a:hover{ color:#fff; }
footer .copy{ color:#7a9387; margin:8px 0 0; }

/* ---------- Mobil ---------- */
@media (max-width:820px){
  .hero-inner{ grid-template-columns:1fr; text-align:center; padding:40px 0; }
  .hero-foto{ order:-1; max-width:300px; margin:0 auto; }
  .priskort{ grid-template-columns:1fr; }
  .accordion.cols{ grid-template-columns:1fr; }
  .ommig{ grid-template-columns:1fr; }
  .ommig img{ position:static; max-width:280px; margin:0 auto; }
  .hero h1{ font-size:30px; }
  nav a{ margin:0 10px; }
  .topbar{ justify-content:center; }
  .logo img{ height:72px; }
}

/* ---------- Burger-menu (under 470px) ---------- */
@media (max-width:470px){
  .topbar{ justify-content:space-between; flex-wrap:wrap; }
  .burger{ display:block; }
  header nav{
    display:none; flex-basis:100%; width:100%;
    flex-direction:column; align-items:stretch; gap:0; margin-top:6px;
  }
  .menu-toggle:checked ~ nav{ display:flex; }
  header nav a{
    margin:0; padding:13px 6px; width:100%; font-size:17px;
    border-top:1px solid #eee;
  }
  header nav a.active{
    border-bottom:none;
    color:var(--aubergine);
    text-decoration:underline;
    text-decoration-color:var(--ochre);
    text-decoration-thickness:2px;
    text-underline-offset:5px;
  }
}