/* Unflair designsystem, identitets-v5.3. Kanon: docs/IDENTITET.md. */
/* Identitets-v5: finesse-passet (docs/IDENTITET.md, Martins dom 14/7) paa
   det MIGREREDE 1:1-INDHOLD fra unflair.com (content/da/forside.md).
   Alle otte sektioner fra den rigtige forside, i v5's kompositionssprog:
   1 SKALA-MOD: video-casene baerer siden; V1 og V6 i fuld bredde, resten i
     asymmetriske par (7/5 og 5/7). Collagen komponeret, ikke stablet.
   2 BLOK-RYTME: papir -> billede -> papir -> collage -> papir -> NAVY
     (film-intro) -> papir (cases) -> ROSA kontakt-scene -> navy footer.
   3 AKTIV FARVE: rosa er kontakt-scenen; navy er film-introen + footer.
   4 KOMPONERET TOMRUM: alt forankret i samme 4/8-grid; intet sejler.
   5 MIKRO-FINESSE: ens handlings-links m. pil, rolig billed-zoom,
     reduced-motion respekteret. 6 MAALESTOK: internationale storefronts.
   Medier hotlinkes fra Shopify-CDN i eksempel-fladen (genhostes til R2
   foer cutover, jf. paritetstjeklisten). Indholdstekster er DATA og staar
   ordret som paa unflair.com. Kendt indholds-fund: outro-knappen hedder
   "kaffeknap" paa det rigtige site (pladsholder); her sat som den tiltaenkte
   kaffe-invitation, markeret i PR-beskrivelsen til Martins dom. */
:root{
  --uf-hvid:#FCFAF0;--uf-sort:#282524;--uf-navy:#06104A;--uf-rosa:#F7E0D7;
  --uf-gul:#F0E286;--uf-roed:#D30909;--uf-blaa:#85A9E4;--uf-graa:#6B6560;
  --uf-font-heading:"Lilita One",system-ui,sans-serif;
  --uf-font-body:"Montserrat",system-ui,sans-serif;
  --uf-t-xs:0.6875rem;
  --uf-t-sm:0.875rem;
  --uf-t-base:1.0625rem;
  --uf-t-lg:1.125rem;
  --uf-t-sektion:1.3125rem;
  --uf-t-h2:clamp(1.5rem, 1.35rem + 0.65vw, 2rem);
  --uf-t-display:clamp(2.35rem, 1.9rem + 2.1vw, 3.55rem);
  --uf-leading-display:1.08;--uf-leading-heading:1.12;--uf-leading-body:1.65;
  --uf-tracking-eyebrow:.14em;
  --uf-linje:1px solid rgba(40,37,36,.11);
  --uf-rum-2:8px;--uf-rum-3:12px;--uf-rum-4:16px;--uf-rum-5:24px;--uf-rum-6:32px;
  --uf-rum-7:48px;--uf-rum-8:64px;--uf-rum-9:96px;
  --uf-sektion:clamp(96px,9vw,140px);
  --uf-grid-maks:1200px;--uf-margin-side:clamp(24px,6vw,96px);
  --uf-radius-billede:8px;
  --uf-tid:150ms ease;
  --uf-tid-billede:450ms cubic-bezier(.22,.61,.36,1);
}
*{margin:0;padding:0;box-sizing:border-box}
body{background:var(--uf-hvid);color:var(--uf-sort);font-family:var(--uf-font-body);
  font-size:var(--uf-t-base);line-height:var(--uf-leading-body);font-weight:400}
img,video{display:block;max-width:100%}
.wrap{max-width:var(--uf-grid-maks);margin-inline:auto;padding-inline:var(--uf-margin-side)}
h1{font-family:var(--uf-font-heading);font-weight:400;letter-spacing:0}
h2,h3{font-weight:600;letter-spacing:0}
h2.titel{font-family:var(--uf-font-heading);font-weight:400}
a{color:var(--uf-navy);text-decoration-thickness:1.5px;text-underline-offset:3px;transition:color var(--uf-tid)}
a:hover{color:var(--uf-roed)}
:focus-visible{outline:2px solid var(--uf-navy);outline-offset:2px}
.paa-moerk a{color:var(--uf-hvid)}
.paa-moerk a:hover{color:var(--uf-rosa)}
.paa-moerk :focus-visible{outline-color:var(--uf-hvid)}
.eyebrow{font-size:var(--uf-t-xs);font-weight:600;text-transform:uppercase;
  letter-spacing:var(--uf-tracking-eyebrow);color:var(--uf-navy)}
.sektionstitel{font-size:var(--uf-t-sektion);font-weight:600;line-height:1.3;margin-top:var(--uf-rum-2)}
.skip{position:absolute;left:-999px}
.skip:focus{left:16px;top:16px;background:var(--uf-navy);color:var(--uf-hvid);padding:10px 18px;z-index:9}

/* Handlings-link: understregning + pil der flytter sig. Ens overalt. */
.handling{display:inline-flex;align-items:baseline;gap:10px;font-weight:600;text-decoration:none;
  font-size:var(--uf-t-sm);letter-spacing:.01em;
  border-bottom:1.5px solid currentColor;padding-bottom:3px}
.handling .pil{transition:transform var(--uf-tid);display:inline-block}
.handling:hover .pil{transform:translateX(6px)}
.handling[aria-disabled="true"]{opacity:.45;pointer-events:none}

/* Billed-ramme: fast rektangel, rolig zoom bagved. */
.billed{overflow:hidden;border-radius:var(--uf-radius-billede)}
.billed{height:auto}
.billed img{width:100%;height:100%;object-fit:cover;transition:transform var(--uf-tid-billede)}
.collage-grid .billed img{height:100%}
a:hover .billed img{transform:scale(1.025)}

header{position:sticky;top:0;z-index:20;background:transparent;
  border-bottom:var(--uf-linje); /* v8.2: altid synlig markering (Martins dom: toppen saa ufaerdig ud) */
  transition:transform .32s ease,background var(--uf-tid),border-color var(--uf-tid)}
