/* =========================================================
   ALAYV – stylesheet
   Overskrifter: DM Serif Display · Tekst: DM Sans
   Farver: skovgrøn, sand og en varm hvid grund.

   Indhold
    1. Skrifter
    2. Farver og mål
    3. Grundopsætning
    4. Knapper og links
    5. Menu
    6. Hero og testens første spørgsmål
    7. Testen
    8. Sektioner og sektionshoved
    9. Tekst + billede (Møt treneren, abonnement)
   10. Citatbånd
   11. Kosthold
   12. Trening
   13. Priser
   14. Spørsmål og svar
   15. Kontakt
   16. Footer
   17. Mobil: "Ta testen" i bunden
   18. Bevægelse
   19. Klar til Emilies indhold (udtalelser, "Hva du får")
   20. Tablet og mobil
   ========================================================= */


/* 1. Skrifter – ligger i mappen fonts/ */
@font-face{font-family:'DM Serif Display';src:url(../fonts/dm-serif-display-latin-400-normal.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'DM Serif Display';src:url(../fonts/dm-serif-display-latin-400-italic.woff2) format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'DM Sans';src:url(../fonts/dm-sans-latin-300-normal.woff2) format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'DM Sans';src:url(../fonts/dm-sans-latin-400-normal.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'DM Sans';src:url(../fonts/dm-sans-latin-400-italic.woff2) format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'DM Sans';src:url(../fonts/dm-sans-latin-500-normal.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'DM Sans';src:url(../fonts/dm-sans-latin-600-normal.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}


/* 2. Farver og mål */
:root{
  --gron:#43654E;          /* skovgrøn – knapper, accent */
  --gron-mork:#35523F;     /* hover og footer */
  --brun:#4E3F31;
  --sand:#E2D5B6;          /* knapper på mørk/grøn baggrund */
  --sand-lys:#EFE7D4;      /* tekst på mørk/grøn baggrund */
  --salvie:#7F9E8A;        /* fokus-ring */
  --grund:#FAF8F3;         /* sidens baggrund */
  --kridt:var(--grund);    /* (bruges af takk.html) */
  --hvid:#FFFFFF;
  --blekk:#211C17;         /* overskrifter */
  --tekst:#57514a;         /* brødtekst */
  --kant:rgba(33,28,23,.12);
  --kant-lys:rgba(33,28,23,.08);
  --display:'DM Serif Display',Georgia,serif;
  --sans:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  /* Skriftskala – brug kun disse størrelser */
  --fs-xxs:11px;                         /* små etiketter med versaler */
  --fs-xs:13px;                          /* knapper, menu, småtekst */
  --fs-s:15px;                           /* sekundær tekst */
  --fs-m:16px;                           /* brødtekst */
  --fs-l:18px;                           /* indledninger */
  --fs-h3:clamp(19px,1.5vw,22px);        /* små overskrifter */
  --fs-h2s:clamp(24px,2.2vw,30px);       /* mellemoverskrifter */
  --fs-h2:clamp(34px,3.4vw,48px);        /* sektionsoverskrifter */
  --r:14px;
  --r-lille:10px;
  --maks:1200px;
  --ease:cubic-bezier(.2,.7,.2,1);
}


/* 3. Grundopsætning */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--grund);color:var(--blekk);font-family:var(--sans);font-size:var(--fs-m);line-height:1.7;letter-spacing:.005em;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0;font-family:var(--display);font-weight:400;line-height:1.1}
h1 em,h2 em,h3 em{font-style:italic;color:var(--gron)}
p,ul,ol,blockquote,figure{margin:0}
img{display:block;max-width:100%}
a{color:inherit}
strong,b{font-weight:600}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--salvie);outline-offset:3px}
[hidden]{display:none!important}
h1,h2,h3,h4,legend,blockquote{text-wrap:balance}
p,li,summary{text-wrap:pretty}
::selection{background:var(--gron);color:var(--hvid)}
.js img[loading="lazy"]{opacity:0;transition:opacity .6s var(--ease)}
.js img[loading="lazy"].lastet{opacity:1}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{max-width:var(--maks);margin:0 auto;padding:0 clamp(20px,4vw,48px)}
.sec{scroll-margin-top:72px}
.tagline{font-family:var(--display);letter-spacing:.5em;padding-left:.5em;text-transform:uppercase;line-height:1.4}


