/* ============ RAAZ BORG — COMBAT RE-CODED ============ */
:root{
  --void:#08080A; --carbon:#121216; --graphite:#1C1C22; --smoke:#2A2A32;
  --acid:#E1FF00; --magenta:#FF2ED1; --violet:#7B2FFF; --cyan:#00E5FF;
  --red:#FF3131; --orange:#FF6A00;
  --text:#F4F4F5; --text-2:#A0A3AE; --text-3:#5C5F6A;
  --display:'Anton',sans-serif; --body:'Inter',sans-serif; --mono:'JetBrains Mono',monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--void);color:var(--text);font-family:var(--body);line-height:1.5;overflow-x:hidden}
::selection{background:var(--acid);color:var(--void)}
::-webkit-scrollbar{width:10px;background:var(--void)}
::-webkit-scrollbar-thumb{background:var(--smoke)}
::-webkit-scrollbar-thumb:hover{background:var(--acid)}
img{display:block;max-width:100%}

/* noise + scanlines overlay */
body::after{
  content:"";position:fixed;inset:0;z-index:999;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
}
.scanlines{position:absolute;inset:0;background:repeating-linear-gradient(to bottom,transparent 0 3px,rgba(255,255,255,.014) 3px 4px);pointer-events:none;z-index:1}

.wrap{max-width:1320px;margin:0 auto;padding:0 28px}
section{padding:110px 0;position:relative}
h1,h2,h3{font-family:var(--display);text-transform:uppercase;font-weight:400;line-height:1}
.kicker{font-family:var(--mono);font-size:13px;letter-spacing:.35em;text-transform:uppercase}
.lang-es{display:none}
body[data-lang="es"] .lang-en{display:none}
body[data-lang="es"] .lang-es{display:inline}

/* ============ NAV ============ */
nav{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(8,8,10,.88);backdrop-filter:blur(14px);border-bottom:1px solid var(--smoke)}
.nav-inner{max-width:1320px;margin:0 auto;padding:16px 28px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.nav-logo img{height:30px}
.nav-links{display:flex;gap:30px;list-style:none}
.nav-links a{font-family:var(--mono);font-size:12px;letter-spacing:.25em;color:var(--text-2);text-decoration:none;transition:color .2s;position:relative;padding:6px 0}
.nav-links a:hover{color:var(--acid)}
.nav-links a.active{color:var(--acid)}
.nav-links a.active::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--acid)}
.nav-links a.shop-link{color:var(--magenta)}
.nav-links a.shop-link:hover{color:var(--text)}
.nav-right{display:flex;align-items:center;gap:14px}
.lang-toggle{font-family:var(--mono);font-size:12px;letter-spacing:.2em;background:none;border:1px solid var(--smoke);color:var(--text-2);padding:8px 14px;cursor:pointer;transition:.2s}
.lang-toggle:hover{border-color:var(--acid);color:var(--acid)}
.burger{display:none;background:none;border:1px solid var(--smoke);color:var(--text);font-family:var(--mono);font-size:12px;letter-spacing:.15em;padding:8px 12px;cursor:pointer}

.btn{display:inline-block;font-family:var(--mono);font-size:13px;letter-spacing:.25em;text-transform:uppercase;text-decoration:none;padding:15px 34px;transition:.2s;cursor:pointer;border:1px solid transparent}
.btn-acid{background:var(--acid);color:var(--void);border-color:var(--acid);box-shadow:0 0 24px rgba(225,255,0,.25)}
.btn-acid:hover{background:transparent;color:var(--acid)}
.btn-ghost{background:transparent;color:var(--text);border-color:var(--smoke)}
.btn-ghost:hover{border-color:var(--magenta);color:var(--magenta)}
.btn-mag{background:var(--magenta);color:var(--void);border-color:var(--magenta)}
.btn-mag:hover{background:transparent;color:var(--magenta)}
.nav-cta{padding:10px 22px;font-size:12px}

