@font-face{font-family:'Anton';font-weight:400;font-display:swap;src:url(fonts/anton.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'Anton';font-weight:400;font-display:swap;src:url(fonts/anton-ext.woff2) format('woff2');unicode-range:U+0100-024F,U+1E00-1EFF,U+20A0-20AB,U+20AD-20CF}
@font-face{font-family:'Poppins';font-weight:400;font-display:swap;src:url(fonts/poppins-400.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'Poppins';font-weight:400;font-display:swap;src:url(fonts/poppins-400-ext.woff2) format('woff2');unicode-range:U+0100-024F,U+1E00-1EFF,U+20A0-20AB,U+20AD-20CF}
@font-face{font-family:'Poppins';font-weight:600;font-display:swap;src:url(fonts/poppins-600.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'Poppins';font-weight:600;font-display:swap;src:url(fonts/poppins-600-ext.woff2) format('woff2');unicode-range:U+0100-024F,U+1E00-1EFF,U+20A0-20AB,U+20AD-20CF}
@font-face{font-family:'Poppins';font-weight:700;font-display:swap;src:url(fonts/poppins-700.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'Poppins';font-weight:700;font-display:swap;src:url(fonts/poppins-700-ext.woff2) format('woff2');unicode-range:U+0100-024F,U+1E00-1EFF,U+20A0-20AB,U+20AD-20CF}
@font-face{font-family:'Poppins';font-weight:800;font-display:swap;src:url(fonts/poppins-800.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'Poppins';font-weight:800;font-display:swap;src:url(fonts/poppins-800-ext.woff2) format('woff2');unicode-range:U+0100-024F,U+1E00-1EFF,U+20A0-20AB,U+20AD-20CF}
:root{color-scheme:dark;--ink:#05070c;--panel:#0d1519;--line:#1f3540;--cyan:#00c8f0;--yellow:#ffe600;--white:#f4fbfd;--muted:#8fb3bf}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;background:var(--ink);overflow-x:hidden}
main{overflow-x:clip}
body{min-height:100vh;background:var(--ink);color:var(--white);font:400 16px/1.55 Poppins,system-ui,sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:3px solid var(--yellow);outline-offset:3px;border-radius:6px}
em{font-style:normal;color:var(--yellow)}

/* Baggrund: glødende kugler + neongulv */
.bg{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.orb{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;animation:drift 18s ease-in-out infinite alternate}
.o1{width:60vmax;height:60vmax;left:-20vmax;top:-25vmax;background:radial-gradient(circle,#00c8f0 0,transparent 65%)}
.o2{width:45vmax;height:45vmax;right:-18vmax;top:10vh;background:radial-gradient(circle,#0a5f78 0,transparent 65%);animation-duration:24s}
.o3{width:35vmax;height:35vmax;left:30vw;bottom:-20vmax;background:radial-gradient(circle,#ffe600 0,transparent 60%);opacity:.14;animation-duration:30s}
@keyframes drift{to{transform:translate(6vmax,4vmax) scale(1.1)}}
.floor{position:absolute;left:-50%;right:-50%;bottom:-10vh;height:55vh;transform:perspective(420px) rotateX(62deg);transform-origin:bottom;
  background-image:linear-gradient(rgba(0,200,240,.35) 1px,transparent 1px),linear-gradient(90deg,rgba(0,200,240,.35) 1px,transparent 1px);
  background-size:60px 60px;animation:run 3s linear infinite;
  -webkit-mask-image:linear-gradient(to top,#000 0,transparent 85%);mask-image:linear-gradient(to top,#000 0,transparent 85%)}
@keyframes run{to{background-position:0 60px}}

/* Top */
.top{position:fixed;top:0;left:0;right:0;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:14px max(16px,env(safe-area-inset-left)) 14px;
  background:linear-gradient(#05070ccc,#05070c00)}
.brand{display:flex;align-items:center;gap:10px;font:400 20px/1 Anton,Impact,sans-serif;letter-spacing:.06em}
.mini svg{width:30px;height:32px;display:block}

/* Knapper */
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--yellow);color:var(--ink);font:400 18px/1 Anton,Impact,sans-serif;letter-spacing:.08em;
  padding:12px 20px;border-radius:12px;box-shadow:0 0 0 0 rgba(255,230,0,.5);transition:transform .15s,box-shadow .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 30px -8px rgba(255,230,0,.6)}
.btn.sm{font-size:15px;padding:9px 14px;border-radius:10px}
.btn.big{font-size:26px;padding:18px 34px;border-radius:16px;animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(255,230,0,.45)}50%{box-shadow:0 0 0 14px rgba(255,230,0,0)}}

/* Hero */
.hero{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:96px 16px 70px;position:relative}
.shield{width:132px;filter:drop-shadow(0 0 22px rgba(0,200,240,.75));animation:float 5s ease-in-out infinite;margin-bottom:18px}
.shield svg{width:100%;height:auto;display:block}
.shield.sm{width:84px;margin:0 auto 16px}
@keyframes float{50%{transform:translateY(-10px) rotate(-2deg)}}
.kicker{color:var(--cyan);font-weight:700;font-size:13px;letter-spacing:.28em;text-transform:uppercase;max-width:340px}
@media (min-width:760px){.kicker{max-width:none}}
h1{font:400 clamp(64px,19vw,190px)/.86 Anton,Impact,sans-serif;text-transform:uppercase;margin:14px 0 16px;letter-spacing:.01em}
h1 .l1{display:block;background:linear-gradient(180deg,#fff 30%,#9eeeff);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 40px rgba(0,200,240,.25)}
h1 .l2{display:block;color:transparent;-webkit-text-stroke:2px var(--yellow);text-shadow:0 0 28px rgba(255,230,0,.35);animation:flicker 6s infinite}
@keyframes flicker{0%,92%,100%{opacity:1}93%{opacity:.35}94%{opacity:1}96%{opacity:.5}97%{opacity:1}}
.tag{font-size:clamp(17px,4.4vw,22px);color:#cfe7ee}
.tag b{color:var(--yellow)}

.count{display:flex;gap:10px;margin:28px 0 8px}
.count div{min-width:74px;padding:12px 8px 8px;border:1px solid var(--line);border-radius:14px;background:rgba(13,21,25,.72);backdrop-filter:blur(6px)}
.count b{display:block;font:400 40px/1 Anton,Impact,sans-serif;color:var(--white);font-variant-numeric:tabular-nums}
.count span{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.count.done{display:none}
.state{color:var(--muted);font-size:14px;margin-bottom:26px}
.state.live{color:var(--yellow);font-weight:700;font-size:17px}
.state.live::before{content:'';display:inline-block;width:10px;height:10px;border-radius:50%;background:#ff3b3b;margin-right:8px;animation:blink 1s infinite}
@keyframes blink{50%{opacity:.2}}
.fine{margin-top:14px;font-size:13px;color:var(--muted)}
.scroll{position:absolute;bottom:18px;left:50%;width:26px;height:42px;margin-left:-13px;border:2px solid var(--line);border-radius:14px}
.scroll span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--cyan);animation:wheel 1.6s infinite}
@keyframes wheel{to{transform:translateY(14px);opacity:0}}

/* Rullebånd */
.marquee{background:var(--yellow);color:var(--ink);transform:rotate(-2deg);margin:10px -10px 40px;overflow:hidden;box-shadow:0 0 40px rgba(255,230,0,.25)}
.track{display:flex;width:max-content;animation:slide 26s linear infinite}
.track span,.track i{font:400 26px/1 Anton,Impact,sans-serif;letter-spacing:.06em;padding:14px 16px;white-space:nowrap;font-style:normal}
@keyframes slide{to{transform:translateX(-50%)}}

/* Sektioner */
.wrap{max-width:1080px;margin:0 auto;padding:40px 16px}
h2{font:400 clamp(40px,9vw,72px)/1 Anton,Impact,sans-serif;text-transform:uppercase;margin-bottom:22px}
.sub{color:var(--muted);margin:-10px 0 22px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.card{position:relative;overflow:hidden;background:linear-gradient(160deg,#0f1c22,#0a1115);border:1px solid var(--line);border-radius:20px;padding:24px 22px 22px}
.card::after{content:'';position:absolute;inset:0;border-radius:20px;background:radial-gradient(120% 70% at 100% 0,rgba(0,200,240,.16),transparent 60%);pointer-events:none}
.num{font:400 88px/.9 Anton,Impact,sans-serif;color:transparent;-webkit-text-stroke:2px var(--cyan);margin-bottom:10px}
.card h3{font:400 28px/1.1 Anton,Impact,sans-serif;text-transform:uppercase;letter-spacing:.02em;margin-bottom:8px}
.card p{color:#cfe7ee;font-size:15px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.chips span{font-size:12px;font-weight:700;padding:5px 10px;border-radius:99px;border:1px solid var(--line)}
.c1{color:var(--cyan)}.c2{color:var(--yellow)}.c3{color:var(--white)}

.lineup{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.slot{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:14px;text-align:center;transition:transform .2s,border-color .2s}
.slot:hover{transform:translateY(-4px) rotate(-1deg);border-color:var(--cyan)}
.ph{width:100%;aspect-ratio:1;border-radius:14px;background:#132128 center/cover no-repeat;margin-bottom:10px;box-shadow:inset 0 0 0 2px rgba(0,200,240,.25)}
.ph.q{display:flex;align-items:center;justify-content:center;font:400 72px/1 Anton,Impact,sans-serif;color:var(--cyan);
  background:repeating-linear-gradient(135deg,#0f1c22 0 10px,#0b151a 10px 20px);text-shadow:0 0 24px rgba(0,200,240,.8)}
.nm{font:400 22px/1 Anton,Impact,sans-serif;text-transform:uppercase;letter-spacing:.03em}
.secret .nm{color:var(--muted);font-size:17px}
.tm{margin-top:6px;display:inline-block;font-weight:700;font-size:13px;color:var(--ink);background:var(--cyan);border-radius:99px;padding:2px 10px}

.final{text-align:center;padding:70px 16px 60px;max-width:720px;margin:0 auto}
.final p{color:#cfe7ee;margin:-8px 0 26px}
.foot{text-align:center;color:#4f6d78;font-size:12px;padding:20px 16px 34px}

/* Animation ved scroll */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i,0) * 60ms)}
.reveal.in{opacity:1;transform:none}

@media (min-width:760px){.count div{min-width:96px}.count b{font-size:54px}.shield{width:170px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}
.feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}
.feat{display:flex;gap:14px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:14px 16px}
.feat .ic{flex:none;width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;background:rgba(0,200,240,.1);box-shadow:inset 0 0 0 1px rgba(0,200,240,.35)}
.feat b{display:block;font:400 20px/1.1 Anton,Impact,sans-serif;text-transform:uppercase;letter-spacing:.02em}
.feat span{font-size:14px;color:#cfe7ee}
.center{text-align:center;margin-top:22px}