@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Space+Grotesk:wght@400;500&display=swap');
:root{--bg:#070707;--ink:#f5f2e8;--mute:#8d8a80;--y:#ffcc00;--logo:url(logo.png);--h:"Archivo Black","Helvetica Neue",Arial,sans-serif;--b:"Space Grotesk",Arial,sans-serif}
html{scroll-padding-top:90px;scroll-behavior:smooth}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--b);overflow-x:hidden;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
button{font-family:inherit;cursor:pointer}a{color:inherit}
.ann{background:#0b0b0b;border-bottom:1px solid #1d1d1b;text-align:center;font-size:11px;letter-spacing:.25em;padding:9px;color:var(--mute);text-transform:uppercase}
nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px 5vw;background:rgba(7,7,7,.85);backdrop-filter:blur(14px);border-bottom:1px solid #151514;font-size:12px;letter-spacing:.2em;text-transform:uppercase}
.lg{display:block;width:70px;height:30px;background:var(--logo) center/contain no-repeat}
nav .links a{text-decoration:none;margin-right:26px;transition:.2s;padding-bottom:5px}
nav .links a:hover{color:var(--y)}
nav .links a.on{border-bottom:2px solid var(--y)}
.cartb{background:none;border:1px solid #333;color:var(--ink);padding:9px 16px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;transition:.2s}
.cartb:hover{border-color:var(--ink)}
.hero{position:relative;min-height:86vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:50px 5vw 100px;background:radial-gradient(ellipse 60% 45% at 50% 40%,rgba(255,255,255,.05),transparent 70%)}
.pill{font-size:11px;letter-spacing:.3em;text-transform:uppercase;border:1px solid #2c2c29;padding:8px 16px;border-radius:99px;color:var(--mute);margin-bottom:40px}
.pill i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--y);box-shadow:0 0 10px var(--y);margin-right:10px}
.logo-wrap{position:relative;width:min(620px,84vw)}
.logo-wrap img{width:100%;display:block;animation:float 5s ease-in-out infinite;position:relative;z-index:2}
.glow{position:absolute;left:50%;bottom:-46px;width:90%;height:34px;transform:translateX(-50%);background:radial-gradient(ellipse at center,var(--y) 0%,rgba(255,204,0,.55) 35%,transparent 70%);filter:blur(14px);animation:pulse 5s ease-in-out infinite}
.bar{position:absolute;left:50%;bottom:-34px;width:70%;height:3px;transform:translateX(-50%);background:var(--y);border-radius:3px;box-shadow:0 0 18px 4px var(--y),0 0 70px 18px rgba(255,204,0,.45)}
@keyframes float{50%{transform:translateY(-14px)}}
@keyframes pulse{50%{opacity:.55;transform:translateX(-50%) scaleX(.88)}}
.tag{margin-top:96px;font-size:clamp(13px,2vw,17px);letter-spacing:.35em;text-transform:uppercase;color:var(--mute)}
.btn{display:inline-block;margin-top:28px;padding:16px 36px;background:var(--ink);color:#000;border:0;text-decoration:none;text-transform:uppercase;letter-spacing:.18em;font-size:12px;font-weight:500;clip-path:polygon(0 0,100% 0,calc(100% - 14px) 100%,0 100%);transition:.25s}
.btn:hover{background:var(--y);box-shadow:0 0 40px var(--y)}
.marq{overflow:hidden;border-block:1px solid #1d1d1b;background:#0b0b0b;padding:14px 0;white-space:nowrap}
.marq div{display:inline-block;animation:m 26s linear infinite;font-family:var(--h);font-size:22px;letter-spacing:.08em;text-transform:uppercase}
.marq i{color:var(--y);font-style:normal;margin:0 22px}
@keyframes m{to{transform:translateX(-50%)}}
section{padding:80px 5vw}
.ph{padding:90px 5vw 50px;border-bottom:1px solid #151514;background:radial-gradient(ellipse 70% 100% at 50% 0,rgba(255,255,255,.06),transparent 70%)}
.ph h1{font-family:var(--h);font-size:clamp(44px,9vw,120px);line-height:.95;margin:0;text-transform:uppercase;letter-spacing:-.03em}
.ph h1 span{color:transparent;-webkit-text-stroke:2px var(--ink)}
.ph p{max-width:560px;color:var(--mute);font-size:18px;line-height:1.6;margin:22px 0 0}
.ph::after{content:"";display:block;width:120px;height:3px;background:var(--y);box-shadow:0 0 22px 3px var(--y);margin-top:34px}
.kick{font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--mute);margin-bottom:14px}
h2{font-family:var(--h);font-size:clamp(30px,5vw,60px);margin:0 0 36px;text-transform:uppercase;letter-spacing:-.02em;line-height:1}
h2 span{color:transparent;-webkit-text-stroke:1.5px var(--ink)}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.tile{position:relative;aspect-ratio:4/5;border:1px solid #1d1d1b;padding:24px;display:flex;flex-direction:column;justify-content:flex-end;background:radial-gradient(ellipse 80% 50% at 50% 0,rgba(255,255,255,.08),transparent 70%),#0c0c0b;text-decoration:none;overflow:hidden;transition:.35s}
.tile b{position:absolute;top:10px;right:18px;font-family:var(--h);font-size:110px;line-height:1;color:transparent;-webkit-text-stroke:1px #2a2a27;transition:.35s}
.tile h3{font-family:var(--h);font-size:30px;margin:0;text-transform:uppercase}
.tile span{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);margin-top:8px}
.tile::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--y);box-shadow:0 0 24px 4px var(--y);transform:scaleX(0);transition:.4s}
.tile:hover{border-color:#3a3a36;transform:translateY(-6px)}.tile:hover::after{transform:scaleX(1)}.tile:hover b{-webkit-text-stroke-color:var(--ink)}
.tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:40px}
.tabs button{background:none;border:1px solid #2a2a27;color:var(--ink);padding:11px 22px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;transition:.2s}
.tabs button:hover{border-color:var(--ink)}.tabs button.on{background:var(--ink);color:#000;border-color:var(--ink)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:34px 26px}
.card{position:relative}
.pic{position:relative;aspect-ratio:4/5;border:1px solid #1d1d1b;background:radial-gradient(ellipse 80% 55% at 50% 16%,rgba(255,255,255,.09),transparent 70%),linear-gradient(#141413,#080807);display:grid;place-items:center;transition:.35s}
.pic::before{content:"";position:absolute;left:14%;right:14%;bottom:19%;height:3px;border-radius:50%;background:var(--y);opacity:.75;box-shadow:0 0 10px 2px var(--y),0 -8px 36px 6px rgba(255,204,0,.2);z-index:1;transition:.35s}
.pic::after{content:"";position:absolute;left:10%;right:10%;bottom:-14px;height:10px;background:var(--y);border-radius:50%;filter:blur(12px);opacity:.12;transition:.35s}
.g{position:relative;width:66%;z-index:2;margin-top:-14%;filter:drop-shadow(0 16px 16px rgba(0,0,0,.75));transition:.35s}
.g svg{width:100%;display:block}
.pr{position:absolute;left:50%;transform:translateX(-50%);aspect-ratio:1.7;background:var(--logo) center/contain no-repeat}
.badge{position:absolute;top:12px;left:12px;z-index:3;background:var(--ink);color:#000;font-size:10px;letter-spacing:.2em;padding:5px 9px;text-transform:uppercase}
.card:hover .pic{transform:translateY(-8px);border-color:#4a4a46}.card:hover .g{transform:translateY(-8px) scale(1.04)}
.card:hover .pic::before{opacity:1;box-shadow:0 0 22px 6px var(--y),0 -10px 60px 14px rgba(255,204,0,.5)}
.card:hover .pic::after{opacity:1;bottom:-22px;left:2%;right:2%;height:16px;box-shadow:0 0 50px 14px rgba(255,204,0,.55)}
.meta{display:flex;justify-content:space-between;margin-top:22px;font-size:14px;letter-spacing:.06em;text-transform:uppercase}
.sz{display:flex;gap:6px;margin:12px 0}
.sz button{flex:1;background:none;border:1px solid #2a2a27;color:var(--mute);padding:8px 0;font-size:11px;transition:.2s}.sz button.on{border-color:var(--ink);color:var(--ink)}
.addb{width:100%;background:none;border:1px solid var(--ink);color:var(--ink);padding:13px;font-size:11px;letter-spacing:.22em;text-transform:uppercase;transition:.25s}.addb:hover{background:var(--ink);color:#000}
.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:50px;align-items:start}
.two p,.txt p{font-size:18px;line-height:1.65;color:#bdbaaf;margin:0 0 22px}
.vals{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.val{border:1px solid #1d1d1b;padding:30px;background:#0c0c0b;transition:.3s}.val:hover{border-color:var(--y);box-shadow:0 12px 40px -18px var(--y)}
.val b{font-family:var(--h);font-size:44px;color:transparent;-webkit-text-stroke:1px var(--ink);display:block;margin-bottom:14px;font-weight:400}
.val h3{font-family:var(--h);font-weight:400;text-transform:uppercase;margin:0 0 10px;font-size:20px}.val p{margin:0;color:var(--mute);line-height:1.6}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px;background:#1d1d1b;border:1px solid #1d1d1b;margin:0 5vw}
.stats div{background:var(--bg);padding:34px 28px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
.stats b{display:block;font-family:var(--h);font-weight:400;font-size:38px;color:var(--ink);letter-spacing:0;margin-bottom:6px}
details{border-bottom:1px solid #1d1d1b;padding:20px 0}
summary{cursor:pointer;font-family:var(--h);font-size:18px;text-transform:uppercase;list-style:none;display:flex;justify-content:space-between}
summary::after{content:"+";color:var(--y)}details[open] summary::after{content:"–"}
details p{color:#bdbaaf;line-height:1.65;margin:14px 0 0;max-width:720px}
table{width:100%;border-collapse:collapse;font-size:14px;margin-top:10px}
th,td{padding:14px;border-bottom:1px solid #1d1d1b;text-align:left}th{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);font-weight:400}
form{display:flex;gap:12px;flex-wrap:wrap}
input,textarea{background:#0f0f0e;border:1px solid #2a2a27;color:var(--ink);padding:16px 18px;font-size:15px;font-family:inherit;outline:none;width:100%}
input:focus,textarea:focus{border-color:var(--ink)}
.fm{display:grid;gap:14px;max-width:560px}.fm .btn{margin:0;justify-self:start}
.nl{text-align:center}.nl form{justify-content:center}.nl input{width:auto;min-width:280px}.nl .btn{margin:0}
.cta{text-align:center;border-top:1px solid #151514}
footer{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:30px;padding:60px 5vw 40px;border-top:1px solid #1a1a18;font-size:13px;color:var(--mute)}
footer h4{margin:0 0 14px;color:var(--ink);font-size:11px;letter-spacing:.25em;text-transform:uppercase}
footer a{display:block;text-decoration:none;margin:8px 0}footer a:hover{color:var(--y)}footer p{margin:6px 0}
.copy{grid-column:1/-1;padding-top:20px;border-top:1px solid #151514;font-size:11px;letter-spacing:.2em;text-transform:uppercase}
.ov{position:fixed;inset:0;background:rgba(0,0,0,.6);opacity:0;pointer-events:none;transition:.3s;z-index:90}
.drawer{position:fixed;top:0;right:0;height:100%;width:min(400px,100%);background:#0c0c0b;border-left:1px solid #222;transform:translateX(100%);transition:.35s;z-index:100;display:flex;flex-direction:column;padding:24px;padding-top:calc(24px + env(safe-area-inset-top,0px))}
body.open .drawer{transform:none}body.open .ov{opacity:1;pointer-events:auto}
.drawer header{display:flex;justify-content:space-between;align-items:center;font-family:var(--h);text-transform:uppercase;font-size:20px;margin-bottom:20px}
.drawer header button{background:none;border:0;color:var(--ink);font-size:26px}
#lines{flex:1;overflow:auto}
.ln{display:flex;justify-content:space-between;gap:10px;padding:14px 0;border-bottom:1px solid #1d1d1b;font-size:14px}
.ln small{display:block;color:var(--mute);margin-top:4px;letter-spacing:.1em}
.ln button{background:none;border:0;color:var(--mute);font-size:12px;margin-top:6px;padding:0;text-decoration:underline}
.tot{display:flex;justify-content:space-between;font-family:var(--h);font-size:20px;padding:20px 0 4px}
.note{font-size:12px;color:var(--mute);min-height:18px;margin:8px 0}
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s,transform .7s}.rv.in{opacity:1;transform:none}
@media(max-width:700px){nav .links{display:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}