/* ============ TICKER ============ */
.ticker{background:var(--acid);color:var(--void);overflow:hidden;white-space:nowrap;padding:10px 0;border-top:1px solid var(--void)}
.ticker-track{display:inline-flex;gap:48px;animation:ticker 28s linear infinite;font-family:var(--mono);font-size:13px;letter-spacing:.25em;text-transform:uppercase;font-weight:700}
.ticker-track span{display:inline-flex;gap:48px}
.ticker.mag{background:var(--magenta)}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ============ HERO ============ */
.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden;padding:0}
.hero-bg{position:absolute;inset:0}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 20%;filter:saturate(1.15) contrast(1.08)}
.hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,var(--void) 8%,rgba(8,8,10,.45) 45%,rgba(8,8,10,.55) 100%)}
.hero-content{position:relative;z-index:2;padding:170px 0 64px}
.hero .kicker{color:var(--magenta);margin-bottom:20px;display:flex;align-items:center;gap:12px}
.hero .kicker::before{content:"";width:34px;height:2px;background:var(--magenta)}
.hero-title{font-family:var(--display);font-size:clamp(64px,12.5vw,190px);line-height:.95;text-transform:uppercase;position:relative;letter-spacing:.01em}
.hero-title .row2{background:linear-gradient(90deg,#F5C144,#FF6A00 50%,#E0503E);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .tagline{font-family:var(--mono);font-size:clamp(14px,1.8vw,20px);letter-spacing:.45em;color:var(--acid);margin:22px 0 30px;text-transform:uppercase}
.hero .sub{max-width:540px;color:var(--text-2);font-size:16px;margin-bottom:40px}
.hero-ctas{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:56px}
.hero-meta{display:flex;gap:36px;flex-wrap:wrap;font-family:var(--mono);font-size:12px;letter-spacing:.2em;color:var(--text-3)}
.hero-meta b{color:var(--acid);font-weight:400}

/* glitch */
.glitch{position:relative;display:inline-block}
.glitch::before,.glitch::after{content:attr(data-text);position:absolute;inset:0;overflow:hidden}
.glitch::before{color:var(--magenta);z-index:-1;animation:glitchA 3.2s infinite steps(1)}
.glitch::after{color:var(--cyan);z-index:-2;animation:glitchB 2.7s infinite steps(1)}
@keyframes glitchA{0%,86%,100%{transform:none;opacity:0}87%{transform:translate(-6px,2px);opacity:.8;clip-path:inset(10% 0 60% 0)}89%{transform:translate(4px,-2px);opacity:.8;clip-path:inset(55% 0 15% 0)}91%{transform:none;opacity:0}}
@keyframes glitchB{0%,78%,100%{transform:none;opacity:0}79%{transform:translate(6px,-3px);opacity:.7;clip-path:inset(65% 0 5% 0)}82%{transform:translate(-5px,3px);opacity:.7;clip-path:inset(5% 0 70% 0)}84%{transform:none;opacity:0}}
.flicker{animation:flicker 4s infinite}
@keyframes flicker{0%,95%,100%{opacity:1}96%{opacity:.4}97%{opacity:1}98%{opacity:.6}99%{opacity:1}}

/* typed line */
.sysline{font-family:var(--mono);font-size:13px;letter-spacing:.12em;color:var(--acid);min-height:20px;margin-bottom:18px}
.sysline .cursor{animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}

/* ============ SECTION HEADS w/ giant ghost text ============ */
.sec-head{position:relative;margin-bottom:64px}
.ghost{position:absolute;top:-70px;left:-8px;font-family:var(--display);font-size:clamp(90px,16vw,240px);color:transparent;-webkit-text-stroke:1px var(--graphite);text-transform:uppercase;line-height:1;pointer-events:none;user-select:none;white-space:nowrap}
.sec-head h2{font-size:clamp(44px,6vw,84px);position:relative}
.sec-head .kicker{color:var(--acid);margin-bottom:14px;display:block}
.sec-head .kicker.mag{color:var(--magenta)}
.sec-head .kicker.cy{color:var(--cyan)}
.sec-head .kicker.vio{color:var(--violet)}

/* reveal on scroll */
.reveal{opacity:0;transform:translateY(36px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
.reveal-d1{transition-delay:.1s}.reveal-d2{transition-delay:.2s}.reveal-d3{transition-delay:.3s}

/* ============ FIGHTER CARDS ============ */
.f-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.f-grid.cols3{grid-template-columns:repeat(3,1fr)}
.f-card{position:relative;background:var(--carbon);border:1px solid var(--smoke);overflow:hidden;text-decoration:none;color:var(--text)}
.f-card .f-photo{aspect-ratio:3/4;overflow:hidden;position:relative}
.f-card .f-photo img{width:100%;height:100%;object-fit:cover;filter:grayscale(.55) contrast(1.05);transition:filter .35s,transform .45s}
.f-card:hover .f-photo img{filter:grayscale(0) saturate(1.2);transform:scale(1.045)}
.f-card .f-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(8,8,10,.92) 0%,transparent 45%)}
.f-card .corner{position:absolute;width:22px;height:22px;border:2px solid var(--acid);z-index:3;opacity:0;transition:opacity .25s}
.f-card .c-tl{top:10px;left:10px;border-right:none;border-bottom:none}
.f-card .c-br{bottom:10px;right:10px;border-left:none;border-top:none}
.f-card:hover .corner{opacity:1}
.f-card .f-tag{position:absolute;top:14px;left:14px;z-index:2;font-family:var(--mono);font-size:10px;letter-spacing:.22em;color:var(--void);background:var(--acid);padding:4px 10px}
.f-card .f-info{position:absolute;bottom:0;left:0;right:0;z-index:2;padding:20px}
.f-card h3{font-size:30px;margin-bottom:4px}
.f-card .arch{font-family:var(--mono);font-size:10px;letter-spacing:.22em;color:var(--text-2);text-transform:uppercase;display:block;margin-bottom:14px}
.stat{margin-bottom:9px}
.stat .s-label{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10px;letter-spacing:.15em;color:var(--text-2);margin-bottom:5px}
.s-bar{height:3px;background:rgba(255,255,255,.14)}
.s-fill{height:100%;width:0;transition:width 1.1s cubic-bezier(.2,.7,.2,1)}
.in .s-fill,.f-card:hover .s-fill{width:var(--w)}

/* ============ TIMELINE ============ */
.timeline{display:grid;grid-template-columns:repeat(5,1fr);gap:2px;background:var(--smoke);border:1px solid var(--smoke)}
.t-item{background:var(--void);padding:34px 22px;transition:background .2s;position:relative;text-decoration:none;display:block}
.t-item:hover{background:var(--carbon)}
.t-item::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--tc,var(--acid));opacity:.85}
.t-item .year{font-family:var(--display);font-size:34px;margin-bottom:12px;color:var(--text)}
.t-item .ev{font-family:var(--mono);font-size:12px;letter-spacing:.12em;line-height:1.6;text-transform:uppercase;color:var(--tc,var(--acid))}
.t-item .st{font-size:12px;color:var(--text-3);margin-top:8px}