header.scrollet{background:var(--uf-hvid);border-bottom:var(--uf-linje)}
header.skjult{transform:translateY(-101%)}
.header-flex{display:flex;align-items:center;justify-content:space-between;padding-block:20px}
.header-logo img{height:24px;width:auto}
nav{display:flex;align-items:center;gap:var(--uf-rum-6)}
nav a{font-size:13px;font-weight:600;text-decoration:none}
nav a[aria-current]{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:6px;text-decoration-color:var(--uf-roed)}

/* S1+S2: hero-tekst + fuldbredde-billede. */
.hero{padding-block:var(--uf-rum-9) 0}
.hero h1{font-size:var(--uf-t-display);line-height:var(--uf-leading-display);margin-top:10px;max-width:22ch}
.hero .manchet{font-size:var(--uf-t-lg);line-height:1.68;font-weight:400;color:var(--uf-graa);margin-top:18px;max-width:58ch}
.hero-handling{margin-top:28px}
.hero-foto{margin-top:var(--uf-rum-8)}
.hero-foto img{width:100%;aspect-ratio:16/7;object-fit:cover;
  object-position:var(--fokus,50% 20%);border-radius:var(--uf-radius-billede)}
@media (max-width:900px){.hero-foto img{aspect-ratio:4/3}}

.sektion{margin-top:var(--uf-sektion)}
.sektion-inner{border-top:var(--uf-linje);padding-top:var(--uf-rum-6);
  display:grid;grid-template-columns:4fr 8fr;gap:var(--uf-rum-8)}
.sektion .broedtekst{max-width:60ch}
.sektion .broedtekst + .broedtekst{margin-top:14px}
.sektion-handling{margin-top:28px}

/* S4: billedcollage, FORSKUDT komposition (kalibreret mod forsman.com:
   ulige stoerrelser + lodrette offsets; tomrummet ER kompositionen). */
.collage{margin-top:var(--uf-sektion)}
.collage-grid{display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--uf-rum-6)}
.collage-grid .billed:nth-child(1){grid-column:1/8;aspect-ratio:4/3}
.collage-grid .billed:nth-child(2){grid-column:9/13;aspect-ratio:3/4;margin-top:clamp(48px,7vw,110px)}
.collage-grid .billed:nth-child(3){grid-column:2/6;aspect-ratio:3/4;margin-top:clamp(-60px,-4vw,-24px)}
.collage-grid .billed:nth-child(4){grid-column:7/13;aspect-ratio:16/10;margin-top:clamp(56px,8vw,120px)}

/* S6: film-intro. Den ENE navy-flade og sidens andet Lilita-sted. */
.breaker{background:var(--uf-hvid);margin-top:var(--uf-sektion);padding-block:0;border-top:var(--uf-linje)}
.breaker{padding-block:var(--uf-rum-9)}
.breaker-eyebrow{color:var(--uf-graa);margin-bottom:14px}
.breaker .titel{font-family:var(--uf-font-heading);font-weight:400;letter-spacing:0;
  font-size:var(--uf-t-h2);line-height:var(--uf-leading-heading);color:var(--uf-sort);max-width:24ch}
.breaker .broedtekst{font-size:var(--uf-t-base);line-height:var(--uf-leading-body);
  color:var(--uf-sort);margin-top:18px;max-width:62ch}
.breaker .handling{color:var(--uf-navy);margin-top:28px}

/* S7: video-cases som FILMSTRIMMEL (kalibreret mod andco.dk 14/7:
   eet dominerende stage ad gangen, naboerne titter frem i kanterne,
   klient paa mediet, progress-linje 01—06 og Forrige/Naeste under).
   Loeser ogsaa par-hoejde-problemet: alle stages er 16:9. */
.strimmel{margin-top:var(--uf-rum-7);overflow:hidden}
.strimmel-spor{display:flex;align-items:center;gap:var(--uf-rum-5);transition:transform .55s cubic-bezier(.22,.61,.36,1);will-change:transform}
.stage{flex:0 0 auto;width:84%;min-width:0;position:relative;border-radius:var(--uf-radius-billede);
  overflow:hidden;background:var(--uf-sort);cursor:pointer;border:0;padding:0;appearance:none;
  transition:opacity .45s ease}
.stage img,.stage video{width:100%;aspect-ratio:var(--ratio,16/9);object-fit:cover;display:block}
.stage img{transition:transform var(--uf-tid-billede)}
.stage:hover img{transform:scale(1.015)}
/* Posters m. indbagte letterbox-bjaelker beskaeres ind, PRAECIST maalt
   pr. poster (Pillow-scan af raekker m. luminans<18): Sydbank 1.46,
   Saxo 1.31. Rene 16:9-posters roeres ikke. */
.stage.beskaer-bred img{transform:scale(1.50)}
.stage.beskaer-bred:hover img{transform:scale(1.52)}
.stage.beskaer-let img{transform:scale(1.32)}
.stage.beskaer-let:hover img{transform:scale(1.34)}
.stage:not(.aktiv){opacity:.45}
.stage:not(.aktiv):hover{opacity:.65}
.stage .scrim{position:absolute;inset:0;background:linear-gradient(to top, rgba(6,16,74,.45), rgba(6,16,74,0) 42%);
  display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding:22px 26px;pointer-events:none;
  transition:background var(--uf-tid)}
.stage:hover .scrim{background:linear-gradient(to top, rgba(6,16,74,.55), rgba(6,16,74,0) 46%)}
.stage .klient{color:var(--uf-hvid);font-weight:700;font-size:var(--uf-t-lg);line-height:1.2;text-align:left}
.stage .spil{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;
  background:rgba(252,250,240,.92);flex:none;transition:transform var(--uf-tid)}
.stage:hover .spil{transform:scale(1.1)}
.stage .spil svg{width:17px;height:17px;fill:var(--uf-navy);margin-left:2px}
.stage.spiller{cursor:default}
.stage.spiller .scrim{display:none}
.strimmel-nav{display:flex;align-items:center;justify-content:space-between;gap:var(--uf-rum-6);
  margin-top:var(--uf-rum-5)}
.strimmel-nav button{appearance:none;border:0;background:none;padding:6px 0;cursor:pointer;
  font:inherit;font-size:var(--uf-t-sm);font-weight:600;color:var(--uf-navy);
  display:inline-flex;align-items:baseline;gap:8px;transition:color var(--uf-tid)}
