/* global.css — cleaned 2025-08-11T10:58:18.775257Z */

/* NEUROBLASTER / global.css */
/* Root variables, resets, and global layout primitives */
:root{
  --brand:#7C3AED;        /* purple */
  --brand-2:#1D4ED8;      /* blue */
  --bg:#0B0B10;
  --bg-soft:#111319;
  --card:#141726;
  --text:#F3F4F6;
  --text-dim:#C7CAD1;
  --accent:#22D3EE;
  --danger:#EF4444;
  --success:#10B981;
  --muted:#6B7280;
  --radius:18px;
  --nav-h:86px;
  --nav-h-shrink:64px;
  --shadow:0 10px 30px rgba(0,0,0,0.25);
}
*{box-sizing:border-box}
html,body{height:100%;}
html{scroll-behavior:smooth}
body{
  margin:0;
  background: linear-gradient(180deg, #0b0b10 0%, #0c0f1a 100%);
  color:var(--text);
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Apple Color Emoji","Segoe UI Emoji", "Segoe UI Symbol";
  line-height:1.6;
}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%; height:auto; display:block}
.container{
  width: min(1200px, 92vw);
  margin: 0 auto;
}
.section{
  padding: 80px 0;
}
h1,h2,h3{line-height:1.2; margin: 0 0 12px}
h1{font-size: clamp(28px, 4vw, 44px);}
h2{font-size: clamp(22px, 3.2vw, 32px);}
h3{font-size: clamp(18px, 2.6vw, 24px);}
p{margin:0 0 12px}
button,.btn{
  appearance:none; border:0; cursor:pointer; display:inline-flex; align-items:center; justify-content:center;
  padding: 11px 16px; border-radius: 12px; font-weight:700; color:#0b0b10;
  background:linear-gradient(135deg, var(--accent), #60A5FA);
  transition: filter .2s ease, transform .08s ease;
}
button:hover,.btn:hover{filter:brightness(1.05)}
button:active,.btn:active{transform:translateY(1px)}
.btn.secondary{background:#24283b; color:var(--text)}
.btn.ghost{background:transparent; border:1px solid #2b2f44; color:var(--text)}
.card{
  background: radial-gradient(100% 100% at 0% 0%, #101425 0%, #0f1220 100%);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow:hidden;
}
.grid{display:grid; gap:24px}
.grid-3{grid-template-columns: repeat(3, minmax(0, 1fr))}
.grid-2{grid-template-columns: repeat(2, minmax(0, 1fr))}
@media (max-width: 1024px){ .grid-3 {grid-template-columns: repeat(2, minmax(0, 1fr))} }
@media (max-width: 720px){ .grid-3, .grid-2 {grid-template-columns: 1fr} }

/* Utility spacing */
.mt-1{margin-top:8px} .mt-2{margin-top:12px} .mt-3{margin-top:16px} .mt-4{margin-top:24px}
.mb-1{margin-bottom:8px} .mb-2{margin-bottom:12px} .mb-3{margin-bottom:16px} .mb-4{margin-bottom:24px}
.pt-1{padding-top:8px} .pt-2{padding-top:12px} .pt-3{padding-top:16px} .pt-4{padding-top:24px}
.pb-1{padding-bottom:8px} .pb-2{padding-bottom:12px} .pb-3{padding-bottom:16px} .pb-4{padding-bottom:24px}

/* Visually hidden (for a11y) */
.visually-hidden{ position:absolute !important; height:1px; width:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); white-space:nowrap }