/* 4. Knapper og links
   .btn         grøn (primær)
   .btn-ramme   grøn kant (sekundær)
   .btn-lys     sand – på grøn eller mørk baggrund
   .btn-insta   grøn kant med ikon, uden pil */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 26px;
  border:1px solid transparent;border-radius:999px;background:var(--gron);color:var(--hvid);
  font-family:var(--sans);font-size:var(--fs-xs);font-weight:500;line-height:1;letter-spacing:.1em;text-transform:uppercase;
  text-decoration:none;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.btn:hover{background:var(--gron-mork)}
.btn::after{content:"\2192";font-size:15px;letter-spacing:0;transition:transform .25s var(--ease)}
.btn:hover::after{transform:translateX(3px)}
.btn:disabled{opacity:.6;cursor:wait}
.btn:disabled::after{content:none}
.btn-fuld{width:100%}
.btn-ramme{background:transparent;color:var(--gron);border-color:var(--gron)}
.btn-ramme:hover{background:var(--gron);color:var(--hvid)}
.btn-lys{background:var(--sand);color:var(--blekk)}
.btn-lys:hover{background:var(--hvid);color:var(--blekk)}
.btn-insta{background:transparent;color:var(--gron);border-color:var(--gron);font-size:var(--fs-s);letter-spacing:.01em;text-transform:none}
.btn-insta::after{content:none}
.btn-insta:hover{background:var(--gron);color:var(--hvid)}
.tekstlink{display:inline-flex;align-items:center;min-height:44px;font-size:var(--fs-s);color:var(--gron);
  text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px;text-decoration-color:rgba(67,101,78,.45)}
.tekstlink:hover{text-decoration-color:var(--gron)}
.tilbake{min-height:44px;padding:0;border:0;background:none;font-size:var(--fs-s);color:var(--gron);cursor:pointer;text-decoration:underline;text-underline-offset:5px}
.tilbake:disabled{visibility:hidden}


/* 5. Menu – svævende pille; på mobil logo + burger */
.nav{position:sticky;top:0;z-index:60;height:0;display:flex;justify-content:center;align-items:flex-start}
.pille{position:relative;display:flex;align-items:center;gap:2px;margin-top:14px;padding:4px;
  border:1px solid var(--kant);border-radius:999px;background:rgba(250,248,243,.86);
  -webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);
  box-shadow:0 8px 30px -14px rgba(33,28,23,.25);transition:background .3s,border-color .3s}
.nav-links{display:flex;align-items:center;gap:2px}
.markor{position:absolute;top:4px;bottom:4px;left:0;width:0;border-radius:999px;background:rgba(67,101,78,.12);opacity:0;
  transition:transform .45s var(--ease),width .45s var(--ease),opacity .3s}
.navlink,.nav-cta{display:inline-flex;align-items:center;min-height:40px;border-radius:999px;
  font-size:var(--fs-xs);font-weight:500;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap;text-decoration:none}
.navlink{position:relative;z-index:1;padding:0 16px;color:var(--tekst);transition:color .3s,background .2s}
.navlink:hover{background:rgba(127,158,138,.16)}
.navlink.aktiv{color:var(--gron)}
.navlink.aktiv:hover{background:transparent}
.nav-cta{position:relative;z-index:1;margin-left:6px;padding:0 20px;background:var(--gron);color:var(--hvid);transition:background .2s}
.nav-cta:hover{background:var(--gron-mork)}
.nav-logo{display:block;max-width:120px;padding:0 14px 0 16px;overflow:hidden;white-space:nowrap;
  font-family:var(--display);font-size:var(--fs-h3);line-height:1;letter-spacing:.02em;color:var(--blekk);text-decoration:none;
  transition:max-width .45s var(--ease),padding .45s var(--ease),opacity .3s}
