:root{
  --bg0:#050814;
  --bg1:#061327;
  --ink:#EAF1FF;
  --muted:rgba(234,241,255,.72);
  --muted2:rgba(234,241,255,.56);
  --line:rgba(255,255,255,.10);
  --glass:rgba(15,22,45,.46);
  --glass2:rgba(10,16,34,.40);
  --shadow:0 30px 80px rgba(0,0,0,.55);
  --teal:#35F6FF;
  --teal2:#00D6C6;
  --purple:#B061FF;
  --indigo:#4B63FF;
  --hot:#FF4D9A;
  --radius:20px;
  --radius2:14px;
  --pad:clamp(16px, 2.2vw, 26px);
  --max:1320px;
  --h1:clamp(38px, 4.2vw, 62px);
  --h2:clamp(26px, 2.4vw, 38px);
  --p:clamp(15px, 1.2vw, 18px);
  --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color:var(--ink);
  background: radial-gradient(1200px 700px at 70% 10%, rgba(53,246,255,.10), transparent 60%),
              radial-gradient(900px 500px at 10% 20%, rgba(176,97,255,.10), transparent 65%),
              linear-gradient(135deg, var(--bg0), var(--bg1));
  padding-top: var(--topbar-offset, 76px);
  overflow-x:hidden;
  letter-spacing:.2px;
}

a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; }

.container{ width:min(var(--max), calc(100% - 32px)); margin:0 auto; }
.muted{ color:var(--muted2); }
.sep{ opacity:.55; margin:0 10px; }

/* Background layers */
#bg{ position:fixed; inset:0; z-index:-1; }
#particles,#starfield{ position:absolute; inset:0; width:100%; height:100%; display:block; }
.bg-glow{
  position:absolute; inset:-20%;
  background:
    radial-gradient(900px 700px at 70% 18%, rgba(53,246,255,.12), transparent 65%),
    radial-gradient(700px 500px at 22% 55%, rgba(176,97,255,.12), transparent 60%),
    radial-gradient(600px 420px at 45% 92%, rgba(255,77,154,.08), transparent 60%);
  filter: blur(22px);
  transform: translate3d(0,0,0);
}
.bg-grid{
  position:absolute; inset:0;
  background:
    linear-gradient(to right, rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: radial-gradient(closest-side at 55% 30%, rgba(0,0,0,.85), transparent 80%);
  opacity:.20;
}

/* Glass base */
.glass{
  background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.10);
  border-radius:var(--radius);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 22px 70px rgba(0,0,0,.38);
}

/* Topbar */
.topbar{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:50;
  padding:16px clamp(24px, 5vw, 56px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  background: linear-gradient(180deg, rgba(5,8,20,.72), rgba(5,8,20,.30));
  border-bottom:1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  overflow:hidden;
}
.topbar:before{
  content:"";
  position:absolute;
  inset:-60px -120px -80px -120px;
  background:
    radial-gradient(520px 240px at 120px 38px, rgba(255,255,255,.12), rgba(255,255,255,0) 70%),
    radial-gradient(520px 240px at 120px 38px, rgba(53,246,255,.12), rgba(53,246,255,0) 70%),
    radial-gradient(520px 240px at 120px 38px, rgba(176,97,255,.08), rgba(176,97,255,0) 74%);
  pointer-events:none;
  z-index:0;
}
.topbar > *{ position:relative; z-index:1; }
.brand{ display:flex; align-items:center; gap:10px; white-space:nowrap; }
.logo-plate{
  width:46px;
  height:46px;
  border-radius:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:
    radial-gradient(30px 30px at 30% 25%, rgba(255,255,255,.22), rgba(255,255,255,0) 70%),
    rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.20);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow:
    0 18px 60px rgba(0,0,0,.35),
    0 0 34px rgba(53,246,255,.18),
    0 0 40px rgba(176,97,255,.12);
}
.logo-plate:before{
  content:"";
  position:absolute;
  width:46px;
  height:46px;
  border-radius:16px;
  pointer-events:none;
  background: linear-gradient(135deg, rgba(53,246,255,.40), rgba(176,97,255,.26), rgba(255,77,154,.14));
  opacity:.22;
  filter: blur(.2px);
}
.logo-plate{ position:relative; }
.brand-logo{
  width:38px;
  height:38px;
  border-radius:12px;
  filter: drop-shadow(0 0 18px rgba(53,246,255,.18)) drop-shadow(0 0 20px rgba(176,97,255,.14));
}
.brand-name{
  font-weight:800;
  letter-spacing:1.6px;
  font-size:16px;
  text-transform:uppercase;
  background: linear-gradient(90deg, rgba(234,241,255,1), rgba(53,246,255,.92));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  text-shadow: 0 0 22px rgba(53,246,255,.10);
}
.brand-sub{ color:var(--muted2); font-weight:600; letter-spacing:1.4px; font-size:12px; text-transform:uppercase; }
.nav{ display:flex; gap:24px; color:var(--muted); font-weight:500; font-size:16px; letter-spacing:.4px; }
.nav a{ opacity:.92; transition: opacity .2s ease; }
.nav a:hover{ opacity:1; color:rgba(234,241,255,.92); }
.topbar-cta{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; justify-content:flex-end; }

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  height:44px;
  padding:0 16px;
  border-radius:14px;
  font-weight:600;
  letter-spacing:.8px;
  text-transform:uppercase;
  font-size:12px;
  border:1px solid rgba(255,255,255,.14);
  position:relative;
  cursor:pointer;
  user-select:none;
}
.btn-ghost{
  background: rgba(255,255,255,.05);
  color: rgba(234,241,255,.86);
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
.btn-ghost:hover{ transform: translateY(-1px); background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.18); }

