/* ══════════════════════════════════════════════════════════════════════════
   STIL — landingssiden.

   Alle øvrige styles står inline i index.html, præcis som i designet. Denne
   fil rummer kun det, en inline-style ikke kan udtrykke: skriften,
   sidens globale regler, indtoningen og hover-/fokus-tilstande.

   Skriften hentes IKKE udefra. De to WOFF2-filer under skrift/ er
   byte-identiske med dem, designfilen selv havde indlejret (samme
   underopdeling og samme unicode-range som Google Fonts leverer).
   Licens: SIL Open Font License 1.1, se skrift/OFL.txt.
   ══════════════════════════════════════════════════════════════════════════ */

/* latin-ext */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url("skrift/figtree-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url("skrift/figtree-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── Globalt — ordret fra designets egen <style>-blok ───────────────────── */
html{scroll-behavior:smooth}
body{margin:0;background:#f3f1ec;transition:background 400ms ease;color:#201e19;font-family:Figtree,system-ui,sans-serif;font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}
a{color:#2d5b46}a:hover{color:#1d3d2f}
input::placeholder{color:#635e50;opacity:1}

/* Skjulte elementer. Designet sætter display inline på næsten alt, og en
   inline-style slår browserens egen [hidden]-regel — uden !important ville en
   skjult sektion (fx formularen, når ventelisten er lukket) stadig blive vist.
   MÅLT i browseren 21. september 2026: uden denne linje viste siden BÅDE
   «Tilmeldingen åbner snart», hele formularen OG kvitteringen på én gang. */
[hidden]{display:none !important}
@media (prefers-reduced-motion: no-preference){
  html.u4-ton [data-ton]{opacity:0;transform:translateY(24px)}
  html.u4-ton [data-ton].u4-vis{opacity:1;transform:none;transition:opacity 600ms cubic-bezier(.22,.61,.36,1),transform 600ms cubic-bezier(.22,.61,.36,1)}
}

/* ── Hover og fokus ─────────────────────────────────────────────────────────
   Designet bar dem som style-hover="…" / style-focus="…", som kun
   Design-værktøjets runtime forstod. De er her omsat til rigtige CSS-regler,
   én klasse pr. unik erklæring. Erklæringerne er ordret som i designet.
   ── */
.kf1:focus-visible{outline:2px solid #2d5b46;outline-offset:2px}
.kh2:hover{color:#201e19}
.kh3:hover{color:#1d3d2f;text-decoration-color:#1d3d2f}
.kh4:hover{background:#1d3d2f;color:#fff}
.kh5:hover{color:#1d3d2f}
.kf6:focus-visible{outline:2px solid #2d5b46;outline-offset:3px}
.kh7:hover{color:#1d3d2f;border-color:#2d5b46}
.kf8:focus-visible{border-bottom-color:#201e19}
.kh9:hover:not(:disabled){background:#1d3d2f}

/* Knappen «Skriv mig op» er deaktiveret, indtil samtykkefeltet er krydset af.
   I designet var hover-farven lig med grundfarven i den tilstand, dvs. ingen
   synlig hover — :not(:disabled) ovenfor er præcis den regel. */

/* ── Spørgsmål og svar (C17c) ───────────────────────────────────────────────
   Browserens egne <details>/<summary>. Tastaturbetjeningen, rollen og
   åben/lukket-tilstanden kommer fra browseren — ingen JavaScript og ingen
   egne aria-attributter, der skulle holdes synkrone med virkeligheden.

   Svarene står i HTML'en, også mens de er lukkede, så en søgemaskine kan
   læse dem. Alle er lukkede fra start: der er intet `open`-attribut.

   Tegnet er et PLUS, der bliver et MINUS. Det er ét element, hvis to streger
   er tegnet med ::before og ::after — den vandrette står altid, den lodrette
   fjernes, når panelet er åbent. Så kan der ikke opstå en tilstand, hvor
   begge tegn er synlige på én gang. */
.sp{border-top:1px solid var(--kant)}
.sp-liste>li:last-child .sp{border-bottom:1px solid var(--kant)}
.sp-sp{list-style:none;cursor:pointer;padding:clamp(20px,2.4vw,28px) 0;
  display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.sp-sp::-webkit-details-marker{display:none}   /* Safari tegner ellers sin egen trekant */
.sp-sp>h3{flex:1 1 auto}
.sp-tegn{flex:0 0 auto;position:relative;width:20px;height:20px;margin-top:.35em}
.sp-tegn::before,.sp-tegn::after{content:"";position:absolute;background:#2d5b46}
.sp-tegn::before{left:0;top:9px;width:20px;height:2px}            /* vandret — står altid */
.sp-tegn::after{left:9px;top:0;width:2px;height:20px}             /* lodret — væk når åben */
.sp[open] .sp-tegn::after{display:none}
.sp-svar{padding:0 0 clamp(20px,2.4vw,28px);display:flex;flex-direction:column;gap:16px;max-width:62ch}
.sp-sp:hover>h3{color:#2d5b46}

/* Ingen bevægelse, når brugeren har slået den fra: hele reglen står inde i
   no-preference, præcis som indtoningen ovenfor. */
@media (prefers-reduced-motion: no-preference){
  .sp-tegn::before,.sp-tegn::after{transition:transform 180ms cubic-bezier(.22,.61,.36,1)}
  .sp[open] .sp-tegn::before{transform:rotate(180deg)}
}

/* ── Ventelisten (C17c del 2a) ──────────────────────────────────────────────
   Bot-fælden: et felt, kun en bot udfylder. Flyttet uden for skærmen frem for
   display:none, fordi nogle bots springer skjulte felter over. */
.u4-faelde{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}

/* Sporknapperne (Daniels beslutning 1 fra C17c del 1): mindre skrift under
   ca. 420 px. «Jeg har en virksomhed» havde 2,7 px luft ved 390 px.
   !important, fordi størrelsen står inline på knapperne, som i designet.
   Kun sporvælgeren i #spor — den fastgjorte sporpille er ikke rørt.
   MÅLT (C17c del 2a): ved 15 px ombrød «Jeg har en virksomhed» allerede fra
   375 px og ned. 14 px giver én linje med 12,9 px luft ved 390 px; 13 px
   under 380 px giver 16 px luft ved 375 px og én linje ned til 360 px. Under det må teksten ombryde inden for knappen,
   som designet tillader (min-height, ikke height) — én linje ved 320 px
   ville kræve under 12,5 px. */
@media (max-width:420px){ #spor [data-klik="vaelgIde"],#spor [data-klik="vaelgVirk"]{font-size:14px !important} }
@media (max-width:380px){ #spor [data-klik="vaelgIde"],#spor [data-klik="vaelgVirk"]{font-size:13px !important} }