@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
:root{
  --r:#e63946;--rg:rgba(230,57,70,.15);--b:#457b9d;--bg:rgba(248,249,250,.88);--white:rgba(255,255,255,.92);
  --c1:#1d1d1f;--c2:#3a3a3c;--c3:#636366;--c4:#8e8e93;--c5:#aeaeb2;--c6:#d1d1d6;--c7:#e5e5ea;--c8:#f2f2f7;
  --sh:0 1px 3px rgba(0,0,0,.04),0 4px 12px rgba(0,0,0,.04);
  --sh2:0 8px 30px rgba(0,0,0,.08),0 2px 8px rgba(0,0,0,.04);
  --sh3:0 20px 60px rgba(0,0,0,.1),0 4px 14px rgba(0,0,0,.05);
  --rd:18px;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Space Grotesk',sans-serif;background:#f0f0f3;color:var(--c1);overflow-x:hidden;-webkit-font-smoothing:antialiased;cursor:none}
::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:var(--c8)}::-webkit-scrollbar-thumb{background:var(--r);border-radius:10px}

/* ═══ CUSTOM CURSOR ═══ */
.cursor{position:fixed;width:18px;height:18px;border:2px solid var(--r);border-radius:50%;pointer-events:none;z-index:9999;transition:transform .15s ease,width .2s,height .2s,border-color .2s;transform:translate(-50%,-50%);mix-blend-mode:difference}
.cursor-dot{position:fixed;width:5px;height:5px;background:var(--r);border-radius:50%;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);transition:transform .08s ease}
.cursor.hover{width:45px;height:45px;border-color:var(--b);background:rgba(69,123,157,.08)}

/* ═══ FLOATING PARTICLES ═══ */
.particles{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.particle{position:absolute;width:3px;height:3px;background:var(--r);border-radius:50%;opacity:.15;animation:float linear infinite}
.particle:nth-child(even){background:var(--b)}
@keyframes float{0%{transform:translateY(100vh) rotate(0deg);opacity:0}10%{opacity:.15}90%{opacity:.15}100%{transform:translateY(-10vh) rotate(720deg);opacity:0}}

/* ═══ ANIMATED BORDER (ALWAYS ON) ═══ */
@property --ba{syntax:'<angle>';initial-value:0deg;inherits:false}
@keyframes bspin{to{--ba:360deg}}
.ab{position:relative;background:var(--white);border-radius:var(--rd);isolation:isolate}
.ab::before{content:'';position:absolute;inset:-2px;border-radius:inherit;background:conic-gradient(from var(--ba),var(--c7) 0%,var(--r) 10%,var(--b) 20%,var(--c7) 30%);animation:bspin 3s linear infinite;z-index:-2;opacity:.5;transition:opacity .4s}
.ab:hover::before{opacity:1}
.ab::after{content:'';position:absolute;inset:2px;border-radius:calc(var(--rd) - 2px);background:var(--white);z-index:-1}

/* Card inner glow on hover */
.ab:hover{box-shadow:0 0 25px rgba(230,57,70,.06),var(--sh2)}

/* ═══ HERO ═══ */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--c1)}
.hero-bg{position:absolute;inset:0}.hero-bg img{width:100%;height:100%;object-fit:cover;opacity:.12;filter:saturate(.3)}
.hero-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(29,29,31,.5),rgba(29,29,31,.88) 65%,var(--c1))}
.hero-c{position:relative;z-index:5;text-align:center;padding:2rem;max-width:750px;margin:0 auto}

/* 3D Scene */
.hero-3d{position:absolute;inset:0;z-index:3}
.hero-3d canvas{width:100%!important;height:100%!important}

/* ═══ HERO GAMING OVERLAYS ═══ */
.hero-fx{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}

