* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Inter', system-ui, sans-serif; background: #050816; color: #fff; overflow-x: hidden; }

.grid-bg {
background-image:
linear-gradient(rgba(239,68,68,0.025) 1px, transparent 1px),
linear-gradient(90deg, rgba(239,68,68,0.025) 1px, transparent 1px);
background-size: 60px 60px;
}

@keyframes float { 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-12px) } }
@keyframes float-slow { 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-8px) } }
@keyframes radar-sweep { 0%{ transform:rotate(0deg) } 100%{ transform:rotate(360deg) } }
@keyframes scanline { 0%{ top:-10% } 100%{ top:110% } }
@keyframes ticker { 0%{ transform:translateX(0) } 100%{ transform:translateX(-50%) } }
@keyframes glow-pulse { 0%,100%{ box-shadow:0 0 20px rgba(239,68,68,0.12) } 50%{ box-shadow:0 0 40px rgba(239,68,68,0.25) } }
@keyframes fade-up { from{ opacity:0; transform:translateY(24px) } to{ opacity:1; transform:translateY(0) } }
@keyframes rotate-slow { 0%{ transform:rotate(0deg) } 100%{ transform:rotate(360deg) } }
@keyframes dash-flow { to{ stroke-dashoffset:-20 } }
@keyframes dash-border { to{ stroke-dashoffset:-24 } }
@keyframes pulse-glow { 0%,100%{ opacity:.6; transform:scale(1) } 50%{ opacity:1; transform:scale(1.08) } }
@keyframes line-appear { from{ width:0 } to{ width:100% } }
@keyframes counter { from { opacity:0; transform:translateY(10px) } to { opacity:1; transform:translateY(0) } }
@keyframes signal-pulse { 0%{ opacity:0; transform:scale(0.5) } 50%{ opacity:1 } 100%{ opacity:0; transform:scale(2.5) } }
@keyframes pulse-ring { 0%{ width:6px; height:6px; opacity:1 } 100%{ width:50px; height:50px; opacity:0 } }
@keyframes spin { to{ transform:rotate(360deg) } }

.anim-float { animation: float 7s ease-in-out infinite; }
.anim-float-slow { animation: float-slow 9s ease-in-out 1.5s infinite; }
.anim-radar { animation: radar-sweep 6s linear infinite; }
.anim-ticker { animation: ticker 40s linear infinite; }
.anim-glow { animation: glow-pulse 3s ease-in-out infinite; }
.anim-fade-up { animation: fade-up .75s ease-out forwards; }
.anim-rotate-slow { animation: rotate-slow 25s linear infinite; }
.anim-dash { animation: dash-flow 1.5s linear infinite; }
.anim-pulse-glow { animation: pulse-glow 2.5s ease-in-out infinite; }

