@font-face { font-family: Barlow; font-weight: 400; font-display: swap; src: url(/skrifter/barlow-latin-400-normal.woff2) format('woff2'); }
@font-face { font-family: Barlow; font-weight: 500; font-display: swap; src: url(/skrifter/barlow-latin-500-normal.woff2) format('woff2'); }
@font-face { font-family: Barlow; font-weight: 600; font-display: swap; src: url(/skrifter/barlow-latin-600-normal.woff2) format('woff2'); }
@font-face { font-family: 'Barlow Condensed'; font-weight: 600; font-display: swap; src: url(/skrifter/barlow-condensed-latin-600-normal.woff2) format('woff2'); }
@font-face { font-family: 'Barlow Condensed'; font-weight: 700; font-display: swap; src: url(/skrifter/barlow-condensed-latin-700-normal.woff2) format('woff2'); }
:root {
--rosa: #C63D67; --rosa-dyb: #A62F53; --rosa-moerk: #7E2240; --rosa-lys: #EEE7DA; --rosa-paa-moerk: #F2B8CA;
--skifer: #36494F; --skifer-dyb: #26363B; --svag: #5B6B70; --paa-moerk: #E3EAEC;
--papir: #F7F3EB; --hvid: #FFFFFF; --linje: #E5DED0; --kant: #8A999D;
--titel: 'Barlow Condensed', 'Arial Narrow', sans-serif; --tekst: Barlow, system-ui, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 24px; }
body { margin: 0; font-family: var(--tekst); font-size: 18px; line-height: 1.55; color: var(--skifer); background: var(--papir); -webkit-text-size-adjust: 100%; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--rosa-dyb); } a:hover { color: var(--rosa-moerk); }
:focus-visible { outline: 3px solid var(--rosa); outline-offset: 3px; border-radius: 4px; }
h1, h2, h3 { color: var(--skifer-dyb); margin: 0; }
h1, h2, .titel { font-family: var(--titel); font-weight: 700; line-height: 1.02; }
h1 { font-size: clamp(42px, 5.6vw, 74px); letter-spacing: -0.01em; }
h2 { font-size: clamp(34px, 4.2vw, 52px); }
h3 { font-size: 22px; font-weight: 600; line-height: 1.25; }
p { margin: 0 0 16px; } p:last-child { margin-bottom: 0; }
ul { margin: 0 0 16px; padding-left: 22px; } li { margin-bottom: 6px; }
.hop { position: absolute; left: -9999px; } .hop:focus { left: 16px; top: 16px; background: var(--hvid); padding: 12px 16px; z-index: 10; }
.wrap { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.smal { max-width: 860px; }
.sektion { padding-top: 88px; } .sektion-sidst { padding-bottom: 96px; }
.hat { font-size: 15px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--rosa-dyb); margin: 0 0 10px; }
.indledning { font-size: 21px; line-height: 1.45; max-width: 680px; }
.under-h2 { font-size: 20px; max-width: 680px; margin: 12px 0 0; }
.h2-luft { margin-bottom: 40px; }
.knap, .knap-2, .knap-hvid { display: inline-block; font: 600 19px/1.2 var(--tekst); text-decoration: none; padding: 16px 28px; border-radius: 6px; border: 2px solid transparent; cursor: pointer; text-align: center; }
.knap { background: var(--rosa); color: var(--hvid); } .knap:hover { background: var(--rosa-dyb); color: var(--hvid); }
.knap-2 { background: var(--hvid); color: var(--skifer); border-color: var(--skifer); } .knap-2:hover { background: var(--skifer); color: var(--hvid); }
.knap-hvid { background: var(--hvid); color: var(--skifer-dyb); } .knap-hvid:hover { background: var(--rosa-lys); color: var(--skifer-dyb); }
.knapper { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 8px; }
.pil { font-weight: 600; color: var(--rosa-dyb); }
.top { background: var(--hvid); border-bottom: 1px solid var(--linje); }
.top .wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; padding-top: 10px; padding-bottom: 10px; }
.logo img { width: 150px; height: auto; }
.menu { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 26px; font-weight: 500; font-size: 17px; }
.menu a { color: var(--skifer); text-decoration: none; padding: 12px 0; border-bottom: 2px solid transparent; }
.menu a:hover, .menu a[aria-current] { color: var(--skifer-dyb); border-bottom-color: var(--rosa); }
.top-hoejre { display: flex; align-items: center; gap: 18px; }
.sprog { display: flex; gap: 4px; font-size: 15px; font-weight: 600; }
.sprog a { color: var(--svag); text-decoration: none; padding: 12px 6px; border-bottom: 2px solid transparent; }
.sprog a[aria-current] { color: var(--skifer); border-bottom-color: var(--rosa); }
.top .knap { font-size: 17px; padding: 12px 20px; }
.menuknap { display: none; font: 600 17px var(--tekst); background: var(--hvid); color: var(--skifer); border: 2px solid var(--skifer); border-radius: 6px; padding: 10px 16px; cursor: pointer; }
@media (max-width: 1040px) {
.menuknap { display: inline-block; }
.menu { display: none; order: 5; width: 100%; flex-direction: column; align-items: stretch; gap: 0; padding-bottom: 8px; }
.menu.aaben { display: flex; }
.menu a { padding: 14px 0; border-bottom: 1px solid var(--linje); }
}
@media (max-width: 560px) { .top .knap { display: none; } .logo img { width: 124px; } }
.helt { background: var(--hvid); }
.helt .wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 56px; padding-top: 72px; padding-bottom: 80px; }
.helt-tekst { flex: 1 1 480px; min-width: 0; display: flex; flex-direction: column; gap: 22px; align-items: flex-start; }
.helt-tekst p { margin: 0; }
.helt-billede { flex: 1 1 400px; min-width: 0; position: relative; }
.helt-billede img { width: 100%; height: 520px; object-fit: cover; object-position: 70% 30%; border-radius: 10px; }
.navneskilt { position: absolute; left: -20px; bottom: 28px; background: var(--skifer-dyb); color: var(--hvid); padding: 16px 22px; border-radius: 8px; }
.navneskilt strong { display: block; font: 700 26px/1.1 var(--titel); }
.navneskilt span { font-size: 16px; color: var(--paa-moerk); }
@media (max-width: 700px) { .helt .wrap { padding-top: 40px; padding-bottom: 48px; gap: 32px; } .helt-billede img { height: 360px; } .navneskilt { left: 12px; bottom: 12px; } }
.fakta { background: var(--skifer-dyb); color: var(--hvid); }
.fakta .wrap { display: flex; flex-wrap: wrap; gap: 28px 32px; padding-top: 36px; padding-bottom: 36px; }
.fakta div { flex: 1 1 220px; color: #D5DEE0; }
.fakta strong { display: block; font: 700 44px/1 var(--titel); color: var(--hvid); margin-bottom: 4px; }
.kunder { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px 48px; padding-top: 40px; }
.kunder .hat { color: var(--svag); margin: 0; }
.kunder span { font: 600 34px var(--titel); color: var(--skifer); }
.sidetop { background: var(--hvid); }
.sidetop.moerk { background: var(--skifer-dyb); color: var(--paa-moerk); }
.sidetop.moerk h1 { color: var(--hvid); } .sidetop.moerk .hat { color: var(--rosa-paa-moerk); } .sidetop.moerk .broed, .sidetop.moerk .broed a { color: #D5DEE0; }
.sidetop .wrap { padding-top: 36px; padding-bottom: 72px; }
.broed { font-size: 15px; color: var(--svag); margin-bottom: 32px; } .broed a { color: var(--svag); }
.sidetop-raekke { display: flex; flex-wrap: wrap; gap: 48px; align-items: flex-start; }
.sidetop-tekst { flex: 999 1 520px; min-width: 0; display: flex; flex-direction: column; gap: 22px; align-items: flex-start; }
.sidetop-tekst p { margin: 0; }
.sideboks { flex: 1 1 300px; background: var(--skifer-dyb); color: var(--paa-moerk); border-radius: 12px; padding: 32px; display: flex; flex-direction: column; gap: 14px; }
.sideboks .titel { font-size: 30px; color: var(--hvid); line-height: 1.05; }
.sideboks a.tlf { color: var(--hvid); font-weight: 600; text-align: center; padding: 10px; }
.piller { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; padding: 0; margin: 0; }
.piller li { background: var(--rosa-lys); color: var(--rosa-moerk); font-weight: 600; font-size: 15px; padding: 8px 14px; border-radius: 999px; margin: 0; }
.moerk .piller li { background: #3B4F56; color: var(--hvid); }
.raekke { display: flex; flex-wrap: wrap; gap: 24px; }
.raekke > * { flex: 1 1 260px; min-width: 0; }
.raekke.tre > * { flex-basis: 320px; }
.raekke.to > * { flex-basis: 420px; }
.kort { background: var(--hvid); border: 1px solid var(--linje); border-radius: 10px; padding: 28px; display: flex; flex-direction: column; gap: 12px; }
a.kort { text-decoration: none; color: var(--skifer); transition: border-color .15s, transform .15s; }
a.kort:hover { border-color: var(--rosa); color: var(--skifer); transform: translateY(-2px); }
.kort .titel { font-size: 30px; line-height: 1.05; color: var(--skifer-dyb); }
.kort .pil { margin-top: auto; }
.kort.rosa { background: var(--rosa-lys); border-color: var(--rosa-lys); }
.kort.moerk { background: var(--skifer-dyb); border-color: var(--skifer-dyb); color: var(--paa-moerk); }
.kort.moerk .titel, .kort.moerk h3 { color: var(--hvid); } .kort.moerk .hat { color: var(--rosa-paa-moerk); }
.trin { border-top: 3px solid var(--rosa); padding-top: 18px; }
.trin .nr { font: 700 22px var(--titel); color: var(--rosa-dyb); }
.trin h3 { margin: 4px 0 8px; }
.flise { background: var(--hvid); border: 1px solid var(--linje); border-radius: 12px; padding: 48px; }
@media (max-width: 700px) { .flise { padding: 28px 22px; } }
.tal { flex: 1 1 170px; background: var(--papir); border-radius: 10px; padding: 28px; }
.tal strong { display: block; font: 700 56px/1 var(--titel); color: var(--rosa); margin-bottom: 8px; }
.liste-kort { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.liste-kort li { background: var(--hvid); border: 1px solid var(--linje); border-radius: 8px; padding: 12px 18px; font-weight: 500; margin: 0; }
.flueben { list-style: none; padding: 0; }
.flueben li { padding-left: 30px; position: relative; margin-bottom: 10px; }
.flueben li::before { content: ''; position: absolute; left: 2px; top: 7px; width: 14px; height: 8px; border-left: 3px solid var(--rosa); border-bottom: 3px solid var(--rosa); transform: rotate(-45deg); }
.citat { margin: 0; background: var(--hvid); border: 1px solid var(--linje); border-radius: 10px; padding: 32px; display: flex; flex-direction: column; gap: 20px; }
.citat blockquote { margin: 0; font-size: 20px; line-height: 1.45; color: var(--skifer-dyb); }
.citat.kort-citat blockquote { font-size: 22px; line-height: 1.4; }
.citat figcaption { margin-top: auto; } .citat figcaption strong { font-weight: 600; display: block; }
.baand { background: var(--skifer-dyb); color: var(--paa-moerk); border-radius: 12px; padding: 56px 48px; display: flex; flex-wrap: wrap; gap: 32px 40px; align-items: center; justify-content: space-between; }
.baand h2 { color: var(--hvid); } .baand .hat { color: var(--rosa-paa-moerk); }
.baand > div:first-child { flex: 2 1 420px; min-width: 0; }
.baand.rosa { background: var(--rosa); color: var(--hvid); }
.baand.rosa p { font-size: 20px; } .baand.rosa a:not(.knap-hvid) { color: var(--hvid); }
@media (max-width: 700px) { .baand { padding: 36px 24px; } }
form .felt { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
label { font-weight: 600; }
input[type=text], input[type=email], input[type=tel], input[type=number], textarea { font: inherit; padding: 14px 16px; border: 1px solid var(--kant); border-radius: 6px; background: var(--hvid); color: var(--skifer-dyb); width: 100%; }
textarea { min-height: 120px; resize: vertical; }
.skjult { position: absolute; left: -9999px; }
.kryds { display: flex; align-items: center; gap: 10px; min-height: 44px; font-weight: 400; }
.kryds input { width: 22px; height: 22px; accent-color: var(--rosa); flex: none; }
.lille { font-size: 15px; color: var(--svag); }
.faq details { background: var(--hvid); border: 1px solid var(--linje); border-radius: 10px; margin-bottom: 12px; }
.faq summary { font-weight: 600; font-size: 21px; color: var(--skifer-dyb); padding: 22px 24px; cursor: pointer; list-style-position: outside; }
.faq details > div { padding: 0 24px 22px; }
.antal { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 20px; margin: 28px 0; }
.antal label { font-size: 20px; color: var(--skifer-dyb); }
.antal input[type=range] { flex: 1 1 260px; height: 44px; accent-color: var(--rosa); }
.antal input[type=number] { width: 110px; font: 700 34px var(--titel); color: var(--rosa); text-align: center; padding: 8px; }
.mulighed { border: 1px solid var(--linje); border-radius: 10px; padding: 28px; display: flex; flex-direction: column; gap: 10px; }
.mulighed.anbefalet { border: 2px solid var(--rosa); background: var(--papir); }
.mulighed table { width: 100%; border-collapse: collapse; font-size: 16px; margin-top: 6px; }
.mulighed td { padding: 8px 0; border-top: 1px solid var(--linje); vertical-align: top; }
.mulighed td:last-child { text-align: right; white-space: nowrap; padding-left: 12px; font-variant-numeric: tabular-nums; }
.mulighed .sum { font: 700 48px/1 var(--titel); color: var(--skifer-dyb); margin-top: auto; padding-top: 16px; }
.mulighed.anbefalet .sum { color: var(--rosa); }
.valg { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 8px 0 20px; }
.prosa { max-width: 760px; }
.prosa h2 { font-size: clamp(30px, 3.4vw, 40px); margin: 48px 0 16px; }
.prosa h3 { margin: 32px 0 10px; }
.prosa p, .prosa li { font-size: 19px; line-height: 1.65; }
.prosa .overtitel { font-weight: 600; color: var(--svag); }
.episoder { list-style: none; padding: 0; margin: 0; columns: 2 380px; column-gap: 40px; }
.episoder li { padding: 10px 0; border-bottom: 1px solid var(--linje); break-inside: avoid; margin: 0; }
.person { display: flex; flex-wrap: wrap; gap: 32px; align-items: flex-start; }
.person img { flex: 0 1 300px; width: 300px; border-radius: 10px; }
.person > div { flex: 1 1 360px; min-width: 0; }
.bund { background: var(--hvid); border-top: 1px solid var(--linje); margin-top: 96px; font-size: 16px; }
.bund .wrap { display: flex; flex-wrap: wrap; gap: 40px; padding-top: 48px; padding-bottom: 32px; }
.bund .wrap > div { flex: 1 1 190px; display: flex; flex-direction: column; gap: 10px; }
.bund strong { font-weight: 600; color: var(--skifer-dyb); }
.bund .logo img { width: 170px; margin: -6px 0 4px -8px; }
.bund .nederst { border-top: 1px solid var(--linje); padding-top: 20px; padding-bottom: 28px; color: var(--svag); font-size: 15px; display: flex; gap: 8px 24px; flex-wrap: wrap; }
.bund .nederst > * { flex: none; }
.spor { position: fixed; top: 0; left: 0; right: 0; height: 3px; background: var(--rosa); transform: scaleX(0); transform-origin: left; z-index: 20; }
.helt { position: relative; overflow: hidden; }
.helt::before { content: ''; position: absolute; width: 900px; height: 900px; right: -220px; top: -320px; border-radius: 50%; background: radial-gradient(closest-side, #F9E3EA, rgba(249, 227, 234, 0)); animation: skaer 38s ease-in-out infinite alternate; pointer-events: none; }
.helt .wrap { position: relative; }
@keyframes skaer { to { transform: translate(-260px, 140px) scale(1.15); } }
.js h1[data-ord] .ord { display: inline-block; opacity: 0; transform: translateY(0.35em); animation: ordind .6s cubic-bezier(.2, .7, .2, 1) forwards; animation-delay: calc(var(--i) * 70ms + 120ms); }
@keyframes ordind { to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: no-preference) { .js h1[data-ord]:not([aria-label]) { visibility: hidden; } }
.js [data-ind] { opacity: 0; transition: opacity .7s ease, transform .7s cubic-bezier(.2, .7, .2, 1); transition-delay: calc(var(--i, 0) * 90ms); }
.js [data-ind=op] { transform: translateY(28px); }
.js [data-ind=venstre] { transform: translateX(-36px); }
.js [data-ind=hoejre] { transform: translateX(36px); }
.js [data-ind].inde { opacity: 1; transform: none; }
.spalter { display: flex; flex-wrap: wrap; gap: 32px 64px; align-items: flex-start; }
.spalte-titel { flex: 1 1 300px; position: sticky; top: 40px; }
.spalter > :last-child { flex: 2 1 560px; min-width: 0; }
.raekke.to-og-to > * { flex: 1 1 260px; }
@media (max-width: 960px) { .spalte-titel { position: static; } }
.trinraekke .trin { position: relative; border-top-color: var(--linje); }
.trinraekke .trin::before { content: ''; position: absolute; left: 0; top: -3px; width: 100%; height: 3px; background: var(--rosa); transform-origin: left; }
.js .trinraekke .trin::before { transform: scaleX(0); transition: transform .7s ease; }
.js .trinraekke.inde .trin::before { transform: scaleX(1); }
.js .trinraekke .trin .nr { opacity: .35; transition: opacity .4s ease; }
.js .trinraekke.inde .trin .nr { opacity: 1; }
.trinraekke .trin:nth-child(1)::before, .trinraekke .trin:nth-child(1) .nr { transition-delay: .1s; }
.trinraekke .trin:nth-child(2)::before, .trinraekke .trin:nth-child(2) .nr { transition-delay: .6s; }
.trinraekke .trin:nth-child(3)::before, .trinraekke .trin:nth-child(3) .nr { transition-delay: 1.1s; }
.trinraekke .trin:nth-child(4)::before, .trinraekke .trin:nth-child(4) .nr { transition-delay: 1.6s; }
.udsagn { font: 700 clamp(40px, 6.4vw, 92px)/1.02 var(--titel); color: var(--skifer-dyb); max-width: 1000px; margin: 24px 0; letter-spacing: -0.01em; }
.js .udsagn .ord { color: #D8D0C2; transition: color .35s ease; }
.js .udsagn .ord.taendt { color: var(--skifer-dyb); }
.js .udsagn .ord.taendt.tegn { color: var(--rosa); }
.rulle { overflow: hidden; border-top: 1px solid var(--linje); border-bottom: 1px solid var(--linje); background: var(--hvid); margin-top: 88px; padding-top: 0; }
.rulle-bane { display: flex; width: max-content; text-decoration: none; color: var(--skifer); animation: rul 64s linear infinite; }
.rulle-bane:hover { animation-play-state: paused; color: var(--rosa-dyb); }
.rulle-raekke { display: flex; flex: none; }
.rulle-raekke span { font: 600 22px var(--titel); padding: 18px 28px; white-space: nowrap; }
.rulle-raekke span::after { content: '·'; color: var(--rosa); margin-left: 56px; }
@keyframes rul { to { transform: translateX(-50%); } }
.episoder li { transition: padding-left .2s ease, color .2s ease; }
.episoder li:hover { padding-left: 10px; color: var(--rosa-dyb); }
.faq summary { transition: color .2s ease; } .faq summary:hover { color: var(--rosa-dyb); }
.knap, .knap-2, .knap-hvid { transition: background-color .2s ease, color .2s ease, transform .2s ease; }
.knap:hover, .knap-hvid:hover { transform: translateY(-1px); }
.helt-billede.har-video video { width: 100%; height: 520px; object-fit: cover; border-radius: 10px; background: var(--skifer-dyb); display: block; }
.helt-billede.har-video.bred video { height: auto; aspect-ratio: 16 / 9; }
.afspil { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; gap: 14px; font: 600 18px var(--tekst); color: var(--skifer-dyb); background: var(--hvid); border: 0; border-radius: 999px; padding: 14px 24px 14px 16px; cursor: pointer; box-shadow: 0 10px 30px rgba(38, 54, 59, .28); transition: transform .2s ease; }
.afspil:hover { transform: translate(-50%, -50%) scale(1.04); }
.trekant { width: 44px; height: 44px; border-radius: 50%; background: var(--rosa); position: relative; flex: none; }
.trekant::after { content: ''; position: absolute; left: 17px; top: 13px; border-left: 15px solid #fff; border-top: 9px solid transparent; border-bottom: 9px solid transparent; }
.helt-billede.spiller .afspil, .helt-billede.spiller .navneskilt { display: none; }
.helt-billede.biograf { display: flex; align-items: center; justify-content: flex-start; align-self: stretch; }
.afspil.stor { position: static; transform: none; gap: 16px; color: var(--hvid); text-align: left; padding: 10px 28px 10px 10px; background: rgba(24, 35, 39, .55); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, .18); box-shadow: 0 20px 50px -20px rgba(0, 0, 0, .6); }
.introvindue { width: min(1200px, 92vw); max-width: none; padding: 0; border: 0; border-radius: 14px; background: #000; overflow: visible; box-shadow: 0 40px 120px rgba(0, 0, 0, .6); }
.introvindue::backdrop { background: rgba(14, 20, 23, .86); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.helt-billede.har-video .introvindue video { display: block; box-shadow: none; width: 100%; height: auto; aspect-ratio: 16 / 9; border-radius: 14px; background: #000; }
.introvindue .luk { position: absolute; right: -14px; top: -14px; width: 44px; height: 44px; border-radius: 50%; border: 0; background: #fff; color: var(--skifer-dyb); font: 400 30px/44px var(--tekst); cursor: pointer; box-shadow: 0 8px 24px rgba(0, 0, 0, .4); z-index: 1; }
@media (max-width: 700px) { .introvindue .luk { right: 6px; top: -54px; } }
.afspil.stor:hover { transform: none; }
.afspil.stor .trekant { width: 76px; height: 76px; border-radius: 50%; background: var(--rosa); box-shadow: 0 0 0 0 rgba(198, 61, 103, .55); animation: puls 2.4s ease-out infinite; position: relative; flex: none; display: block; border: 0; transition: transform .2s ease; }
.afspil.stor .trekant::after { content: ""; position: absolute; left: 30px; top: 24px; border-style: solid; border-width: 14px 0 14px 22px; border-color: transparent transparent transparent #fff; }
.afspil.stor:hover .trekant { transform: scale(1.08); }
.afspil-tekst strong { display: block; font: 700 20px/1.2 var(--titel); }
.afspil-tekst span { font-size: 15px; color: rgba(255, 255, 255, .8); }
@keyframes puls { 0% { box-shadow: 0 0 0 0 rgba(198, 61, 103, .55); } 80%, 100% { box-shadow: 0 0 0 22px rgba(198, 61, 103, 0); } }
@media (prefers-reduced-motion: reduce) { .afspil.stor .trekant { animation: none; } }
@media (max-width: 700px) { .afspil.stor .trekant { width: 56px; height: 56px; } .afspil.stor .trekant::after { left: 22px; top: 17px; border-width: 11px 0 11px 17px; } .afspil-tekst span { display: none; } .afspil-tekst strong { font-size: 16px; } }
@media (max-width: 700px) { .helt-billede.har-video video { height: 420px; } .afspil { font-size: 16px; white-space: nowrap; } }
@media (prefers-reduced-motion: reduce) {
html { scroll-behavior: auto; } a.kort { transition: none; }
.helt::before, .rulle-bane { animation: none; }
.rulle-bane { width: auto; flex-wrap: wrap; } .rulle-raekke { flex-wrap: wrap; } .rulle-raekke[aria-hidden] { display: none; } .rulle-raekke span { white-space: normal; }
.js h1[data-ord] .ord { animation: none; opacity: 1; transform: none; }
.js [data-ind] { opacity: 1; transform: none; transition: none; }
.js .trinraekke .trin::before { transform: none; transition: none; } .js .trinraekke .trin .nr { opacity: 1; }
.js .udsagn .ord { color: var(--skifer-dyb); transition: none; } .js .udsagn .ord.tegn { color: var(--rosa); }
.spor { display: none; }
}
@media print { .top, .bund, .knapper, form { display: none; } }
.helt { background: var(--skifer-dyb); color: #fff; }
.helt::before { display: none; }
.helt-bag { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 78% 30%; }
.helt::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(24, 35, 39, .95) 0%, rgba(24, 35, 39, .88) 34%, rgba(24, 35, 39, .38) 62%, rgba(24, 35, 39, .06) 84%); }
.helt .wrap { z-index: 1; min-height: 680px; padding-top: 88px; padding-bottom: 150px; }
.helt h1 { color: #fff; } .helt .hat { color: var(--rosa-paa-moerk); } .helt .indledning { color: var(--paa-moerk); }
.helt .knap-2 { background: transparent; color: #fff; border-color: #fff; } .helt .knap-2:hover { background: #fff; color: var(--skifer-dyb); }
.helt-billede.tom { align-self: stretch; min-height: 120px; }
.helt-billede.tom .navneskilt { left: auto; right: 0; bottom: 0; background: rgba(24, 35, 39, .84); }
.helt-billede.har-video video { box-shadow: 0 24px 60px rgba(0, 0, 0, .45); }
@media (max-width: 900px) {
.helt::after { background: rgba(24, 35, 39, .80); }
.helt .wrap { min-height: 0; padding-top: 56px; padding-bottom: 120px; }
.helt-billede.tom { display: none; }
}
.fakta { background: transparent; color: var(--skifer); position: relative; z-index: 2; margin-top: -76px; padding: 0 24px; }
.fakta .wrap { background: var(--hvid); border-radius: 12px; box-shadow: 0 18px 50px rgba(38, 54, 59, .16); padding: 32px 40px; max-width: 1152px; }
.fakta div { color: var(--svag); } .fakta strong { color: var(--rosa); }
.ikon { width: 52px; height: 52px; border-radius: 12px; background: var(--rosa-lys); color: var(--rosa-dyb); display: flex; align-items: center; justify-content: center; flex: none; }
.ikon svg { width: 28px; height: 28px; }
.derfor { background: var(--hvid); margin-top: 88px; padding: 80px 0; border-top: 1px solid var(--linje); border-bottom: 1px solid var(--linje); }
.grund h3 { margin: 18px 0 8px; }
.moed { display: flex; flex-wrap: wrap; gap: 40px 64px; align-items: center; }
.moed img { flex: 0 1 380px; width: 380px; border-radius: 12px; }
.moed > div { flex: 1 1 420px; min-width: 0; }
.bredbillede { width: 100%; aspect-ratio: 21 / 9; object-fit: cover; object-position: center 35%; border-radius: 12px; margin-top: -48px; position: relative; box-shadow: 0 18px 50px rgba(38, 54, 59, .16); }
@media (max-width: 700px) { .bredbillede { aspect-ratio: 16 / 10; } }
.bund { background: var(--skifer-dyb); color: #D5DEE0; border-top: 0; }
.bund a { color: #fff; } .bund a:hover { color: var(--rosa-paa-moerk); } .bund strong { color: #fff; }
.bund .nederst { border-top-color: #3B4F56; color: #B9C6C9; }
.bund .logo.plade { background: #fff; border-radius: 10px; padding: 10px 16px; align-self: flex-start; }
.bund .logo img { margin: 0; width: 150px; }
.citat figcaption.med-ansigt { display: flex; align-items: center; gap: 16px; }
.ansigt { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; flex: none; border: 2px solid var(--rosa-lys); }
.kunder { align-items: center; }
.kunder img { height: 60px; width: auto; }
.partnere { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 48px; margin-top: 56px; padding-top: 32px; border-top: 1px solid var(--linje); }
.partnere .hat { color: var(--svag); margin: 0; flex: 0 0 100%; }
.partnere img { height: 64px; width: auto; }
@media (max-width: 700px) { .kunder img { height: 46px; } .partnere img { height: 50px; } }
.kunder { background: var(--hvid); border: 1px solid var(--linje); border-radius: 12px; margin-top: 40px; padding: 14px 32px; gap: 8px 36px; max-width: 1152px; }
.kunder span { font-size: 30px; }
.kunder img[alt="Sanistål"] { height: 92px; margin: -10px -24px; }
.kunder img[alt="Telenor"] { height: 58px; }
.kunder img[alt="Norlys"] { height: 78px; margin: 0 -16px; }
@media (max-width: 1240px) { .kunder { margin-left: 24px; margin-right: 24px; } }
.kunder .hat { flex: 0 0 100%; margin-top: 6px; }
.kunder { justify-content: space-between; padding-bottom: 6px; }
.kundebaand { background: var(--hvid); border-top: 1px solid var(--linje); border-bottom: 1px solid var(--linje); margin-top: 48px; padding: 22px 0 14px; overflow: hidden; }
.kundebaand .hat { color: var(--svag); margin-bottom: 4px; }
.kundebane { display: flex; width: max-content; animation: rul 70s linear infinite; }
.kundebane:hover { animation-play-state: paused; }
.kunderulle { display: flex; align-items: center; gap: 64px; padding-right: 64px; flex: none; height: 96px; }
.kunderulle img { width: auto; max-width: none; filter: grayscale(1); mix-blend-mode: multiply; opacity: .9; }
.kunderulle span { font: 600 32px var(--titel); color: #4A5A5F; white-space: nowrap; }
@media (max-width: 700px) { .kunderulle { gap: 40px; padding-right: 40px; zoom: .8; } }
@media (prefers-reduced-motion: reduce) { .kundebane { animation: none; width: auto; } .kunderulle { flex-wrap: wrap; height: auto; padding: 0 24px; gap: 16px 40px; } .kunderulle[aria-hidden] { display: none; } }
.kundebaand .hat { margin: 0 auto 4px; }
.kundebane { animation-duration: 130s; }
.formel { font: 700 clamp(34px, 5.2vw, 72px)/1.05 var(--titel); color: var(--skifer-dyb); margin: 0 0 28px; letter-spacing: -0.01em; }
.galleri { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; }
.galleri figure { margin: 0; }
.galleri img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 12px; }
.galleri figcaption { margin-top: 10px; color: var(--svag); font-size: 16px; }
.episoder a { color: inherit; text-decoration: none; display: block; } .episoder a:hover { color: var(--rosa-dyb); }
.episodenav { display: flex; justify-content: space-between; gap: 16px; margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--linje); font-weight: 600; }
.helt .helt-note { margin: 0; font-size: 16px; color: #D5DEE0; }
.talkort strong { display: block; white-space: nowrap; font: 700 44px/1 var(--titel); color: var(--rosa); }
details.mere { margin-bottom: 16px; }
details.mere summary { cursor: pointer; color: var(--rosa-dyb); font-weight: 600; padding: 6px 0; }
details.mere .felt { margin: 10px 0 0; }
.byg { display: flex; flex-wrap: wrap; gap: 32px; align-items: flex-start; }
.byg-valg { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 24px; }
.byg fieldset { margin: 0; min-width: 0; padding: 32px; }
.byg legend { float: left; width: 100%; padding: 0; margin: 0 0 12px; font: 700 30px/1.1 var(--titel); color: var(--skifer-dyb); display: flex; align-items: center; gap: 14px; }
.byg legend + * { clear: both; }
.byg .nr { width: 40px; height: 40px; border-radius: 50%; background: var(--rosa); color: #fff; font: 700 22px var(--titel); display: flex; align-items: center; justify-content: center; flex: none; }
.byg .valg { margin-bottom: 0; }
.valgkortraekke { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; margin-top: 8px; }
.valgkort { border: 1px solid var(--linje); border-radius: 10px; padding: 18px 20px; background: var(--papir); transition: border-color .15s, background-color .15s; }
.valgkort.valgt { border-color: var(--rosa); background: var(--hvid); box-shadow: 0 0 0 1px var(--rosa); }
.valgkort p { margin: 4px 0 0; font-size: 16px; }
.valgpris { font-weight: 600; color: var(--rosa-dyb); }
.lille-antal { margin: 10px 0 0; gap: 10px; }
.lille-antal label { font-size: 16px; }
.lille-antal input[type=number] { width: 84px; font-size: 24px; padding: 4px; }
.byg-sum { flex: 1 1 320px; position: sticky; top: 24px; background: var(--hvid); border: 2px solid var(--rosa); border-radius: 12px; padding: 28px; display: flex; flex-direction: column; gap: 12px; }
.byg-sum table { width: 100%; border-collapse: collapse; font-size: 16px; }
.byg-sum td { padding: 8px 0; border-top: 1px solid var(--linje); vertical-align: top; }
.byg-sum td:last-child { text-align: right; white-space: nowrap; padding-left: 12px; font-variant-numeric: tabular-nums; }
.byg-sum .sum { font: 700 52px/1 var(--titel); color: var(--rosa); }
.byg-sum .felt { margin-bottom: 0; }
@media (max-width: 960px) { .byg-sum { position: static; } .byg fieldset { padding: 24px 20px; } }
.vores-svar { background: var(--hvid); border: 1px solid var(--linje); border-left: 4px solid var(--rosa); border-radius: 8px; padding: 16px 20px; }
@media (max-width: 960px) { .js [data-ind=venstre], .js [data-ind=hoejre] { transform: translateY(28px); } }
main { overflow-x: clip; }
.kort.rosa { background: var(--hvid); border: 2px solid var(--rosa); }
.piller li { color: var(--skifer-dyb); }
.ikon { color: var(--rosa); }
.modelraekke { display: flex; flex-wrap: wrap; align-items: center; gap: 32px 64px; }
.modelfigur { flex: 1 1 380px; max-width: 520px; min-width: 0; margin: 0 auto; }
.modelfigur svg { width: 100%; height: auto; display: block; }
.modeltekst { flex: 1 1 420px; min-width: 0; }
.modelpunkter { margin: 0; display: flex; flex-direction: column; gap: 18px; }
.modelpunkter dt { font: 700 26px/1.1 var(--titel); color: var(--skifer-dyb); display: flex; align-items: center; gap: 12px; }
.modelpunkter dd { margin: 4px 0 0 28px; }
.prik { width: 16px; height: 16px; border-radius: 50%; flex: none; }
.modelfigur .del { mix-blend-mode: multiply; }
.modelfigur .maerke { mix-blend-mode: normal; }
.modelpunkter > div { border-radius: 8px; padding: 6px 10px; margin: -6px -10px; cursor: default; transition: background-color .2s ease; }
.modelpunkter > div:hover, .modelpunkter > div:focus-visible { background: var(--hvid); }
@media (prefers-reduced-motion: no-preference) {
.js .modelfigur .del { transition: transform 1.2s cubic-bezier(.2, .7, .2, 1), opacity .9s ease; }
.js .modelfigur:not(.inde) .del1 { transform: translate(-95px, -55px); opacity: 0; }
.js .modelfigur:not(.inde) .del2 { transform: translate(95px, -55px); opacity: 0; }
.js .modelfigur:not(.inde) .del3 { transform: translate(0, 105px); opacity: 0; }
.js .modelfigur .del2 { transition-delay: .15s; } .js .modelfigur .del3 { transition-delay: .3s; }
.js .modelfigur .midte { transform-box: fill-box; transform-origin: center; transform: scale(0); transition: transform .65s cubic-bezier(.3, 1.6, .5, 1) 1.15s; }
.js .modelfigur.inde .midte { transform: scale(1); }
.js .modelfigur .ring { transform-box: fill-box; transform-origin: center; opacity: 0; }
.js .modelfigur.inde .ring { animation: modelring 1.5s ease-out 1.6s 2 both; }
.js .modelfigur.inde.rolig .del1 { animation: svaev1 9s ease-in-out infinite alternate; }
.js .modelfigur.inde.rolig .del2 { animation: svaev2 11s ease-in-out infinite alternate; }
.js .modelfigur.inde.rolig .del3 { animation: svaev3 10s ease-in-out infinite alternate; }
.modelfigur[data-fokus] .del { opacity: .22; }
.modelfigur[data-fokus="1"] .del1, .modelfigur[data-fokus="2"] .del2, .modelfigur[data-fokus="3"] .del3 { opacity: 1; }
}
@keyframes modelring { from { transform: scale(1); opacity: .9; } to { transform: scale(2.1); opacity: 0; } }
@keyframes svaev1 { to { transform: translate(-7px, -5px); } }
@keyframes svaev2 { to { transform: translate(7px, -4px); } }
@keyframes svaev3 { to { transform: translate(0, 8px); } }
.trinraekke .trin { border-top: 0; padding-top: 0; }
.trinraekke .trin::after { content: ''; position: absolute; left: 0; top: 22px; width: calc(100% + 24px); height: 3px; background: var(--linje); z-index: 0; }
.trinraekke .trin::before { top: 22px; width: calc(100% + 24px); z-index: 1; }
.trinraekke .trin:last-child::before, .trinraekke .trin:last-child::after { display: none; }
.trinraekke .trin .nr { position: relative; z-index: 2; width: 47px; height: 47px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 22px; margin-bottom: 14px; background: var(--rosa); border: 3px solid var(--rosa); color: #fff; opacity: 1; transition: transform .2s ease; }
.trinraekke .trin:hover .nr { transform: scale(1.1); }
.js .trinraekke .trin .nr, .js .trinraekke.inde .trin .nr { opacity: 1; }
@media (prefers-reduced-motion: no-preference) {
.js .trinraekke .trin .nr { transition: background-color .35s ease, border-color .35s ease, color .35s ease, transform .2s ease; }
.js .trinraekke:not(.inde) .trin .nr { background: var(--hvid); border-color: var(--linje); color: var(--svag); }
.js .trinraekke.inde .trin .nr { animation: trinpop .5s cubic-bezier(.3, 1.6, .5, 1) both; }
.js .trinraekke .trin h3, .js .trinraekke .trin > div:last-child { transition: opacity .5s ease, transform .5s ease; }
.js .trinraekke:not(.inde) .trin h3, .js .trinraekke:not(.inde) .trin > div:last-child { opacity: 0; transform: translateY(12px); }
.js .trinraekke .trin::before { transition: transform .5s ease; }
.trinraekke .trin:nth-child(1) .nr, .trinraekke .trin:nth-child(1) h3, .trinraekke .trin:nth-child(1) > div:last-child { transition-delay: .1s; animation-delay: .1s; }
.trinraekke .trin:nth-child(2) .nr, .trinraekke .trin:nth-child(2) h3, .trinraekke .trin:nth-child(2) > div:last-child { transition-delay: .65s; animation-delay: .65s; }
.trinraekke .trin:nth-child(3) .nr, .trinraekke .trin:nth-child(3) h3, .trinraekke .trin:nth-child(3) > div:last-child { transition-delay: 1.2s; animation-delay: 1.2s; }
.trinraekke .trin:nth-child(4) .nr, .trinraekke .trin:nth-child(4) h3, .trinraekke .trin:nth-child(4) > div:last-child { transition-delay: 1.75s; animation-delay: 1.75s; }
.trinraekke .trin:nth-child(5) .nr, .trinraekke .trin:nth-child(5) h3, .trinraekke .trin:nth-child(5) > div:last-child { transition-delay: 2.3s; animation-delay: 2.3s; }
.trinraekke .trin:nth-child(6) .nr, .trinraekke .trin:nth-child(6) h3, .trinraekke .trin:nth-child(6) > div:last-child { transition-delay: 2.85s; animation-delay: 2.85s; }
.trinraekke .trin:nth-child(1)::before { transition-delay: .3s; } .trinraekke .trin:nth-child(2)::before { transition-delay: .85s; }
.trinraekke .trin:nth-child(3)::before { transition-delay: 1.4s; } .trinraekke .trin:nth-child(4)::before { transition-delay: 1.95s; }
.trinraekke .trin:nth-child(5)::before { transition-delay: 2.5s; }
}
@keyframes trinpop { 0% { transform: scale(.6); } 60% { transform: scale(1.18); } 100% { transform: scale(1); } }
@media (max-width: 700px) { .trinraekke .trin::before, .trinraekke .trin::after { display: none; } }
.fakta strong, .talkort strong { font-variant-numeric: tabular-nums; }
.svar .kortsvar { font-size: 21px; line-height: 1.55; background: var(--hvid); border: 1px solid var(--linje); border-radius: 12px; padding: 22px 26px; margin: 0 0 8px; }
.svar .vores-svar { margin: 40px 0 0; }
.svar .vores-svar p { margin: 0 0 10px; } .svar .vores-svar p:last-child { margin: 0; }
.laer { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.laer li { margin: 0; }
.laer a { display: block; background: var(--hvid); border: 1px solid var(--linje); border-radius: 10px; padding: 14px 18px; text-decoration: none; font-weight: 600; color: var(--skifer-dyb); }
.laer a:hover { border-color: var(--rosa); }
.laer .lille { display: block; font-weight: 400; margin-bottom: 2px; }
.svar .afsender { margin-top: 36px; }
.lille-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px 48px; padding: 36px 40px; }
.lille-cta h2 { font-size: clamp(26px, 3vw, 34px); margin: 0 0 8px; } .lille-cta p { margin: 0; max-width: 560px; }
.cta-knapper { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.relaterede { list-style: none; padding: 0; margin: 0; columns: 2 320px; column-gap: 48px; }
.relaterede li { break-inside: avoid; margin: 0 0 12px; font-size: 19px; }
.relaterede a { font-weight: 600; }
@media (max-width: 600px) { .lille-cta { padding: 28px 22px; } }
.modelindhold { margin-top: 28px; } .modelindhold .piller a { text-decoration: none; color: inherit; }
.model figure { margin: 0; } .model img { display: block; width: 100%; height: auto; border-radius: 12px; border: 1px solid var(--linje); background: #F7F3EB; }
.model figcaption { font-size: 15px; color: var(--svag); margin-top: 10px; }
.modeltekst { max-width: 860px; } .modeltekst p { font-size: 19px; line-height: 1.6; }
.modellinks { display: flex; gap: 24px; flex-wrap: wrap; }
.modelindhold .overtitel { margin: 22px 0 10px; font-size: 15px; } .modelgruppe { padding-bottom: 0; } .modelgruppe .hat { font-size: 18px; margin: 0; border-top: 2px solid var(--linje); padding-top: 28px; }
.svarmodel { margin: 28px 0 8px; } .svarmodel img { display: block; width: 100%; height: auto; border-radius: 12px; border: 1px solid var(--linje); } .svarmodel figcaption { font-size: 15px; color: var(--svag); margin-top: 8px; }
:root { --papir: #FFFFFF; --rosa-lys: #F3F3F3; --linje: #E4E4E4; --skifer-dyb: #1E2427; --skifer: #2C3A3F; }
body { background: #FFFFFF; }
.sidetop { background: var(--skifer-dyb); color: var(--paa-moerk); }
.sidetop h1 { color: #FFFFFF; } .sidetop .hat { color: var(--rosa-paa-moerk); }
.sidetop .broed, .sidetop .broed a { color: #D5DEE0; } .sidetop .indledning { color: #E3EAEC; }
.sektion.mork { background: var(--skifer-dyb); box-shadow: 0 0 0 100vmax var(--skifer-dyb); clip-path: inset(0 -100vmax); margin-top: 88px; padding-bottom: 88px; color: var(--paa-moerk); }
.sektion.mork + .sektion { padding-top: 88px; }
.sektion.mork > h2, .sektion.mork .modeltekst h2, .sektion.mork .spalte-titel h2 { color: #FFFFFF; }
.sektion.mork .hat { color: var(--rosa-paa-moerk); }
.sektion.mork > .under-h2, .sektion.mork .modeltekst > p, .sektion.mork > p { color: #D5DEE0; }
.sektion.mork > p a, .sektion.mork > p .pil { color: var(--rosa-paa-moerk); }
.sektion.mork .modelpunkter dt { color: #FFFFFF; }
.sektion.mork .modelpunkter dd { color: #D5DEE0; }
.sektion.mork .modelpunkter > div:hover, .sektion.mork .modelpunkter > div:focus-visible { background: rgba(255, 255, 255, .08); }
.sektion.mork .modelfigur .del { mix-blend-mode: normal; }
.sektion.mork .modelfigur circle.del1 { fill: #5F7C85; }
.sektion.mork .modelpunkter .prik[style*="#36494F"] { background: #5F7C85 !important; }
.sektion.mork .citat, .sektion.mork .talkort, .sektion.mork .kort, .sektion.mork .flise { border-color: transparent; }
.sektion.mork .citat, .sektion.mork .talkort, .sektion.mork .kort, .sektion.mork .flise { color: var(--skifer); }
.sektion.mork .flise .under-h2, .sektion.mork .flise label { color: var(--skifer); }
.sektion.mork .kort .hat, .sektion.mork .citat .hat, .sektion.mork .flise .hat { color: var(--rosa-dyb); }
.kurser-hop { margin-top: 8px; }
.kurser-hop li { padding: 0; }
.kurser-hop a { display: block; padding: 8px 14px; color: #FFFFFF; text-decoration: none; }
.kurser-hop a:hover { color: var(--rosa-paa-moerk); }
.kurser-varighed { font: 600 15px/1.3 var(--tekst); letter-spacing: .12em; text-transform: uppercase; color: var(--svag); margin: 36px 0 16px; padding-top: 16px; border-top: 1px solid var(--linje); }
.kurser-varighed:first-of-type { margin-top: 0; }
.raekke.kurser-gitter { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px; }
.kurser-gitter .kort .hat, .kurser-spilkort .hat { font-size: 13px; margin: 0; }
.kurser-spilkort { border: 2px solid var(--rosa); }
.kurser-pakke { font-weight: 600; display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; margin: 0; }
.kurser-plus { color: var(--rosa); font-weight: 700; }
.kurser-note { max-width: 680px; }
.kurser-tilhvem { font-size: 20px; color: var(--skifer-dyb); font-weight: 500; }
.kurser-faar { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 24px; counter-reset: faar; }
.kurser-faar li { counter-increment: faar; margin: 0; background: var(--hvid); border: 1px solid var(--linje); border-top: 3px solid var(--rosa); border-radius: 10px; padding: 24px 28px 28px; font-size: 19px; line-height: 1.45; color: var(--skifer-dyb); }
.kurser-faar li::before { content: counter(faar); display: block; font: 700 40px/1 var(--titel); color: var(--rosa); margin-bottom: 12px; font-variant-numeric: tabular-nums; }
.kurser-saerligt { max-width: 900px; border-left: 4px solid var(--rosa); }
.kurser-saerligt > p:not(.kurser-saerligt-hat):not(.lille) { font-size: 21px; line-height: 1.5; color: var(--skifer-dyb); }
.kurser-saerligt-hat { display: flex; align-items: center; gap: 10px; font-weight: 600; font-size: 15px; letter-spacing: .12em; text-transform: uppercase; color: var(--rosa-dyb); }
.kurser-stjerne { width: 22px; height: 22px; fill: var(--rosa); flex: none; }
.kurser-fakta { margin: 0; display: flex; flex-direction: column; }
.kurser-fakta div { display: grid; grid-template-columns: 7em minmax(0, 1fr); gap: 16px; padding: 14px 0; border-top: 1px solid var(--linje); }
.kurser-fakta div:first-child { border-top: 0; padding-top: 0; }
.kurser-fakta dt { font-size: 14px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--svag); padding-top: 3px; }
.kurser-fakta dd { margin: 0; color: var(--skifer-dyb); font-weight: 500; }
.kurser-spor { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 20px; counter-reset: spor; }
.kurser-spor li { counter-increment: spor; margin: 0; background: var(--hvid); color: var(--skifer); border-radius: 10px; padding: 22px 24px 24px; display: flex; flex-direction: column; gap: 6px; font-size: 17px; }
.kurser-spor li::before { content: counter(spor); width: 36px; height: 36px; border-radius: 50%; background: var(--rosa); color: #FFFFFF; font: 700 20px/36px var(--titel); text-align: center; margin-bottom: 8px; }
.kurser-spor strong { font: 700 24px/1.1 var(--titel); color: var(--skifer-dyb); }
.kurser-post { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 14px; }
.kurser-post li { margin: 0; background: var(--hvid); border: 1px solid var(--linje); border-left: 4px solid var(--rosa); border-radius: 8px; padding: 18px 22px; font-size: 17px; }
.kurser-post li p { margin: 0; }
.kurser-post-top { display: flex; justify-content: space-between; gap: 12px; font-weight: 600; color: var(--skifer-dyb); margin-bottom: 6px !important; }
.kurser-point { color: var(--rosa-dyb); white-space: nowrap; font-variant-numeric: tabular-nums; }
.kurser-regler h3 { margin-bottom: 14px; }
.kurser-tabel { width: 100%; border-collapse: collapse; font-size: 17px; font-variant-numeric: tabular-nums; }
.kurser-tabel th, .kurser-tabel td { text-align: left; padding: 12px 0; border-top: 1px solid var(--linje); vertical-align: top; }
.kurser-tabel th { font-weight: 500; }
.kurser-tabel td { text-align: right; font-weight: 600; color: var(--skifer-dyb); padding-left: 16px; }
#spil-beregner .antal input[type=number] { width: 120px; }
#spil-beregner .mulighed td:last-child { white-space: normal; }
@media (max-width: 700px) { .kurser-fakta div { grid-template-columns: minmax(0, 1fr); gap: 2px; } .kurser-faar li { padding: 20px 22px 24px; } }
.svarliste { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px 40px; }
.svarliste li { margin: 0; padding: 14px 0; border-top: 1px solid var(--linje); }
.svarliste a { display: block; font-weight: 600; font-size: 19px; margin-bottom: 4px; }
.svarliste span { display: block; font-size: 16px; color: var(--svag); line-height: 1.45; }
.kurser-kortpris { font-weight: 600; color: var(--rosa-dyb); margin-top: 6px; }
.kurser-prisboks { display: flex; flex-wrap: wrap; gap: 24px 56px; align-items: flex-start; }
.kurser-prisboks > div:first-child { flex: 0 1 340px; } .kurser-prisboks > div:last-child { flex: 1 1 380px; }
.kurser-prisboks h2 { color: var(--rosa); line-height: 1.15; }
.kurser-prisdel { font: 500 20px var(--tekst); color: var(--svag); }
.kurser-laering { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }
.kurser-laering li { margin: 0; padding: 14px 18px; border-left: 4px solid var(--linje); background: var(--hvid); border-radius: 6px; }
.kurser-laering li:last-child { border-left-color: var(--rosa); }
.kurser-laering strong { color: var(--skifer-dyb); }
.gd-kampe { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.gd-kampe li { margin: 0; background: var(--hvid); color: var(--skifer); border-radius: 10px; padding: 22px 20px; display: flex; flex-direction: column; gap: 4px; }
.gd-kampe__nr { font: 700 30px/1 var(--titel); color: var(--rosa); margin-bottom: 8px; }
.gd-kampe b { font: 700 22px/1.15 var(--titel); color: var(--skifer-dyb); margin-bottom: 6px; }
.gd-kampe li span:not(.gd-kampe__nr) { font-size: 16px; }
.gd-kampe__info { margin-top: 22px; color: #D5DEE0; font-size: 17px; }
.gd-kampe__info b { color: var(--rosa-paa-moerk); }
@media (max-width: 900px) { .gd-kampe { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .gd-kampe { grid-template-columns: 1fr; } }
.roi-beregner { margin: 28px 0 32px; padding: 28px; border: 1px solid var(--linje, #D9DDDF); border-radius: 12px; background: #fff; display: grid; gap: 28px; }
.roi-del { display: grid; gap: 16px; }
.roi-del + .roi-del { border-top: 1px solid var(--linje, #D9DDDF); padding-top: 26px; }
.roi-del .hat { margin: 0; }
.roi-felter { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.roi-felter.fire { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.roi-felter .felt { display: flex; flex-direction: column; justify-content: flex-end; gap: 6px; }
.roi-felter label { font-size: 15px; font-weight: 600; line-height: 1.25; }
.roi-felter input { width: 100%; font: inherit; font-size: 18px; padding: 10px 12px; border: 1px solid #B9C1C4; border-radius: 8px; }
.roi-svar { background: var(--skifer-dyb); color: #fff; border-radius: 10px; padding: 18px 22px; display: grid; gap: 4px; }
.roi-svar b { color: #fff; }
.roi-svar .sum { font: 700 40px/1.1 var(--titel); color: var(--rosa-paa-moerk, #F2A7C0); margin: 2px 0; }
@media (max-width: 760px) { .roi-felter, .roi-felter.fire { grid-template-columns: 1fr 1fr; } .roi-beregner { padding: 20px 16px; } }
@media (max-width: 420px) { .roi-felter, .roi-felter.fire { grid-template-columns: 1fr; } }
.kurser-kortdeltagere { font-size: 14.5px; color: var(--svag); margin-top: -2px; }
.mork .kurser-kortdeltagere { color: inherit; opacity: .85; }
.skjult-tekst { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pod-lyt { margin-top: 16px; font-size: 15px; color: var(--svag); }
.pod-lyt a { color: inherit; }
.pod-nyeste { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px 40px; align-items: start; }
.pod-nyeste__nr { font: 700 clamp(96px, 16vw, 180px)/.85 var(--titel); color: var(--rosa-paa-moerk); letter-spacing: -.02em; }
.pod-nyeste h2 { margin: 6px 0 12px; }
.pod-nyeste h2 a { color: inherit; text-decoration: none; }
.pod-nyeste h2 a:hover { text-decoration: underline; text-decoration-color: var(--rosa-paa-moerk); }
.pod-nyeste p { max-width: 64ch; }
.pod-nyeste audio { width: 100%; max-width: 560px; margin: 8px 0 14px; }
.pod-nyeste__links { display: flex; gap: 10px 24px; flex-wrap: wrap; }
.pod-start { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.pod-start__kort { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 22px 22px 22px 86px; border: 1px solid var(--linje); border-radius: 12px; background: var(--hvid); color: var(--skifer); text-decoration: none; min-height: 100%; }
.pod-start__kort:hover { border-color: var(--rosa); }
.pod-start__kort .hat { margin: 0; }
.pod-start__kort .titel { font: 700 22px/1.15 var(--titel); color: var(--skifer-dyb); }
.pod-start__kort > span:last-child { font-size: 15.5px; color: var(--svag); }
.pod-start__nr { position: absolute; left: 20px; top: 18px; font: 700 46px/1 var(--titel); color: var(--rosa); }
.pod-alle-top { display: flex; justify-content: space-between; align-items: end; gap: 16px 32px; flex-wrap: wrap; margin-bottom: 20px; }
.pod-soeg input { width: min(360px, 100%); font: inherit; font-size: 16px; padding: 11px 14px; border: 1px solid var(--kant); border-radius: 8px; background: var(--hvid); }
.pod-liste { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--linje); }
.pod-ep { display: grid; grid-template-columns: 44px 56px minmax(0, 1fr); gap: 4px 16px; align-items: center; padding: 14px 4px; border-bottom: 1px solid var(--linje); }
.pod-ep[hidden] { display: none; }
.pod-ep__nr { font: 700 28px/1 var(--titel); color: var(--rosa); text-align: right; font-variant-numeric: tabular-nums; }
.pod-ep__tekst { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pod-ep__titel { font-weight: 600; color: var(--skifer-dyb); text-decoration: none; }
.pod-ep__titel:hover { text-decoration: underline; }
.pod-ep__meta { font-size: 14px; color: var(--svag); }
.ep-vt { font-size: 14px; color: var(--rosa-dyb); text-decoration: none; }
.ep-vt:hover { text-decoration: underline; }
.pod-ny { display: inline-block; background: var(--rosa); color: #fff; font-size: 12px; font-weight: 600; border-radius: 99px; padding: 1px 8px; margin-right: 4px; }
.ep-play { width: 44px; height: 44px; border-radius: 50%; border: 0; background: var(--rosa); cursor: pointer; display: grid; place-items: center; }
.ep-play:hover { background: var(--rosa-dyb); }
.ep-play span { width: 0; height: 0; border-left: 13px solid #fff; border-top: 8px solid transparent; border-bottom: 8px solid transparent; margin-left: 4px; }
.ep-play.spiller span { width: 12px; height: 14px; border: 0; margin: 0; border-left: 4px solid #fff; border-right: 4px solid #fff; }
.ep-play:focus-visible { outline: 3px solid var(--rosa-lys); outline-offset: 2px; }
.pod-ingen { margin-top: 16px; color: var(--svag); }
.pod-spiller { position: sticky; bottom: 12px; z-index: 5; margin-top: 18px; display: flex; gap: 14px; align-items: center; background: var(--skifer-dyb); color: #fff; border-radius: 12px; padding: 10px 16px; box-shadow: 0 10px 30px -12px rgba(0,0,0,.5); flex-wrap: wrap; }
.pod-spiller[hidden] { display: none; }
.pod-spiller span { font-weight: 600; font-size: 15px; flex: 1 1 200px; min-width: 0; }
.pod-spiller audio { flex: 1 1 280px; max-width: 100%; }
.ep-lyd { width: 100%; max-width: 560px; margin: 18px 0 6px; display: block; }
@media (max-width: 900px) { .pod-start { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) {
.pod-start { grid-template-columns: 1fr; }
.pod-nyeste { grid-template-columns: 1fr; }
.pod-nyeste__nr { font-size: 80px; }
.pod-ep { grid-template-columns: 44px minmax(0, 1fr); }
.pod-ep__nr { display: none; }
}
.mork .pod-nyeste h2, .mork .pod-nyeste h2 a { color: #fff; }
.mork .pod-nyeste .pil, .mork .pod-nyeste a { color: var(--rosa-paa-moerk); }
.sidetop .pod-lyt { color: var(--paa-moerk, #E3EAEC); opacity: .9; }
.sidetop .pod-lyt a { color: #fff; }
.kurser-video { padding-bottom: 0; }
.kurser-video video { width: 100%; max-width: 960px; aspect-ratio: 16 / 9; display: block; border-radius: 12px; background: var(--skifer-dyb); box-shadow: 0 24px 60px -30px rgba(0, 0, 0, .45); }
.kurser-video p { margin-top: 10px; }
.kundegitter__logoer { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 22px 44px; padding-block: 8px 4px; }
.kundegitter__logoer img { max-width: 140px; width: auto; filter: grayscale(1); opacity: .8; }
.forsidecase { display: grid; grid-template-columns: minmax(0, 260px) minmax(0, 1fr); gap: 24px 48px; align-items: start; padding: 32px; border: 1px solid var(--linje); border-radius: 14px; background: var(--hvid); color: var(--skifer); text-decoration: none; }
.forsidecase:hover { border-color: var(--rosa); }
.forsidecase__tal strong { display: block; font: 700 clamp(48px, 7vw, 76px)/1 var(--titel); color: var(--rosa); }
.forsidecase__tal span { color: var(--svag); }
.forsidecase h2 { margin: 4px 0 14px; }
.forsidecase dl { margin: 0 0 14px; display: grid; gap: 10px; }
.forsidecase dt { font-weight: 700; color: var(--skifer-dyb); }
.forsidecase dd { margin: 0; }
@media (max-width: 760px) { .forsidecase { grid-template-columns: 1fr; padding: 22px 18px; } }
.kpi-boks { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 24px 48px; align-items: start; }
@media (max-width: 760px) { .kpi-boks { grid-template-columns: 1fr; } }
.kurser-udfordringer ul { margin: 10px 0 0; padding-left: 18px; display: grid; gap: 4px; }
.kurser-udfordringer a { color: var(--rosa-dyb); }
.emne-svar { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border-top: 1px solid var(--linje); }
.emne-svar li { padding: 14px 0; border-bottom: 1px solid var(--linje); display: grid; gap: 4px; }
.emne-svar a { font-weight: 600; color: var(--skifer-dyb); }
.emne-svar span { color: var(--svag); font-size: 15.5px; }
.svar-genveje ul { margin: 10px 0 0; padding-left: 18px; display: grid; gap: 4px; }
.svar-genveje a { color: var(--skifer-dyb); }