.nav.paa-hero:not(.aaben) .nav-logo{max-width:0;padding:0;opacity:0}
.nav-burger{display:none}
/* Over videoen i toppen er menuen mørk og gennemsigtig */
.nav.paa-hero:not(.aaben) .pille{background:rgba(22,18,15,.3);border-color:rgba(255,255,255,.22);box-shadow:none}
.nav.paa-hero:not(.aaben) .markor{background:rgba(255,255,255,.16)}
.nav.paa-hero:not(.aaben) .navlink{color:var(--hvid)}
.nav.paa-hero:not(.aaben) .nav-cta{background:var(--sand);color:var(--blekk)}
.nav.paa-hero:not(.aaben) .nav-cta:hover{background:var(--hvid)}


/* 6. Hero – video bagest, tekst og første spørgsmål til venstre, Emilie til højre */
.hero{position:relative;overflow:hidden;isolation:isolate;min-height:min(100svh,920px);background:#16120f;color:var(--hvid)}
.hero-video{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}
.hero-tone{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(22,18,15,.82) 0%,rgba(22,18,15,.62) 45%,rgba(22,18,15,.45) 100%)}
.hero-inner{position:relative;z-index:2;min-height:inherit;max-width:1320px;margin:0 auto;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"tekst figur" "quiz figur";grid-template-rows:auto 1fr;
  column-gap:clamp(24px,4vw,64px);padding:clamp(120px,15vh,170px) clamp(24px,5vw,72px) 0}
.hero-tekst{grid-area:tekst;display:flex;flex-direction:column;gap:14px}
.hero-ord{font-size:clamp(60px,6.8vw,104px);line-height:.95;letter-spacing:.01em;color:var(--sand)}
.hero-linje{max-width:30em;font-size:var(--fs-l);font-weight:300;line-height:1.5;color:var(--sand-lys)}
.hero-cred{display:inline-flex;align-items:center;gap:10px;font-size:var(--fs-s);letter-spacing:.04em;color:var(--sand)}
.hero-cred::before{content:"";width:22px;height:1px;background:var(--sand)}
.hero-quiz{grid-area:quiz;align-self:start;display:flex;flex-direction:column;gap:10px;width:min(100%,400px);
  margin-top:clamp(28px,5vh,52px);padding-bottom:clamp(40px,7vh,72px)}
.hq-spm{margin-bottom:6px;font-family:var(--display);font-size:var(--fs-h2s)}
.hq-valg{display:flex;flex-direction:column;gap:10px}
.hq-knapp{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:54px;padding:0 20px;
  border:1px solid rgba(255,255,255,.28);border-radius:var(--r-lille);background:rgba(255,255,255,.07);color:var(--hvid);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  font-size:var(--fs-m);text-align:left;cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.hq-knapp::after{content:"\2192";opacity:.45;transition:opacity .2s,transform .25s var(--ease)}
.hq-knapp:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.5)}
.hq-knapp:hover::after{opacity:1;transform:translateX(3px)}
.hq-knapp[aria-pressed="true"]{background:var(--sand);border-color:var(--sand);color:var(--blekk)}
.hero-figur{grid-area:figur;position:relative;align-self:end;justify-self:end;width:min(790px,calc(100vw - 540px));
  margin:0 calc(-1 * clamp(24px,5vw,72px)) 0 0}
.hero-figur::before{content:"";position:absolute;left:8%;right:8%;bottom:0;height:85%;z-index:0;
  background:radial-gradient(ellipse at 50% 60%,rgba(226,213,182,.28) 0%,rgba(226,213,182,0) 65%)}
.hero-figur img{position:relative;z-index:1;width:100%;height:auto}


