:root{
  --bg:#050609;
  --bg-2:#0a0c12;
  --panel:#0d0f16;
  --border:rgba(255,255,255,0.08);
  --border-hover:rgba(140,160,255,0.35);
  --text:#eef0f6;
  --text-dim:#9096a8;
  --text-faint:#5c6178;
  --cyan:#22d3ee;
  --blue:#3b82f6;
  --purple:#8b5cf6;
  --grad: linear-gradient(120deg,var(--cyan),var(--blue) 55%,var(--purple));
  --radius:18px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:
    radial-gradient(ellipse 900px 500px at 15% -10%, rgba(59,130,246,0.16), transparent 60%),
    radial-gradient(ellipse 900px 600px at 100% 10%, rgba(139,92,246,0.14), transparent 55%),
    var(--bg);
  color:var(--text);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
}

a{color:inherit;text-decoration:none;}

.wrap{max-width:1120px;margin:0 auto;padding:0 28px;}

/* ---------- Nav ---------- */
header.site{
  position:sticky;top:0;z-index:50;
  background:rgba(5,6,9,0.72);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border);
}
.nav{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 28px;max-width:1120px;margin:0 auto;
}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:0.06em;font-size:15px;}
.brand img{height:28px;width:auto;display:block;}
.brand img.wordmark{height:15px;}
.navlinks{display:flex;gap:28px;font-size:14px;color:var(--text-dim);}
.navlinks a{transition:color .15s ease;}
.navlinks a:hover{color:var(--text);}

/* ---------- Hero ---------- */
.hero{padding:96px 0 64px;text-align:center;}
.hero .logo-mark{width:auto;height:150px;margin:0 auto 28px;display:block;filter:drop-shadow(0 0 40px rgba(96,120,255,0.35));}
.eyebrow{
  display:inline-block;font-size:12px;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--text-dim);border:1px solid var(--border);border-radius:999px;
  padding:6px 14px;margin-bottom:22px;
}
.eyebrow b{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
h1.hero-title{
  font-size:clamp(38px,6vw,64px);line-height:1.05;margin:0 0 20px;font-weight:800;letter-spacing:-0.02em;
}
h1.hero-title .g{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero-sub{
  max-width:620px;margin:0 auto;color:var(--text-dim);font-size:17px;line-height:1.65;
}

/* ---------- Sections ---------- */
.section{padding:56px 0;}
.section-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:32px;flex-wrap:wrap;gap:12px;}
.section-head h2{font-size:26px;margin:0;font-weight:700;letter-spacing:-0.01em;}
.section-head p{color:var(--text-faint);font-size:14px;margin:0;}

/* ---------- Product Grid ---------- */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
@media (max-width:860px){.grid{grid-template-columns:1fr;}}

.card{
  position:relative;border-radius:var(--radius);padding:28px;
  background:linear-gradient(180deg,rgba(255,255,255,0.035),rgba(255,255,255,0.01));
  border:1px solid var(--border);
  transition:transform .2s ease,border-color .2s ease,background .2s ease;
  display:flex;flex-direction:column;min-height:100%;
}
.card:hover{transform:translateY(-4px);border-color:var(--border-hover);}
.card .icon{
  width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  font-size:22px;margin-bottom:18px;overflow:hidden;
}
.card .icon img{width:100%;height:100%;object-fit:cover;display:block;}
.card h3{font-size:19px;margin:0 0 8px;font-weight:700;}
.card p.desc{color:var(--text-dim);font-size:14.5px;line-height:1.6;margin:0 0 20px;flex:1;}
.card .tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:22px;}
.tag{font-size:11px;padding:4px 9px;border-radius:999px;border:1px solid var(--border);color:var(--text-faint);}
.card-links{display:flex;gap:10px;flex-wrap:wrap;}

