:root{
    --void-black:#050505;
    --surface:#131313;
    --surface-dim:#131313;
    --surface-container-low:#1c1b1b;
    --surface-container:#20201f;
    --surface-container-high:#2a2a2a;
    --on-surface:#e5e2e1;
    --on-surface-variant:#c4c7c7;
    --outline:#8e9192;
    --outline-variant:#444748;
    --industrial-gray:#444444;
    --cyber-green:#00FF9D;
    --racing-red:#FF4D00;
    --glitch-blue:#00E0FF;

    --font-display:'Bebas Neue',sans-serif;
    --font-body:'Fira Sans',sans-serif;
    --font-mono:'JetBrains Mono',monospace;

    --margin-desktop:64px;
    --margin-mobile:16px;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
    background:var(--void-black);
    color:var(--on-surface);
    font-family:var(--font-body);
    font-size:14px;line-height:20px;
    overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;}
::selection{background:var(--racing-red);color:#fff;}
img,svg{display:block;}

#shader-canvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none;}
.scanning-overlay{
    position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.5;
    background-image:linear-gradient(to bottom, transparent, transparent 50%, rgba(10,10,10,.3) 50%, rgba(10,10,10,.3));
    background-size:100% 4px;
    animation:scan 10s linear infinite;
}
@keyframes scan{0%{background-position:0 0;}100%{background-position:0 100vh;}}

.content-wrapper{position:relative;z-index:10;width:100%;}

body.is-loading{overflow:hidden;}
#loader{
    position:fixed;inset:0;z-index:10000;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;
    background:var(--void-black);
    transition:opacity .6s ease, visibility .6s ease;
}
#loader.loader-hidden{opacity:0;visibility:hidden;pointer-events:none;}