.strimmel-nav button:hover{color:var(--uf-roed)}
.strimmel-nav button:disabled{color:var(--uf-graa);opacity:.5;cursor:default}
.strimmel-nav .pil{transition:transform var(--uf-tid);display:inline-block}
.strimmel-nav button:not(:disabled):hover .pil-h{transform:translateX(5px)}
.strimmel-nav button:not(:disabled):hover .pil-v{transform:translateX(-5px)}
.fremdrift{display:flex;align-items:center;gap:14px;flex:1;max-width:340px;margin-inline:auto}
.fremdrift .nr{font-size:var(--uf-t-xs);font-weight:600;letter-spacing:var(--uf-tracking-eyebrow)}
.fremdrift .nu{color:var(--uf-sort)}
.fremdrift .alle{color:var(--uf-graa)}
.fremdrift .linje{position:relative;flex:1;height:1px;background:rgba(40,37,36,.18)}
.fremdrift .linje i{position:absolute;left:0;top:-0.5px;height:2px;background:var(--uf-navy);
  width:16.7%;transition:width .55s cubic-bezier(.22,.61,.36,1)}

/* S8: kontakt-scenen. Rosa fuldbredde m. navy typografi; haardt snit mod footer. */
.cta-scene{background:var(--uf-rosa);margin-top:var(--uf-sektion);padding-block:clamp(80px,9vw,128px)}
.breaker+.cta-scene{margin-top:0} /* navy filmscene gaar i haardt snit over i rosa — ingen papirstribe */
.cta-inner{display:grid;grid-template-columns:4fr 8fr;gap:var(--uf-rum-8)}
.cta-scene .cta-titel{font-size:var(--uf-t-h2);font-weight:600;line-height:1.25;color:var(--uf-navy);max-width:20ch}
.cta-handling-rk{margin-top:32px}
.cta-scene .handling{font-size:var(--uf-t-base);color:var(--uf-navy)}
.cta-scene .handling:hover{color:var(--uf-roed)}

footer{background:var(--uf-navy);color:var(--uf-hvid);padding-block:28px}
.footer-logo img{height:32px;width:auto}
.footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--uf-rum-8);
  margin-top:var(--uf-rum-7);padding-top:var(--uf-rum-5);border-top:1px solid rgba(252,250,240,.15);max-width:760px}
footer h3{font-family:var(--uf-font-body);font-size:var(--uf-t-xs);font-weight:600;text-transform:uppercase;
  letter-spacing:var(--uf-tracking-eyebrow);color:rgba(252,250,240,.6);margin-bottom:12px}
footer ul{list-style:none}
footer li{margin-bottom:10px;font-size:var(--uf-t-sm);line-height:1.55}
footer a{text-decoration:none}
footer a:hover{text-decoration:underline}
.footer-daemp{color:rgba(252,250,240,.72)}
.footer-bund{display:flex;justify-content:space-between;gap:var(--uf-rum-6);
  font-size:var(--uf-t-sm);color:rgba(252,250,240,.72);flex-wrap:wrap}

@media (max-width:900px){
  .sektion-inner,.cta-inner{grid-template-columns:1fr;gap:var(--uf-rum-6)}
  .collage-grid{grid-template-columns:1fr;row-gap:var(--uf-rum-6)}
  .collage-grid .billed{grid-column:1/-1 !important;margin-top:0 !important;aspect-ratio:3/2 !important}
  .footer-grid{grid-template-columns:1fr;gap:var(--uf-rum-5)}
  nav{gap:var(--uf-rum-4)}
  nav a{font-size:12px}
  /* Peek er meningsloes paa smaa skaerme (QA: 3px synlig nabo). Fuld
     bredde + swipe i stedet. */
  .stage{flex-basis:100%}
}
/* Touch-maal >=44px paa beroeringsskaerme (QA-fund). */
@media (pointer:coarse){
  .strimmel-nav button{padding:12px 6px}
  .handling{padding-block:8px}
  footer li a{display:inline-block;padding-block:6px}
}
.reveal{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease}
.reveal.synlig{opacity:1;transform:none}
/* U-FOLLOWER (Martins oenske 14/7, kalibreret mod &Co's cirkel-cursor):
   lille rosa cirkel m. bomaerket der vokser frem over klikbare elementer.
   Systemcursoren beholdes; kun desktop-pointere. */
#u-cursor{position:fixed;left:0;top:0;width:52px;height:52px;border-radius:50%;
  background:var(--uf-rosa);display:none;align-items:center;justify-content:center;
  pointer-events:none;z-index:99;transform:translate(-50%,-50%) scale(0);
  transition:transform .22s cubic-bezier(.34,1.4,.64,1);will-change:transform;
  box-shadow:0 2px 14px rgba(6,16,74,.18)}