.btn{
  display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600;
  padding:9px 16px;border-radius:10px;transition:all .15s ease;
}
.btn-primary{background:var(--grad);color:#05060a;}
.btn-primary:hover{filter:brightness(1.08);}
.btn-ghost{border:1px solid var(--border);color:var(--text);}
.btn-ghost:hover{border-color:var(--border-hover);background:rgba(255,255,255,0.03);}
.btn[disabled],.btn.disabled{opacity:0.45;pointer-events:none;}

/* icon color variants */
.icon-bot{background:rgba(34,211,238,0.12);color:var(--cyan);}
.icon-ghost{background:rgba(139,92,246,0.14);color:#b79bff;}
.icon-star{background:rgba(59,130,246,0.14);color:#7fa6ff;}
.icon-pulse{background:rgba(255,255,255,0.06);color:var(--text-dim);}
.icon-prshift{background:rgba(34,211,238,0.12);color:var(--cyan);}
.icon-launchpad{background:rgba(74,222,128,0.14);color:#4ade80;}
.icon-sereva{background:rgba(94,234,212,0.14);color:#5eead4;}
.icon-lumacore{background:rgba(250,204,21,0.14);color:#fbbf24;}
.icon-valura{background:rgba(236,72,153,0.14);color:#f472b6;}
.icon-revix{background:rgba(249,115,22,0.14);color:#fb923c;}

/* ---------- Coming soon ---------- */
.soon{
  border-radius:var(--radius);padding:34px;border:1px dashed rgba(255,255,255,0.15);
  background:linear-gradient(135deg,rgba(139,92,246,0.06),rgba(34,211,238,0.04));
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;justify-content:space-between;
}
.soon + .soon{margin-top:18px;}
.soon-left{display:flex;align-items:center;gap:18px;}
.soon .icon{width:52px;height:52px;border-radius:14px;background:rgba(255,255,255,0.05);display:flex;align-items:center;justify-content:center;font-size:24px;overflow:hidden;}
.soon .icon img{width:100%;height:100%;object-fit:cover;display:block;}
.soon h3{margin:0 0 4px;font-size:19px;}
.soon p{margin:0;color:var(--text-dim);font-size:14px;max-width:440px;}
.pill{font-size:11px;letter-spacing:0.08em;text-transform:uppercase;padding:5px 12px;border-radius:999px;background:var(--grad);color:#05060a;font-weight:700;}

/* ---------- Footer ---------- */
footer{border-top:1px solid var(--border);padding:36px 0;margin-top:40px;}
.footer-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;color:var(--text-faint);font-size:13px;}
.footer-row .brand{font-size:13px;}
.footer-row .brand img{height:20px;width:auto;}
.footer-row .brand img.wordmark{height:11px;}

/* ---------- Subpages ---------- */
.back-link{display:inline-flex;align-items:center;gap:6px;color:var(--text-dim);font-size:14px;margin-bottom:28px;transition:color .15s ease;}
.back-link:hover{color:var(--text);}

.product-hero{padding:52px 0 40px;border-bottom:1px solid var(--border);}
.product-hero-top{display:flex;align-items:center;gap:20px;margin-bottom:22px;flex-wrap:wrap;}
.product-hero .icon{width:64px;height:64px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:30px;overflow:hidden;}
.product-hero .icon img{width:100%;height:100%;object-fit:cover;display:block;}
.product-hero h1{font-size:clamp(30px,4.5vw,44px);margin:0;font-weight:800;letter-spacing:-0.02em;}
.product-hero .tagline{color:var(--text-dim);font-size:16px;max-width:620px;line-height:1.6;margin-top:6px;}
.product-hero .actions{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap;}

.feature-list{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:8px;}
@media (max-width:700px){.feature-list{grid-template-columns:1fr;}}
.feature-item{
  border:1px solid var(--border);border-radius:14px;padding:20px;
  background:rgba(255,255,255,0.02);
}
.feature-item h4{margin:0 0 8px;font-size:15px;display:flex;align-items:center;gap:8px;}
.feature-item h4 .dot{width:7px;height:7px;border-radius:50%;background:var(--grad);flex:0 0 auto;}
.feature-item p{margin:0;color:var(--text-dim);font-size:13.5px;line-height:1.6;}

.status-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;}
.status-chip{font-size:12px;padding:6px 12px;border-radius:999px;border:1px solid var(--border);color:var(--text-dim);}
