.hero-title{background:linear-gradient(135deg,var(--text) 40%,var(--red) 60%,var(--text) 80%);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:text-mask-reveal 3s ease forwards}
@keyframes text-mask-reveal{from{background-position:200% center;opacity:0;filter:blur(8px)}to{background-position:0 center;opacity:1;filter:blur(0)}}
.hero-gradient-overlay{position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(135deg,rgba(232,25,44,0.08),transparent 40%,rgba(232,25,44,0.05),transparent);background-size:400% 400%;animation:gradient-anim 12s ease infinite}
@keyframes gradient-anim{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.hero-typing{position:relative;z-index:1;font-size:12px;color:var(--red);font-weight:600;letter-spacing:.5px;font-family:'Courier New',monospace;min-height:18px;margin-bottom:16px}
.feat{transition:background .22s,box-shadow .22s,transform .22s,background-size .4s,letter-spacing .3s}
.feat:hover{background-size:120%;box-shadow:inset 4px 4px 20px rgba(232,25,44,0.06),inset -4px -4px 20px rgba(0,0,0,0.1),0 0 20px rgba(232,25,44,0.06),0 8px 24px rgba(0,0,0,0.15);transform:perspective(800px) rotateX(-1deg) rotateY(1deg) translateY(-2px)}
.feat:hover .feat-name{letter-spacing:.5px}
.feat-extra{max-height:0;overflow:hidden;transition:max-height .3s ease,opacity .3s;opacity:0;font-size:12px;color:var(--text-dim);margin-top:0;line-height:1.6}
.feat:hover .feat-extra{max-height:60px;opacity:1;margin-top:8px}
.feat-corner-icon{position:absolute;bottom:10px;right:10px;width:20px;height:20px;opacity:0;transform:scale(0.5);transition:all .3s cubic-bezier(.34,1.56,.64,1)}
.feat-corner-icon svg{width:20px;height:20px;stroke:var(--red);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.feat:hover .feat-corner-icon{opacity:.4;transform:scale(1)}
.feat::before{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 0 rgba(232,25,44,0);transition:box-shadow .3s;pointer-events:none}
.feat:hover::before{box-shadow:0 0 0 1px rgba(232,25,44,0.2)}
.border-draw{position:relative}
.border-draw::before,.border-draw::after{content:'';position:absolute;inset:0;border:1px solid var(--red);border-radius:inherit;opacity:0;transition:opacity .3s}
.border-draw::before{clip-path:inset(0 100% 0 0);transition:clip-path .4s ease}
.border-draw::after{clip-path:inset(0 0 0 100%);transition:clip-path .4s ease .1s}
.border-draw:hover::before{clip-path:inset(0 0 0 0);opacity:1}
.border-draw:hover::after{clip-path:inset(0 0 0 0);opacity:1}
.nav-links a{position:relative}
.nav-links a::after{content:'';position:absolute;bottom:-4px;left:0;width:0;height:2px;background:linear-gradient(90deg,var(--red),rgba(232,25,44,0.3));transition:width .3s ease;border-radius:2px}
.nav-links a.active::after,.nav-links a:hover::after{width:100%}
nav.nav-hidden{transform:translateY(-100%)}
nav{transition:height .3s,background .3s,transform .3s,backdrop-filter .3s}
.s-title{text-shadow:0 0 0 transparent;transition:text-shadow .6s ease}
.reveal.visible .s-title{text-shadow:0 0 30px rgba(232,25,44,0.15)}
.partner-card{transition:border-color .2s,transform .3s cubic-bezier(.34,1.56,.64,1)}
.partner-card:hover{transform:translateY(-4px)}
.ghost-text{position:absolute;font-family:var(--head);font-size:clamp(120px,18vw,260px);color:rgba(232,25,44,0.02);letter-spacing:10px;white-space:nowrap;pointer-events:none;z-index:0;animation:ghost-slide 30s linear infinite;top:50%;transform:translateY(-50%)}
@keyframes ghost-slide{from{transform:translateY(-50%) translateX(100%)}to{transform:translateY(-50%) translateX(-100%)}}
.click-flash{position:fixed;width:60px;height:60px;border-radius:50%;background:radial-gradient(circle,rgba(232,25,44,0.3),transparent 70%);pointer-events:none;z-index:9999;transform:translate(-50%,-50%) scale(0);opacity:0}
.click-flash.pop{animation:flash-pop .4s ease forwards}
@keyframes flash-pop{0%{transform:translate(-50%,-50%) scale(0);opacity:1}100%{transform:translate(-50%,-50%) scale(3);opacity:0}}
.side-info{position:fixed;left:12px;top:50%;transform:translateY(-50%);z-index:80;display:flex;flex-direction:column;gap:4px;writing-mode:vertical-rl;font-size:9px;color:var(--text-dim);letter-spacing:1px;text-transform:uppercase;opacity:0;transition:opacity .3s}
.side-info.show{opacity:1}
.side-info span{color:var(--red);font-weight:600}
.footer-marquee{overflow:hidden;padding:12px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.footer-marquee-inner{display:flex;animation:marquee-run 25s linear infinite;width:max-content;gap:40px}
.footer-marquee-inner span{font-family:var(--head);font-size:14px;letter-spacing:3px;color:var(--text-dim);white-space:nowrap}
.footer-marquee-inner span em{color:var(--red);font-style:normal}
@keyframes marquee-run{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ping-badge{position:relative}
.ping-badge::after{content:'';position:absolute;top:-2px;right:-2px;width:8px;height:8px;border-radius:50%;background:var(--red);animation:ping-anim 2s cubic-bezier(0,0,0.2,1) infinite}
@keyframes ping-anim{0%{transform:scale(1);opacity:1}75%,100%{transform:scale(2.5);opacity:0}}
.corner-brackets{position:relative}
.corner-brackets::before,.corner-brackets::after{content:'';position:absolute;width:16px;height:16px;border-color:var(--red);border-style:solid;border-width:0;opacity:0;transition:all .3s ease}
.corner-brackets::before{top:8px;left:8px;border-top-width:2px;border-left-width:2px}
.corner-brackets::after{bottom:8px;right:8px;border-bottom-width:2px;border-right-width:2px}
.corner-brackets:hover::before,.corner-brackets:hover::after{opacity:1}
.focus-blur .feat:not(:hover){filter:blur(1.5px) brightness(0.85);transition:filter .3s}
.focus-blur .feat:hover{filter:none}
.focus-blur:not(:hover) .feat{filter:none}
.section-progress{width:100%;height:2px;background:var(--border);border-radius:2px;margin-top:40px;overflow:hidden}
.section-progress-fill{height:100%;width:0;background:var(--red);border-radius:2px;transition:width .8s ease}
.hover-grid-bg{position:relative;overflow:hidden}
.hover-grid-bg::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(232,25,44,0.03) 1px,transparent 1px),linear-gradient(90deg,rgba(232,25,44,0.03) 1px,transparent 1px);background-size:20px 20px;opacity:0;transition:opacity .3s;pointer-events:none;z-index:0}
.hover-grid-bg:hover::before{opacity:1}
.reveal-scale{opacity:0;transform:translateY(20px) scale(0.96);filter:blur(4px);transition:opacity .6s ease,transform .6s ease,filter .6s ease}
.reveal-scale.visible{opacity:1;transform:none;filter:none}
.scroll-up nav:not(.shrunk){transform:translateY(0)}
.scroll-down nav.shrunk{transform:translateY(-100%)}
.scroll-down .back-to-top{opacity:0;pointer-events:none}
.scroll-up .back-to-top.show{opacity:1;pointer-events:auto}
.top-notif{position:fixed;top:0;left:0;right:0;z-index:201;background:var(--red);color:#fff;font-size:11px;font-weight:600;text-align:center;padding:5px 12px;letter-spacing:.3px;transform:translateY(-100%);transition:transform .3s}
.top-notif.show{transform:none}
.top-notif a{color:#fff;text-decoration:underline;margin-left:8px}
.feat-icon svg{transition:stroke-dashoffset .6s ease}
.feat:hover .feat-icon svg{animation:icon-draw .6s ease forwards}
@keyframes icon-draw{from{stroke-dasharray:100;stroke-dashoffset:100}to{stroke-dasharray:100;stroke-dashoffset:0}}
.footer-activity{overflow:hidden;height:18px;position:relative}
.footer-activity-inner{display:flex;flex-direction:column;animation:activity-scroll 12s linear infinite}
.footer-activity-inner span{font-size:11px;color:var(--text-dim);white-space:nowrap;height:18px;line-height:18px}
@keyframes activity-scroll{0%{transform:translateY(0)}100%{transform:translateY(-100%)}}
.section-highlight{position:relative}
.section-highlight::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(232,25,44,0.04),transparent 50%);pointer-events:none;opacity:0;transition:opacity .3s}
.section-highlight:hover::before{opacity:1}
.hero-lens{position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse 80% 60% at 50% 50%,transparent 40%,rgba(0,0,0,0.15) 100%)}
.mini-counter{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;background:var(--bg4);border:1px solid var(--border);border-radius:999px;font-size:11px;font-weight:600;color:var(--text-muted);letter-spacing:.3px}
.mini-counter em{color:var(--red);font-style:normal;font-family:var(--head);font-size:16px;letter-spacing:1px}
.stagger-letter{display:inline-flex}
.stagger-letter span{display:inline-block;opacity:0;transform:translateY(10px);animation:stagger-in .4s ease forwards}
@keyframes stagger-in{to{opacity:1;transform:none}}
@media(max-width:900px){.side-info{display:none}.top-notif{font-size:10px}}
@media(max-width:600px){.ghost-text{display:none}.footer-activity{display:none}}