/* 7. Testen – folder sig ud under toppen */
.test-sek{padding:clamp(48px,6vw,80px) 0;scroll-margin-top:70px}
#heroQuiz{scroll-margin-top:90px}
.test-panel{max-width:720px;margin:0 auto;padding:clamp(28px,3.4vw,52px);border:1px solid var(--kant);border-radius:var(--r);background:var(--hvid)}
.test-panel.aaben{animation:fold .55s var(--ease) both}
.fremdrift{display:flex;align-items:center;gap:16px;margin-bottom:30px}
.fremdrift-tekst{font-size:var(--fs-s);color:var(--tekst);white-space:nowrap}
.fremdrift-bar{position:relative;flex:1;height:2px;overflow:hidden;background:rgba(67,101,78,.18)}
.fremdrift-bar span{position:absolute;inset:0 auto 0 0;width:20%;background:var(--gron);transition:width .45s var(--ease)}
.steg{min-width:0;margin:0;padding:0;border:0}
.steg.aktivt{animation:inn .45s var(--ease) both}
.steg legend{margin-bottom:24px;padding:0;font-family:var(--display);font-size:var(--fs-h2s);line-height:1.15}
.hjelp{margin:-14px 0 22px;font-size:var(--fs-s);color:var(--tekst)}
.valg{display:flex;flex-direction:column;gap:10px}
.valg-knapp{display:flex;align-items:center;width:100%;min-height:56px;padding:0 22px;border:1px solid var(--kant);border-radius:var(--r-lille);
  background:var(--hvid);color:var(--blekk);font-size:var(--fs-m);text-align:left;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.valg-knapp:hover{border-color:var(--gron)}
.valg-knapp[aria-pressed="true"]{background:var(--gron);border-color:var(--gron);color:var(--hvid)}
.felter{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.felt{display:flex;flex-direction:column;gap:8px;min-width:0}
.felt label{font-size:var(--fs-s);font-weight:500;color:var(--tekst)}
.felt input,.felt select,.felt textarea,.epost-rad input{width:100%;min-height:52px;padding:12px 16px;border:1px solid rgba(33,28,23,.18);border-radius:var(--r-lille);
  background:var(--hvid);font-size:var(--fs-m);color:var(--blekk);transition:border-color .2s,box-shadow .2s}
.felt textarea{min-height:140px;resize:vertical}
.felt input:focus,.felt select:focus,.felt textarea:focus,.epost-rad input:focus{outline:none;border-color:var(--gron);box-shadow:0 0 0 3px rgba(67,101,78,.14)}
.test-nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-top:28px}
#testNav:has(.tilbake:disabled){display:none}
.feil{margin-top:12px;font-size:var(--fs-s);color:#8A3B2A}
/* Resultatet */
.resultat{display:flex;flex-direction:column;gap:22px}
.resultat.aktivt{animation:inn .5s var(--ease) both}
.resultat h3{font-size:var(--fs-h2s)}
.plan{display:flex;flex-direction:column;padding:0;list-style:none}
.plan li{display:grid;grid-template-columns:150px 1fr;gap:4px 18px;padding:16px 0;border-top:1px solid var(--kant)}
.plan li:last-child{border-bottom:1px solid var(--kant)}
.lbl{padding-top:5px;font-size:var(--fs-xxs);letter-spacing:.2em;text-transform:uppercase;color:var(--tekst)}
.plan strong{display:block;font-family:var(--display);font-size:var(--fs-h3);font-weight:400;line-height:1.3}
.smaa{font-size:var(--fs-s);color:var(--tekst)}
.pakke-boks{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:22px 24px;
  border:1px solid var(--kant);border-radius:var(--r-lille);background:var(--grund)}
.pakke-boks strong{display:block;font-family:var(--display);font-size:var(--fs-h3);font-weight:400;line-height:1.2}
.pakke-boks span{font-size:var(--fs-s)}
.epost{display:flex;flex-direction:column;gap:10px;padding-top:6px}
.epost p{font-size:var(--fs-s)}
.epost-rad{display:flex;flex-wrap:wrap;gap:10px}
.epost-rad input{flex:1 1 220px;width:auto;border-radius:999px;padding:12px 18px}
/* Fælles for formularer */
.honning{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.skjema-feil{margin:0;padding:10px 14px;border-radius:var(--r-lille);background:#F6E3DA;color:#7A2E1C;font-size:var(--fs-s);line-height:1.5}
.samtykke{margin:0;font-size:var(--fs-xs);line-height:1.5;color:var(--tekst)}


/* 8. Sektioner – samme lyse grund, adskilt af en tynd linje */
.sek{padding:clamp(72px,8vw,120px) 0;scroll-margin-top:72px}
.sek.lys + .sek.lys{background:linear-gradient(var(--kant),var(--kant)) top center/min(calc(100% - 2 * clamp(20px,4vw,48px)),1104px) 1px no-repeat}
.sek.gron{background:var(--gron);color:var(--hvid)}
.sek-hode{display:flex;flex-direction:column;align-items:center;gap:14px;max-width:760px;margin:0 auto clamp(36px,4vw,56px);text-align:center}
.sek-hode h2{font-size:var(--fs-h2)}
.sek-hode p{max-width:36em;font-size:var(--fs-l);line-height:1.6;color:var(--tekst)}


/* 9. Tekst + billede side om side */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:center}
.split-bilde{position:relative;aspect-ratio:4/5;overflow:hidden;border-radius:var(--r);background:var(--sand)}
.split-bilde img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.split-tekst{display:flex;flex-direction:column;align-items:flex-start;gap:16px;max-width:32rem}
.split-tekst h2{font-size:var(--fs-h2)}
.split-tekst p{font-size:var(--fs-m);line-height:1.75;color:var(--tekst)}
/* Møt treneren */
.bio-blok{display:flex;flex-direction:column;gap:4px;width:100%;padding-top:16px;border-top:1px solid var(--kant)}
.bio-blok:first-of-type{margin-top:8px}
.bio-blok h3{font-size:var(--fs-h3);line-height:1.2}
.bio-handling{display:flex;flex-wrap:wrap;gap:12px;margin-top:10px}


/* 10. Citatbånd over et sort-hvidt billede */
.udsagn-foto{position:relative;overflow:hidden;isolation:isolate;padding:clamp(96px,11vw,160px) 24px;background:#111;color:var(--hvid);text-align:center}
.udsagn-billeder{position:absolute;inset:0;z-index:-2}
.udsagn-billeder img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.12) brightness(.45)}
.udsagn-foto::after{content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(ellipse 70% 80% at 50% 50%,rgba(17,14,11,.45) 0%,rgba(17,14,11,.15) 100%)}
.udsagn-sitat{display:flex;flex-direction:column;align-items:center;gap:clamp(20px,2.4vw,30px)}
.udsagn-sitat blockquote{max-width:16em;font-family:var(--display);font-size:clamp(34px,4.6vw,66px);line-height:1.1;color:var(--hvid);text-wrap:balance}
.udsagn-sitat blockquote em{font-style:italic;color:var(--sand)}
.udsagn-sitat .tagline{font-size:clamp(11px,1vw,13px);color:var(--sand-lys)}


/* 11. Kosthold – tre guider */
.kort-grid{display:grid;gap:clamp(16px,2vw,28px)}
.kort-grid.tre{grid-template-columns:repeat(3,minmax(0,1fr))}
.kort-bilde{position:relative;aspect-ratio:4/5;overflow:hidden;border-radius:var(--r);background:var(--sand)}
.kort-bilde img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.66) contrast(1.04) brightness(1.02)}
.abo{display:flex;align-items:center;justify-content:space-between;gap:20px 40px;margin-top:clamp(36px,4vw,56px);padding-top:clamp(24px,3vw,32px);border-top:1px solid var(--kant)}
.abo p{max-width:42rem;font-size:var(--fs-m);line-height:1.7;color:var(--tekst)}
.abo strong{color:var(--blekk)}
.abo .btn{flex:none}
.guide h3{margin-top:16px;font-size:var(--fs-h3);text-align:center}