/* ============ SPLIT FEATURE ============ */
.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.split .img-frame{position:relative}
.split .img-frame img{width:100%;aspect-ratio:4/5;object-fit:cover;border:1px solid var(--smoke)}
.split .img-frame::after{content:"";position:absolute;top:18px;left:18px;right:-18px;bottom:-18px;border:1px solid var(--graphite);z-index:-1}
.split .img-frame .frame-tag{position:absolute;bottom:16px;left:16px;font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--acid);background:rgba(8,8,10,.8);padding:6px 12px}
.split h2{font-size:clamp(40px,5vw,64px);margin-bottom:28px}
.split p{color:var(--text-2);margin-bottom:18px}
.split .protocol{font-family:var(--mono);font-size:13px;color:var(--text-3);border-left:2px solid var(--violet);padding-left:16px;margin:28px 0}

/* ============ SHOP ============ */
.drop-banner{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;background:var(--carbon);border:1px solid var(--smoke);padding:28px 32px;margin-bottom:56px}
.drop-banner .d-title{font-family:var(--display);font-size:34px;text-transform:uppercase}
.drop-banner .d-count{font-family:var(--mono);font-size:13px;letter-spacing:.2em;color:var(--magenta)}
.p-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.p-card{background:var(--carbon);border:1px solid var(--smoke);overflow:hidden;position:relative;transition:border-color .25s,transform .25s}
.p-card:hover{border-color:var(--acid);transform:translateY(-4px)}
.p-photo{aspect-ratio:1;overflow:hidden;position:relative;background:var(--graphite)}
.p-photo img{width:100%;height:100%;object-fit:cover;object-position:center 25%;transition:transform .4s}
.p-card:hover .p-photo img{transform:scale(1.05)}
.p-badge{position:absolute;top:12px;left:12px;font-family:var(--mono);font-size:10px;letter-spacing:.2em;padding:4px 10px;background:var(--magenta);color:var(--void);z-index:2}
.p-badge.acid{background:var(--acid)}
.p-badge.red{background:var(--red);color:var(--text)}
.p-info{padding:20px}
.p-info h3{font-size:20px;letter-spacing:.02em;margin-bottom:6px}
.p-info .p-type{font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--text-3);text-transform:uppercase;display:block;margin-bottom:14px}
.p-row{display:flex;justify-content:space-between;align-items:center}
.p-price{font-family:var(--mono);font-size:16px;color:var(--acid)}
.p-cart{font-family:var(--mono);font-size:11px;letter-spacing:.15em;background:none;border:1px solid var(--smoke);color:var(--text-2);padding:8px 14px;cursor:pointer;transition:.2s}
.p-cart:hover{border-color:var(--acid);color:var(--acid)}
.size-row{display:flex;gap:6px;margin-bottom:14px}
.size-row span{font-family:var(--mono);font-size:10px;color:var(--text-3);border:1px solid var(--graphite);padding:3px 7px}

