/* Fælles stil for /, /foreninger, /seasons og de to juridiske sider.
   Små tekster bruger --accent-deep og --ink-soft, fordi --accent (3,75:1) og --muted (3,44:1)
   ikke når 4,5:1 på papir. */

:root{
  --paper:#F2EFE7; --paper-2:#EAE6DA; --ink:#16140F; --ink-2:#1E1B14;
  --ink-soft:#3A372F; --accent:#D8490D; --accent-deep:#A93608;
  --line:rgba(22,20,15,.16); --line-light:rgba(242,239,231,.2);
  --display:'Anton',Impact,sans-serif; --body:'Archivo',Helvetica,Arial,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
::selection{background:var(--accent-deep);color:var(--paper)}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px}
.accentbar{height:6px;background:var(--accent)}

/* ---------- Nav: ordmærke + tre links. Brydes i to rækker på smal skærm, ingen JS ---------- */
nav.top{border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(242,239,231,.95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);z-index:40}
nav.top .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;column-gap:28px;row-gap:0;min-height:70px;padding-top:8px;padding-bottom:8px}
.wordmark{font-family:var(--display);font-size:22px;letter-spacing:.05em;text-transform:uppercase;text-decoration:none;color:var(--ink);white-space:nowrap}
.wordmark span{color:var(--accent)}
.navlinks{display:flex;flex-wrap:wrap;column-gap:26px;list-style:none}
.navlinks a{display:inline-block;padding:12px 0;font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);text-decoration:none;border-bottom:2px solid transparent;line-height:1.4}
.navlinks a:hover{border-bottom-color:var(--accent)}
.navlinks a[aria-current="page"]{border-bottom-color:var(--accent-deep)}

/* ---------- Typografi ---------- */
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--accent-deep);display:flex;align-items:center;gap:12px;margin-bottom:26px}
.eyebrow::before{content:"";flex:0 0 36px;height:2px;background:var(--accent)}
h1{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(38px,6.4vw,92px);line-height:1.14;letter-spacing:.005em;max-width:16ch;overflow-wrap:break-word}
.acc{color:var(--accent)} /* kun på stor tekst: --accent er 3,75:1 på papir, nok til >=24px */
h2{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(30px,4.3vw,56px);line-height:1.12;max-width:22ch;overflow-wrap:break-word}
h3{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(24px,2.3vw,30px);line-height:1.14;overflow-wrap:break-word}
.sec-label{font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:18px}
.lead{font-size:clamp(18px,1.9vw,21px);line-height:1.55;color:var(--ink-soft);max-width:62ch;margin-top:30px}
.prose{max-width:66ch;margin-top:28px}
.prose p{color:var(--ink-soft);font-size:18px;margin-bottom:18px}
.prose p:last-child{margin-bottom:0}
.prose a,.lead a,.note a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:3px}
.prose a:hover,.lead a:hover,.note a:hover{color:var(--accent-deep)}
.list{list-style:none;max-width:66ch;margin:24px 0;border-top:1px solid var(--line)}
.list li{position:relative;padding:14px 0 14px 28px;border-bottom:1px solid var(--line);color:var(--ink-soft);font-size:17px}
.list li::before{content:"";position:absolute;left:0;top:1.45em;width:14px;height:2px;background:var(--accent)}
.list strong{color:var(--ink);font-weight:600}

/* Faktalinje under heroteksten. Prikken står foran hvert punkt, også det første.
   Listen er rykket 34 px (14 + 6 + 14) til venstre, og de 34 px er klippet væk, så en prik
   aldrig ses i starten af en linje, uanset hvor linjen brydes. Derfor ingen brudpunkt pr. side. */
.facts{list-style:none;display:flex;flex-wrap:wrap;gap:8px 0;margin:26px 0 0 -34px;-webkit-clip-path:inset(0 0 0 34px);clip-path:inset(0 0 0 34px);font-weight:600;font-size:16px;color:var(--ink)}
.facts li{display:flex;align-items:center}
.facts li::before{content:"";flex:0 0 6px;height:6px;background:var(--accent);margin:0 14px}

/* Markering af manglende oplysninger. Står altid inde i et element med data-kladde */
.udfyld{border:2px dashed var(--accent-deep);color:var(--accent-deep);font-weight:600;padding:0 .3em;border-radius:2px}

/* ---------- Kladdevisning ----------
   Alt med data-kladde er skjult, også uden JavaScript. Scriptet øverst i <head> sætter
   html.kladde kun på localhost/127.0.0.1. ?kladde=0 tvinger live-visningen dér. */