/* 12. Trening – tre sort-hvide billeder med tekst */
.triptyk{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,1.4vw,20px);align-items:start}
.triptyk figure{position:relative;aspect-ratio:4/5;overflow:hidden;border-radius:var(--r);background:#1e1e1e}
.triptyk img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.18) brightness(.95)}
.triptyk figcaption{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:6px;padding:70px 22px 22px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.65) 100%);color:var(--hvid);text-align:left}
.triptyk figcaption strong{font-family:var(--display);font-size:var(--fs-h3);font-weight:400;line-height:1.15}
.triptyk figcaption span{font-size:var(--fs-s);line-height:1.45;color:rgba(255,255,255,.88)}


/* 13. Priser – fire kort; "Kosthold + trening" er fremhævet */
.priser{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,22px)}
.pris{position:relative;display:flex;flex-direction:column;gap:14px;padding:clamp(24px,2.4vw,34px);
  border:1px solid var(--kant-lys);border-radius:var(--r);background:var(--hvid);
  box-shadow:0 1px 2px rgba(33,28,23,.04),0 14px 34px -22px rgba(33,28,23,.22)}
.pris h3{font-size:var(--fs-h3)}
.belop{font-family:var(--display);font-size:var(--fs-h2);line-height:1}
.belop span{font-family:var(--sans);font-size:var(--fs-xs);letter-spacing:.02em;color:var(--tekst)}
.pris ul{display:flex;flex:1;flex-direction:column;gap:10px;margin-bottom:12px;padding:0;list-style:none;font-size:var(--fs-s);line-height:1.5;color:var(--tekst)}
.pris li{display:flex;gap:12px}
.pris li::before{content:"";flex:none;width:15px;height:15px;margin-top:4px;background:var(--gron);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat}
.pris.fremhevet{border-color:var(--gron);background:var(--gron);color:var(--hvid)}
.pris.fremhevet .belop span,.pris.fremhevet ul{color:var(--sand-lys)}
.pris.fremhevet li::before{background:var(--sand)}
.pris .btn{padding:0 16px;font-size:var(--fs-xs);letter-spacing:.07em;white-space:nowrap}
.pris-merke{position:absolute;top:-12px;left:clamp(24px,2.4vw,34px);padding:5px 12px;border-radius:999px;background:var(--sand);color:var(--blekk);
  font-size:var(--fs-xxs);font-weight:500;letter-spacing:.1em;text-transform:uppercase}