#u-cursor svg{width:16px;height:16px;margin-left:2px}
#u-cursor.synlig{transform:translate(-50%,-50%) scale(1)}
@media (pointer:fine){#u-cursor{display:flex}}
@media (prefers-reduced-motion:reduce){
  .billed img,.handling .pil,.case-video img,.case-video .play span{transition:none}
  .reveal{opacity:1;transform:none;transition:none}
  #u-cursor{display:none !important}
}

/* v5.5 (Martins feedback paa live-sitet, 15/7): */
/* a) Film-intro og strimmel er EEN navy-scene. */
.breaker-strimmel{margin-top:var(--uf-rum-7)}
.paa-moerk .strimmel-nav button{color:var(--uf-hvid)}
.paa-moerk .strimmel-nav button:hover{color:var(--uf-rosa)}
.paa-moerk .strimmel-nav button:disabled{color:rgba(252,250,240,.4)}
.paa-moerk .fremdrift .nu{color:var(--uf-hvid)}
.paa-moerk .fremdrift .alle{color:rgba(252,250,240,.5)}
.paa-moerk .fremdrift .linje{background:rgba(252,250,240,.22)}
.paa-moerk .fremdrift .linje i{background:var(--uf-rosa)}
/* b) U-followeren ER play-affordancen paa medie-stages; statisk play-cirkel
   kun paa touch. Mindre og hurtigere follower, ingen stoej paa tekstlinks. */
@media (pointer:fine){.stage .spil{display:none}}
#u-cursor{width:44px;height:44px}
/* c) Diskret sprog-switch efter nav'en. */
nav .sprog{display:inline-flex;align-items:center;gap:10px;margin-left:var(--uf-rum-5);
  padding-left:var(--uf-rum-5);border-left:var(--uf-linje);
  font-size:var(--uf-t-xs);font-weight:600;letter-spacing:var(--uf-tracking-eyebrow)}
nav .sprog a{color:var(--uf-graa);text-decoration:none}
nav .sprog a:hover{color:var(--uf-roed)}
nav .sprog .aktiv{color:var(--uf-navy)}

/* v5.6: kontakt-detaljer + globale mikro-detaljer (Martins detalje-pas 15/7). */
::selection{background:var(--uf-rosa);color:var(--uf-navy)}
.handling-lille{font-size:var(--uf-t-sm);border-bottom-width:1.5px;padding-bottom:2px}
.portraet{aspect-ratio:4/5;max-width:420px}
.portraet img{height:100%}
.person-rolle{font-size:var(--uf-t-xs);font-weight:600;text-transform:uppercase;
  letter-spacing:var(--uf-tracking-eyebrow);color:var(--uf-graa);margin-top:10px}
.person-fakta{margin-top:var(--uf-rum-5);padding-top:var(--uf-rum-5);border-top:var(--uf-linje)}
.person-ex{font-size:var(--uf-t-sm);line-height:1.55;color:var(--uf-graa);max-width:52ch}
.person-kontaktlinje{margin-top:14px}
/* Formular i systemets haarlinje-sprog: aabne felter m. underkant, ikke bokse. */
.kontakt-form label{display:block;font-size:var(--uf-t-xs);font-weight:600;text-transform:uppercase;
  letter-spacing:var(--uf-tracking-eyebrow);color:var(--uf-navy);margin-bottom:6px}
.kontakt-form .felt{margin-bottom:var(--uf-rum-6)}
.kontakt-form input:not([type=hidden]),.kontakt-form textarea{appearance:none;-webkit-appearance:none;width:100%;padding:10px 2px;font:inherit;
  color:var(--uf-navy);background:transparent;border:0;border-radius:0;
  border-bottom:1px solid rgba(6,16,74,.28);transition:border-color var(--uf-tid)}
.kontakt-form input:not([type=hidden]):hover,.kontakt-form textarea:hover{border-bottom-color:rgba(6,16,74,.5)}
.kontakt-form input:not([type=hidden]):focus,.kontakt-form textarea:focus{outline:none;border-bottom:2px solid var(--uf-navy);padding-bottom:9px}
.kontakt-form textarea{resize:vertical;min-height:120px}
.kontakt-form button[type=submit]{appearance:none;border:0;cursor:pointer;font:inherit;font-weight:600;
  font-size:var(--uf-t-base);color:var(--uf-hvid);background:var(--uf-navy);
  padding:14px 28px;border-radius:999px;display:inline-flex;align-items:baseline;gap:10px;
  transition:background var(--uf-tid),transform var(--uf-tid)}
.kontakt-form button[type=submit] .pil{transition:transform var(--uf-tid);display:inline-block}
.kontakt-form button[type=submit]:hover{background:var(--uf-roed)}
.kontakt-form button[type=submit]:hover .pil{transform:translateX(5px)}

/* v5.7: SPACING-KLASSEN lukket (Martins fund paa /en/work/): sidens sidste
   sektion skal have luft foer footeren, MEDMINDRE den er en farvet scene
   (rosa/navy) der bevidst moeder footeren i et haardt snit. */
main > :last-child:not(.cta-scene):not(.breaker){margin-bottom:var(--uf-sektion)}

/* v5.9: kontaktlinje uden understregnings-klods (Martins fund): mail og
   telefon paa EEN linje i footerens sprog; kun farveskift ved hover. */
.person-kontakt{margin-top:16px;font-weight:600;font-size:var(--uf-t-base);display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.person-kontakt a{color:var(--uf-navy);text-decoration:none}
.person-kontakt a:hover{color:var(--uf-roed)}
.person-kontakt .skil{color:var(--uf-graa)}

/* v6.0: CINEMATISK HERO (Martins dom: det foerste man ser skal vaere film).
   21:9-band m. filmstill, meget langsom Ken Burns (start-skala 1.14 holder
   posterens indbagte letterbox-bjaelker ude af rammen), klient-credit paa
   scrim; klik ruller til filmscenen. BTS-billedet er flyttet til collagen. */
.hero-scene{position:relative;display:block;margin-top:var(--uf-rum-8);
  border-radius:var(--uf-radius-billede);overflow:hidden;background:var(--uf-sort)}
.hero-scene img{width:100%;aspect-ratio:21/9;object-fit:cover;display:block;
  animation:uf-kenburns 46s ease-in-out infinite alternate;will-change:transform}
@keyframes uf-kenburns{from{transform:scale(1.14) translateX(-0.5%)}to{transform:scale(1.23) translateX(0.7%)}}
.hero-scene::after{content:"";position:absolute;inset:0;
  background:linear-gradient(to top, rgba(6,16,74,.38), rgba(6,16,74,0) 34%)}
.hero-credit{position:absolute;left:26px;bottom:20px;z-index:1;
  font-size:var(--uf-t-xs);font-weight:600;text-transform:uppercase;
  letter-spacing:var(--uf-tracking-eyebrow);color:var(--uf-hvid)}
@media (max-width:900px){.hero-scene img{aspect-ratio:16/10}}
@media (prefers-reduced-motion:reduce){.hero-scene img{animation:none;transform:scale(1.16)}}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Collagens 5. element (BTS-billedet, brugt paa ny maade) */
.collage-grid .billed:nth-child(5){grid-column:3/10;aspect-ratio:16/9;margin-top:clamp(48px,7vw,110px)}

/* v6.1: citat-typografi uden fed-kursiv-klods (Martins kalibrering). */
.citat p{font-size:var(--uf-t-lg);font-weight:400;font-style:normal;line-height:1.62;color:var(--uf-navy);max-width:58ch}
.citat-afsender{margin-top:20px;font-size:var(--uf-t-sm) !important;line-height:1.55;font-weight:400}
.citat-afsender strong{font-weight:600}

/* v6.2: SPLIT-HERO (Martins dom): tekst venstre, BTS-billedet hoejrestillet,
   een samlet blok. Fokuspunkt sat eksplicit saa ansigterne aldrig klippes. */
.hero-grid{display:grid;grid-template-columns:7fr 5fr;gap:var(--uf-rum-8);align-items:center}
.hero-tekst .manchet{max-width:52ch}
.hero-billede{aspect-ratio:4/5;max-height:560px}
.hero-billede img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr;gap:var(--uf-rum-6)}
  .hero-billede{aspect-ratio:3/2;max-height:none}
}