.btn-neon{
  border-color: rgba(53,246,255,.34);
  background:
    linear-gradient(135deg, rgba(53,246,255,.16), rgba(176,97,255,.14)) padding-box,
    linear-gradient(135deg, rgba(53,246,255,.95), rgba(176,97,255,.95)) border-box;
  box-shadow:
    0 0 0 1px rgba(53,246,255,.14),
    0 18px 50px rgba(0,0,0,.35),
    0 0 26px rgba(53,246,255,.12),
    0 0 34px rgba(176,97,255,.10);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.btn-neon.alt{
  border-color: rgba(176,97,255,.38);
  background:
    linear-gradient(135deg, rgba(176,97,255,.16), rgba(53,246,255,.10)) padding-box,
    linear-gradient(135deg, rgba(176,97,255,.95), rgba(53,246,255,.95)) border-box;
}
.btn-neon:hover{
  transform: translateY(-1px);
  filter: brightness(1.08);
  box-shadow:
    0 0 0 1px rgba(53,246,255,.16),
    0 22px 60px rgba(0,0,0,.40),
    0 0 32px rgba(53,246,255,.16),
    0 0 46px rgba(176,97,255,.14);
}
.btn:active{ transform: translateY(0px) scale(.99); }

/* Sections */
section{ padding: clamp(54px, 6.2vw, 88px) 0; position:relative; }
section{ scroll-margin-top: calc(var(--topbar-offset, 76px) + 14px); }
.section-head{ display:grid; gap:10px; margin-bottom:22px; }
.section-head h2{ margin:0; font-size:var(--h2); letter-spacing:1.1px; }
.section-head p{ margin:0; color:var(--muted); font-size:var(--p); line-height:1.6; max-width:76ch; }

/* Hero */
.hero{ padding-top: clamp(54px, 6vw, 78px); }
.hero-grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: clamp(22px, 3.6vw, 42px);
  align-items:start;
}
.hero-copy{ position:relative; }
.hero-copy:before{
  content:"";
  position:absolute;
  left:-140px;
  top:-80px;
  width:520px;
  height:320px;
  background:
    radial-gradient(closest-side at 55% 45%, rgba(255,255,255,.10), rgba(255,255,255,0) 72%),
    radial-gradient(closest-side at 55% 45%, rgba(53,246,255,.10), rgba(53,246,255,0) 74%),
    radial-gradient(closest-side at 55% 45%, rgba(176,97,255,.08), rgba(176,97,255,0) 78%);
  pointer-events:none;
  filter: blur(2px);
  z-index:0;
}
.hero-copy > *{ position:relative; z-index:1; }
.hero-brand{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
.hero-logo{
  width:44px;
  height:44px;
  border-radius:16px;
  filter: drop-shadow(0 0 22px rgba(53,246,255,.20)) drop-shadow(0 0 22px rgba(176,97,255,.14));
}
.logo-plate-lg{
  width:62px;
  height:62px;
  border-radius:20px;
}
.logo-plate-lg:before{
  width:62px;
  height:62px;
  border-radius:20px;
}
.logo-plate-lg .hero-logo{
  width:52px;
  height:52px;
  border-radius:16px;
}
.hero-brand-name{
  font-weight:900;
  letter-spacing:2.2px;
  text-transform:uppercase;
  font-size:16px;
  line-height:1.1;
}
.hero-brand-sub{
  margin-top:2px;
  color:rgba(234,241,255,.72);
  letter-spacing:2.4px;
  text-transform:uppercase;
  font-size:11px;
  font-family:var(--mono);
}
.pill{
  display:inline-flex;
  gap:10px;
  align-items:center;
  padding:10px 14px;
  border-radius:999px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(234,241,255,.80);
  font-size:12px;
  letter-spacing:1.1px;
  text-transform:uppercase;
}
.dot-live{
  width:8px; height:8px; border-radius:50%;
  background: rgba(53,246,255,1);
  box-shadow: 0 0 0 6px rgba(53,246,255,.10), 0 0 18px rgba(53,246,255,.40);
}
.hero-title{ margin:14px 0 10px; font-size:var(--h1); line-height:1.02; letter-spacing:1.2px; }
.grad{
  background: linear-gradient(90deg, rgba(53,246,255,1), rgba(176,97,255,1), rgba(255,77,154,1));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.hero-subtitle{ margin:0 0 18px; color:var(--muted); font-size:var(--p); line-height:1.65; max-width:70ch; }
.hero-platforms{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin:0 0 18px;
}
.platform-label{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:1.6px;
  color:var(--muted2);
}
.platform-icons{
  display:flex;
  align-items:center;
  gap:14px;
}
.platform-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  color:rgba(234,241,255,.88);
  transition: transform .2s ease, color .2s ease;
}
.platform-icon:hover{
  transform: scale(1.12);
  color:#35F6FF;
}
.platform-icon svg{
  width:100%;
  height:100%;
  object-fit:contain;
}
.platform-icon.small{
  width:22px;
  height:22px;
}
.card-platforms{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
}
.card-platforms .platform-icon{
  width:24px;
  height:24px;
  color:var(--muted2);
}
.card-platforms .platform-icon:hover{
  color:rgba(53,246,255,.9);
}
.hero-cta{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin: 18px 0 18px; }

.hero-kpis{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:12px;
  margin-top:16px;
}
.kpi{ padding:14px 14px; border-radius:18px; }
.kpi-label{ color:var(--muted2); font-size:12px; letter-spacing:1.1px; text-transform:uppercase; margin-bottom:8px; }
.kpi-value{ font-size:22px; font-weight:700; letter-spacing:.8px; }
.unit{ opacity:.85; font-weight:700; }

/* Dashboard */
.hero-module{ display:grid; gap:10px; }
.dashboard{ padding: var(--pad); border-radius: 22px; position:relative; overflow:hidden; }
.dashboard:before{
  content:"";
  position:absolute; inset:-1px;
  background: linear-gradient(135deg, rgba(53,246,255,.45), rgba(176,97,255,.30), rgba(255,77,154,.14));
  opacity:.20;
  pointer-events:none;
}
.dash-top{ position:relative; display:flex; justify-content:space-between; gap:14px; align-items:flex-start; margin-bottom:16px; }
.dash-title{ display:flex; gap:10px; align-items:center; font-weight:700; letter-spacing:1px; }
.dash-live{
  font-family: var(--mono);
  font-size:11px;
  padding:6px 8px;
  border-radius:999px;
  border:1px solid rgba(53,246,255,.36);
  color:rgba(53,246,255,.96);
  background: rgba(53,246,255,.08);
  box-shadow: 0 0 16px rgba(53,246,255,.18);
}
.dash-controls{ display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.segmented{
  display:inline-flex;
  padding:4px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
}
.seg-btn{
  border:0;
  background:transparent;
  color:rgba(234,241,255,.78);
  font-size:12px;
  letter-spacing:1.1px;
  text-transform:uppercase;
  padding:8px 10px;
  border-radius:999px;
  cursor:pointer;
  transition: background .16s ease, color .16s ease, transform .16s ease;
}
.seg-btn.is-active{
  background: linear-gradient(135deg, rgba(53,246,255,.16), rgba(176,97,255,.14));
  border:1px solid rgba(53,246,255,.22);
  color: rgba(234,241,255,.94);
}
.seg-btn:hover{ transform: translateY(-1px); }

.dropdown{ position:relative; }
.dd-btn{
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  color: rgba(234,241,255,.86);
  padding:10px 12px;
  border-radius:14px;
  font-size:12px;
  letter-spacing:.9px;
  text-transform:uppercase;
  cursor:pointer;
  white-space:nowrap;
}
.chev{ opacity:.7; margin-left:8px; }
.dd-menu{
  position:absolute;
  right:0;
  top: calc(100% + 10px);
  width: 220px;
  padding:8px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(7,10,22,.72);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  box-shadow: var(--shadow);
  display:none;
}
.dropdown.is-open .dd-menu{ display:block; }
.dd-item{
  width:100%;
  text-align:left;
  border:1px solid transparent;
  background: transparent;
  color: rgba(234,241,255,.84);
  padding:10px 10px;
  border-radius:12px;
  cursor:pointer;
  letter-spacing:.7px;
  text-transform:uppercase;
  font-size:12px;
}
.dd-item:hover{
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.10);
}
.dd-item.is-active{
  background: linear-gradient(135deg, rgba(53,246,255,.12), rgba(176,97,255,.10));
  border-color: rgba(53,246,255,.18);
}

.dash-metrics{
  position:relative;
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:12px;
  margin-bottom:12px;
}
.metric{
  border:1px solid rgba(255,255,255,.10);
  border-radius:18px;
  padding:14px 14px;
  background: rgba(255,255,255,.04);
}
.metric-label{
  color:var(--muted2);
  font-size:12px;
  letter-spacing:1.1px;
  text-transform:uppercase;
  margin-bottom:10px;
}
.metric-value{
  font-weight:800;
  font-size:22px;
  letter-spacing:.8px;
}
.sparkline{ height:28px; margin-top:10px; border-radius:12px; background: rgba(255,255,255,.03); overflow:hidden; position:relative; }
.sparkline canvas{ width:100%; height:100%; display:block; }

.dash-bottom{
  display:flex;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  color: rgba(234,241,255,.78);
  font-size:12px;
  letter-spacing:1px;
  text-transform:uppercase;
  margin-top:10px;
}
.chip{
  display:inline-flex;
  align-items:center;
  height:22px;
  padding:0 8px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  font-family:var(--mono);
  font-size:11px;
  margin-right:8px;
}
.health-dot{
  width:7px; height:7px; border-radius:50%;
  background: rgba(53,246,255,1);
  box-shadow: 0 0 0 6px rgba(53,246,255,.10), 0 0 18px rgba(53,246,255,.35);
  display:inline-block;
  margin-right:8px;
}
.hero-note{ color:var(--muted2); font-size:13px; line-height:1.5; padding:0 2px; }

/* Cards / grids */
.feature-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:12px;
}
.feature{ padding:18px 16px; border-radius:18px; }
.feature-title{ font-weight:700; letter-spacing:.6px; margin-bottom:8px; }
.feature-text{ color:var(--muted); line-height:1.6; font-size:14px; }