/* Online coaching – bred boks under kortene */
.coaching{display:flex;align-items:center;justify-content:space-between;gap:24px 48px;margin-top:clamp(14px,1.6vw,22px);padding:clamp(24px,3vw,40px);
  border:1px solid var(--kant-lys);border-radius:var(--r);background:var(--hvid);box-shadow:0 1px 2px rgba(33,28,23,.04),0 14px 34px -22px rgba(33,28,23,.22)}
.coaching-tekst{max-width:36rem}
.coaching-tekst h3{font-size:var(--fs-h2s)}
.coaching-tekst p{margin-top:8px;color:var(--tekst)}
.coaching-kjop{display:flex;flex:none;align-items:center;gap:28px}
/* Linje om betalingen – vises, når Stripe er slået til */
.tillid{display:none;flex-wrap:wrap;justify-content:center;gap:10px 32px;margin:clamp(22px,2.6vw,32px) 0 0;padding:0;list-style:none;font-size:var(--fs-s);color:var(--tekst)}
.tillid li{display:inline-flex;align-items:center;gap:8px}
.tillid svg{color:var(--gron)}
.betaling-aktiv .tillid{display:flex}
.tillid .kun-portal{display:none}
.betaling-portal .tillid .kun-portal{display:inline-flex}


/* 14. Spørsmål og svar – én centreret kolonne */
.faq{max-width:860px}
.faq .sek-hode{margin-bottom:clamp(28px,3vw,40px)}
.sporsmal details{border-top:1px solid var(--kant)}
.sporsmal details:last-child{border-bottom:1px solid var(--kant)}
.sporsmal summary{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:72px;padding:14px 0;
  list-style:none;cursor:pointer;font-size:var(--fs-l);font-weight:500;line-height:1.4}
.sporsmal summary::-webkit-details-marker{display:none}
.sporsmal summary::after{content:"";flex:none;width:30px;height:30px;border:1px solid var(--gron);border-radius:50%;
  background:linear-gradient(var(--gron),var(--gron)) center/11px 1px no-repeat,linear-gradient(var(--gron),var(--gron)) center/1px 11px no-repeat;
  transition:transform .3s var(--ease)}
.sporsmal details[open] summary::after{transform:rotate(45deg)}
.sporsmal details p{padding:0 50px 22px 0;font-size:var(--fs-m);line-height:1.75;color:var(--tekst)}