/* v6.3: HERO-FILMEN (Martins beslutning): seneste film, lydloest loop,
   klik giver lyd og kontroller. Credit-linje under i eyebrow-stil. */
.hero-grid{grid-template-columns:6fr 6fr}
.hero-film{appearance:none;border:0;padding:0;width:100%;display:block;position:relative;
  border-radius:var(--uf-radius-billede);overflow:hidden;background:var(--uf-sort);cursor:pointer}
.hero-film video{width:100%;aspect-ratio:1.897;object-fit:cover;display:block}
.hero-film .spil-hint{position:absolute;right:16px;bottom:16px;display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:50%;background:rgba(252,250,240,.9);transition:transform var(--uf-tid),opacity var(--uf-tid)}
.hero-film .spil-hint svg{width:15px;height:15px;fill:var(--uf-navy);margin-left:2px}
.hero-film:hover .spil-hint{transform:scale(1.1)}
.hero-film.lyd .spil-hint{opacity:0;pointer-events:none}
.hero-film-credit{margin-top:12px;font-size:var(--uf-t-xs);font-weight:600;text-transform:uppercase;
  letter-spacing:var(--uf-tracking-eyebrow);color:var(--uf-graa)}
@media (prefers-reduced-motion:reduce){.hero-film video{display:block}}

/* v6.4: hero-filmen i fuld bredde under teksten (Martins dom: nu hvor det
   er film, hoerer den hjemme dernede). Cinematisk 21:9-loop der klapper ud
   til aegte 16:9 naar lyden slaas til; video toner ind over posteren. */
.hero-film{margin-top:var(--uf-rum-8);overflow:hidden;
  transition:max-height .65s cubic-bezier(.22,.61,.36,1)}
.hero-film video{aspect-ratio:16/9;opacity:0;
  transition:opacity .6s ease,margin-top .65s cubic-bezier(.22,.61,.36,1)}
.hero-film video.klar{opacity:1}
.hero-film .spil-hint svg{margin-left:0}
.hero-film-linje{display:flex;align-items:baseline;justify-content:space-between;gap:var(--uf-rum-5);margin-top:12px}
.hero-film-hint{font-size:var(--uf-t-xs);font-weight:600;text-transform:uppercase;
  letter-spacing:var(--uf-tracking-eyebrow);color:var(--uf-graa);transition:opacity var(--uf-tid)}
.hero-film.lyd + .hero-film-linje .hero-film-hint{opacity:0}
@media (max-width:900px){.hero-film video{aspect-ratio:16/9}}

/* v6.5: hover-preview paa filmflader (finesse-sproget fra heroen, doseret):
   hover paa aktiv/solo-stage = lydloest loop bag posteren; klik = lyd.
   Preview-videoen ligger bag posteren og toner ind naar den er klar. */
.stage .preview{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .45s ease}
.stage.smugkig img{opacity:0}
.stage.smugkig .preview{opacity:1}
.stage img{transition:opacity .45s ease,transform var(--uf-tid-billede)}
@media (prefers-reduced-motion:reduce){.stage .preview{display:none}}

/* v6.7: ORIGINALFORMATER (Martins idé): hver film vises i sit aegte format,
   maalt fra posterens indbaggede soejler/bjaelker (docs/FORMAT_MANIFEST).
   Strimlen koerer blandede formater i SAMME hoejde som en aegte filmstrimmel
   (bredder saettes af JS ud fra data-ratio). Solo-film faar naturlig bredde. */
.case-blok .stage{width:min(100%,calc(min(62vh,540px)*var(--ratio,1.7778)))}
.stage .preview{aspect-ratio:var(--ratio,16/9)}
/* Citat-kontrast: farven arves af scenen (var usynlig navy-paa-navy). */
.citat p{color:inherit}
.paa-moerk .citat p{color:var(--uf-hvid)}
.paa-moerk .citat-afsender{color:rgba(252,250,240,.85)}
.paa-moerk .citat-afsender strong{color:var(--uf-hvid)}

/* v6.8: kaffe-scenen. */
.kaffe-inner{display:flex;flex-direction:column;align-items:center;text-align:center}
.kaffe-scene .cta-titel{margin:0}
.kaffe-handling{margin:34px 0 0}
.kaffe-ikon{width:72px;color:var(--uf-navy);margin-bottom:22px;will-change:transform}
.kaffe-ikon svg{display:block;width:100%;height:auto}
.damp path{opacity:0;animation:uf-damp 3.2s ease-in-out infinite}
.damp path:nth-child(2){animation-delay:1.4s}
@keyframes uf-damp{0%{opacity:0;transform:translateY(5px)}25%{opacity:.75}60%{opacity:.2}100%{opacity:0;transform:translateY(-9px)}}
.kaffeknap{display:inline-block;padding:13px 32px;border:1.5px solid var(--uf-navy);border-radius:999px;
  color:var(--uf-navy);font-weight:600;font-size:1.0625rem;line-height:1;text-decoration:none;
  transition:background .25s ease,color .25s ease}
.kaffeknap:hover{background:var(--uf-navy);color:var(--uf-rosa)}
@media (prefers-reduced-motion:reduce){.damp path{animation:none;opacity:.5}}

/* v6.9: ekspertise som nummererede raekker (forside) — flugter med sektionernes 4/8-spor. */
.ekspertise{margin-top:var(--uf-sektion)}
.disciplin-liste{list-style:none;margin:var(--uf-rum-3) 0 0;padding:0}
.disciplin{display:grid;grid-template-columns:4fr 8fr;gap:var(--uf-rum-8);
  align-items:start;padding-block:clamp(28px,3.5vw,40px);border-top:var(--uf-linje)}