/* Horizontal light streaks — left to right */
.streak{position:absolute;height:1px;background:linear-gradient(90deg,transparent,rgba(230,57,70,.4),rgba(230,57,70,.6),rgba(230,57,70,.4),transparent);filter:blur(.5px)}
.streak-1{top:18%;width:100%;animation:streakLR 4s linear infinite}
.streak-2{top:42%;width:70%;animation:streakRL 5s 1s linear infinite}
.streak-3{top:65%;width:85%;animation:streakLR 6s 2s linear infinite}
.streak-4{top:80%;width:60%;height:2px;background:linear-gradient(90deg,transparent,rgba(69,123,157,.3),rgba(69,123,157,.5),rgba(69,123,157,.3),transparent);animation:streakRL 4.5s .5s linear infinite}
@keyframes streakLR{0%{transform:translateX(-100%);opacity:0}10%{opacity:1}90%{opacity:1}100%{transform:translateX(100vw);opacity:0}}
@keyframes streakRL{0%{transform:translateX(100vw);opacity:0}10%{opacity:1}90%{opacity:1}100%{transform:translateX(-100%);opacity:0}}

/* Diagonal scan lines */
.diag-lines{position:absolute;inset:-50%;width:200%;height:200%;background:repeating-linear-gradient(45deg,transparent,transparent 60px,rgba(230,57,70,.02) 60px,rgba(230,57,70,.02) 61px);animation:diagMove 20s linear infinite}
@keyframes diagMove{to{transform:translate(85px,85px)}}

/* Crosshair center */
.crosshair{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:200px;height:200px;opacity:.06;animation:chPulse 3s ease-in-out infinite}
.crosshair::before{content:'';position:absolute;top:50%;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 20%,var(--r),transparent 80%)}
.crosshair::after{content:'';position:absolute;left:50%;top:0;bottom:0;width:1px;background:linear-gradient(180deg,transparent 20%,var(--r),transparent 80%)}
.ch-ring{position:absolute;inset:30px;border:1px solid var(--r);border-radius:50%;animation:chSpin 8s linear infinite}
.ch-ring::before{content:'';position:absolute;top:-3px;left:50%;width:5px;height:5px;background:var(--r);border-radius:50%;transform:translateX(-50%);box-shadow:0 0 6px var(--r)}
@keyframes chPulse{0%,100%{opacity:.06;transform:translate(-50%,-50%) scale(1)}50%{opacity:.1;transform:translate(-50%,-50%) scale(1.05)}}
@keyframes chSpin{to{transform:rotate(360deg)}}

/* Floating geometric shapes — triangles & diamonds */
.geo{position:absolute;opacity:.04}
.geo-tri{width:0;height:0;border-left:15px solid transparent;border-right:15px solid transparent;border-bottom:26px solid var(--r);animation:geoFloat 12s linear infinite}
.geo-dia{width:20px;height:20px;background:var(--b);transform:rotate(45deg);animation:geoFloat2 15s linear infinite}
.geo-hex{width:24px;height:14px;background:var(--r);position:relative;animation:geoFloat 18s 3s linear infinite}
.geo-hex::before,.geo-hex::after{content:'';position:absolute;width:0;height:0;border-left:12px solid transparent;border-right:12px solid transparent}
.geo-hex::before{bottom:100%;border-bottom:7px solid var(--r)}
.geo-hex::after{top:100%;border-top:7px solid var(--r)}
@keyframes geoFloat{0%{transform:translateX(-50px) translateY(0) rotate(0);opacity:0}10%{opacity:.04}90%{opacity:.04}100%{transform:translateX(calc(100vw + 50px)) translateY(-100px) rotate(180deg);opacity:0}}
@keyframes geoFloat2{0%{transform:translateX(calc(100vw + 50px)) translateY(0) rotate(45deg);opacity:0}10%{opacity:.04}90%{opacity:.04}100%{transform:translateX(-50px) translateY(-80px) rotate(405deg);opacity:0}}