/* 15. Kontakt – grøn afslutning før footeren */
.split.kontakt{align-items:start}
.kontakt .split-tekst h2{color:var(--hvid)}
.kontakt .split-tekst p{color:var(--sand-lys)}
.kontakt .signatur{font-family:var(--display);font-size:var(--fs-h2s);font-style:italic;color:var(--sand)}
.kontakt .felt label{color:var(--sand-lys)}
.kontakt .felt input,.kontakt .felt select,.kontakt .felt textarea{border-color:transparent}
.kontakt .felt input:focus,.kontakt .felt select:focus,.kontakt .felt textarea:focus{border-color:var(--sand);box-shadow:0 0 0 3px rgba(226,213,182,.35)}
.kontakt .samtykke{color:rgba(239,231,212,.8)}
.kontakt .tilbake{color:var(--sand)}
.skjema{display:flex;flex-direction:column;gap:14px;width:100%}
.skjema .btn{align-self:flex-start}
.takk{display:flex;flex-direction:column;gap:14px}
.takk h3{font-size:var(--fs-h2s)}


/* 16. Footer */
footer{padding:clamp(48px,6vw,72px) 0 28px;background:var(--gron-mork);color:var(--hvid)}
.fot-topp,.fot-bunn{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;
  width:calc(100% - 2 * clamp(20px,4vw,48px));max-width:calc(var(--maks) - 96px);margin:0 auto}
.fot-merke{display:flex;flex-direction:column;gap:12px}
.ordmerke{font-family:var(--display);font-size:clamp(36px,3.4vw,48px);line-height:.9;letter-spacing:.01em}
footer .tagline{padding-left:0;font-size:var(--fs-xxs);color:var(--sand-lys)}
.fot-bunn{margin-top:clamp(32px,4vw,48px);padding-top:20px;border-top:1px solid rgba(255,255,255,.18);font-size:var(--fs-xs);color:rgba(239,231,212,.8)}
.fot-lenker{display:flex;flex-wrap:wrap;gap:6px 22px}
.fot-lenker a{text-decoration:none}
.fot-lenker a:hover{color:var(--sand)}


/* 17. Mobil: "Ta testen" i bunden af skærmen */
.mobil-cta{display:none}