/* ============ LAB CARDS / MEDIA ============ */
.lab-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.lab-card{background:var(--carbon);border:1px solid var(--smoke);padding:32px;transition:border-color .2s;position:relative;overflow:hidden}
.lab-card:hover{border-color:var(--acid)}
.lab-card .tag{font-family:var(--mono);font-size:11px;letter-spacing:.25em;color:var(--red);margin-bottom:16px;display:block}
.lab-card h3{font-size:24px;margin-bottom:12px}
.lab-card p{font-size:14px;color:var(--text-2)}
.vid-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.vid{position:relative;aspect-ratio:16/9;background:var(--carbon);border:1px solid var(--smoke);overflow:hidden;display:flex;align-items:center;justify-content:center;cursor:pointer}
.vid img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55;filter:grayscale(.4);transition:.3s}
.vid:hover img{opacity:.8;filter:none}
.vid .play{position:relative;z-index:2;width:64px;height:64px;border:2px solid var(--acid);display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--acid);background:rgba(8,8,10,.55)}
.vid .v-cap{position:absolute;bottom:12px;left:14px;z-index:2;font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--text)}

/* ============ GALLERY MOSAIC ============ */
.mosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:230px;gap:14px}
.mosaic .m-item{position:relative;overflow:hidden;border:1px solid var(--smoke)}
.mosaic .m-item img{width:100%;height:100%;object-fit:cover;filter:grayscale(.3);transition:.35s}
.mosaic .m-item:hover img{filter:none;transform:scale(1.04)}
.mosaic .m-item .cap{position:absolute;bottom:12px;left:14px;font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--text);background:rgba(8,8,10,.75);padding:5px 10px;z-index:2}
.mosaic .big{grid-column:span 2;grid-row:span 2}
.mosaic .tall{grid-row:span 2}

/* ============ CTA / FOOTER ============ */
.cta-final{text-align:center;padding:150px 0;position:relative;overflow:hidden}
.cta-final::before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:820px;height:820px;background:radial-gradient(circle,rgba(225,255,0,.1),transparent 65%);pointer-events:none}
.cta-final .kicker{color:var(--magenta);margin-bottom:22px}
.cta-final h2{font-size:clamp(46px,8vw,108px)}
.cta-final h2 .accent{color:var(--acid)}
.cta-final p{color:var(--text-2);max-width:480px;margin:30px auto 44px}
footer{border-top:1px solid var(--smoke);padding:52px 0}
.foot{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.foot img{height:26px;opacity:.9}
.foot .fm{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--text-3)}
.foot-links{display:flex;gap:24px;list-style:none}
.foot-links a{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--text-2);text-decoration:none}
.foot-links a:hover{color:var(--acid)}

/* page hero (interior pages) */
.page-hero{padding:200px 0 70px;position:relative;overflow:hidden}
.page-hero .ghost{top:60px}
.page-hero h1{font-size:clamp(56px,9vw,130px);position:relative}
.page-hero .kicker{color:var(--magenta);margin-bottom:16px;display:block}
.page-hero .lead{max-width:620px;color:var(--text-2);margin-top:24px;font-size:17px}

.dark{background:var(--carbon)}

@media(max-width:1020px){
  .f-grid,.p-grid{grid-template-columns:repeat(2,1fr)}
  .f-grid.cols3,.lab-grid,.vid-grid{grid-template-columns:1fr 1fr}
  .timeline{grid-template-columns:1fr 1fr}
  .split{grid-template-columns:1fr}
  .mosaic{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:var(--void);border-bottom:1px solid var(--smoke);flex-direction:column;gap:0;padding:12px 28px 20px}
  .nav-links.open{display:flex}
  .nav-links a{padding:12px 0;font-size:13px}
  .burger{display:block}
  .f-grid,.p-grid,.f-grid.cols3,.lab-grid,.vid-grid,.timeline{grid-template-columns:1fr}
  .mosaic{grid-template-columns:1fr;grid-auto-rows:260px}
  .mosaic .big,.mosaic .tall{grid-column:auto;grid-row:auto}
  section{padding:72px 0}
}