.disciplin-nr{display:block;font-size:var(--uf-t-xs);font-weight:600;letter-spacing:var(--uf-tracking-eyebrow);color:var(--uf-graa)}
.disciplin-titel{font-size:clamp(1.375rem,1.1rem+1.2vw,1.875rem);font-weight:500;line-height:1.25;
  color:var(--uf-navy);margin:4px 0 0;max-width:16ch}
.disciplin .broedtekst{margin:0;max-width:62ch}

/* v6.9: kontaktsidens brev-hero — portraet + brevet der skrives til dig. */
.sr-kun{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}
.brev-layout{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);
  gap:clamp(36px,6vw,96px);align-items:center;margin-top:var(--uf-rum-2)}
.brev-tekst .broedtekst{font-size:1.0625rem;line-height:1.7}
.brev-tekst .broedtekst{max-width:56ch}
.brev-tekst .broedtekst+.broedtekst{margin-top:14px}
.brev-foto img{width:100%;height:auto;aspect-ratio:1;object-fit:cover}
.skjult-rest{visibility:hidden}
.skrive-cursor{display:inline-block;width:2px;height:1em;background:var(--uf-navy);
  vertical-align:-0.12em;margin-left:1px;opacity:1;transition:opacity .5s ease}
.skrive-cursor.blink{animation:uf-blink 1.06s steps(1) infinite}
.skrive-cursor.slut{opacity:0}
@keyframes uf-blink{0%,100%{opacity:1}50%{opacity:0}}
.brev-underskrift{margin-top:26px;display:flex;flex-direction:column;gap:4px}
.brev-underskrift strong{font-weight:600;color:var(--uf-navy)}
.brev-rolle{font-size:var(--uf-t-xs);font-weight:600;text-transform:uppercase;
  letter-spacing:var(--uf-tracking-eyebrow);color:var(--uf-graa)}
.brev-tekst.skriver .brev-underskrift{opacity:0;transform:translateY(8px)}
.brev-tekst.skriver .brev-underskrift.vis{opacity:1;transform:none;
  transition:opacity .8s ease,transform .8s ease}
.stifter-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,88px);
  border-top:var(--uf-linje);padding-top:var(--uf-rum-6)}
.stifter-navn{font-size:var(--uf-t-sektion);font-weight:600;line-height:1.3;margin:0}
.stifter .person-rolle{margin-top:6px}
.stifter .broedtekst{margin:16px 0 0;max-width:44ch}
.stifter .person-kontakt{margin-top:18px}
@media (max-width:900px){
  .brev-layout,.stifter-grid,.disciplin{grid-template-columns:1fr}
  .brev-foto{order:-1;max-width:420px}
  .disciplin-titel{max-width:none}
}

/* v6.9.3: kontaktsidens fakta-raekke flugter med stifter-gridets spor; balanceret bio-ombrydning. */
.fakta-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,88px);
  border-top:var(--uf-linje);padding-top:var(--uf-rum-6)}
.fakta-eyebrow{font-size:var(--uf-t-xs);font-weight:600;text-transform:uppercase;
  letter-spacing:var(--uf-tracking-eyebrow);color:var(--uf-graa);margin:0 0 8px}
.fakta-grid .broedtekst{margin:0}
.fakta-handling{margin-top:16px}
.stifter .broedtekst{text-wrap:pretty}
@media (max-width:900px){.fakta-grid{grid-template-columns:1fr;gap:var(--uf-rum-5)}}

/* v6.9.5: film-scenens intro i sidens 4/8-spor — titlen ejer scenen, manchetten daempes. */
.breaker-intro{display:grid;grid-template-columns:4fr 8fr;gap:var(--uf-rum-8);align-items:start}
.breaker-intro .titel{margin:0}
.breaker-intro .broedtekst{color:var(--uf-sort);max-width:52ch;margin:0}
.breaker-handling-rk{margin:26px 0 0}
@media (max-width:900px){.breaker-intro{grid-template-columns:1fr;gap:var(--uf-rum-5)}}

/* v7.0.1: mobil-header — luft mellem logo og nav (logo+Hjem stoedte sammen paa 390px). */
@media (max-width:640px){
  .header-flex{gap:16px}
  nav{gap:14px;flex-wrap:nowrap}
  nav .sprog{margin-left:8px;gap:8px}
  .header-logo img{height:20px}
}

/* ============ v7.2: STILLS-GALLERI (justified, aegte formater) ============ */
.galleri-sektion{margin-top:var(--uf-sektion)}
.galleri-sektion .sektion-handling{margin-top:var(--uf-rum-4)}
/* v7.4: horisontalt scroll-spor — hvert billede i sit aegte format */
.galleri-scroll{display:flex;gap:14px;overflow-x:auto;overscroll-behavior-x:contain;
  scroll-snap-type:x proximity;margin-top:var(--uf-rum-7);padding-bottom:6px;
  scrollbar-width:none;-webkit-overflow-scrolling:touch}
.galleri-scroll::-webkit-scrollbar{display:none}
.galleri-billed{position:relative;flex:0 0 auto;border:0;padding:0;background:none;
  height:clamp(240px,30vw,400px);aspect-ratio:var(--ratio,3/2);scroll-snap-align:start;
  border-radius:var(--uf-radius-billede);overflow:hidden;cursor:pointer;display:block}
.galleri-billed img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform var(--uf-tid-billede)}
.galleri-billed:hover img{transform:scale(1.025)}
.galleri-billed .g-scrim{position:absolute;inset:0;display:flex;align-items:flex-end;
  padding:14px;background:linear-gradient(to top, rgba(6,16,74,.5), rgba(6,16,74,0) 44%);
  opacity:0;transition:opacity var(--uf-tid)}
.galleri-billed:hover .g-scrim,.galleri-billed:focus-visible .g-scrim{opacity:1}
.galleri-billed .g-klient{color:var(--uf-hvid);font-size:var(--uf-t-sm);font-weight:700;text-align:left}