html:not(.kladde) [data-kladde]{display:none!important}
html.kladde body::before{content:"Kladdevisning";position:fixed;top:0;right:0;z-index:100;padding:3px 10px;background:var(--ink);color:var(--paper);font:700 11px/1.4 var(--body);letter-spacing:.14em;text-transform:uppercase;pointer-events:none}

/* ---------- Knapper ---------- */
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 18px;margin-top:34px}
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--ink);color:var(--paper);text-decoration:none;font-weight:600;text-transform:uppercase;letter-spacing:.1em;font-size:13px;line-height:1.35;padding:15px 24px;border:2px solid var(--ink);cursor:pointer;position:relative;overflow:hidden;max-width:100%;transition:color .2s}
.btn::before{content:"";position:absolute;inset:0;background:var(--accent-deep);transform:translateX(-101%);transition:transform .3s cubic-bezier(.7,0,.2,1)}
.btn:hover::before{transform:translateX(0)}
.btn span{position:relative;z-index:1}
.btn .arr{transition:transform .3s}
.btn:hover .arr{transform:translateX(4px)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{color:var(--paper)}
.btn.light{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.btn.light:hover{color:var(--paper)}
.dark .btn.ghost{color:var(--paper);border-color:var(--paper)}
.btn.small{padding:11px 18px;font-size:12px}
.note{margin-top:16px;font-size:15px;color:var(--ink-soft)}

/* Synlig fokus på alt, der kan tabbes til */
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.dark a:focus-visible,footer a:focus-visible{outline-color:var(--paper)}

/* ---------- Sektioner ---------- */
.hero{padding:76px 0 80px}
section{padding:96px 0;border-top:1px solid var(--line)}
section.alt{background:var(--paper-2)}
.dark{background:var(--ink);color:var(--paper);border-top:none}
.dark h2,.dark h3{color:var(--paper)}
.dark .sec-label{color:rgba(242,239,231,.75)}
.dark .prose p,.dark .lead,.dark .note{color:rgba(242,239,231,.86)}
.dark .prose a,.dark .lead a,.dark .note a{color:var(--paper)}
.dark .prose a:hover,.dark .lead a:hover,.dark .note a:hover{color:var(--paper);text-decoration-color:var(--paper)}
.split{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:64px;align-items:center}
.photo{border:1px solid var(--line);background:var(--paper-2)}
.dark .photo{border-color:var(--line-light);background:var(--ink-2)}
.photo img{width:100%;height:auto}
.photo.square img{aspect-ratio:1/1;object-fit:cover;object-position:center 18%}
.band{padding:40px 0}
.band p{font-size:18px;color:var(--ink-soft);max-width:66ch}
.band .sec-label{margin-bottom:10px}
.textlink{display:inline-block;margin-top:10px;font-weight:600;color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:4px;padding:6px 0}
.textlink:hover{color:var(--accent-deep)}

/* Forsidens tre døre: kategori, indhold, målgruppe, tekst og knap */
.doors{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:48px}
.door{background:var(--paper);border:1px solid var(--line);border-top:4px solid var(--accent);padding:30px 28px 28px;display:flex;flex-direction:column}
.door .sec-label{margin-bottom:12px}
.door p{color:var(--ink-soft);font-size:16.5px;margin:16px 0 26px;flex:1}
.door .door-sub{flex:none;margin:12px 0 0;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink)}
.door h3 a{display:block;line-height:1.3;color:inherit;text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:5px}
/* To workshops på samme kort: hver sin overskrift, med luft og en hårlinje imellem som i .list og .skema.
   Padding over linjen holder ringen i »Å« fri af understregningen ovenover */
.door h3 + h3{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.door h3 a:hover{color:var(--accent-deep)}
.door .btn{align-self:flex-start}
/* Valgsiden /foreninger har kun to døre */
.doors.to{grid-template-columns:repeat(2,minmax(0,1fr))}
/* Erhvervsdøren: linje + bookingknap, og linket til /erhverv ved siden af. Linjen må ikke få flex:1
   fra .door p, så skubber brødteksten stadig alt nedenunder til bunden af kortet */
.door .door-book{flex:none;margin:0 0 16px;color:var(--ink);font-weight:600}
.door-actions{display:flex;flex-wrap:wrap;gap:12px 14px}

/* Lille mellemrubrik over en liste */
.minihead{font-family:var(--body);font-weight:700;font-size:13px;line-height:1.4;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);margin-top:36px}
.minihead + .list{margin-top:14px}

/* Seasons-skema */
.skema{list-style:none;max-width:780px;margin-top:30px;border-top:2px solid var(--ink)}
.skema > li{padding:20px 0;border-bottom:1px solid var(--line);color:var(--ink-soft);font-size:17px}
.skema .tid{display:block;font-family:var(--display);text-transform:uppercase;font-size:clamp(20px,2.2vw,26px);line-height:1.15;color:var(--ink);letter-spacing:.01em}
.skema .titel{display:block;font-weight:600;color:var(--ink);margin-top:4px}
.skema .detaljer{display:block;margin-top:4px}
.skema .aflyst{display:inline-block;margin-top:8px;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--paper);background:var(--ink);padding:4px 10px}
.skema .btn{margin-top:14px}

