/* blindsens.com – fælles stil (v3). Fladt: ingen skygger, forløb, blur eller glød. Kun transform/opacity animeres. */

:root{
  --vw:min(1vw,14px);
  --bk:#000;--g1:#0b0b0b;--g2:#121212;--ln:#1d1d1d;--ln2:#2a2a2a;--ln3:#3a3a3a;
  --t1:#fff;--t2:#b4b4b4;--t3:#7f7f7f;
  --lime:#e4ff33;--lime2:#efff7a;--cyan:#12eeff;--vio:#b18cff;
  --fd:"Montserrat",ui-sans-serif,system-ui,sans-serif;
  --fb:"Inter",ui-sans-serif,system-ui,sans-serif;
  --max:1320px;--pad:clamp(16px,calc(var(--vw) * 3.4),40px);--nav:72px;
  --sec:clamp(104px,calc(var(--vw) * 11),176px);
  --e-lid:cubic-bezier(.76,0,.24,1);--e-out:cubic-bezier(.16,1,.3,1);--e-seam:cubic-bezier(.65,0,.35,1);
}
@media (max-width:860px){:root{--nav:64px}}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{color-scheme:dark;scrollbar-color:#2e2e2e #000;background:var(--bk);color:var(--t1);-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--nav)}
body{min-height:100vh;background:var(--bk);color:var(--t2);font:400 17px/1.6 var(--fb);font-optical-sizing:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
@media (max-width:560px){body{font-size:16px}}
img,video,svg,canvas{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ol,ul{list-style:none}
h1,h2,h3,h4{font-weight:600;color:var(--t1)}
p{text-wrap:pretty}
b,strong{font-weight:600;color:var(--t1)}
::selection{background:var(--lime);color:#000}
:focus{outline:none}
:focus-visible{outline:2px solid var(--lime);outline-offset:3px}
[hidden]{display:none!important}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- typografi ---------- */
.d-xxl,.d-xl,.d-l,.d-m{font-family:var(--fd);font-weight:600;color:var(--t1);text-wrap:balance}
.d-xxl{font-size:clamp(52px,calc(var(--vw) * 10.2),172px);line-height:.9;letter-spacing:-.047em}
.d-xl{font-size:clamp(38px,calc(var(--vw) * 5.9),92px);line-height:.96;letter-spacing:-.042em}
.d-l{font-size:clamp(30px,calc(var(--vw) * 3.7),56px);line-height:1.02;letter-spacing:-.034em}
.d-m{font-size:clamp(21px,calc(var(--vw) * 1.9),26px);line-height:1.18;letter-spacing:-.018em}
.lead{font-size:clamp(18px,calc(var(--vw) * 1.45),21px);line-height:1.5;color:var(--t2);max-width:34em}
.num{font-family:var(--fb);font-weight:200;font-feature-settings:"tnum" 1;letter-spacing:-.035em;color:var(--t1)}
.small{font-size:14px;line-height:1.55;color:var(--t3)}
.tn{font-feature-settings:"tnum" 1}

/* ---------- ramme ---------- */
.in{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--pad)}
.split{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);column-gap:calc(100% / 12);align-items:end}
.split > p{max-width:30em}
@media (max-width:900px){.split{grid-template-columns:minmax(0,1fr);row-gap:24px}}

/* ---------- mærke og ordmærke ---------- */
.mark{width:28px;height:28px;flex:none;overflow:visible}
.wm{font:600 16px/1 var(--fd);letter-spacing:.16em;margin-right:-.16em;color:var(--t1);white-space:nowrap}
.wm span{color:var(--lime)}

/* ---------- knapper ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 24px;border-radius:999px;font:600 15px/1 var(--fb);letter-spacing:-.005em;white-space:nowrap;border:1px solid transparent;transition:background-color .25s,color .25s,border-color .25s,transform .5s var(--e-out)}
.btn svg{width:14px;height:14px;flex:none}
.btn.pri{background:var(--lime);color:#000}
.btn.pri:hover{background:var(--lime2)}
.btn.pri:active{transform:scale(.97)}
.btn svg{transition:transform .45s var(--e-out)}
.btn:hover svg{transform:translateX(2px)}
.btn.sec{color:var(--t1);border-color:var(--ln3)}
.btn.sec:hover{border-color:var(--t1)}
.btn.sm{height:40px;padding:0 18px;font-size:14px}
.steam{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 4px;font:500 15px/1 var(--fb);color:var(--t2);white-space:nowrap}
.steam svg{width:18px;height:18px;flex:none;color:var(--t1)}
.ctas{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}

/* ---------- navigation ---------- */
.skip{position:fixed;left:16px;top:12px;z-index:200;padding:10px 16px;border-radius:999px;background:var(--lime);color:#000;font:600 14px/1 var(--fb);transform:translateY(-200%)}
.skip:focus-visible{transform:none}
.nav{position:fixed;left:0;right:0;top:0;z-index:50;height:var(--nav);background:#000;border-bottom:1px solid var(--ln);transition:background-color .35s,border-color .35s}
.nav .in{height:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:inline-flex;align-items:center;gap:12px;flex:none}
.nav nav{display:flex;align-items:center;gap:30px}
.nav nav a:not(.btn){position:relative;font:500 15px/1 var(--fb);color:var(--t2);transition:color .2s}
.nav nav a:not(.btn):hover,.nav nav a[aria-current="page"]{color:var(--t1)}
.nav nav a:not(.btn)::before{content:"";position:absolute;left:0;right:0;bottom:-7px;height:1px;background:var(--lime);transform:scaleX(0);transition:transform .35s var(--e-seam)}
.nav nav a:not(.btn):hover::before{transform:scaleX(1)}
.nav nav a[aria-current="page"]:hover::before{transform:scaleX(0)}
.nav nav a[aria-current="page"]::after{content:"";position:absolute;left:50%;bottom:-12px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--lime)}
.mbtn{display:none;align-items:center;gap:12px;height:40px;padding:0 4px 0 12px;font:600 14px/1 var(--fb);color:var(--t1)}
.mbtn .ic{position:relative;width:22px;height:12px}
.mbtn .ic i{position:absolute;left:0;right:0;height:2px;background:currentColor;border-radius:2px;transition:transform .45s var(--e-lid),background-color .3s}
.mbtn .ic i:first-child{top:0}
.mbtn .ic i:last-child{bottom:0}
@media (max-width:860px){.nav nav{display:none}.mbtn{display:inline-flex}}
body.nav-clear .nav{background:transparent;border-bottom-color:transparent}
body.nav-clear .nav.solid{background:#000;border-bottom-color:var(--ln)}

/* ---------- menu (mobil) ---------- */
.menu{position:fixed;inset:0;z-index:90;display:none;flex-direction:column;background:transparent;overflow-y:auto;overscroll-behavior:contain}
.menu.on{display:flex}
.menu .bar{height:var(--nav);flex:none}
.menu .bar .in{height:100%;display:flex;align-items:center;justify-content:space-between}
.menu .mbtn{display:inline-flex}
.menu .mbtn .ic i:first-child{transform:translateY(5px)}
.menu .mbtn .ic i:last-child{transform:translateY(-5px);background:var(--lime)}
.menu .body{flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:48px;padding:clamp(24px,6vh,56px) 0 32px}
.menu .big a{display:block;font:600 clamp(36px,calc(var(--vw) * 10),64px)/1.08 var(--fd);letter-spacing:-.04em;color:var(--t1);padding:4px 0}
.menu .big a:active{color:var(--lime)}
.menu .sm{display:flex;flex-wrap:wrap;gap:12px 28px;font:500 16px/1.4 var(--fb);color:var(--t2)}
.menu .fx{opacity:0;transform:translateY(18px);transition:opacity .45s,transform .7s var(--e-out)}
.menu.show .fx{opacity:1;transform:none}
.menu.show .fx:nth-child(2){transition-delay:.05s}.menu.show .fx:nth-child(3){transition-delay:.1s}.menu.show .fx:nth-child(4){transition-delay:.15s}.menu.show .fx:nth-child(5){transition-delay:.2s}
.menu .foot{display:flex;flex-direction:column;gap:22px}
html.menu-on,html.menu-on body{overflow:hidden}
html.menu-on .lids .s{opacity:0;transition:opacity .25s linear .1s}

/* ---------- øjenlåg: menu, sideskift og hop ---------- */
.lids{position:fixed;inset:0;z-index:80;pointer-events:none;visibility:hidden}
.lids i{position:absolute;left:0;right:0;display:block}
.lids .t,.lids .b{height:50.1%;background:#000;transition:transform .42s var(--e-lid)}
.lids .t{top:0;transform:translateY(-101%)}
.lids .b{bottom:0;transform:translateY(101%)}
.lids .s{top:50%;height:2px;margin-top:-1px;background:var(--lime);transform:scaleX(0);transition:transform .32s var(--e-seam) .16s,opacity .25s linear}
.lids.on{visibility:visible;pointer-events:auto}
.lids.shut .t,.lids.shut .b{transform:none}
.lids.shut .s{transform:scaleX(1)}
.lids.opening .t,.lids.opening .b{transition:transform .72s var(--e-lid)}
.lids.opening .s{opacity:0;transition:opacity .28s linear .12s}
html.veil-in .lids{visibility:visible}
html.veil-in .lids .t,html.veil-in .lids .b{transform:none;transition:none}
html.veil-in .lids .s{transform:scaleX(1);transition:none}

/* ---------- linjer, der åbner som et øje (hero, slutning, footer) ---------- */
.eye .ln{display:block}
.eye .w{position:relative;display:inline-block}
.js .eye .t{display:inline-block;transform:scaleY(.04);transform-origin:50% 58%;opacity:0}
.js .eye .w::after{content:"";position:absolute;left:0;right:0;top:58%;height:2px;margin-top:-1px;background:var(--lime);transform:scaleX(0);transform-origin:0 50%}
.js .eye.go .w::after{transform:scaleX(1);opacity:0;transition:transform .42s var(--e-seam),opacity .28s linear .62s}
.js .eye.go .t{transform:none;opacity:1;transition:transform .82s var(--e-lid) .36s,opacity .12s linear .36s}
.js .eye.go .ln:nth-child(2) .w::after{transition-delay:.14s,.76s}
.js .eye.go .ln:nth-child(2) .t{transition-delay:.5s,.5s}

.ft-wm .ln,.ft-wm .w,.ft-wm .t,.js .ft-wm.eye .t{display:block}
.js .ft-wm .t{transform-origin:50% 50%}
.js .ft-wm .w::after{top:50%}

/* ---------- sektioner ---------- */
main{display:block}
.sec{padding-block:var(--sec)}
.rule{border-top:1px solid var(--ln)}

/* ---------- footer ---------- */
.ft{position:relative;border-top:1px solid var(--ln);padding-top:clamp(64px,calc(var(--vw) * 8),112px);overflow:hidden}
.ft-grid{display:grid;grid-template-columns:minmax(0,5fr) repeat(3,minmax(0,2fr));gap:40px 32px}
.ft-grid .say{font:600 clamp(22px,calc(var(--vw) * 2),28px)/1.15 var(--fd);letter-spacing:-.02em;color:var(--t1);max-width:14em}
.ft-grid .steam{height:auto;margin-top:22px}
.ft-grid h2{font:500 14px/1 var(--fb);color:var(--t3);margin-bottom:18px}
.ft-grid ul{display:flex;flex-direction:column;gap:12px}
.ft-grid ul a{font:500 16px/1.3 var(--fb);color:var(--t2);transition:color .2s;overflow-wrap:anywhere}
.ft-grid ul a:hover{color:var(--t1)}
.ft-legal{margin-top:clamp(56px,calc(var(--vw) * 7),96px);padding-top:24px;border-top:1px solid var(--ln);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 40px;font-size:13.5px;line-height:1.6;color:var(--t3)}
.ft-legal p{max-width:none}
.ft-legal a{color:var(--t2)}
.ft-wm{display:block;margin-top:clamp(32px,calc(var(--vw) * 4),56px);padding-bottom:clamp(20px,calc(var(--vw) * 2.6),40px);user-select:none}
.ft-wm svg{width:100%;height:auto;overflow:visible}
@media (max-width:1000px){.ft-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.ft-grid > :first-child{grid-column:1/-1}}
@media (max-width:560px){.ft-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ft-grid > :last-child{grid-column:1/-1}}

/* ---------- dokument-sider (support, privatliv, presse) ---------- */
.page{padding-top:calc(var(--nav) + clamp(56px,calc(var(--vw) * 8),120px));padding-bottom:var(--sec)}
.page-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);column-gap:calc(100% / 12);align-items:end;padding-bottom:clamp(40px,calc(var(--vw) * 5),72px);border-bottom:1px solid var(--ln)}
.page-head .kick{display:flex;align-items:center;gap:10px;margin-bottom:28px;font:500 15px/1 var(--fb);color:var(--t3)}
.page-head .kick .mark{width:18px;height:18px}
.page-head p{font-size:clamp(17px,calc(var(--vw) * 1.35),19px);color:var(--t2);max-width:30em}
.page-head p a,.prose a,.faq a,.note a{color:var(--t1);border-bottom:1px solid var(--lime);transition:color .2s}
.page-head p a:hover,.prose a:hover,.faq a:hover,.note a:hover{color:var(--lime)}
@media (max-width:900px){.page-head{grid-template-columns:minmax(0,1fr);row-gap:24px}}
.page-body{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);column-gap:calc(100% / 12);padding-top:clamp(40px,calc(var(--vw) * 5),72px)}
.page-body > aside{position:relative}
.page-body > aside .stick{position:sticky;top:calc(var(--nav) + 32px)}
@media (max-width:900px){.page-body{grid-template-columns:minmax(0,1fr);row-gap:40px}.page-body > aside .stick{position:static}.page-body > aside .toc{display:none}.page-body > aside .small{margin-top:0!important}}
.toc{display:flex;flex-direction:column;gap:2px;border-left:1px solid var(--ln2)}
.toc a{display:block;padding:8px 0 8px 18px;margin-left:-1px;border-left:1px solid transparent;font:500 15px/1.35 var(--fb);color:var(--t3);transition:color .2s,border-color .2s}
.toc a:hover{color:var(--t1)}
.toc a.on{color:var(--t1);border-left-color:var(--lime)}
.prose{max-width:40em}
.prose h2{font:600 clamp(22px,calc(var(--vw) * 2),28px)/1.15 var(--fd);letter-spacing:-.02em;margin-top:64px;scroll-margin-top:calc(var(--nav) + 24px)}
.prose h2:first-child{margin-top:0}
.prose p,.prose li{margin-top:16px;color:var(--t2)}
.prose ul{margin-top:8px}
.prose ul li{position:relative;padding-left:22px}
.prose ul li::before{content:"";position:absolute;left:2px;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--ln3)}
.note{padding:24px 26px;border:1px solid var(--ln2);border-radius:18px;color:var(--t2)}
.note b{display:block;font:600 13px/1 var(--fb);color:var(--t1);margin-bottom:10px}
.card-mail{display:flex;flex-direction:column;gap:14px;padding:26px;border:1px solid var(--ln2);border-radius:20px}
.card-mail .addr{font:600 clamp(18px,calc(var(--vw) * 1.6),22px)/1.2 var(--fd);letter-spacing:-.01em;color:var(--t1);overflow-wrap:anywhere}
.card-mail .addr:hover{color:var(--lime)}
.card-mail p{font-size:15px;color:var(--t3)}
.card-mail p a{color:var(--t2);border-bottom:1px solid var(--ln3);transition:color .2s,border-color .2s}
.card-mail p a:hover{color:var(--t1);border-color:var(--lime)}

/* FAQ */
.faq{border-top:1px solid var(--ln2)}
.faq details{border-bottom:1px solid var(--ln2)}
.faq summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:minmax(0,1fr) 24px;align-items:center;gap:24px;padding:24px 0;font:600 clamp(18px,calc(var(--vw) * 1.5),21px)/1.3 var(--fd);letter-spacing:-.015em;color:var(--t1);transition:color .2s}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--lime)}
.faq summary .pm{position:relative;width:24px;height:24px}
.faq summary .pm::before,.faq summary .pm::after{content:"";position:absolute;left:4px;right:4px;top:50%;height:2px;margin-top:-1px;background:var(--t1);border-radius:2px;transition:transform .45s var(--e-lid),background-color .3s}
.faq summary .pm::after{transform:rotate(90deg)}
.faq details[open] summary .pm::after{transform:rotate(0)}
.faq details[open] summary .pm::before,.faq details[open] summary .pm::after{background:var(--lime)}
.faq .ans{padding:0 48px 26px 0;color:var(--t2)}
.faq .ans p + p{margin-top:12px}