/* Grid overlay on hero */
.hero-grid{position:absolute;inset:0;opacity:.025;background-image:linear-gradient(rgba(230,57,70,.3) 1px,transparent 1px),linear-gradient(90deg,rgba(230,57,70,.3) 1px,transparent 1px);background-size:60px 60px}

/* Corner brackets */
.corner{position:absolute;width:30px;height:30px;opacity:.08}
.corner::before,.corner::after{content:'';position:absolute;background:var(--r)}
.corner.tl{top:40px;left:40px}.corner.tl::before{top:0;left:0;width:15px;height:1.5px}.corner.tl::after{top:0;left:0;width:1.5px;height:15px}
.corner.tr{top:40px;right:40px}.corner.tr::before{top:0;right:0;width:15px;height:1.5px}.corner.tr::after{top:0;right:0;width:1.5px;height:15px}
.corner.bl{bottom:40px;left:40px}.corner.bl::before{bottom:0;left:0;width:15px;height:1.5px}.corner.bl::after{bottom:0;left:0;width:1.5px;height:15px}
.corner.br{bottom:40px;right:40px}.corner.br::before{bottom:0;right:0;width:15px;height:1.5px}.corner.br::after{bottom:0;right:0;width:1.5px;height:15px}

/* Horizontal scan line */
.h-scan{position:absolute;left:0;right:0;height:1.5px;background:linear-gradient(90deg,transparent,rgba(230,57,70,.25),transparent);animation:hScan 5s linear infinite}
@keyframes hScan{0%{top:-2px}100%{top:100%}}

/* Logo with orbit */
.logo-box{width:150px;height:150px;margin:0 auto 2rem;position:relative;display:flex;align-items:center;justify-content:center}
.logo-img{width:105px;height:105px;border-radius:50%;object-fit:cover;z-index:3;position:relative;border:2px solid rgba(230,57,70,.2);box-shadow:0 0 50px rgba(230,57,70,.15);animation:logoPulse 3s ease-in-out infinite}
@keyframes logoPulse{0%,100%{box-shadow:0 0 30px rgba(230,57,70,.12)}50%{box-shadow:0 0 60px rgba(230,57,70,.25)}}
.orbit{position:absolute;inset:0;border-radius:50%;animation:orb 5s linear infinite}
.orbit::before{content:'';position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,transparent 55%,var(--r) 78%,transparent 100%);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2.5px),#000 calc(100% - 2px));mask:radial-gradient(farthest-side,transparent calc(100% - 2.5px),#000 calc(100% - 2px))}
.orbit.o2{inset:-12px;animation-duration:8s;animation-direction:reverse;opacity:.35}
.orbit.o2::before{background:conic-gradient(from 180deg,transparent 55%,var(--b) 78%,transparent 100%)}
.orbit.o3{inset:-24px;animation-duration:12s;opacity:.15}
.orbit.o3::before{background:conic-gradient(from 90deg,transparent 65%,var(--r) 85%,transparent 100%);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 1.5px),#000 calc(100% - 1px));mask:radial-gradient(farthest-side,transparent calc(100% - 1.5px),#000 calc(100% - 1px))}
@keyframes orb{to{transform:rotate(360deg)}}

/* Floating dots around logo */
.orbit-dot{position:absolute;width:4px;height:4px;border-radius:50%;background:var(--r);box-shadow:0 0 6px var(--r);z-index:4}
.orbit-dot:nth-child(2){background:var(--b);box-shadow:0 0 6px var(--b)}