/* Seasons: stort foto nederst i hero og en billedrække. Ensartet beskæring med object-fit,
   16:9 i hero på desktop og 4:3 på mobil. Rækken er otte kvadrater: fire og fire på desktop,
   to og to på mobil. Hold antallet deleligt med fire, ellers står den sidste række halv */
.hero .photo{margin-top:56px}
.photo.wide img{aspect-ratio:16/9;object-fit:cover;object-position:center 35%}
.galleri{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:56px}
.galleri img{width:100%;aspect-ratio:1/1;object-fit:cover;border:1px solid var(--line);background:var(--paper-2)}
@media(max-width:720px){
  .hero .photo{margin-top:40px}
  .photo.wide img{aspect-ratio:4/3}
  .galleri{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:40px}
}

/* ---------- Juridiske sider: /persondatapolitik og /forretningsbetingelser ----------
   Lang tekst, så overskrifterne er mindre end på salgssiderne, og h3/h4 er Archivo.
   Ankrene må ikke gemme sig under den klæbende nav (to rækker på mobil). */
.legal-hero{padding:72px 0 0}
.legal-hero h1{font-size:clamp(34px,6vw,80px);max-width:none}
.legal-meta{margin-top:22px;font-size:16px;color:var(--ink-soft)}
.legal{max-width:760px;padding:44px 0 112px;overflow-wrap:break-word}
/* Lange danske sammensætninger (»standardfortrydelsesformularen«) må deles i tabeller og på mobil, aldrig i links */
.legal td{-webkit-hyphens:auto;hyphens:auto}
.legal a{-webkit-hyphens:manual;hyphens:manual}
.legal [id]{scroll-margin-top:96px}
.legal p,.legal li{font-size:18px;color:var(--ink-soft)}
.legal p{margin-bottom:18px}
.legal strong{color:var(--ink);font-weight:600}
.legal a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:3px}
.legal a:hover{color:var(--accent-deep)}
.legal code{font-family:inherit;font-weight:600;color:var(--ink);background:var(--paper-2);padding:0 .3em}
.legal .udfyld{-webkit-box-decoration-break:clone;box-decoration-break:clone}
.legal h2{font-size:clamp(26px,3.2vw,38px);max-width:none;margin:64px 0 20px;padding-top:28px;border-top:1px solid var(--line)}
.legal h2.del{font-size:clamp(30px,4.2vw,52px);margin-top:96px;padding-top:30px;border-top:4px solid var(--ink)}
.legal > h2:first-child{margin-top:0}
.legal h3{font-family:var(--body);font-weight:700;text-transform:none;letter-spacing:0;font-size:21px;line-height:1.3;color:var(--ink);margin:44px 0 14px}
.legal h2 + h3{margin-top:28px}
.legal h4{font-family:var(--body);font-weight:700;font-size:18px;line-height:1.4;color:var(--ink);margin:26px 0 10px}
.legal ul{list-style:none;margin:0 0 20px}
.legal li{position:relative;padding-left:26px;margin-bottom:10px}
.legal li::before{content:"";position:absolute;left:0;top:.85em;width:12px;height:2px;background:var(--accent)}
.legal .btn{color:var(--paper);text-decoration:none}
.legal .btn:hover{color:var(--paper)}
.legal .bilag{border:1px solid var(--line);background:var(--paper-2);padding:30px 32px 14px;margin:56px 0}
.legal .bilag h3{margin-top:0}
.legal .tbl{margin:26px 0 30px}
.legal table{width:100%;border-collapse:collapse}
.legal th,.legal td{text-align:left;vertical-align:top;padding:14px 18px 14px 0;border-bottom:1px solid var(--line);font-size:16px;line-height:1.5;color:var(--ink-soft)}
.legal th:last-child,.legal td:last-child{padding-right:0}
.legal thead th{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);border-bottom:2px solid var(--ink)}
.legal td:first-child{color:var(--ink);font-weight:600}
@media(max-width:720px){
  .legal-hero{padding:52px 0 0}
  .legal{padding:32px 0 88px}
  .legal [id]{scroll-margin-top:128px}
  .legal p,.legal li{font-size:17px}
  .legal p,.legal li,.legal h3{-webkit-hyphens:auto;hyphens:auto}
  .legal .bilag{padding:22px 18px 6px;margin:44px 0}
  /* Tabellerne stables: hver række bliver en blok, og kolonnenavnet står over cellen */
  .legal thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
  .legal table,.legal tbody,.legal tr,.legal td{display:block;width:100%}
  .legal tr{padding:14px 0;border-bottom:1px solid var(--line)}
  .legal tbody tr:first-child{border-top:2px solid var(--ink)}
  .legal td{border:0;padding:2px 0}
  .legal td + td::before{content:attr(data-label);display:block;margin-top:8px;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
}

/* ---------- Footer (samme indhold som på erhvervssiden) ---------- */
footer{background:var(--ink);color:rgba(242,239,231,.72);padding:54px 0;font-size:14px}
footer .wrap{display:flex;justify-content:space-between;gap:18px 30px;flex-wrap:wrap;align-items:center}
/* Seasons: lodret holdfilm (9:16) ved siden af teksten om metoden. Smal på desktop, så den ikke
   strækkes, og stablet under teksten på mobil */
.holdfilm-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,380px);gap:64px;align-items:center}
.holdfilm{width:100%;max-width:380px;border:1px solid var(--line);background:var(--ink)}
.holdfilm video{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:cover}
@media(max-width:920px){
  .holdfilm-split{grid-template-columns:1fr;gap:36px}
  .holdfilm{max-width:340px}
}
/* Seasons: niveau-teksten med en lille boks om, hvem der deltager, ude til højre */
.niveau-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,360px);gap:56px;align-items:start;margin-top:28px}
.niveau-split .prose{margin-top:0}
.deltagere{background:var(--paper-2);border:1px solid var(--line);border-top:4px solid var(--accent);padding:26px 26px 24px}
.deltagere .minihead{margin-top:0}
.deltagere p{margin-top:12px;color:var(--ink-soft);font-size:16.5px;line-height:1.6}
@media(max-width:920px){
  .niveau-split{grid-template-columns:1fr;gap:32px}
  .deltagere{max-width:62ch}
}
footer .fm{font-family:var(--display);text-transform:uppercase;font-size:18px;color:var(--paper);letter-spacing:.05em}
footer .fm span{color:var(--accent)}
footer a{color:var(--paper);text-decoration:underline;text-decoration-color:rgba(242,239,231,.35);text-underline-offset:3px}
footer a:hover{text-decoration-color:var(--accent)}
footer .links a{display:inline-block;padding:4px 0}