.card-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:18px;
}
.card{ padding:20px 18px; border-radius:22px; position:relative; overflow:hidden; }
.card h3{ margin:10px 0 8px; letter-spacing:.8px; }
.card p{ margin:0 0 12px; color:var(--muted); line-height:1.65; }
.card-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:12px;
  letter-spacing:1.1px;
  text-transform:uppercase;
  color: rgba(234,241,255,.80);
}
.card-badge.glow{
  color: rgba(53,246,255,.92);
  text-shadow: 0 0 18px rgba(53,246,255,.18);
}
.bullets{ margin:0; padding-left:18px; color:rgba(234,241,255,.80); line-height:1.7; }
.bullets li{ margin:6px 0; }
.card-highlight{
  border-color: rgba(53,246,255,.24);
  box-shadow:
    0 0 0 1px rgba(53,246,255,.10),
    0 28px 90px rgba(0,0,0,.44),
    0 0 42px rgba(53,246,255,.10);
}
.card-highlight:after{
  content:"";
  position:absolute; inset:-2px;
  background: radial-gradient(700px 340px at 40% 0%, rgba(53,246,255,.16), transparent 60%),
              radial-gradient(600px 300px at 85% 70%, rgba(176,97,255,.12), transparent 62%);
  pointer-events:none;
}
.nodes{ position:absolute; inset:0; pointer-events:none; opacity:.9; }