/* Lysboks: faelles fremviser (galleri + OOH) */
.lysboks{position:fixed;inset:0;z-index:90;background:rgba(6,16,74,.96);
  display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;transition:opacity .28s ease}
.lysboks.aaben{opacity:1;pointer-events:auto}
.lysboks figure{margin:0;display:flex;flex-direction:column;align-items:center;max-width:88vw}
.lysboks img{max-width:88vw;max-height:78vh;border-radius:var(--uf-radius-billede);
  box-shadow:0 30px 90px rgba(0,0,0,.45)}
.lysboks-tekst{margin-top:16px;display:flex;gap:14px;align-items:baseline;
  color:rgba(252,250,240,.9);font-size:var(--uf-t-sm)}
.lysboks-tekst .lb-klient{font-weight:700}
.lysboks-tekst .lb-nr{color:rgba(252,250,240,.55);font-variant-numeric:tabular-nums}
.lysboks-luk{position:absolute;top:18px;right:22px;width:48px;height:48px;border:0;
  background:none;color:rgba(252,250,240,.85);font-size:34px;line-height:1;cursor:pointer;
  transition:color var(--uf-tid)}
.lysboks-luk:hover{color:var(--uf-hvid)}
.lysboks-pil{position:absolute;top:50%;transform:translateY(-50%);width:56px;height:56px;
  border:1px solid rgba(252,250,240,.35);border-radius:50%;background:none;
  color:var(--uf-hvid);font-size:20px;cursor:pointer;transition:background var(--uf-tid),border-color var(--uf-tid)}
.lysboks-pil:hover{background:rgba(252,250,240,.12);border-color:rgba(252,250,240,.6)}
.lysboks-pil.venstre{left:clamp(10px,3vw,40px)}
.lysboks-pil.hoejre{right:clamp(10px,3vw,40px)}
@media(max-width:640px){.lysboks-pil{display:none}.lysboks img{max-width:94vw}}

/* ============ v7.2: NAVY-UNIVERSETS KAPITLER (film / native / OOH) ============ */
.breaker-kapitel{margin-top:var(--uf-rum-9);padding-top:var(--uf-rum-9);
  border-top:var(--uf-linje)}

/* ============ v7.2: OOH — bagbelyste abribus-paneler ============ */
.ooh-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--uf-rum-6);
  margin-top:var(--uf-rum-7)}
.ooh-panel{border:0;padding:0;background:none;cursor:pointer;text-align:left}
.ooh-panel .ooh-ramme{position:relative;border-radius:6px;overflow:hidden;
  box-shadow:0 0 0 1px rgba(40,37,36,.08), 0 18px 60px rgba(40,37,36,.14);
  transition:transform var(--uf-tid-billede),box-shadow var(--uf-tid-billede)}
.ooh-panel:hover .ooh-ramme{transform:translateY(-6px);
  box-shadow:0 0 0 1px rgba(40,37,36,.12), 0 26px 80px rgba(40,37,36,.2)}
.ooh-panel img{width:100%;aspect-ratio:677/1000;object-fit:cover;display:block}
.ooh-klient{display:block;margin-top:12px;color:var(--uf-graa);
  font-size:var(--uf-t-xs);letter-spacing:var(--uf-tracking-eyebrow);text-transform:uppercase}
@media(max-width:900px){.ooh-grid{grid-template-columns:1fr 1fr;gap:var(--uf-rum-5)}}

/* ============ v7.3: FOTO-BREAKER — seniorkompetencer taet paa ============ */
/* 4Z3A6005 (Mimosa-BTS). Baand 2.2 m. anker 40% er MAALT: kamera-rig og
   begge personer bevaret. Mobil faar det fulde 3:2-format. */
.foto-breaker{margin-top:var(--uf-sektion)}
.foto-breaker figure{margin:0}
.foto-breaker img{width:100%;aspect-ratio:2.2;object-fit:cover;object-position:50% 40%;
  border-radius:var(--uf-radius-billede);display:block}
@media(max-width:640px){.foto-breaker img{aspect-ratio:3/2}}

/* ============ v7.7: FILM I GALLERI-SPROGET (Martins dom: stills-visningen
   er sproget) — konstant hoejde, aegte formater, konstant mellemrum,
   horisontal scroll. Mouseover = lydloes preview; klik = lyd + kontroller. */
.film-galleri .galleri-billed{cursor:pointer}
.film-galleri video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .35s ease}
.film-galleri .galleri-billed.spiller video{opacity:1}
.film-galleri .g-scrim{opacity:1;justify-content:space-between;align-items:flex-end}
.film-galleri .g-spil{display:flex;align-items:center;justify-content:center;
  width:48px;height:48px;border-radius:50%;background:var(--uf-hvid);
  transition:opacity var(--uf-tid),transform var(--uf-tid)}
.film-galleri .g-spil svg{width:15px;height:15px;fill:var(--uf-navy);margin-left:2px}
.film-galleri .galleri-billed:hover .g-spil{transform:scale(1.08)}
.film-galleri .galleri-billed.lyd .g-scrim{opacity:0;pointer-events:none}

/* v7.7b: hoejformat i eget udtryk — native-films faar telefonens form:
   afrundet, moerk ramme, gloed. Samme spor-sprog (konstant hoejde/gap). */
.native-galleri .galleri-billed{height:clamp(320px,36vw,500px);border-radius:30px;
  border:7px solid #0b0f26;
  box-shadow:none}
.native-galleri .galleri-billed img,.native-galleri video{border-radius:22px}
.native-galleri .g-scrim{border-radius:22px}

/* ============ v8.0: RADIO — lydboelge-scene i navy-universet ============ */
.radio-scene{margin-top:var(--uf-rum-7)}
.radio-boelge{display:block;width:100%;height:clamp(180px,24vw,280px);cursor:pointer}
.radio-spots{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--uf-rum-5);
  margin-top:var(--uf-rum-6)}
.radio-spot{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:4px;
  padding:22px 22px 20px;border:1px solid rgba(40,37,36,.18);border-radius:var(--uf-radius-billede);
  background:none;cursor:pointer;overflow:hidden;text-align:left;
  transition:border-color var(--uf-tid),transform var(--uf-tid)}