.h1{font-size:clamp(3rem,10vw,6.5rem);font-weight:700;letter-spacing:-.04em;line-height:.85;color:#fff;margin-bottom:.75rem}
.h1 .ac{color:var(--r);text-shadow:0 0 50px rgba(230,57,70,.3);display:inline-block;animation:textGlow 3s ease-in-out infinite}
@keyframes textGlow{0%,100%{text-shadow:0 0 30px rgba(230,57,70,.2)}50%{text-shadow:0 0 60px rgba(230,57,70,.4),0 0 100px rgba(230,57,70,.15)}}
.h-sub{font-size:.7rem;letter-spacing:.35em;text-transform:uppercase;color:rgba(255,255,255,.3);margin-bottom:2rem;animation:fadeUp .8s .3s ease both}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.pill{display:inline-flex;align-items:center;gap:7px;padding:7px 18px;border-radius:50px;border:1px solid rgba(230,57,70,.15);background:rgba(230,57,70,.05);backdrop-filter:blur(10px);font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(230,57,70,.85);animation:fadeUp .8s .5s ease both}
.dot{width:6px;height:6px;border-radius:50%;background:var(--r);animation:bk 1.5s ease-in-out infinite}
@keyframes bk{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(230,57,70,.4)}50%{opacity:.5;box-shadow:0 0 0 6px transparent}}
.clk{font-size:.55rem;color:rgba(255,255,255,.2);font-family:monospace;margin-top:.75rem;animation:fadeUp .8s .7s ease both}
.scroll-i{margin-top:2.5rem;display:flex;flex-direction:column;align-items:center;gap:5px;animation:fadeUp .8s .9s ease both}
.scroll-i span{font-size:.45rem;letter-spacing:.25em;text-transform:uppercase;color:rgba(255,255,255,.2)}
.sc-box{width:16px;height:26px;border:1.5px solid rgba(255,255,255,.15);border-radius:8px;position:relative}
.sc-box::after{content:'';width:2px;height:5px;background:var(--r);border-radius:2px;position:absolute;top:4px;left:50%;transform:translateX(-50%);animation:sc 1.5s ease-in-out infinite}
@keyframes sc{0%,100%{opacity:1;transform:translateX(-50%) translateY(0)}50%{opacity:.2;transform:translateX(-50%) translateY(7px)}}

/* ═══ MARQUEE ═══ */
.marquee{overflow:hidden;padding:.85rem 0;border-bottom:1px solid var(--c7);background:var(--white)}
.mq-t{display:flex;gap:2rem;animation:mq 22s linear infinite;will-change:transform}
@keyframes mq{to{transform:translateX(-50%)}}
.mq-i{font-size:.5rem;font-weight:500;letter-spacing:.25em;text-transform:uppercase;color:var(--c5);white-space:nowrap}
.mq-d{color:var(--r);font-size:.45rem}

/* ═══ FULL PAGE 3D CANVAS ═══ */
#pageFX{position:fixed;top:0;left:0;width:100%;height:100%;z-index:3;pointer-events:none}

/* ═══ SECTIONS ═══ */
.sec{max-width:1100px;margin:0 auto;padding:5rem 2rem;position:relative;z-index:2}
.s-tag{font-size:.5rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--r);margin-bottom:.5rem;display:flex;align-items:center;gap:8px}
.s-tag::before{content:'';width:16px;height:1.5px;background:var(--r);animation:tagPulse 2s ease-in-out infinite}
@keyframes tagPulse{0%,100%{width:16px}50%{width:24px}}
.s-h{font-size:clamp(1.6rem,4vw,2.4rem);font-weight:700;letter-spacing:-.03em;line-height:1.15}
.s-h .ac{color:var(--r)}