/* Markets */
.markets-grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:20px;
  align-items:stretch;
}
.map{ padding:14px; border-radius:22px; }
.map-inner{
  position:relative;
  border-radius:18px;
  overflow:hidden;
}
.world-map{
  width:100%;
  height:auto;
  display:block;
  border-radius:18px;
}
.map-markers{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.map-marker{
  position:absolute;
  left:var(--x);
  top:var(--y);
  width:14px;
  height:14px;
  border-radius:50%;
  transform:translate(-50%,-50%);
  border:1px solid currentColor;
  background:radial-gradient(circle at 30% 30%, rgba(255,255,255,.9), transparent 65%);
  box-shadow:
    0 0 0 3px rgba(5,8,20,.9),
    0 0 14px currentColor,
    0 0 26px rgba(0,0,0,.6);
  color:#35F6FF;
  animation: mapPulse 2.1s ease-out infinite;
}
.map-marker::before{
  content:"";
  position:absolute;
  inset:4px;
  border-radius:inherit;
  background:currentColor;
  box-shadow:0 0 12px currentColor;
}
.map-marker.sea{ color:#35F6FF; }
.map-marker.latam{ color:#B061FF; }
.map-marker.southasia{ color:#E8A84A; }
@keyframes mapPulse{
  0%{ transform:translate(-50%,-50%) scale(1); opacity:1; }
  70%{ transform:translate(-50%,-50%) scale(1.35); opacity:.12; }
  100%{ transform:translate(-50%,-50%) scale(1.5); opacity:0; }
}
.map-legend{ display:flex; gap:14px; padding:12px 6px 0; color:var(--muted2); font-size:12px; letter-spacing:1px; text-transform:uppercase; }
.legend-item{ display:flex; align-items:center; gap:8px; }
.swatch{ width:10px; height:10px; border-radius:50%; }
.swatch.sea{ background: rgba(53,246,255,1); box-shadow:0 0 18px rgba(53,246,255,.25); }
.swatch.latam{ background: rgba(176,97,255,1); box-shadow:0 0 18px rgba(176,97,255,.25); }
.swatch.southasia{ background: rgba(232,168,74,1); box-shadow:0 0 12px rgba(232,168,74,.35); }

.regions{ display:grid; gap:14px; }
.region{ padding:18px 16px; border-radius:22px; }
.region-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:10px; margin-bottom:12px; }
.region h3{ margin:0; letter-spacing:.8px; }
.region-stat{ color:var(--muted2); font-size:12px; letter-spacing:1px; text-transform:uppercase; }
.chips{ display:flex; flex-wrap:wrap; gap:8px; }
.chip.sea{ border-color: rgba(53,246,255,.28); }
.chip.latam{ border-color: rgba(176,97,255,.28); }
.chip.southasia{ border-color: rgba(232,168,74,.45); color: rgba(248,212,140,.95); }
.region-foot{ margin-top:12px; }

/* Metrics */
.metric-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:16px;
}
.stat{ padding:18px 16px; border-radius:22px; text-align:left; }
.stat-value{ font-weight:900; font-size:34px; letter-spacing:.8px; }
.stat-label{ color:var(--muted2); margin-top:10px; letter-spacing:1px; text-transform:uppercase; font-size:12px; }

/* Cases */
.case{ padding:18px 16px; border-radius:22px; }
.case-meta{ color:var(--muted2); letter-spacing:1px; text-transform:uppercase; font-size:12px; }
.case-pill{
  display:inline-flex;
  align-items:center;
  height:30px;
  padding:0 12px;
  border-radius:999px;
  background: rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  font-weight:700;
  letter-spacing:.8px;
  text-transform:uppercase;
  font-size:12px;
}
.case-pill.sea{ border-color: rgba(53,246,255,.22); color: rgba(53,246,255,.92); }
.case-pill.latam{ border-color: rgba(176,97,255,.22); color: rgba(176,97,255,.92); }
.case-top,.case-mid{ display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.case-result{ display:flex; align-items:baseline; justify-content:space-between; margin-top:16px; }
.case-big{
  font-size:42px;
  font-weight:900;
  letter-spacing:1px;
  background: linear-gradient(90deg, rgba(53,246,255,1), rgba(176,97,255,1));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* Stack */
.stack-panels{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:12px;
  perspective: 900px;
}
.panel{ padding:18px 16px; border-radius:22px; transform: translateZ(0); }
.panel-title{ font-weight:800; letter-spacing:.8px; margin-bottom:8px; }
.panel-text{ color:var(--muted); line-height:1.6; font-size:14px; }

/* Why */
.why-grid{
  display:grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap:12px;
}
.why-item{ padding:18px 16px; border-radius:22px; }
.why-item h3{ margin:0 0 8px; letter-spacing:.7px; }
.why-item p{ margin:0; color:var(--muted); line-height:1.65; }

/* Contact */
.contact-card{ padding:22px 18px; border-radius:26px; position:relative; overflow:hidden; }
.contact-card:before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(800px 320px at 20% 10%, rgba(176,97,255,.16), transparent 60%),
    radial-gradient(700px 320px at 85% 60%, rgba(53,246,255,.14), transparent 62%),
    radial-gradient(700px 360px at 55% 110%, rgba(255,77,154,.10), transparent 60%);
  pointer-events:none;
}
.contact-direct{
  position:relative;
  margin-top:10px;
  margin-bottom:10px;
  padding:10px 12px;
  border-radius:18px;
  background: rgba(5,10,24,.72);
  border:1px solid rgba(255,255,255,.16);
  display:flex;
  flex-direction:column;
  gap:6px;
}
.contact-direct-label{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:1.4px;
  color:var(--muted2);
}
.contact-direct-row{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13px;
}
.contact-direct-row a{
  color:rgba(234,241,255,.92);
  text-decoration:none;
}
.contact-direct-row a:hover{
  color:#35F6FF;
}
.contact-actions{ position:relative; display:flex; flex-wrap:wrap; gap:10px; margin-top:12px; }
.fineprint{ position:relative; margin-top:18px; color:var(--muted2); letter-spacing:.7px; }

/* Floating support button */
.support-fab{
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:60;
  display:flex;
  align-items:center;
  justify-content:center;
  width:54px;
  height:54px;
  border-radius:999px;
  background: rgba(5,10,24,.88);
  border:1px solid rgba(53,246,255,.40);
  box-shadow:
    0 18px 50px rgba(0,0,0,.55),
    0 0 24px rgba(53,246,255,.22);
  text-decoration:none;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.support-fab:hover{
  border-color:rgba(53,246,255,.70);
  box-shadow:
    0 20px 60px rgba(0,0,0,.60),
    0 0 30px rgba(53,246,255,.28);
}
.support-avatar{
  width:48px;
  height:48px;
  border-radius:50%;
  object-fit:cover;
  display:block;
  border:2px solid rgba(53,246,255,.45);
  box-shadow:
    0 0 0 2px rgba(5,8,20,.9),
    0 0 20px rgba(53,246,255,.35);
}
.support-fab:hover .support-avatar{
  border-color:rgba(53,246,255,.7);
  box-shadow:0 0 24px rgba(53,246,255,.45);
}

/* Footer */
.footer{ padding:28px 0 38px; border-top:1px solid rgba(255,255,255,.08); background: rgba(0,0,0,.10); }
.footer-inner{ display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.footer-brand{ font-weight:800; letter-spacing:1px; }
.footer-right a{ color:var(--muted2); }
.footer-right a:hover{ color:rgba(234,241,255,.92); }

/* Motion utilities */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior:auto !important; }
}

/* Responsive */
@media (max-width: 980px){
  .nav{ display:none; }
  .hero-grid{ grid-template-columns: 1fr; }
  .markets-grid{ grid-template-columns: 1fr; }
  .feature-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .card-grid{ grid-template-columns: 1fr; }
  .metric-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .stack-panels{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .why-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .support-fab{
    right:14px;
    bottom:18px;
    width:50px;
    height:50px;
  }
}

@media (max-width: 520px){
  .hero-kpis{ grid-template-columns: 1fr; }
  .dash-metrics{ grid-template-columns: 1fr; }
  .metric-value{ font-size:20px; }
  .stat-value{ font-size:30px; }
}