@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/hanken-grotesk-400.woff) format('woff')}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/hanken-grotesk-500.woff) format('woff')}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/source-sans-3-400.woff) format('woff')}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/source-sans-3-600.woff) format('woff')}

/* Layout: venstrestillet dokument. Tekst i venstre halvdel, højre halvdel er luft, portræt eller model. Ordmærke øverst til venstre, navigation til højre. */
:root{--bund:#FFFEFB;--blaek:#0F1720;--staal:#456582;--daempet:#5E646B;--linje:#D9D8D1;--flade:#EEEDE8;
 --disp:'Hanken Grotesk',Arial,Helvetica,sans-serif;--tekst:'Source Sans 3',Arial,Helvetica,sans-serif;--L:26px;color-scheme:light}
*{box-sizing:border-box}
body{margin:0;background:var(--bund);color:var(--blaek);font-family:var(--tekst);font-size:17px;line-height:1.5}
.frame{max-width:1280px;margin:0 auto;background:var(--bund);container-type:inline-size;container-name:site}
.site{position:relative;--m:84px;padding:calc(var(--L)*1.5) var(--m) 0;min-height:100vh;min-height:100svh;display:flex;flex-direction:column}
.head{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.wm{width:180px;height:auto;color:var(--blaek);display:block}
.logo-l{display:block;color:inherit;text-decoration:none}
.nav{display:flex;gap:32px;align-items:center;font-family:var(--disp);font-weight:500;font-size:14px}
.nav a{color:var(--blaek);text-decoration:none;padding-block:10px}
.nav a[aria-current="page"]{text-decoration:underline;text-underline-offset:6px}
.nav .sprog{color:var(--daempet);letter-spacing:.06em;display:flex;gap:6px;align-items:center;line-height:1}
.nav .sprog a{color:var(--daempet)}
.nav .sprog a[aria-current="true"]{color:var(--blaek);text-decoration:underline;text-underline-offset:6px}
.menu-btn{display:none;font:500 14px var(--disp);letter-spacing:.06em;background:none;border:0;padding:12px 0;color:var(--blaek);cursor:pointer;min-height:44px}
.nav-info{display:none}
body.nav-lock{overflow:hidden}
.etik{font-family:var(--disp);font-weight:500;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--staal)}
h1{font-family:var(--disp);font-weight:400;letter-spacing:-.01em;line-height:1.1;font-size:clamp(34px,4.2cqw,51px);margin:0;text-wrap:balance;max-width:17ch}
h2{font-family:var(--disp);font-weight:400;letter-spacing:-.005em;line-height:1.2;font-size:25px;margin:0;text-wrap:balance;color:var(--staal)}
.tekstside h2{color:var(--blaek)}
h3{font-family:var(--disp);font-weight:500;font-size:14px;letter-spacing:.06em;margin:0}
p{margin:0}
.lead{max-width:44ch;font-size:20px;line-height:1.5}
.sub{max-width:30ch}
.nw{white-space:nowrap}
.txt{max-width:60ch;display:flex;flex-direction:column;gap:var(--L)}
.hero{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);column-gap:calc(var(--L)*2);padding-block:calc(var(--L)*4) calc(var(--L)*3)}
.hero.home{padding-block:calc(var(--L)*3) calc(var(--L)*1)}
.hero .v{display:flex;flex-direction:column;gap:var(--L);align-items:flex-start;max-width:60ch}
.knap{display:inline-block;background:var(--staal);color:var(--bund);font:500 17px/1 var(--disp);padding:var(--L) calc(var(--L)*1.4);text-decoration:none;border:0;cursor:pointer}
.knap:hover{text-decoration:underline;text-underline-offset:5px}
.knap:active{transform:translateY(1px)}
.lnk{color:var(--staal);text-decoration:underline;text-underline-offset:4px;font-weight:600}
.side{display:flex;flex-direction:column;justify-content:flex-end}
.lille{margin:0;width:170px}
.lille img,.stor-pt img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;background:var(--flade)}
.lille figcaption{margin-top:10px;font:500 14px/1.3 var(--disp)}
.stor-pt{margin:0;width:min(100%,360px)}
.hero.om .side,.hero.top .side{justify-content:flex-start}
.blok2{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);column-gap:calc(var(--L)*2);row-gap:var(--L);padding-block:calc(var(--L)*1) calc(var(--L)*2);font-size:20px;line-height:1.5}
.blok2 p{max-width:44ch}
.mx{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);width:100%;max-width:520px}
.mx .c{display:flex;flex-direction:column;justify-content:space-between;gap:10px;justify-content:flex-start;min-height:132px;padding:var(--L);text-decoration:none;color:var(--blaek);border:0 solid var(--linje)}
.mx .c:nth-child(odd){padding-left:0}
.mx .c:nth-child(-n+2){padding-top:0}
.mx .c:nth-child(n+3){padding-bottom:0}
.mx .c:nth-child(1),.mx .c:nth-child(3){}
.mx .c .t{font-family:var(--disp);font-size:20px;line-height:1.2;overflow-wrap:anywhere;color:var(--staal)}
.mx .c:hover .t{text-decoration:underline;text-underline-offset:5px}
.mx .c .d{font-size:15px;line-height:1.4;color:var(--daempet);max-width:26ch}
.afs{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);column-gap:calc(var(--L)*2);padding-block:calc(var(--L)*3);align-items:center}
.afs .v{display:flex;flex-direction:column;gap:var(--L);align-items:flex-start;max-width:44ch}
.strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--L);padding-block:calc(var(--L)*1) calc(var(--L)*4)}
.strip img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.ydel{padding-block:calc(var(--L)*4) calc(var(--L)*3);display:flex;flex-direction:column;gap:calc(var(--L)*3)}
.blok{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);column-gap:calc(var(--L)*2);row-gap:var(--L);align-items:start}
.blok h2{padding-top:2px;position:sticky;top:24px;align-self:start}
.hero.top + .ydel{padding-top:calc(var(--L)*1)}
.blok ul,.liste{margin:0;padding-left:1.1em;display:flex;flex-direction:column;gap:8px;max-width:60ch}
.cc{display:flex;flex-direction:column;gap:var(--L);max-width:60ch}
.cc .etik{margin-bottom:6px}
.ph{color:var(--daempet);font-style:italic}
.kontakt{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);column-gap:calc(var(--L)*2);padding-block:calc(var(--L)*4) calc(var(--L)*3);row-gap:calc(var(--L)*2)}
.kontakt .v{display:flex;flex-direction:column;gap:var(--L);max-width:60ch}
.felt{display:flex;flex-direction:column;gap:8px}
.felt label{font-family:var(--disp);font-weight:500;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--staal)}
.felt input,.felt textarea{font:400 17px/1.5 var(--tekst);color:var(--blaek);background:var(--bund);border:1px solid var(--blaek);border-radius:0;padding:12px 14px;width:100%}
.felt textarea{min-height:170px;resize:vertical}
.felt.fejl input,.felt.fejl textarea{border-width:2px;padding:11px 13px}
.felt .err{font-size:15px;min-height:0}
.samtykke{font-size:14px;color:var(--daempet);max-width:60ch}
.info{display:flex;flex-direction:column;gap:6px}
.tak{border:1px solid var(--blaek);padding:var(--L);max-width:60ch}
.tekstside{padding-block:calc(var(--L)*4) calc(var(--L)*3);display:flex;flex-direction:column;gap:var(--L)}
.tekstside .kol{max-width:65ch;display:flex;flex-direction:column;gap:var(--L)}
.tekstside h2{margin-top:var(--L);font-size:22px}
.fod{margin-top:auto;padding-block:calc(var(--L)*2) calc(var(--L)*1.5);display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);column-gap:calc(var(--L)*2);row-gap:var(--L);font-size:14px;line-height:1.6;color:var(--daempet)}
.fod p{overflow-wrap:anywhere}
.fod a{color:var(--daempet);text-decoration:underline;text-underline-offset:3px;margin-right:calc(var(--L)*1);cursor:pointer;display:inline-block;padding-block:12px}
@container site (max-width:900px){
 .site{--m:24px}
 .hero,.blok,.fod,.afs,.kontakt,.blok2{grid-template-columns:minmax(0,1fr)}
 .hero{padding-block:calc(var(--L)*2.5) calc(var(--L)*2);row-gap:calc(var(--L)*2.5)}
 .logo-l,.menu-btn{position:relative;z-index:6}
 .nav{display:none}
 .nav.open,.nav.closing{display:flex;position:absolute;left:0;right:0;top:0;height:min(100%,780px);z-index:5;background:var(--bund);flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:4px;padding:calc(var(--L)*5) var(--m) calc(var(--L)*2);font-family:var(--disp);font-weight:400;font-size:clamp(30px,9cqw,40px);letter-spacing:-.01em;line-height:1.15}
 .nav.open > a,.nav.closing > a{padding-block:8px}
 .nav .sprog{margin-top:calc(var(--L)*1.5);font:500 14px/1 var(--disp);letter-spacing:.06em}
 .nav .sprog a{padding-block:12px}
 .site.menu-open > :not(.head){visibility:hidden}
 .nav:focus{outline:none}
 .nav-info{margin-top:auto;font:400 14px/1.6 var(--tekst);letter-spacing:0;color:var(--daempet)}
 .nav.open .nav-info,.nav.closing .nav-info{display:block}
 .menu-btn{display:block}
 .wm{width:140px}
 .stor-pt{width:60%}.lille{width:120px}
 .blok h2{position:static}
 .afs{row-gap:calc(var(--L)*2)}
 .mx .c{padding:16px;min-height:120px}
 .mx .c:nth-child(odd){padding-left:0}
 .mx .c:nth-child(-n+2){padding-top:0}
 .mx .c:nth-child(n+3){padding-bottom:0}
 .mx .c .t{font-size:16px}
 .mx .c .d{font-size:14px}
 .strip{grid-template-columns:minmax(0,1fr)}

}
.site[hidden]{display:none}
@media (prefers-reduced-motion:no-preference){
 .knap{transition:transform .12s}
 @container site (max-width:900px){
  .nav.open{animation:navIn .35s ease-out both}
  .nav.closing{animation:navOut .22s ease-in both}
  .nav.open > a,.nav.open .sprog{animation:riseW .8s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(140ms + var(--i,0) * 75ms)}
  .nav.open .nav-info{animation:fade .9s ease-out both;animation-delay:520ms}
 }
 @keyframes navIn{from{opacity:0}to{opacity:1}}
 @keyframes navOut{from{opacity:1}to{opacity:0}}
 .site .r{animation:rise .9s cubic-bezier(.22,1,.36,1) both;animation-delay:var(--d,0ms)}
 .site h1 .w{display:inline-block;animation:riseW .9s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(120ms + var(--i,0) * 70ms)}
 .site .fade{animation:fade 1.2s ease-out both;animation-delay:820ms}
 @keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
 @keyframes riseW{from{opacity:0;transform:translateY(.4em)}to{opacity:1;transform:none}}
 @keyframes fade{from{opacity:0}to{opacity:1}}
}

/* Telefon og mail som links i løbende tekst (ikke den store fod-link-stil) */
.fod p a,.info a,.nav-info a{color:inherit;text-decoration:underline;text-underline-offset:3px;margin:0;padding:0;display:inline}
.cform button[disabled]{opacity:.6;cursor:progress}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}

.samtykke-bar{position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--blaek);color:var(--bund);
  padding-block:20px calc(20px + env(safe-area-inset-bottom,0px));padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px))}
.samtykke-bar .ind{max-width:1232px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;gap:16px 32px}
.samtykke-bar p{margin:0;flex:1 1 32ch;min-width:0;font-size:15px;line-height:1.5}
.samtykke-bar a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.samtykke-bar .valg{display:flex;gap:12px;flex-wrap:wrap}
.samtykke-bar button{font:500 16px/1 var(--disp);padding:14px 22px;cursor:pointer;border:1px solid var(--bund);background:var(--bund);color:var(--blaek)}
.samtykke-bar button:focus-visible{outline:2px solid var(--bund);outline-offset:3px}