/* ═══ SOCIALS ═══ */
.socs{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.soc{width:50px;height:50px;display:flex;align-items:center;justify-content:center;font-size:1rem;text-decoration:none;color:var(--c4);transition:all .4s cubic-bezier(.25,.8,.25,1);box-shadow:var(--sh);cursor:none}
.soc:hover{transform:translateY(-5px) scale(1.1);color:var(--r);box-shadow:var(--sh3)}

/* ═══ PORTFOLIO — 2-2-1 IMAGE GRID ═══ */
.port-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;max-width:700px;margin:0 auto}
.p-card{cursor:none;transition:all .5s cubic-bezier(.25,.8,.25,1);box-shadow:var(--sh);overflow:hidden;position:relative}
.p-card:last-child{grid-column:span 2}
.p-card:hover{transform:translateY(-4px);box-shadow:var(--sh3)}
.p-card img{width:100%;height:auto;display:block;transition:transform .5s cubic-bezier(.25,.8,.25,1)}
.p-card:hover img{transform:scale(1.04)}
.p-card .p-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(29,29,31,.6);backdrop-filter:blur(4px);opacity:0;transition:opacity .4s cubic-bezier(.25,.8,.25,1)}
.p-card:hover .p-label{opacity:1}
.p-card .p-label span{color:#fff;font-size:.85rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;transform:translateY(10px) scale(.9);transition:transform .4s cubic-bezier(.25,.8,.25,1),opacity .4s;opacity:0;padding:8px 22px;border:1.5px solid rgba(255,255,255,.25);border-radius:50px;backdrop-filter:blur(6px);background:rgba(230,57,70,.15)}
.p-card:hover .p-label span{transform:translateY(0) scale(1);opacity:1}

/* ═══ GALLERY ═══ */
.gal-w{overflow:hidden}
.gal-t{display:flex;gap:10px;animation:gs 28s linear infinite;will-change:transform}
.gal-t:hover{animation-play-state:paused}
@keyframes gs{to{transform:translateX(-50%)}}
.gal-t img{height:150px;border-radius:14px;object-fit:cover;flex-shrink:0;border:1px solid var(--c7);transition:all .4s cubic-bezier(.25,.8,.25,1);box-shadow:var(--sh);cursor:none}
.gal-t img:hover{transform:scale(1.06) translateY(-4px);border-color:rgba(230,57,70,.15);box-shadow:var(--sh3)}

/* ═══ PRICING — PREMIUM CARDS ═══ */
.pr-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.pr-card{padding:1.75rem;box-shadow:var(--sh);transition:all .5s cubic-bezier(.25,.8,.25,1);cursor:none}
.pr-card:hover{transform:translateY(-5px);box-shadow:var(--sh3)}
.pr-card.wide{grid-column:span 2}
.pr-badge{position:absolute;top:-2px;right:-2px;padding:5px 16px;border-radius:0 var(--rd) 0 14px;font-size:.5rem;font-weight:700;letter-spacing:.1em;color:#fff;z-index:5;box-shadow:0 4px 12px rgba(0,0,0,.1)}
.pr-badge.red{background:linear-gradient(135deg,var(--r),#d62828)}.pr-badge.blue{background:linear-gradient(135deg,var(--b),#1d3557)}
.pr-head{display:flex;align-items:center;gap:12px;margin-bottom:1rem}
.pr-ico{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:.85rem;flex-shrink:0;position:relative;overflow:hidden}
.pr-ico.red{background:rgba(230,57,70,.06);color:var(--r);border:1px solid rgba(230,57,70,.1)}
.pr-ico.blue{background:rgba(69,123,157,.06);color:var(--b);border:1px solid rgba(69,123,157,.1)}
.pr-ico::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,transparent,rgba(255,255,255,.3));opacity:0;transition:opacity .3s}
.pr-card:hover .pr-ico::after{opacity:1}
.pr-name{font-size:.95rem;font-weight:700}
.pr-sub{font-size:.5rem;color:var(--c4);margin-top:2px;letter-spacing:.05em}
.pr-amt{margin-left:auto;font-size:1.1rem;font-weight:700;color:var(--r)}
.pr-list{list-style:none;margin-top:.5rem}.pr-list li{font-size:.7rem;color:var(--c3);padding:5px 0;display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--c8)}
.pr-list li:last-child{border-bottom:none}
.ck{font-size:.55rem;color:var(--r)}.ck.b{color:var(--b)}
.pr-row{display:flex;justify-content:space-between}.pr-val{color:var(--c1);font-weight:700;font-size:.75rem}

/* ═══ STATS ═══ */
.stats{display:flex;box-shadow:var(--sh);overflow:hidden;border-radius:var(--rd)}
.st{flex:1;padding:1.5rem 1rem;text-align:center;border-right:1px solid var(--c7);position:relative;transition:all .3s;cursor:none}
.st:last-child{border-right:none}
.st:hover{background:var(--c8)}
.st::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2.5px;background:linear-gradient(90deg,var(--r),var(--b));transform:scaleX(0);transition:transform .5s cubic-bezier(.25,.8,.25,1)}
.st:hover::after{transform:scaleX(1)}
.st-n{font-size:clamp(1.3rem,3vw,2rem);font-weight:700}
.st-l{font-size:.5rem;color:var(--c4);letter-spacing:.12em;text-transform:uppercase;margin-top:3px}

