:root{
  --bg:oklch(0.16 0.012 250);
  --fg:oklch(0.97 0.005 250);
  --surface:oklch(0.20 0.014 250);
  --surface-elev:oklch(0.24 0.016 250);
  --primary:oklch(0.70 0.18 42);
  --primary-glow:oklch(0.78 0.20 50);
  --secondary:oklch(0.74 0.13 190);
  --muted:oklch(0.72 0.012 250);
  --border:oklch(1 0 0 / 0.10);
  --destructive:oklch(0.65 0.22 25);
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--fg);font-family:'Inter',system-ui,sans-serif;-webkit-font-smoothing:antialiased;scroll-behavior:smooth}
h1,h2,h3,h4{font-family:'Space Grotesk',system-ui,sans-serif;letter-spacing:-0.02em;margin:0}
p{margin:0}
a{color:inherit;text-decoration:none}
.text-primary{color:var(--primary)}
.text-secondary{color:var(--secondary)}
.text-muted{color:var(--muted)}
.text-fg{color:var(--fg)}
.bg-surface{background:var(--surface)}
.bg-surface-elev{background:var(--surface-elev)}
.border-d{border:1px solid var(--border)}
.bg-accent-gradient{background-image:linear-gradient(135deg,var(--primary),var(--primary-glow))}
.shadow-glow{box-shadow:0 0 40px -10px var(--primary)}
.shadow-elev{box-shadow:0 20px 60px -20px rgba(0,0,0,.6)}
.text-balance{text-wrap:balance}
.bg-hero{background-image:radial-gradient(ellipse at top,oklch(0.24 0.04 42 / 0.35),transparent 60%),radial-gradient(ellipse at bottom left,oklch(0.24 0.06 190 / 0.25),transparent 50%),radial-gradient(circle at 50% -10%,oklch(0.70 0.18 42 / 0.18),transparent 50%)}
.bg-services-glow{background-image:radial-gradient(ellipse at top right,oklch(0.74 0.13 190 / 0.12),transparent 55%)}
.gradient-text{background:linear-gradient(135deg,var(--primary),var(--primary-glow),var(--secondary));-webkit-background-clip:text;background-clip:text;color:transparent}
.gradient-stat{background:linear-gradient(135deg,var(--primary),var(--primary-glow));-webkit-background-clip:text;background-clip:text;color:transparent}
.gradient-stat-2{background:linear-gradient(135deg,var(--secondary),var(--primary));-webkit-background-clip:text;background-clip:text;color:transparent}
.container{max-width:1200px;margin:0 auto;padding:0 1.5rem}
.btn{display:inline-flex;align-items:center;gap:.5rem;border-radius:.5rem;padding:.75rem 1.25rem;font-size:.875rem;font-weight:600;cursor:pointer;border:1px solid transparent;transition:all .2s}
.btn-primary{background-image:linear-gradient(135deg,var(--primary),var(--primary-glow));color:oklch(0.16 0.012 250);box-shadow:0 0 40px -10px var(--primary)}
.btn-primary:hover{opacity:.95}
.btn-ghost{border-color:var(--border);background:rgba(255,255,255,.04);color:var(--fg)}
.btn-ghost:hover{border-color:color-mix(in oklab,var(--primary) 50%,transparent);color:var(--primary)}
.card{background:color-mix(in oklab,var(--surface) 60%,transparent);border:1px solid var(--border);border-radius:1rem;backdrop-filter:blur(8px)}
.section{padding:6rem 0}
@media(max-width:640px){.section{padding:4rem 0}}
.eyebrow{font-size:.75rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--primary)}
.eyebrow-2{color:var(--secondary)}
.h2{font-size:2rem;font-weight:600;letter-spacing:-.02em;line-height:1.1}
@media(min-width:640px){.h2{font-size:2.5rem}}
.muted{color:var(--muted)}
.grid{display:grid;gap:1.5rem}
.cols-2{grid-template-columns:repeat(2,1fr)}
.cols-3{grid-template-columns:repeat(3,1fr)}
.cols-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.cols-3,.cols-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.cols-2,.cols-3,.cols-4{grid-template-columns:1fr}}
/* Header */
header.site{position:fixed;inset:0 0 auto 0;z-index:50;transition:all .3s;background:rgba(20,22,28,.4);backdrop-filter:blur(12px)}
header.site.scrolled{background:rgba(20,22,28,.85);border-bottom:1px solid var(--border)}
header .nav{display:flex;align-items:center;justify-content:space-between;height:64px}
header .links{display:none;gap:.25rem;align-items:center}
@media(min-width:1024px){header .links{display:flex}}
header .links a{padding:.5rem .75rem;font-size:.875rem;font-weight:500;color:rgba(255,255,255,.8);border-radius:.375rem}
header .links a:hover,header .links a.active{color:var(--primary)}
.logo{display:inline-flex;align-items:center;gap:.5rem;font-size:1.125rem;font-weight:600}
.logo-mark{display:grid;place-items:center;height:32px;width:32px;border-radius:.5rem;background-image:linear-gradient(135deg,var(--primary),var(--primary-glow));color:oklch(0.16 0.012 250);box-shadow:0 0 40px -10px var(--primary)}
.menu-btn{display:grid;place-items:center;height:36px;width:36px;border:1px solid var(--border);border-radius:.375rem;background:transparent;color:var(--fg)}
@media(min-width:1024px){.menu-btn{display:none}}
.mobile-menu{display:none;border-top:1px solid var(--border);background:rgba(20,22,28,.95);backdrop-filter:blur(12px)}
.mobile-menu.open{display:block}
.mobile-menu nav{display:flex;flex-direction:column;gap:.25rem;padding:1rem 1.5rem}
.mobile-menu a{padding:.5rem .75rem;border-radius:.375rem;color:rgba(255,255,255,.8);font-size:.875rem}
.mobile-menu a:hover{background:var(--surface);color:var(--primary)}
/* Footer */
footer.site{border-top:1px solid var(--border);background:color-mix(in oklab,var(--surface) 40%,transparent)}
footer.site .container{padding-top:4rem;padding-bottom:4rem}
footer .cols{display:grid;gap:2rem;grid-template-columns:repeat(4,1fr)}
@media(max-width:768px){footer .cols{grid-template-columns:repeat(2,1fr)}}
footer h4{font-size:.875rem;font-weight:600}
footer ul{list-style:none;padding:0;margin:1rem 0 0;display:flex;flex-direction:column;gap:.5rem;font-size:.875rem;color:var(--muted)}
footer ul a:hover{color:var(--primary)}
footer .bottom{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--border);display:flex;justify-content:space-between;font-size:.75rem;color:var(--muted);flex-wrap:wrap;gap:1rem}
.icon-link{display:grid;place-items:center;height:36px;width:36px;border:1px solid var(--border);border-radius:.375rem;color:var(--muted);transition:all .2s}
.icon-link:hover{border-color:color-mix(in oklab,var(--primary) 50%,transparent);color:var(--primary)}
/* Hero */
.hero{position:relative;padding-top:8rem;padding-bottom:5rem;overflow:hidden}
.hero-grid{display:grid;gap:3rem;grid-template-columns:1fr 1fr;align-items:center}
@media(max-width:1024px){.hero-grid{grid-template-columns:1fr}}
.hero h1{font-size:3rem;font-weight:600;line-height:1.05;margin-top:1.25rem}
@media(min-width:1024px){.hero h1{font-size:3.75rem}}
.chip{display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--border);border-radius:9999px;padding:.25rem .75rem;font-size:.75rem;font-weight:500;color:rgba(255,255,255,.85);backdrop-filter:blur(8px);background:color-mix(in oklab,var(--surface) 60%,transparent)}
/* Tracking map */
.hub-svg{width:100%;height:auto}
@keyframes pulse-node{0%,100%{opacity:.4;r:4}50%{opacity:1;r:7}}
@keyframes dash{to{stroke-dashoffset:-200}}
.hub-node{animation:pulse-node 3s ease-in-out infinite}
.route-line{stroke-dasharray:6 8;animation:dash 6s linear infinite}
/* Forms */
.form-card{background:color-mix(in oklab,var(--surface) 60%,transparent);border:1px solid var(--border);border-radius:1rem;padding:2rem;backdrop-filter:blur(8px)}
.form-row{display:grid;gap:1rem;grid-template-columns:1fr 1fr;margin-top:1rem}
@media(max-width:640px){.form-row{grid-template-columns:1fr}}
label{display:block;font-size:.75rem;font-weight:500;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.4rem}
input,select,textarea{width:100%;background:rgba(0,0,0,.3);border:1px solid var(--border);border-radius:.5rem;padding:.75rem;color:var(--fg);font:inherit;font-size:.875rem;outline:none;transition:border .2s}
input:focus,select:focus,textarea:focus{border-color:color-mix(in oklab,var(--primary) 60%,transparent)}
textarea{min-height:120px;resize:vertical}
.field-error{color:var(--destructive);font-size:.75rem;margin-top:.25rem}
.toast{position:fixed;top:1rem;right:1rem;background:var(--surface-elev);border:1px solid var(--border);border-left:3px solid var(--secondary);padding:.75rem 1rem;border-radius:.5rem;font-size:.875rem;box-shadow:0 20px 60px -20px rgba(0,0,0,.6);z-index:100;animation:slideIn .3s}
.toast.error{border-left-color:var(--destructive)}
@keyframes slideIn{from{transform:translateX(20px);opacity:0}to{transform:translateX(0);opacity:1}}