/* 18. Bevægelse – kun en rolig fade, når indhold kommer frem */
@keyframes ind{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes inn{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:none}}
@keyframes fold{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:none}}
.rise{animation:ind .9s var(--ease) both}
.d1{animation-delay:.12s}
.d2{animation-delay:.24s}
.js .fade{opacity:0;transform:translateY(8px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .fade.synlig{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rise,.steg.aktivt,.resultat.aktivt,.test-panel.aaben{animation:none}
  .js .fade{opacity:1;transform:none;transition:none}
  .markor,.mobil-cta,.btn,.nav-links{transition:none}
}


/* 19. Klar til Emilies indhold (bruges, når kommentarerne i index.html fjernes) */
.kort{padding:clamp(20px,2vw,28px);border:1px solid var(--kant-lys);border-radius:var(--r);background:var(--hvid)}
.uttalelse blockquote{font-family:var(--display);font-size:var(--fs-h3);line-height:1.35}
.uttalelse figcaption{margin-top:16px;font-size:var(--fs-s);color:var(--tekst)}
.inkludert{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.6vw,22px);margin-top:clamp(20px,2.4vw,32px)}
.inkludert h3{font-size:var(--fs-h3)}
.inkludert p{margin-top:4px;font-size:var(--fs-s);line-height:1.55;color:var(--tekst)}


/* 20. Tablet og mobil */
@media (max-width:1000px){
  .nav-cta{display:none}
  .inkludert{grid-template-columns:repeat(2,minmax(0,1fr))}
  /* Hero stables: tekst → Emilie → spørgsmålet på lys baggrund */
  .hero{min-height:0}
  .hero-quiz{background:var(--grund);color:var(--blekk)}
  .hq-knapp{border-color:var(--kant);background:var(--hvid);color:var(--blekk);-webkit-backdrop-filter:none;backdrop-filter:none}
  .hq-knapp:hover{border-color:var(--gron);background:var(--hvid)}
  .hq-knapp[aria-pressed="true"]{border-color:var(--gron);background:var(--gron);color:var(--hvid)}
}
@media (min-width:761px) and (max-width:1000px){
  .hero-inner{grid-template-columns:1fr;grid-template-areas:"tekst" "figur" "quiz";grid-template-rows:auto;padding:118px 0 0}
  .hero-tekst{padding:0 44px}
  .hero-figur{justify-self:center;width:min(100%,660px);margin:28px 0 0}
  .hero-quiz{width:100%;margin-top:0;padding:40px max(44px,calc((100% - 520px) / 2)) 48px}
}
@media (min-width:761px){
  .split.kontakt .split-tekst{position:sticky;top:110px}
}
@media (max-width:760px){
  /* Menu: logo + burger; links i en dropdown */
  .pille{justify-content:space-between;width:calc(100% - 24px);margin-top:10px;padding:4px 4px 4px 20px}
  .markor{display:none}
  .nav-logo{padding:0}
  .nav-burger{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:44px;height:44px;
    border:0;border-radius:50%;background:transparent;color:var(--blekk);cursor:pointer}
  .nav-burger span{display:block;width:20px;height:1.5px;background:currentColor;transition:transform .3s var(--ease)}
  .nav.aaben .nav-burger span:first-child{transform:translateY(3.75px) rotate(45deg)}
  .nav.aaben .nav-burger span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
  .nav.paa-hero:not(.aaben) .pille{background:transparent;border-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
  .nav.paa-hero:not(.aaben) .nav-burger{color:var(--hvid)}
  .nav-links{position:absolute;top:calc(100% + 8px);left:0;right:0;flex-direction:column;align-items:stretch;gap:2px;padding:10px;
    border:1px solid var(--kant);border-radius:20px;background:var(--grund);box-shadow:0 20px 40px -20px rgba(33,28,23,.35);
    opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .25s,transform .25s var(--ease),visibility .25s}
  .nav.aaben .nav-links{opacity:1;visibility:visible;transform:none}
  .nav-links .navlink{min-height:52px;padding:0 16px;border-radius:12px;font-size:var(--fs-s);letter-spacing:.06em;color:var(--blekk)}
  .nav-links .navlink.aktiv{background:rgba(67,101,78,.1);color:var(--gron)}

  /* Hero */
  .hero-inner{grid-template-columns:1fr;grid-template-areas:"tekst" "figur" "quiz";grid-template-rows:auto;padding:96px 0 0}
  .hero-tekst{padding:0 20px}
  .hero-ord{font-size:clamp(56px,17vw,80px)}
  .hero-linje br{display:none}
  .hero-figur{justify-self:center;width:100%;margin:18px 0 0}
  .hero-quiz{width:100%;margin-top:0;padding:28px 20px 36px}

  /* Indhold i én kolonne */
  .sek{padding:64px 0}
  .split,.split.kontakt{grid-template-columns:1fr;gap:28px}
  .split-bilde{aspect-ratio:4/3}
  .bio-handling .btn{width:100%}
  /* Guider og træningsbilleder: vandret swipe-række */
  .kort-grid.tre,.triptyk{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:78%;gap:12px;
    margin:0 calc(-1 * clamp(20px,4vw,48px));padding:0 clamp(20px,4vw,48px) 6px;scroll-padding:0 clamp(20px,4vw,48px);
    overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none}
  .kort-grid.tre::-webkit-scrollbar,.triptyk::-webkit-scrollbar{display:none}
  .kort-grid.tre > *,.triptyk > *{scroll-snap-align:start}
  .triptyk figcaption{padding:56px 18px 18px}
  .abo,.coaching,.coaching-kjop{flex-direction:column;align-items:flex-start}
  .coaching-kjop{gap:16px;width:100%}
  .coaching-kjop .btn,.abo .btn{width:100%}
  .fot-topp,.fot-bunn{flex-direction:column;align-items:flex-start}
  .priser,.inkludert{grid-template-columns:1fr}
  .sporsmal details p{padding-right:0}
  .felter{grid-template-columns:1fr 1fr}
  .felter .felt:last-child{grid-column:1/-1}
  .plan li{grid-template-columns:1fr}
  .test-panel{padding:24px 18px 32px}
  footer{padding-bottom:96px}

  /* "Ta testen" i bunden, når man har scrollet forbi toppen */
  .mobil-cta{display:flex;position:fixed;left:12px;right:12px;bottom:12px;z-index:70;transform:translateY(140%);transition:transform .4s var(--ease)}
  .mobil-cta.vis{transform:none}
}