/* ---------- Mobil ---------- */
@media(max-width:920px){
  section{padding:72px 0}
  .hero{padding:56px 0 64px}
  .split{grid-template-columns:1fr;gap:40px}
  .doors,.doors.to{grid-template-columns:1fr}
}
@media(max-width:720px){
  .wrap{padding:0 20px}
  nav.top .wrap{padding-top:10px;padding-bottom:2px}
  /* Tre etiketter på én linje fra ca. 367 px, når Archivo er hentet. Derfor preload af
     archivo-latin.woff2 i <head>: med systemfonten er etiketterne bredere */
  .navlinks{flex-basis:100%;column-gap:14px}
  .navlinks a{font-size:14px;letter-spacing:0;text-transform:none;padding:12px 0}
  /* Ankre (#skader, #vinterbad, #pris) må ikke lande under nav'en, der her har to rækker (ca. 94 px) */
  main section[id]{scroll-margin-top:100px}
}
@media(max-width:370px){
  /* og fra ca. 352 px. Herunder kan nav'en få tre rækker (ca. 140 px) */
  .navlinks{column-gap:12px}
  .navlinks a{font-size:13.5px}
  .legal [id]{scroll-margin-top:150px}
}
@media(max-width:420px){
  .btn{padding:14px 18px;font-size:12px;letter-spacing:.08em}
  .facts{flex-direction:column;align-items:flex-start}
}

/* Bevægelse slås fra, når brugeren har bedt om det */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important;transition-delay:0s!important;animation:none!important}
}