.text-gradient-fire { background:linear-gradient(135deg,#EF4444 0%,#F59E0B 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.text-gradient-cyan { background:linear-gradient(135deg,#00D4FF 0%,#7C3AED 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.text-gradient-white-red { background:linear-gradient(135deg,#FFFFFF 30%,#EF4444 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }

.glass { background:rgba(255,255,255,0.02); backdrop-filter:blur(16px); border:1px solid rgba(255,255,255,0.06); }
.glass-red { background:rgba(239,68,68,0.04); backdrop-filter:blur(16px); border:1px solid rgba(239,68,68,0.12); }

.corner-brackets { position:relative; }
.corner-brackets::before, .corner-brackets::after { content:''; position:absolute; width:14px; height:14px; border-color:rgba(239,68,68,0.35); border-style:solid; pointer-events:none; }
.corner-brackets::before { top:-1px; left:-1px; border-width:2px 0 0 2px; border-radius:4px 0 0 0; }
.corner-brackets::after { bottom:-1px; right:-1px; border-width:0 2px 2px 0; border-radius:0 0 4px 0; }

.danger-stripe { background-image:repeating-linear-gradient(-45deg,transparent,transparent 8px,rgba(239,68,68,0.04) 8px,rgba(239,68,68,0.04) 16px); }

::-webkit-scrollbar { width:5px; }
::-webkit-scrollbar-track { background:#050816; }
::-webkit-scrollbar-thumb { background:rgba(239,68,68,0.3); border-radius:4px; }
::-webkit-scrollbar-thumb:hover { background:rgba(239,68,68,0.5); }

.nav-link { position:relative; }
.nav-link::after { content:''; position:absolute; bottom:-2px; left:50%; width:0; height:2px; background:#EF4444; transition:all .3s; transform:translateX(-50%); }
.nav-link:hover::after { width:100%; }
.nav-link-active { color:#EF4444 !important; }
.nav-link-active::after { width:100% !important; }

.card-lift { transition:all .4s cubic-bezier(.25,.46,.45,.94); }
.card-lift:hover { transform:translateY(-5px); }
.card-shine { position:relative; overflow:hidden; }
.card-shine::before { content:''; position:absolute; top:0; left:-100%; width:60%; height:100%; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.04),transparent); transition:left .6s; }
.card-shine:hover::before { left:130%; }

.mobile-menu { transform:translateX(100%); transition:transform .3s ease; }
.mobile-menu.open { transform:translateX(0); }

.dropdown-content { opacity:0; visibility:hidden; transform:translateY(8px); transition:all .25s ease; }
.dropdown:hover .dropdown-content { opacity:1; visibility:visible; transform:translateY(0); }

.reveal { opacity:0; transform:translateY(28px); transition:all .7s cubic-bezier(.25,.46,.45,.94); }
.reveal.visible { opacity:1; transform:translateY(0); }

.radar-container { position:relative; }
.radar-ring { position:absolute; border-radius:50%; border:1px solid rgba(239,68,68,0.08); }
.radar-ring-2 { border-color:rgba(239,68,68,0.05); }
.radar-ring-inner { border-color:rgba(239,68,68,0.1); }
.radar-crosshair { position:absolute; background:rgba(239,68,68,0.05); }
.radar-sweep-cone {
position:absolute; inset:0; border-radius:50%;
background: conic-gradient(from 0deg, transparent 0deg, rgba(239,68,68,0.18) 15deg, rgba(239,68,68,0.06) 45deg, transparent 90deg);
}
.radar-blip { position:absolute; border-radius:50%; }
.radar-blip-critical { background:radial-gradient(circle, rgba(239,68,68,0.9) 0%, rgba(239,68,68,0) 70%); }
.radar-blip-warning { background:radial-gradient(circle, rgba(245,158,11,0.9) 0%, rgba(245,158,11,0) 70%); }
.radar-blip-info { background:radial-gradient(circle, rgba(0,212,255,0.9) 0%, rgba(0,212,255,0) 70%); }
.radar-center-dot { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); }
.radar-pulse-ring { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); border-radius:50%; border:1.5px solid rgba(239,68,68,0.3); animation:pulse-ring 3s ease-out infinite; }

.signal-ring { position:absolute; border:1px solid rgba(239,68,68,0.15); border-radius:50%; animation:signal-pulse 4s ease-out infinite; }

.lifecycle-connector { position:relative; }
.lifecycle-connector::after { content:''; position:absolute; top:50%; right:-28px; width:0; height:0; border-top:8px solid transparent; border-bottom:8px solid transparent; border-left:12px solid rgba(239,68,68,0.25); }
.lifecycle-connector:last-child::after { display:none; }

.lifecycle-card { transition: all .4s cubic-bezier(.25,.46,.45,.94); }
.lifecycle-card:hover { transform: translateY(-6px) scale(1.02); }

.faq-answer { max-height:0; overflow:hidden; transition:max-height .35s ease, padding .35s ease; padding:0 0; }
.faq-answer.open { max-height:300px; padding:12px 0 0 0; }
.faq-icon { transition:transform .3s ease; }
.faq-icon.open { transform:rotate(180deg); }

.timeline-line { position:absolute; left:50%; top:0; bottom:0; width:2px; background:linear-gradient(to bottom, rgba(239,68,68,0.3), rgba(239,68,68,0.05)); transform:translateX(-50%); }
@media(max-width:768px) { .timeline-line { left:20px; } }
.timeline-dot { width:14px; height:14px; border-radius:50%; background:#EF4444; border:3px solid #050816; position:absolute; left:50%; top:24px; transform:translateX(-50%); z-index:2; box-shadow:0 0 12px rgba(239,68,68,0.4); }
@media(max-width:768px) { .timeline-dot { left:20px; } }
.timeline-item { opacity:0; transform:translateY(20px); transition:all .6s cubic-bezier(.25,.46,.45,.94); }
.timeline-item.visible { opacity:1; transform:translateY(0); }

.arch-flow-card { position:relative; }
.arch-flow-card::after { content:''; position:absolute; top:50%; right:-2rem; width:2rem; height:2px; background:repeating-linear-gradient(90deg, rgba(239,68,68,0.3) 0, rgba(239,68,68,0.3) 6px, transparent 6px, transparent 12px); }
.arch-flow-card:last-child::after { display:none; }
@media(max-width:1023px) { .arch-flow-card::after { display:none; } }

.pipeline-step { position:relative; }
.pipeline-step::after { content:''; position:absolute; top:50%; right:-1.5rem; width:1.5rem; height:2px; background:linear-gradient(90deg, rgba(239,68,68,0.3), rgba(239,68,68,0.05)); }
.pipeline-step:last-child::after { display:none; }
@media(max-width:1023px) { .pipeline-step::after { display:none; } }

.form-error { display:none; font-size:11px; color:#EF4444; margin-top:4px; }
.form-error.show { display:block; }
input.error, select.error, textarea.error { border-color: rgba(239,68,68,0.5) !important; box-shadow: 0 0 0 1px rgba(239,68,68,0.15); }

.toast { position:fixed; bottom:2rem; right:2rem; z-index:100; transform:translateX(120%); transition:transform .4s cubic-bezier(.25,.46,.45,.94); }
.toast.show { transform:translateX(0); }