.loader-infinity{margin-bottom:-4px;}
.inf-svg{
    width:150px;height:auto;overflow:visible;display:block;
    filter:drop-shadow(0 3px 10px rgba(0,0,0,.55)) drop-shadow(0 0 18px rgba(0,255,157,.35));
    animation:inf-pulse 2.6s ease-in-out infinite;
}
@keyframes inf-pulse{
    0%,100%{filter:drop-shadow(0 3px 10px rgba(0,0,0,.55)) drop-shadow(0 0 14px rgba(0,255,157,.3));}
    50%{filter:drop-shadow(0 3px 10px rgba(0,0,0,.55)) drop-shadow(0 0 26px rgba(0,255,157,.6));}
}
.inf-fill{fill:url(#infGradFace);}

.loader-bar-track{
    width:220px;max-width:60vw;height:3px;background:var(--surface-container-high);
    position:relative;overflow:hidden;
}
.loader-bar-fill{
    position:absolute;inset:0 100% 0 0;background:var(--cyber-green);
    box-shadow:0 0 10px rgba(0,255,157,.8);
    transition:right .25s linear;
}
.loader-meta{
    display:flex;align-items:center;justify-content:space-between;
    width:220px;max-width:60vw;
    font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;font-weight:500;
    color:var(--on-surface-variant);
}
.loader-status span{color:var(--cyber-green);}
.loader-pct{color:var(--cyber-green);min-width:34px;text-align:right;}
.loader-cursor{display:inline-block;width:6px;height:11px;background:var(--cyber-green);margin-left:2px;animation:blink .8s steps(1) infinite;vertical-align:-1px;}

@media(prefers-reduced-motion:reduce){
    #loader{transition:opacity .2s linear;}
    .loader-cursor{animation:none;}
    .inf-svg{animation:none;}
}

header{
    position:fixed;top:0;left:0;width:100%;z-index:50;
    display:flex;align-items:center;justify-content:space-between;
    padding:16px var(--margin-mobile);
    background:rgba(19,19,19,.85);backdrop-filter:blur(10px);
    border-bottom:1px solid rgba(68,71,72,.3);
}
.logo{
    font-family:var(--font-display);font-size:24px;letter-spacing:.02em;
    color:var(--cyber-green);
    filter:drop-shadow(0 0 8px rgba(0,255,157,.8));
    white-space:nowrap;
}
.header-left{display:flex;align-items:center;gap:20px;}
nav{display:none;gap:24px;}
nav a{
    font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;font-weight:700;
    color:var(--on-surface-variant);padding:8px 0;transition:.15s;
}
nav a:hover{color:var(--on-surface);}
.header-right{display:flex;align-items:center;gap:16px;}
.status-live{
    display:none;font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;
    color:var(--cyber-green);animation:blink 2s infinite;
}
.btn-contact{
    font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;font-weight:700;
    color:var(--on-surface);border:1px solid var(--industrial-gray);
    padding:9px 18px;transform:skewX(12deg);
    box-shadow:0 0 10px rgba(255,77,0,0);
    transition:.15s;
}
.btn-contact span{display:inline-block;transform:skewX(-12deg);}
.btn-contact:hover{background:var(--racing-red);border-color:var(--racing-red);color:var(--void-black);box-shadow:0 0 15px rgba(255,77,0,.5);}

@keyframes blink{0%,100%{opacity:1;}50%{opacity:.3;}}
.dot-blink{width:8px;height:8px;border-radius:50%;background:var(--cyber-green);display:inline-block;animation:blink .8s infinite;box-shadow:0 0 6px var(--cyber-green);margin-right:6px;}

.hud{
    display:none;position:absolute;z-index:40;font-family:var(--font-mono);font-size:10px;
    letter-spacing:.1em;color:var(--outline-variant);pointer-events:none;flex-direction:column;gap:4px;
}
.hud-tl{top:32px;left:24px;}
.hud-br{bottom:36px;right:24px;text-align:right;align-items:flex-end;}
.telemetry-scroll{height:48px;overflow:hidden;position:relative;margin-top:8px;}
.telemetry-scroll-inner{animation:scroll-up 4s linear infinite;opacity:.7;}
.telemetry-scroll-inner div{margin-bottom:4px;}
@keyframes scroll-up{0%{transform:translateY(0);}100%{transform:translateY(-50%);}}

main.split{
    display:flex;flex-direction:column;position:relative;
    padding-top:64px;overflow:hidden;
}
@media(min-width:900px){ main.split{flex-direction:row;min-height:calc(100vh - 64px);} }

.split-stage{
    position:relative;width:100%;flex:1;
    --center:50%;--skew:64px;
}
@media(min-width:900px){ .split-stage{min-height:calc(100vh - 64px);} }
.split.hover-kart .split-stage{--center:58%;}
.split.hover-tech .split-stage{--center:42%;}

.sector{
    position:relative;min-height:64vh;
    display:flex;flex-direction:column;justify-content:flex-end;
    padding:28px;padding-bottom:56px;
    cursor:pointer;overflow:hidden;
}
@media(min-width:640px){ .sector{padding:48px;padding-bottom:80px;} }
@media(min-width:900px){
    .sector{
        padding:64px;padding-bottom:120px;min-height:0;
        position:absolute;inset:0;width:100%;height:100%;
        transition:clip-path .6s cubic-bezier(.25,1,.5,1);
    }
    .sector.kart{
        clip-path:polygon(0% 0%, calc(var(--center) + var(--skew)) 0%, calc(var(--center) - var(--skew)) 100%, 0% 100%);
    }
    .sector.tech{
        clip-path:polygon(calc(var(--center) + var(--skew)) 0%, 100% 0%, 100% 100%, calc(var(--center) - var(--skew)) 100%);
        align-items:flex-end;
    }
}

.sector::before{
    content:'';position:absolute;inset:0;z-index:1;
    background:rgba(19,19,19,.7);transition:background-color .6s ease;
}
.bg-img{
    position:absolute;inset:-8%;width:116%;height:116%;z-index:0;
    filter:grayscale(100%) brightness(.55) contrast(1.05);
    transition:filter .7s ease, transform .9s cubic-bezier(.25,1,.5,1);
}

.bg-stripes{
    position:absolute;inset:-20% -60%;z-index:0;pointer-events:none;
    filter:grayscale(100%) brightness(.75);
    transition:filter .7s ease;
}
.sector.kart .bg-img{
    background:
        radial-gradient(circle at 75% 20%, rgba(255,180,90,.55), transparent 42%),
        linear-gradient(100deg, rgba(255,77,0,.35) 0%, transparent 35%),
        linear-gradient(200deg, #2a1c10 0%, #100b08 55%, #050505 100%);
        background-image: url('../images/driver.jpeg');
        background-size: contain;
}
.sector.kart .bg-stripes{
    background:
        repeating-linear-gradient(115deg, rgba(255,255,255,.10) 0 2px, transparent 2px 84px),
        repeating-linear-gradient(115deg, rgba(0,0,0,.35) 0 10px, transparent 10px 84px);
    animation:driftKart 12s linear infinite;
}
@keyframes driftKart{from{transform:translateX(0);}to{transform:translateX(-84px);}}
.sector.tech .bg-img{
    background:
        radial-gradient(circle at 25% 15%, rgba(0,255,157,.35), transparent 45%),
        linear-gradient(70deg, rgba(0,224,255,.18) 0%, transparent 30%),
        repeating-linear-gradient(0deg, rgba(0,255,157,.10) 0 1px, transparent 1px 38px),
        repeating-linear-gradient(90deg, rgba(0,255,157,.10) 0 1px, transparent 1px 38px),
        linear-gradient(210deg, #0a1a15 0%, #0a0e0d 55%, #050505 100%);
    animation:pulseTech 6s ease-in-out infinite;
    background-image: url('../images/ciber.jpeg');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right;
}
@keyframes pulseTech{0%,100%{opacity:.8;}50%{opacity:1;}}

.split.hover-kart .sector.kart::before{background:rgba(255,77,0,.1);}
.split.hover-kart .sector.kart .bg-img{filter:grayscale(0%) brightness(1.15) contrast(1.05);transform:scale(1.05);}
.split.hover-kart .sector.kart .bg-stripes{filter:grayscale(0%) brightness(1.05);}
.split.hover-kart .sector.tech::before{background:rgba(19,19,19,.9);}

.split.hover-tech .sector.tech::before{background:rgba(0,255,157,.1);}
.split.hover-tech .sector.tech .bg-img{filter:grayscale(0%) brightness(1.15) contrast(1.05);transform:scale(1.05);}
.split.hover-tech .sector.kart::before{background:rgba(19,19,19,.9);}

.sector.revealed .bg-img{filter:grayscale(0%) brightness(1.1) contrast(1.05);}
.sector.kart.revealed .bg-stripes{filter:grayscale(0%) brightness(1.05);}
.sector.kart.revealed::before{background:rgba(255,77,0,.12);}
.sector.tech.revealed::before{background:rgba(0,255,157,.12);}

.sector-inner{position:relative;z-index:2;max-width:460px;perspective:1000px;}
@media(min-width:640px) and (max-width:899px){
    .sector-inner{max-width:580px;}
}

@media(min-width:900px){
    .sector-inner{max-width:calc(50vw - 150px);}
}
.sector.tech .sector-inner{margin-left:auto;text-align:right;}
.sector-panel{transition:transform .35s ease;}
.sector.kart .sector-panel{transform:skewX(-2deg);}
.sector.tech .sector-panel{transform:skewX(2deg);}

.eyebrow{
    font-family:var(--font-mono);font-size:11px;letter-spacing:.25em;font-weight:500;
    display:flex;align-items:center;gap:10px;margin-bottom:12px;
}
.sector.kart .eyebrow{color:var(--racing-red);}
.sector.tech .eyebrow{color:var(--cyber-green);justify-content:flex-end;}
.eyebrow i{display:inline-block;width:16px;height:2px;}
.sector.kart .eyebrow i{background:var(--racing-red);}
.sector.tech .eyebrow i{background:var(--cyber-green);}

.sector h2{
    font-family:var(--font-display);font-weight:400;text-transform:uppercase;
    font-size:clamp(2rem,7.4vw,60px);line-height:1;letter-spacing:-.01em;
    margin-bottom:12px;color:var(--on-surface);position:relative;
    transition:color .3s;
    overflow-wrap:break-word;word-break:break-word;hyphens:auto;
    max-width:100%;
}
.sector.kart h2{filter:drop-shadow(0 0 15px rgba(255,77,0,.6));}
.sector.tech h2{filter:drop-shadow(0 0 15px rgba(0,255,157,.6));}
.split.hover-kart .sector.kart h2,.sector.kart.revealed h2{color:var(--racing-red);}
.split.hover-tech .sector.tech h2,.sector.tech.revealed h2{color:var(--cyber-green);}

@media(min-width:900px){
    .sector h2{font-size:clamp(1.7rem,3.6vw,56px);}
}

.glitch{position:relative;display:inline-block;}
.glitch::before,.glitch::after{
    content:attr(data-text);position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;
}
.split.hover-kart .sector.kart .glitch::before,.sector.kart.revealed .glitch::before,
.split.hover-tech .sector.tech .glitch::before,.sector.tech.revealed .glitch::before{
    left:2px;text-shadow:-2px 0 var(--glitch-c);clip:rect(24px,550px,90px,0);
    animation:glitch-a2 3s infinite linear alternate-reverse;opacity:1;
}
.split.hover-kart .sector.kart .glitch::after,.sector.kart.revealed .glitch::after,
.split.hover-tech .sector.tech .glitch::after,.sector.tech.revealed .glitch::after{
    left:-2px;text-shadow:-2px 0 #fff;clip:rect(85px,550px,140px,0);
    animation:glitch-a1 2.5s infinite linear alternate-reverse;opacity:1;
}
@keyframes glitch-a1{0%{clip:rect(31px,9999px,9px,0);}20%{clip:rect(78px,9999px,83px,0);}40%{clip:rect(43px,9999px,49px,0);}60%{clip:rect(93px,9999px,12px,0);}80%{clip:rect(12px,9999px,2px,0);}100%{clip:rect(13px,9999px,48px,0);}}
@keyframes glitch-a2{0%{clip:rect(65px,9999px,100px,0);}20%{clip:rect(10px,9999px,35px,0);}40%{clip:rect(82px,9999px,2px,0);}60%{clip:rect(20px,9999px,60px,0);}80%{clip:rect(50px,9999px,15px,0);}100%{clip:rect(85px,9999px,40px,0);}}

.domain-tag{font-family:var(--font-mono);font-size:12px;color:var(--on-surface-variant);display:block;margin-bottom:14px;}
.badge-soon{
    display:inline-block;font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;font-weight:700;
    color:var(--cyber-green);border:1px solid rgba(0,255,157,.4);padding:4px 8px;margin-bottom:14px;
}
.sector-desc{
    font-size:14px;line-height:1.6;color:var(--on-surface-variant);
    background:rgba(28,27,27,.7);backdrop-filter:blur(8px);
    padding:14px 16px;border-left:2px solid var(--racing-red);
    opacity:.75;transition:opacity .3s;max-width:320px;
}
.sector.tech .sector-desc{border-left:none;border-right:2px solid var(--cyber-green);text-align:right;margin-left:auto;}
.split.hover-kart .sector.kart .sector-desc,.sector.kart.revealed .sector-desc,
.split.hover-tech .sector.tech .sector-desc,.sector.tech.revealed .sector-desc{opacity:1;}

.cta{
    display:inline-block;margin-top:26px;font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;font-weight:700;
    padding:15px 26px;border:1px solid;background:rgba(19,19,19,.8);backdrop-filter:blur(6px);
    transition:background .2s,color .2s,box-shadow .2s,transform .12s;
    max-width:100%;white-space:normal;
}
@media(max-width:400px){
    .cta{font-size:10px;letter-spacing:.12em;padding:13px 18px;}
}
.sector.kart .cta{border-color:var(--racing-red);color:var(--racing-red);transform:skewX(12deg);box-shadow:0 0 20px rgba(255,77,0,.15);}
.sector.tech .cta{border-color:var(--cyber-green);color:var(--cyber-green);transform:skewX(-12deg);box-shadow:0 0 20px rgba(0,255,157,.15);}
.cta span{display:inline-block;}
.sector.kart .cta span{transform:skewX(-12deg);}
.sector.tech .cta span{transform:skewX(12deg);}
.sector.kart .cta:hover{background:var(--racing-red);color:var(--void-black);box-shadow:0 0 30px rgba(255,77,0,.6);animation:glitch-skew .3s both infinite;}
.sector.tech .cta:hover{background:var(--cyber-green);color:var(--void-black);box-shadow:0 0 30px rgba(0,255,157,.6);animation:glitch-skew .3s both infinite;}
@keyframes glitch-skew{0%{transform:skew(0deg);}20%{transform:skew(-8deg);}40%{transform:skew(6deg);}60%{transform:skew(-3deg);}80%{transform:skew(4deg);}100%{transform:skew(0deg);}}

.seam,.or-mark{display:none;}
@media(min-width:900px){
    .seam{
        display:block;position:absolute;inset:0;z-index:20;pointer-events:none;
        background:var(--void-black);box-shadow:0 0 20px rgba(0,0,0,.8);
        clip-path:polygon(
            calc(var(--center) + var(--skew) - 2px) 0%,
            calc(var(--center) + var(--skew) + 2px) 0%,
            calc(var(--center) - var(--skew) + 2px) 100%,
            calc(var(--center) - var(--skew) - 2px) 100%
        );
        transition:clip-path .6s cubic-bezier(.25,1,.5,1);
    }
    .or-mark{
        display:flex;position:absolute;top:50%;left:var(--center);z-index:30;
        width:56px;height:56px;align-items:center;justify-content:center;pointer-events:none;
        background:var(--surface-container);border:2px solid var(--industrial-gray);
        box-shadow:0 0 30px rgba(0,0,0,.8);backdrop-filter:blur(6px);
        transform:translate(-50%,-50%) skewX(12deg);
        transition:left .6s cubic-bezier(.25,1,.5,1);
    }
    .or-mark span{font-family:var(--font-display);font-size:22px;color:var(--on-surface-variant);transform:skewX(-12deg);}
}

.tac-bar{
    position:relative;width:100%;background:rgba(19,19,19,.97);backdrop-filter:blur(10px);
    border-top:1px solid var(--outline-variant);
    display:flex;align-items:center;justify-content:space-between;
    padding:16px var(--margin-mobile);gap:12px;
}
@media(min-width:900px){ .tac-bar{padding:16px var(--margin-desktop);} }
.tac-left{display:flex;align-items:center;gap:12px;}
.tac-icon{width:20px;height:20px;flex-shrink:0;}
.tac-label{font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;color:var(--on-surface-variant);display:none;}
.tac-value{font-family:var(--font-mono);font-size:12px;letter-spacing:.05em;color:var(--on-surface);text-transform:uppercase;}
.tac-center{display:none;align-items:center;gap:24px;font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;color:var(--industrial-gray);}
.tac-line{width:100px;height:1px;background:rgba(68,68,68,.5);}
.tac-right{display:flex;align-items:center;gap:14px;text-align:right;}
@media(min-width:640px){ .tac-label{display:block;} }
@media(min-width:1024px){ .tac-center{display:flex;} }

.about{
    padding:88px var(--margin-mobile);border-top:1px solid rgba(68,71,72,.3);background:var(--surface);
}
@media(min-width:900px){ .about{padding:120px var(--margin-desktop);} }
.about-head{max-width:720px;margin-bottom:48px;}
.about-eyebrow{
    font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;font-weight:500;
    color:var(--cyber-green);display:flex;align-items:center;gap:10px;margin-bottom:18px;
}
.about-eyebrow i{width:16px;height:2px;background:var(--cyber-green);display:inline-block;}
.about h3{
    font-family:var(--font-display);font-size:clamp(2rem,5vw,3.4rem);line-height:1;
    text-transform:uppercase;letter-spacing:.01em;margin-bottom:22px;color:var(--on-surface);
    overflow-wrap:break-word;word-break:break-word;
}
.about p{font-size:16px;line-height:1.75;color:var(--on-surface-variant);max-width:640px;}

.cards{display:grid;grid-template-columns:1fr;gap:1px;background:var(--outline-variant);border:1px solid var(--outline-variant);margin-top:48px;}
@media(min-width:768px){ .cards{grid-template-columns:1fr 1fr;} }
.mini-card{
    background:var(--surface);padding:32px 28px;display:flex;flex-direction:column;gap:12px;
    transition:background .3s,border-color .3s;border-top:2px solid transparent;
}
.mini-card:hover{background:var(--surface-container);}
.mini-card.kart:hover{border-color:var(--racing-red);}
.mini-card.tech:hover{border-color:var(--cyber-green);}
.mini-card .tag{font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;font-weight:700;}
.mini-card.kart .tag{color:var(--racing-red);}
.mini-card.tech .tag{color:var(--cyber-green);}
.mini-card h4{font-family:var(--font-display);font-size:1.7rem;letter-spacing:.02em;text-transform:uppercase;color:var(--on-surface);overflow-wrap:break-word;}
.mini-card p{font-size:14.5px;line-height:1.6;color:var(--on-surface-variant);}
.mini-card .go{margin-top:4px;font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;font-weight:700;display:inline-flex;align-items:center;gap:8px;}
.mini-card.kart .go{color:var(--racing-red);}
.mini-card.tech .go{color:var(--cyber-green);}
.mini-card .go svg{transition:transform .25s;}
.mini-card:hover .go svg{transform:translateX(4px);}

footer{
    padding:56px var(--margin-mobile) 32px;border-top:1px solid rgba(68,71,72,.3);background:var(--surface-dim);
}
@media(min-width:900px){ footer{padding:64px var(--margin-desktop) 32px;} }
.footer-top{display:flex;flex-direction:column;gap:32px;margin-bottom:28px;}
@media(min-width:900px){ .footer-top{flex-direction:row;justify-content:space-between;} }
.footer-brand p{font-family:var(--font-mono);font-size:12px;color:var(--on-surface-variant);max-width:280px;line-height:1.6;margin-top:12px;}
.footer-links{display:flex;gap:40px;flex-wrap:wrap;}
.footer-col h5{font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;font-weight:700;margin-bottom:14px;}
.footer-col.k h5{color:var(--racing-red);}
.footer-col.t h5{color:var(--cyber-green);}
.footer-col.c h5{color:var(--on-surface-variant);}
.footer-col a{display:block;font-family:var(--font-mono);font-size:13px;color:var(--on-surface);transition:color .2s;}
.footer-col.k a:hover{color:var(--racing-red);}
.footer-col.t a:hover{color:var(--cyber-green);}
.socials{display:flex;gap:12px;height:fit-content;}
.socials a{
    width:38px;height:38px;border:1px solid var(--industrial-gray);
    display:flex;align-items:center;justify-content:center;transition:.2s;color:var(--on-surface-variant);
}
.socials a:hover{border-color:var(--cyber-green);color:var(--cyber-green);box-shadow:0 0 14px rgba(0,255,157,.3);}
.footer-bottom{
    display:flex;flex-direction:column;gap:8px;
    font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;color:var(--outline-variant);
    border-top:1px solid rgba(68,71,72,.3);padding-top:22px;
}
@media(min-width:640px){ .footer-bottom{flex-direction:row;justify-content:space-between;} }

@media(min-width:768px){ nav{display:flex;} .status-live{display:block;} }
@media(min-width:900px){ .hud{display:flex;} }

@media(prefers-reduced-motion:reduce){
    *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.15s !important;}
    html{scroll-behavior:auto;}
}