.radio-spot:hover{border-color:rgba(40,37,36,.4);transform:translateY(-2px)}
.radio-spot.spiller{border-color:var(--uf-blaa)}
.radio-fyld{position:absolute;inset:0;width:0;background:linear-gradient(to right, rgba(133,169,228,.35), rgba(133,169,228,.18))}
.radio-spot>*:not(.radio-fyld){position:relative}
.radio-top{display:flex;align-items:center;justify-content:space-between;width:100%;margin-bottom:10px}
.radio-spil{display:flex;align-items:center;justify-content:center;width:40px;height:40px;
  border-radius:50%;background:var(--uf-navy);transition:transform var(--uf-tid)}
.radio-spot:hover .radio-spil{transform:scale(1.08)}
.radio-spil svg{width:13px;height:13px;fill:var(--uf-hvid)}
.radio-spil .pause{display:none}
.radio-spot.spiller .radio-spil .spil-ikon{display:none}
.radio-spot.spiller .radio-spil .pause{display:block}
.radio-meta{display:flex;flex-direction:column;gap:2px;color:var(--uf-sort)}
.radio-meta strong{font-size:var(--uf-t-lg);font-weight:700}
.radio-meta span{color:var(--uf-graa);font-size:var(--uf-t-sm)}
.radio-tid{color:var(--uf-graa);font-size:var(--uf-t-sm);font-variant-numeric:tabular-nums}
@media(max-width:760px){
  .radio-spots{grid-template-columns:1fr;gap:12px}
  .radio-spot{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:14px 16px}
  .radio-top{display:contents}
  .radio-spil{order:1;width:38px;height:38px}
  .radio-meta{order:2;gap:0}
  .radio-meta strong{font-size:var(--uf-t-base)}
  .radio-tid{order:3}
}

/* v8.1: kontaktform — honeypot skjult + statusbesked */
.felt-hp{position:absolute;left:-9999px;opacity:0;pointer-events:none}
.form-status{display:none;margin-top:14px;font-size:var(--uf-t-sm)}
.form-status.vis{display:block}
.form-status.ok{color:var(--uf-navy);font-weight:600}
.form-status.fejl{color:var(--uf-roed)}
.kontakt-form button[disabled]{opacity:.55;cursor:wait}


/* ============ v8.2: MOBIL-PAS (Martins fund: bjaelker, flydende labels) ============ */
@media(max-width:640px){
  .hero-film-linje{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
  .hero-film-credit,.hero-film-hint{font-size:0.625rem;letter-spacing:.08em;white-space:nowrap}
  .hero-film-credit{overflow:hidden;text-overflow:ellipsis}
  .galleri-billed{height:clamp(200px,52vw,280px)}
  .native-galleri .galleri-billed{height:clamp(340px,96vw,440px)}
  .radio-boelge{height:150px}
  .lysboks-tekst{padding-inline:16px;text-align:center}
}

/* v8.2: undersidernes luft mellem hero og foerste sektion (Martins fund) */
.hero+.sektion,.hero+section.sektion{margin-top:clamp(48px,6vw,72px)}

/* v8.5: aktiv afspilning viser ALTID hele billedet (iOS-cover-quirk +
   ratio-mismatch-sikkerhed). Preview-hover beholder cover. */
.film-galleri .galleri-billed.lyd video{object-fit:contain;background:#000}

/* v9.0: en spillende film maa ALDRIG vaere beskaaret (Martins krav).
   Brikker kan vaere bredere end sporet (fast hoejde x ratio) — i lyd-mode
   kappes brikken til sporets bredde, saa hele filmen staar paa skaermen
   (contain-reglen ovenfor matter den paa sort). */
.film-galleri .galleri-billed.lyd{max-width:100%}


/* v8.6: mobil-finpuds (Martins fund) */
@media(max-width:640px){
  .hero{padding-block:40px 0}
  .stifter-grid{grid-template-columns:1fr;gap:0}
  .stifter-grid>div{padding-block:26px;border-top:var(--uf-linje)}
  .stifter-grid>div:first-child{border-top:0;padding-top:4px}
}

/* ============ v8.8: BURGERMENU paa mobil ============ */
.burger{display:none;flex-direction:column;justify-content:center;gap:5px;
  width:44px;height:44px;padding:10px;border:0;background:none;cursor:pointer}
.burger span{display:block;height:2px;background:var(--uf-navy);border-radius:2px;
  transition:transform .25s ease,opacity .2s ease}
@media(max-width:640px){
  .burger{display:flex}
  .header-flex nav{display:none}
  header.menu-aaben .header-flex nav{display:flex;flex-direction:column;align-items:flex-start;
    gap:20px;position:absolute;top:100%;left:0;right:0;background:var(--uf-hvid);
    border-bottom:var(--uf-linje);padding:28px var(--uf-margin-side) 32px;
    font-size:1.35rem;font-weight:600}
  header.menu-aaben .header-flex nav .sprog{margin-left:0;margin-top:6px;font-size:1rem}
  header.menu-aaben .burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  header.menu-aaben .burger span:nth-child(2){opacity:0}
  header.menu-aaben .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}

/* v8.8: logostribe paa Arbejde — kunder ensfarvet i graabrun, horisontal scroll */
.logo-strimmel{display:flex;align-items:center;gap:clamp(36px,5vw,64px);
  overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
  margin-top:var(--uf-rum-7);padding-block:6px}
.logo-strimmel::-webkit-scrollbar{display:none}
.logo-strimmel img{height:30px;width:auto;flex:0 0 auto;opacity:.9}
@media(max-width:640px){.logo-strimmel img{height:24px}.logo-strimmel{gap:32px}}


/* v8.8: mobil-luft-pas (Martins mandat: knivskarp luft overalt) — stakkede
   4/8-grids skal IKKE arve desktop-gap; overskrift og broedtekst hoerer sammen. */
@media(max-width:900px){
  .disciplin{gap:18px}
  .sektion-inner{gap:18px}
  .hero-film video{aspect-ratio:1.897}
}
@media(max-width:640px){
  .sektion{margin-top:clamp(64px,14vw,96px)}
  .sektion-inner{padding-top:24px}
  .breaker-kapitel{margin-top:56px;padding-top:56px}
  .breaker{padding-block:56px}
}