:root{--bg:#050812;--panel:#0b1020;--panel2:#111827;--text:#f8fafc;--muted:#94a3b8;--line:#23304a;--blue:#1c69d4;--cyan:#22d3ee;--white:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);margin:0;font-family:DM Sans,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}a{color:inherit;text-decoration:none}button,select,input{font:inherit}main{overflow:hidden}.hero{background:radial-gradient(circle at 74% 12%,#1c69d43d,#0000 34%),linear-gradient(135deg,#02040a 0%,#07111f 58%,#101827 100%);min-height:100vh;padding:28px 44px 70px;position:relative}.hero:before{content:"";background-image:linear-gradient(#ffffff09 1px,#0000 1px),linear-gradient(90deg,#ffffff09 1px,#0000 1px);background-size:52px 52px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000,#0000 82%);mask-image:linear-gradient(#000,#0000 82%)}nav{z-index:2;align-items:center;gap:30px;height:58px;display:flex;position:relative}nav a{color:#cbd5e1;font-weight:800}nav button{color:#fff;background:0 0;border:1px solid #ffffff57;border-radius:0;margin-left:auto;padding:12px 18px;font-weight:900}.brand{align-items:center;gap:10px;font-size:20px;font-weight:1000;display:flex}.brand svg{color:var(--cyan)}.heroGrid{z-index:1;grid-template-columns:1.05fr .95fr;align-items:center;gap:52px;min-height:calc(100vh - 90px);display:grid;position:relative}.eyebrow{color:var(--cyan);letter-spacing:.16em;text-transform:uppercase;font-size:13px;font-weight:1000}.hero h1{text-transform:uppercase;letter-spacing:-.032em;max-width:920px;margin:24px 0;font-size:clamp(42px,5.35vw,74px);font-weight:420;line-height:1.03}.hero p{color:#cbd5e1;max-width:760px;font-size:19px;line-height:1.5}.heroActions{gap:16px;margin-top:30px;display:flex}.primary,.secondary{border-radius:0;align-items:center;gap:9px;height:54px;padding:0 22px;font-weight:1000;display:inline-flex}.primary{background:var(--blue);color:#fff}.secondary{color:#e5e7eb;border:1px solid #ffffff57}.heroPanel{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#020617b8;border:1px solid #94a3b838;min-height:560px;padding:22px;position:relative}.heroMiniMetrics{z-index:5;grid-template-columns:repeat(3,1fr);gap:8px;display:grid;position:absolute;top:28px;left:28px;right:28px}.heroMiniMetrics span{background:#050812d1;border:1px solid #94a3b838;padding:10px 12px}.heroMiniMetrics b{color:#fff;font-size:18px;display:block}.heroMiniMetrics small{color:#94a3b8;text-transform:uppercase;letter-spacing:.08em;font-size:10px;display:block}.liveBadge{color:#dbeafe;background:#050812e6;border:1px solid #22d3ee73;padding:10px 14px;font-weight:900;position:absolute;bottom:25px;left:28px}.liveBadge span{background:#22c55e;border-radius:999px;width:9px;height:9px;margin-right:8px;display:inline-block;box-shadow:0 0 16px #22c55e}.simulator{background:#050812;grid-template-columns:320px minmax(420px,1fr) 380px;gap:18px;padding:22px;display:grid}.controlsPanel,.simulationCanvas,.metricsPanel,.chartCard,.clientReady{border:1px solid var(--line);background:linear-gradient(#111827fa,#050812fa);box-shadow:0 30px 80px #00000052}.controlsPanel{align-self:start;padding:22px;position:sticky;top:0}.panelHeader{align-items:flex-end;gap:12px;margin-bottom:20px;display:flex}.panelHeader span,.sectionTitle span{color:var(--cyan);font-weight:1000}.panelHeader h2,.sectionTitle h2{text-transform:uppercase;letter-spacing:-.04em;margin:0;font-size:26px;font-weight:300}.panelHeader p{color:var(--muted);margin:0 0 2px auto}.selectLabel{color:#cbd5e1;margin:16px 0;font-weight:900;display:block}.selectLabel select{color:#fff;background:#070d1c;border:1px solid #2b3955;border-radius:0;width:100%;margin-top:8px;padding:12px}.control{border-top:1px solid var(--line);padding:16px 0;display:block}.control div{justify-content:space-between;gap:12px;display:flex}.control span{color:#cbd5e1}.control strong{color:#fff}.control input{width:100%;accent-color:var(--blue);margin-top:12px}.modeButtons{grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px;display:grid}.modeButtons button{color:#cbd5e1;background:#070d1c;border:1px solid #2b3955;border-radius:0;padding:10px 5px;font-size:12px;font-weight:1000}.modeButtons .active{background:var(--blue);color:#fff;border-color:var(--blue)}.simulationCanvas{min-height:680px;padding:24px}.packStage{background:radial-gradient(circle,#22d3ee17,#0000 35%),linear-gradient(135deg,#080d19,#02040a);border:1px solid #1f2a44;justify-content:center;align-items:center;height:100%;min-height:430px;display:flex;position:relative;overflow:hidden}.packStage:before{content:"";background-image:linear-gradient(#94a3b812 1px,#0000 1px),linear-gradient(90deg,#94a3b812 1px,#0000 1px);background-size:36px 36px;position:absolute;inset:0}.packGrid{z-index:2;gap:6px;width:88%;max-width:900px;display:grid;position:relative}.batteryCell{border:1px solid color-mix(in srgb,var(--cellColor) 55%,#fff 0%);background:linear-gradient(180deg,color-mix(in srgb,var(--cellColor) 25%,#07111f),#050812);min-width:18px;height:28px;box-shadow:0 0 16px color-mix(in srgb,var(--cellColor) 34%,transparent);color:#e2e8f0;animation:1.8s ease-in-out infinite pulse;animation-delay:var(--pulseDelay);justify-content:center;align-items:center;display:flex}.batteryCell.pouch{border-radius:0;height:24px}.batteryCell.prismatic{height:34px}.batteryCell.thermal{border-color:#f59e0b;box-shadow:0 0 18px #f59e0b8c}.batteryCell.safety{border-color:#2dd4bf;box-shadow:0 0 18px #2dd4bf80}@keyframes pulse{0%,to{filter:brightness(.9)}50%{filter:brightness(1.45)}}.bus{z-index:3;border:1px solid #fff;justify-content:center;align-items:center;width:42px;height:42px;font-size:24px;font-weight:1000;display:flex;position:absolute;top:24px}.positive{color:#ef4444;right:24px}.negative{color:#60a5fa;left:24px}.currentRibbon{background:#22d3ee26;height:6px;position:absolute;inset:auto 54px 70px;overflow:hidden}.currentRibbon span{background:linear-gradient(90deg,transparent,var(--cyan),transparent);width:90px;height:100%;animation:2s linear infinite flow;position:absolute}.currentRibbon span:nth-child(2){animation-delay:.65s}.currentRibbon span:nth-child(3){animation-delay:1.25s}@keyframes flow{0%{left:-120px}to{left:100%}}.overflowNote{z-index:4;color:#cbd5e1;background:#020617d1;border:1px solid #334155;padding:8px 12px;font-size:12px;position:absolute;bottom:18px;right:18px}.chemNarrative{background:#080d19;border-left:4px solid;margin-top:16px;padding:14px 16px}.chemNarrative p{color:#cbd5e1;margin:.4rem 0 0;line-height:1.45}.metricsPanel{grid-template-columns:1fr;gap:12px;padding:18px;display:grid}.metricCard{border:1px solid #24314b;border-left:4px solid var(--accent);background:#070d1c;align-items:center;gap:14px;padding:16px;display:flex}.metricIcon{width:38px;height:38px;color:var(--accent);background:#ffffff0d;place-items:center;display:grid}.metricValue{letter-spacing:-.04em;font-size:26px;font-weight:1000}.metricLabel{color:#e2e8f0;font-weight:900}.metricSub{color:#94a3b8;font-size:13px}.analytics{background:#080d19;padding:80px 44px}.sectionTitle{max-width:980px;margin-bottom:28px}.sectionTitle h2{font-size:44px}.sectionTitle p{color:#cbd5e1;font-size:18px;line-height:1.5}.chartGrid{grid-template-columns:1fr 1fr;gap:20px;display:grid}.chartCard{padding:24px}.chartCard h3{margin:0 0 18px;font-size:22px}.clientReady{background:linear-gradient(135deg,#02040a,#0b1730);grid-template-columns:.9fr 1.1fr;gap:40px;margin:0;padding:80px 44px;display:grid}.clientReady h2{text-transform:uppercase;margin:15px 0;font-size:48px;font-weight:300;line-height:1.02}.clientReady p{color:#cbd5e1;font-size:18px;line-height:1.5}.deploymentCards{grid-template-columns:repeat(3,1fr);gap:14px;display:grid}.deploymentCards article{background:#ffffff0a;border:1px solid #2b3955;min-height:220px;padding:22px}.deploymentCards svg{color:var(--cyan)}.deploymentCards h3{font-size:22px}.deploymentCards p{font-size:15px}@media (width<=1150px){.heroGrid,.simulator,.clientReady,.chartGrid{grid-template-columns:1fr}.controlsPanel{position:relative}.metricsPanel{grid-template-columns:repeat(2,1fr)}.hero{padding:22px}.deploymentCards{grid-template-columns:1fr}}@media (width<=680px){nav a{display:none}.hero h1{font-size:42px}.metricsPanel,.deploymentCards{grid-template-columns:1fr}.simulator,.analytics,.clientReady{padding:14px}.heroActions{flex-direction:column}.heroMiniMetrics{grid-template-columns:1fr;margin-bottom:12px;position:relative;top:auto;left:auto;right:auto}}