:root{
  --bg:#04060A; --surface:#080B11; --card:rgba(13,17,23,.7);
  --border:rgba(255,255,255,.08); --border-hover:rgba(255,199,0,.4);
  --gold:#FFC700; --blue:#3B82F6; --cyan:#06B6D4; --purple:#A855F7;
  --text:#fff; --text2:#94A3B8; --muted:#64748B;
  --glow:0 0 25px rgba(255,199,0,.15);
  --font:'Plus Jakarta Sans','Inter',sans-serif; --mono:'JetBrains Mono',monospace;
}
html{scroll-behavior:smooth;scroll-padding-top:5rem}
body{
  font-family:var(--font);color:var(--text);background:var(--bg);
  background-image:radial-gradient(900px 500px at 0% 0%,rgba(255,199,0,.07),transparent 60%),
                   radial-gradient(900px 500px at 100% 100%,rgba(6,182,212,.07),transparent 60%);
  background-attachment:fixed;overflow-x:hidden;
}
.cyber-grid{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.03;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cpath d='M40 0H0v40' fill='none' stroke='white' stroke-width='1'/%3E%3C/svg%3E")}
.font-mono{font-family:var(--mono)}
.text-gold{color:var(--gold)} .bg-gold{background:var(--gold)}
.text-metal{background:linear-gradient(135deg,#fff 20%,#FFC700 70%,#fff);-webkit-background-clip:text;background-clip:text;color:transparent}

.glass{background:var(--card);border:1px solid var(--border);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.card{transition:border-color .25s,box-shadow .25s,transform .25s}
.card:hover{border-color:var(--border-hover);animation:pulseGlow 2.4s ease-in-out infinite;transform:translateY(-3px)}
.btn-gold{background:var(--gold);color:#000;transition:box-shadow .25s,transform .2s}
.btn-gold:hover{box-shadow:0 0 28px rgba(255,199,0,.45);transform:translateY(-1px)}
.gradient-pill{background:linear-gradient(var(--bg),var(--bg)) padding-box,linear-gradient(90deg,var(--gold),var(--purple)) border-box;border:1px solid transparent}

.icon-wrap{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;color:var(--gold);
  background:rgba(255,199,0,.08);border:1px solid rgba(255,199,0,.3);box-shadow:0 0 18px rgba(255,199,0,.15)}
.icon-wrap.sm{width:36px;height:36px;border-radius:10px;flex-shrink:0}
.icon-wrap svg{width:22px;height:22px}.icon-wrap.sm svg{width:18px;height:18px}

.status-pill{padding:4px 12px;border-radius:999px;border:1px solid rgba(16,185,129,.35);background:rgba(16,185,129,.08)}
.pulse-dot{width:8px;height:8px;border-radius:50%;background:#10B981;display:inline-block;animation:ping 1.8s ease-out infinite}

/* Tabs */
.tab-btn{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;padding:10px 16px;border-radius:10px;font-weight:600;font-size:14px;
  color:var(--text2);border:1px solid var(--border);background:var(--card);transition:all .2s}
.tab-btn:hover{color:#fff;border-color:var(--border-hover)}
.tab-btn.active{color:#000;background:var(--gold);border-color:var(--gold)}
.oos-tag{font-family:var(--mono);font-size:10px;padding:2px 6px;border-radius:6px;background:rgba(239,68,68,.15);color:#F87171}
.tab-btn.active .oos-tag{background:rgba(0,0,0,.15);color:#000}
.plan-panel-in{animation:fadeIn .3s ease}
.plan-card.oos{opacity:.75}
.spec{font-family:var(--mono);font-size:13px;color:var(--text2)}
.badge-active,.badge-oos{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;font-weight:600;padding:4px 12px;border-radius:999px}
.badge-active{color:#34D399;border:1px solid rgba(16,185,129,.35);background:rgba(16,185,129,.08)}
.badge-oos{color:#F87171;border:1px solid rgba(239,68,68,.4);background:rgba(239,68,68,.08)}
.plan-btn{display:block;width:100%;text-align:center;padding:12px;border-radius:10px;font-weight:700}
.plan-btn.oos{background:rgba(255,255,255,.06);color:var(--text2);border:1px solid var(--border)}

/* KVM */
.kvm-border{padding:2px;background:linear-gradient(135deg,var(--purple),var(--gold),var(--purple))}
.kvm-inner{background:var(--surface)}

/* Founders */
.badge-b{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;font-weight:800;font-size:22px}
.badge-b.gold{background:rgba(255,199,0,.12);color:var(--gold);border:1px solid rgba(255,199,0,.4)}
.badge-b.cyan{background:rgba(6,182,212,.12);color:var(--cyan);border:1px solid rgba(6,182,212,.4)}
.cc{margin-left:6px;padding:1px 6px;border-radius:5px;border:1px solid var(--border);font-size:11px;color:#fff}

/* Terminal */
.term-ok{color:#34D399}.term-cmt{color:var(--muted)}.term-cmd{color:var(--gold)}
.caret{display:inline-block;width:8px;height:15px;background:var(--gold);vertical-align:-2px;animation:codeTyping 1s steps(1) infinite}

/* Mobile drawer */
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(320px,85vw);z-index:70;padding:20px;background:var(--surface);
  border-left:1px solid var(--border);transform:translateX(100%);transition:transform .3s ease;visibility:hidden}
.drawer.open{transform:none;visibility:visible}
.drawer-backdrop{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.6);opacity:0;pointer-events:none;transition:opacity .3s}
.drawer-backdrop.open{opacity:1;pointer-events:auto}
.drawer-link{padding:12px;border-radius:10px}.drawer-link:hover{background:rgba(255,255,255,.05)}

/* Keyframes */
@keyframes pulseGlow{0%,100%{box-shadow:0 0 12px rgba(255,199,0,.08)}50%{box-shadow:0 0 25px rgba(255,199,0,.15)}}
@keyframes floatCard{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes codeTyping{0%,50%{opacity:1}50.01%,100%{opacity:0}}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(16,185,129,.6)}100%{box-shadow:0 0 0 10px rgba(16,185,129,0)}}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.float-card{animation:floatCard 6s ease-in-out infinite}

/* Scrollbar */
::-webkit-scrollbar{width:10px;height:8px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:#1f2937;border-radius:8px}
::-webkit-scrollbar-thumb:hover{background:var(--gold)}

a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
@media (max-width:767px){.float-card{animation:none}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