/* fakta-tabel (presse) */
.sheet{width:100%;border-collapse:collapse;font-size:16px}
.sheet th,.sheet td{text-align:left;vertical-align:top;padding:16px 0;border-bottom:1px solid var(--ln2)}
.sheet th{width:36%;font-weight:500;color:var(--t3);padding-right:20px}
.sheet td{color:var(--t1)}
.dl{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;margin-top:20px}
.dl a{display:flex;flex-direction:column;border:1px solid var(--ln2);border-radius:16px;overflow:hidden;transition:border-color .25s}
.dl a:hover{border-color:var(--t1)}
.dl .im{aspect-ratio:16/9;background:var(--g1);overflow:hidden}
.dl .im img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--e-out)}
.dl a:hover .im img{transform:scale(1.04)}
.dl .im.fit img{object-fit:contain;padding:22px}
.dl .cap{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:14px 16px;font-size:14px;line-height:1.4;color:var(--t2)}
.dl .cap small{flex:none;font-size:12.5px;color:var(--t3);font-feature-settings:"tnum" 1}
.copy{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;border:1px solid var(--ln3);border-radius:999px;font:600 13px/1 var(--fb);color:var(--t1);transition:border-color .2s,color .2s}
.copy:hover{border-color:var(--t1)}
.copy.ok{border-color:var(--lime);color:var(--lime)}
.blurb{position:relative;padding:24px 26px;border:1px solid var(--ln2);border-radius:18px}
.blurb p{margin-top:0;color:var(--t1)}
.blurb .copy{margin-top:18px}

@media (prefers-reduced-motion:reduce){
  .js .eye .t{transform:none;opacity:1}
  .js .eye .w::after{display:none}
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}