/* ═══ CTA ═══ */
.cta{box-shadow:var(--sh);border-radius:22px}
.cta-bar{height:3px;border-radius:22px 22px 0 0;background:linear-gradient(90deg,var(--r),var(--b),var(--r));background-size:200% 100%;animation:gsl 3s linear infinite}
@keyframes gsl{to{background-position:-200% 0}}
.cta-in{padding:4rem 2rem;text-align:center}
.cta-t{font-size:clamp(1.5rem,4vw,2.8rem);font-weight:700;letter-spacing:-.03em;margin-bottom:.75rem;line-height:1.1}
.cta-d{font-size:.85rem;color:var(--c4);max-width:480px;margin:0 auto 2rem;line-height:1.7;font-weight:300}
.cta-btns{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.btn-p{display:inline-flex;align-items:center;gap:8px;padding:14px 34px;border-radius:50px;background:linear-gradient(135deg,var(--r),#d62828);color:#fff;font-size:.85rem;font-weight:600;text-decoration:none;transition:all .3s;border:none;cursor:none;position:relative;overflow:hidden;box-shadow:0 4px 15px rgba(230,57,70,.2)}
.btn-p::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transform:translateX(-100%);transition:transform .6s}
.btn-p:hover::before{transform:translateX(100%)}
.btn-p:hover{transform:scale(1.05);box-shadow:0 10px 35px rgba(230,57,70,.3)}
.btn-o{display:inline-flex;align-items:center;gap:8px;padding:14px 34px;border-radius:50px;background:transparent;color:var(--c1);font-size:.85rem;font-weight:500;text-decoration:none;border:1.5px solid var(--c6);transition:all .3s;cursor:none}
.btn-o:hover{border-color:var(--r);color:var(--r);transform:scale(1.05)}

/* ═══ FOOTER ═══ */
.foot{padding:3rem 2rem 1.5rem;background:var(--white);border-top:1px solid var(--c7)}
.foot-brand{font-size:clamp(2.5rem,8vw,5rem);font-weight:700;letter-spacing:-.04em;text-align:center;margin-bottom:1.5rem;color:var(--c7);user-select:none}
.foot-socs{display:flex;justify-content:center;gap:10px;margin-bottom:1.5rem}
.foot-s{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid var(--c7);color:var(--c4);font-size:.7rem;text-decoration:none;transition:all .3s;cursor:none}
.foot-s:hover{color:var(--r);border-color:rgba(230,57,70,.2);transform:scale(1.12)}
.foot-bot{border-top:1px solid var(--c7);padding-top:1rem;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;max-width:1100px;margin:0 auto}
.foot-c{font-size:.5rem;color:var(--c4)}.foot-l{display:flex;gap:1.5rem}
.foot-l a{font-size:.5rem;color:var(--c4);text-decoration:none;transition:color .3s;cursor:none}.foot-l a:hover{color:var(--r)}

/* ═══ LIGHTBOX ═══ */
.lb{position:fixed;inset:0;z-index:100;background:rgba(29,29,31,.96);backdrop-filter:blur(20px);display:none;align-items:center;justify-content:center}
.lb.open{display:flex}
.lb-b{position:absolute;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:#fff;font-size:.9rem;cursor:none;display:flex;align-items:center;justify-content:center;transition:all .3s;z-index:20}
.lb-b:hover{background:var(--r);border-color:var(--r);transform:scale(1.1)}
.lb-x{top:20px;right:20px}.lb-pv{left:16px;top:50%;transform:translateY(-50%)}.lb-nx{right:16px;top:50%;transform:translateY(-50%)}
.lb-img{max-height:85vh;max-width:90vw;object-fit:contain;border-radius:14px;transition:opacity .3s}
.lb-i{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);text-align:center;color:#fff}
.lb-i p:first-child{font-size:.8rem;font-weight:600}.lb-i p:last-child{font-size:.5rem;color:rgba(255,255,255,.4);margin-top:3px}

/* ═══ SPLIT LETTER ANIMATIONS ═══ */
.split-char{display:inline-block;opacity:0;transform:translateY(80px) rotate(10deg);filter:blur(8px);transition:all .6s cubic-bezier(.16,1,.3,1)}
.split-char.vis{opacity:1;transform:translateY(0) rotate(0);filter:blur(0)}
/* Word split */
.split-word{display:inline-block;opacity:0;transform:translateY(40px);filter:blur(4px);transition:all .5s cubic-bezier(.16,1,.3,1)}
.split-word.vis{opacity:1;transform:translateY(0);filter:blur(0)}
/* Generic anim-in */
.anim-in{opacity:0;transform:translateY(25px);filter:blur(3px);transition:all .6s cubic-bezier(.16,1,.3,1)}
.anim-in.vis{opacity:1;transform:translateY(0);filter:blur(0)}
/* Logo entrance */
.logo-box{opacity:0;transform:scale(.6);filter:blur(10px);transition:all .8s cubic-bezier(.16,1,.3,1)}
.logo-box.vis{opacity:1;transform:scale(1);filter:blur(0)}
/* Section reveals — scroll triggered */
.rv{opacity:0;transform:translateY(35px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1)}
.rv.vis{opacity:1;transform:translateY(0)}
/* Scroll word reveal */
.scroll-word{display:inline-block;opacity:0;transform:translateY(30px);filter:blur(3px);transition:all .5s cubic-bezier(.16,1,.3,1)}
.scroll-word.vis{opacity:1;transform:translateY(0);filter:blur(0)}

/* ═══ RESPONSIVE ═══ */
@media(min-width:1200px){.sec{max-width:1200px;padding:6rem 3rem}}
@media(max-width:1024px){.sec{padding:4rem 1.5rem}}
@media(max-width:768px){
  .hero-c{padding:1.5rem}.logo-box{width:120px;height:120px}.logo-img{width:85px;height:85px}
  .port-grid{grid-template-columns:1fr}.p-card:last-child{grid-column:span 1}
  .pr-grid{grid-template-columns:1fr}.pr-card.wide{grid-column:span 1}
  .stats{flex-wrap:wrap}.st{min-width:50%;border-bottom:1px solid var(--c7)}.st:nth-child(2){border-right:none}
  .gal-t img{height:120px}.cta-in{padding:2.5rem 1.25rem}.sec{padding:3rem 1.25rem}
  .foot-bot{justify-content:center;text-align:center}
  .cursor,.cursor-dot{display:none}body{cursor:auto}
  .soc,.p-card,.pr-card,.st,.btn-p,.btn-o,.foot-s,.foot-l a,.lb-b,.gal-t img{cursor:auto}
}
@media(max-width:420px){
  .h1{font-size:2.5rem}
  .stats{flex-direction:column}.st{border-right:none;border-bottom:1px solid var(--c7)}.st:last-child{border-bottom:none}
  .cta-btns{flex-direction:column}.btn-p,.btn-o{justify-content:center;width:100%}
  .socs{gap:8px}.soc{width:44px;height:44px;font-size:.9rem}
}