/* ============================================================
   NEXUS AI — Shared Design System
   nexusai-sd.com | Dark Glassmorphism
   ============================================================ */

/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800;900&family=Inter:wght@400;500;600&display=swap');

/* ── Reset & Base ────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  /* Backgrounds */
  --bg:        #03040a;
  --bg-2:      #060810;
  --bg-3:      #0a0b14;

  /* Surfaces / Glass */
  --glass-1:   rgba(255,255,255,0.03);
  --glass-2:   rgba(255,255,255,0.05);
  --glass-3:   rgba(255,255,255,0.08);
  --glass-4:   rgba(255,255,255,0.12);

  /* Borders */
  --border-1:  rgba(255,255,255,0.07);
  --border-2:  rgba(255,255,255,0.12);
  --border-3:  rgba(255,255,255,0.20);

  /* Accents */
  --indigo:    #6366f1;
  --indigo-d:  #4f46e5;
  --indigo-l:  #818cf8;
  --violet:    #8b5cf6;
  --violet-l:  #a78bfa;
  --green:     #22c55e;
  --green-d:   #16a34a;
  --green-l:   #4ade80;

  /* Text */
  --text-1:    #f8fafc;
  --text-2:    #94a3b8;
  --text-3:    #475569;

  /* Fonts */
  --font-h:    'Plus Jakarta Sans', system-ui, sans-serif;
  --font-b:    'Inter', system-ui, sans-serif;

  /* Radius */
  --r-sm:  0.375rem;
  --r-md:  0.625rem;
  --r-lg:  1rem;
  --r-xl:  1.5rem;
  --r-2xl: 2rem;
}

html { scroll-behavior: smooth; }

body {
  background: var(--bg);
  color: var(--text-1);
  font-family: var(--font-b);
  font-size: 1rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

/* Page transitions */
body { opacity: 1; transition: opacity 0.16s ease; }
body:not(.nx-loaded) { opacity: 0; }
body.nx-leaving { opacity: 0; }

img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { font-family: var(--font-b); cursor: pointer; border: none; }

/* ── Container ───────────────────────────────────────────── */
.container {
  width: 100%;
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1.5rem;
}
@media (min-width: 768px)  { .container { padding-inline: 2rem; } }
@media (min-width: 1280px) { .container { padding-inline: 2.5rem; } }

/* ── Typography ──────────────────────────────────────────── */
h1,h2,h3,h4,h5,h6 { font-family: var(--font-h); line-height: 1.15; }

.gradient-text {
  background: linear-gradient(135deg, var(--indigo-l) 0%, var(--violet-l) 50%, var(--green-l) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--font-b);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--indigo-l);
  margin-bottom: 1rem;
}
.eyebrow-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 8px var(--green);
  animation: pulse-dot 2s infinite;
}
@keyframes pulse-dot {
  0%,100% { opacity: 1; transform: scale(1); }
  50%      { opacity: 0.5; transform: scale(1.4); }
}

.section-tag {
  display: inline-block;
  padding: 0.3rem 0.9rem;
  border-radius: 999px;
  border: 1px solid var(--border-2);
  background: var(--glass-2);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--indigo-l);
  margin-bottom: 1rem;
  backdrop-filter: blur(8px);
}

.section-title {
  font-family: var(--font-h);
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 800;
  color: var(--text-1);
  line-height: 1.15;
}

/* ── Glass Card ──────────────────────────────────────────── */
.glass {
  background: var(--glass-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-xl);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

/* ── Buttons ─────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-family: var(--font-b);
  font-weight: 600;
  font-size: 0.9rem;
  border-radius: var(--r-md);
  padding: 0.7rem 1.5rem;
  cursor: pointer;
  transition: all 0.2s ease;
  border: none;
  white-space: nowrap;
  text-decoration: none;
}
.btn:focus-visible { outline: 2px solid var(--indigo); outline-offset: 3px; }

.btn-primary {
  background: linear-gradient(135deg, var(--indigo) 0%, var(--violet) 100%);
  color: #fff;
  box-shadow: 0 0 24px rgba(99,102,241,0.35);
}
.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 36px rgba(99,102,241,0.55);
}
.btn-primary:active { transform: translateY(0); }

.btn-glass {
  background: var(--glass-3);
  color: var(--text-1);
  border: 1px solid var(--border-2);
  backdrop-filter: blur(12px);
}
.btn-glass:hover {
  background: var(--glass-4);
  border-color: var(--border-3);
  transform: translateY(-1px);
}

.btn-green {
  background: linear-gradient(135deg, var(--green) 0%, #059669 100%);
  color: #fff;
  box-shadow: 0 0 20px rgba(34,197,94,0.3);
}
.btn-green:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 32px rgba(34,197,94,0.5);
}

/* ── Navigation ──────────────────────────────────────────── */
.nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  padding: 1rem 0;
  transition: all 0.3s ease;
}
.nav.scrolled {
  background: rgba(3,4,10,0.88);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border-bottom: 1px solid var(--border-1);
  padding: 0.6rem 0;
}

.nav-inner {
  display: flex;
  align-items: center;
  gap: 2rem;
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1.5rem;
}

.nav-logo {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-family: var(--font-h);
  font-weight: 900;
  font-size: 1.1rem;
  letter-spacing: 0.06em;
  color: var(--text-1);
  text-decoration: none;
  flex-shrink: 0;
}
.nav-logo span { color: var(--indigo-l); }
.nav-logo-mark {
  width: 32px; height: 32px;
  background: linear-gradient(135deg, var(--indigo), var(--violet));
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px;
  box-shadow: 0 0 14px rgba(99,102,241,0.4);
}
.nav-logo-mark svg { width: 100%; fill: rgba(255,255,255,0.9); stroke: none; }

.nav-links {
  display: flex;
  gap: 0.25rem;
  margin-left: auto;
}
.nav-links a {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--text-2);
  padding: 0.4rem 0.85rem;
  border-radius: var(--r-sm);
  transition: all 0.15s;
}
.nav-links a:hover { color: var(--text-1); background: var(--glass-2); }

.nav-phone {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--green);
  white-space: nowrap;
}
.nav-phone svg {
  width: 14px; height: 14px;
  fill: currentColor;
}

.nav-cta {
  background: linear-gradient(135deg, var(--indigo), var(--violet));
  color: #fff;
  font-size: 0.82rem;
  font-weight: 600;
  padding: 0.5rem 1.1rem;
  border-radius: var(--r-sm);
  white-space: nowrap;
  transition: all 0.2s;
}
.nav-cta:hover {
  transform: translateY(-1px);
  box-shadow: 0 0 20px rgba(99,102,241,0.4);
}

.hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  padding: 0.4rem;
  background: none;
  border: none;
  cursor: pointer;
  margin-left: auto;
}
.hamburger span {
  display: block;
  width: 22px; height: 2px;
  background: var(--text-1);
  border-radius: 2px;
  transition: all 0.25s;
}

.mobile-drawer {
  display: none;
  position: fixed;
  top: 0; right: 0; bottom: 0;
  width: min(320px, 85vw);
  background: rgba(6,8,16,0.97);
  backdrop-filter: blur(24px);
  border-left: 1px solid var(--border-1);
  z-index: 999;
  padding: 5rem 2rem 2rem;
  flex-direction: column;
  gap: 0.25rem;
  transform: translateX(100%);
  transition: transform 0.3s ease;
}
.mobile-drawer.open { transform: translateX(0); }
.mobile-drawer a {
  display: block;
  padding: 0.85rem 1rem;
  font-size: 1rem;
  font-weight: 500;
  color: var(--text-2);
  border-radius: var(--r-md);
  transition: all 0.15s;
}
.mobile-drawer a:hover { color: var(--text-1); background: var(--glass-2); }
.mobile-drawer .m-cta {
  margin-top: 1rem;
  background: linear-gradient(135deg, var(--indigo), var(--violet));
  color: #fff;
  text-align: center;
  font-weight: 600;
}

@media (max-width: 1023px) {
  .nav-links, .nav-phone { display: none; }
  .nav-cta { display: none; }
  .hamburger { display: flex; }
  .mobile-drawer { display: flex; }
}
@media (max-width: 639px) {
  .nav-inner { padding-inline: 1rem; }
}

/* ── Footer ──────────────────────────────────────────────── */
.footer {
  background: var(--bg-2);
  border-top: 1px solid var(--border-1);
  padding: 4rem 0 2rem;
  margin-top: 5rem;
}

.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 3rem;
  margin-bottom: 3rem;
}
@media (max-width: 1023px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 2rem; }
}
@media (max-width: 639px) {
  .footer-grid { grid-template-columns: 1fr; gap: 1.5rem; }
}

.footer-brand p {
  color: var(--text-2);
  font-size: 0.875rem;
  margin-top: 1rem;
  line-height: 1.7;
  max-width: 280px;
}
.footer-brand-contact {
  margin-top: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.footer-brand-contact a {
  font-size: 0.82rem;
  color: var(--text-2);
  transition: color 0.15s;
}
.footer-brand-contact a:hover { color: var(--indigo-l); }

.footer-col h4 {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-3);
  margin-bottom: 1rem;
}
.footer-col ul { display: flex; flex-direction: column; gap: 0.5rem; }
.footer-col a {
  font-size: 0.875rem;
  color: var(--text-2);
  transition: color 0.15s;
}
.footer-col a:hover { color: var(--text-1); }

.footer-bottom {
  border-top: 1px solid var(--border-1);
  padding-top: 1.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}
.footer-bottom p {
  font-size: 0.78rem;
  color: var(--text-3);
}
.footer-bottom-links {
  display: flex;
  gap: 1.5rem;
}
.footer-bottom-links a {
  font-size: 0.78rem;
  color: var(--text-3);
  transition: color 0.15s;
}
.footer-bottom-links a:hover { color: var(--text-2); }

/* ── Pricing Cards ───────────────────────────────────────── */
.price-card {
  background: var(--glass-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-xl);
  padding: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  position: relative;
  transition: all 0.3s ease;
  backdrop-filter: blur(20px);
}
.price-card:hover {
  border-color: var(--border-2);
  transform: translateY(-4px);
  box-shadow: 0 20px 40px rgba(0,0,0,0.4);
}

.price-card.featured {
  background: var(--glass-3);
  border-color: transparent;
  position: relative;
  transform: scale(1.04);
  box-shadow: 0 0 60px rgba(99,102,241,0.2), 0 20px 40px rgba(0,0,0,0.5);
}
.price-card.featured::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: var(--r-xl);
  padding: 1px;
  background: linear-gradient(135deg, var(--indigo), var(--violet), var(--indigo-l));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  animation: border-spin 4s linear infinite;
}
@keyframes border-spin {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.price-card.featured:hover { transform: scale(1.04) translateY(-4px); }

/* ── Fade In (Intersection Observer) ────────────────────── */
.fade {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.55s ease, transform 0.55s ease;
}
.fade.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ── Form Inputs ─────────────────────────────────────────── */
.form-input {
  width: 100%;
  padding: 0.8rem 1rem;
  background: var(--glass-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-md);
  color: var(--text-1);
  font-family: var(--font-b);
  font-size: 0.9rem;
  transition: all 0.2s;
  outline: none;
}
.form-input::placeholder { color: var(--text-3); }
.form-input:focus {
  border-color: var(--indigo);
  box-shadow: 0 0 0 3px rgba(99,102,241,0.15);
  background: var(--glass-3);
}
.form-input:hover { border-color: var(--border-2); }

select.form-input { appearance: none; cursor: pointer; }

/* ── Utility ─────────────────────────────────────────────── */
.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.text-center { text-align: center; }
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 0.75rem; }
.mt-4 { margin-top: 1rem; }
.mt-6 { margin-top: 1.5rem; }
.mt-8 { margin-top: 2rem; }

/* ── Orb Background Decorations ─────────────────────────── */
.orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  pointer-events: none;
  z-index: 0;
}
.orb-indigo { background: radial-gradient(circle, rgba(99,102,241,0.22) 0%, transparent 70%); }
.orb-violet { background: radial-gradient(circle, rgba(139,92,246,0.18) 0%, transparent 70%); }
.orb-green  { background: radial-gradient(circle, rgba(34,197,94,0.14) 0%, transparent 70%); }

/* ── Scrollbar ───────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--bg-2); }
::-webkit-scrollbar-thumb { background: var(--border-2); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--border-3); }

/* ── Compatibility aliases (maps old → new variable names) ── */
:root {
  --surface:        var(--glass-1);
  --surface-2:      var(--glass-2);
  --surface-3:      var(--glass-3);
  --surface-hover:  var(--glass-3);
  --border:         var(--border-1);
  --text:           var(--text-1);
  --text-muted:     var(--text-2);
  --text-subtle:    var(--text-3);
  --r:              var(--r-md);
  --r-lg:           var(--r-lg);
  --grad:           linear-gradient(135deg, var(--indigo) 0%, var(--violet) 50%, #a855f7 100%);
  --grad-text:      linear-gradient(135deg, var(--indigo-l) 0%, var(--violet-l) 50%, var(--green-l) 100%);
  --grad-cta:       linear-gradient(135deg, var(--indigo), var(--violet));
  --glow-indigo:    0 0 60px rgba(99,102,241,0.25);
  --glow-green:     0 0 40px rgba(34,197,94,0.3);
  --green-glow:     rgba(34,197,94,0.4);
  --indigo-hex:     #6366f1;
  --purple:         #a855f7;
  --amber:          #f59e0b;
  --white:          #ffffff;
  --black:          #000000;
}

/* ── Extra shared components used by index.html ─────────── */
.stats-section { padding: 72px 0; background: var(--bg-2); border-bottom: 1px solid var(--border-1); }
.section-header { text-align: center; margin-bottom: 64px; }
.section-header p { font-size: 1rem; color: var(--text-2); max-width: 520px; margin: 0 auto; line-height: 1.8; }

/* Fade animation */
.fade { opacity: 0; transform: translateY(24px); transition: opacity .65s ease, transform .65s ease; }
.fade.visible { opacity: 1; transform: translateY(0); }
.d1{transition-delay:.1s} .d2{transition-delay:.2s} .d3{transition-delay:.3s} .d4{transition-delay:.4s} .d5{transition-delay:.5s}

/* Gradient orbs (shared) */
.orb-container { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.orb { position: absolute; border-radius: 50%; filter: blur(80px); opacity: 0.55; animation: orb-drift 12s ease-in-out infinite; }
.orb-1 { width:600px;height:600px;background:radial-gradient(circle,rgba(99,102,241,0.5),transparent 70%);top:-150px;left:-100px;animation-duration:14s; }
.orb-2 { width:500px;height:500px;background:radial-gradient(circle,rgba(139,92,246,0.45),transparent 70%);top:0;right:-80px;animation-duration:10s;animation-delay:-4s; }
.orb-3 { width:400px;height:400px;background:radial-gradient(circle,rgba(34,197,94,0.2),transparent 70%);bottom:0;left:30%;animation-duration:16s;animation-delay:-8s; }
@keyframes orb-drift { 0%,100%{transform:translate(0,0) scale(1)} 33%{transform:translate(30px,-20px) scale(1.05)} 66%{transform:translate(-20px,30px) scale(.95)} }

/* Ticker */
.ticker-wrap { background:var(--bg-2);border-top:1px solid var(--border-1);border-bottom:1px solid var(--border-1);padding:12px 0;overflow:hidden;position:relative; }
.ticker-wrap::before,.ticker-wrap::after { content:'';position:absolute;top:0;bottom:0;width:100px;z-index:10;pointer-events:none; }
.ticker-wrap::before { left:0;background:linear-gradient(to right,var(--bg-2),transparent); }
.ticker-wrap::after  { right:0;background:linear-gradient(to left,var(--bg-2),transparent); }
.ticker-track { display:flex;gap:56px;animation:ticker-scroll 32s linear infinite;width:max-content; }
@keyframes ticker-scroll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
.ticker-item { display:flex;align-items:center;gap:10px;font-size:.78rem;font-weight:600;color:var(--text-3);white-space:nowrap; }
.ticker-item span { color:var(--text-2); }

/* CTA box */
.cta-box { background:var(--glass-2);border:1px solid var(--border-2);border-radius:var(--r-2xl);padding:80px 60px;text-align:center;position:relative;overflow:hidden; }
.cta-box::before { content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 0%,rgba(99,102,241,0.12) 0%,transparent 60%);pointer-events:none; }
.cta-phone-big { font-family:var(--font-h);font-size:clamp(1.6rem,3.5vw,2.8rem);font-weight:900;letter-spacing:-.04em;color:var(--text-1);display:flex;align-items:center;gap:12px;justify-content:center;flex-wrap:wrap; }
.cta-phone-big svg { width:32px;height:32px;stroke:var(--green);fill:none;stroke-width:2;flex-shrink:0; }
.cta-actions { display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap; }

/* Footer */
.footer { padding:64px 0 40px;border-top:1px solid var(--border-1);background:var(--bg-2); }
.footer-grid { display:grid;grid-template-columns:2fr repeat(3,1fr);gap:48px;max-width:1160px;margin:0 auto 56px;padding:0 32px; }
.footer-brand .footer-logo { font-family:var(--font-h);font-weight:800;font-size:1.1rem;letter-spacing:-.03em;display:flex;align-items:center;gap:10px;color:var(--text-1);margin-bottom:16px; }
.footer-brand .footer-logo-mark { width:30px;height:30px;background:linear-gradient(135deg,var(--indigo),var(--violet));border-radius:8px;display:flex;align-items:center;justify-content:center; }
.footer-brand .footer-logo-mark svg { width:14px;height:14px;stroke:white;fill:none;stroke-width:2.5; }
.footer-brand p { font-size:.875rem;color:var(--text-3);line-height:1.75;max-width:260px;margin-bottom:20px; }
.footer-contact a { display:flex;align-items:center;gap:8px;font-size:.8125rem;color:var(--text-2);margin-bottom:8px;transition:.15s; }
.footer-contact a:hover { color:var(--text-1); }
.footer-contact svg { width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2;flex-shrink:0; }
.footer-col-title { font-family:var(--font-h);font-size:.75rem;font-weight:700;color:var(--text-3);letter-spacing:.1em;text-transform:uppercase;margin-bottom:20px; }
.footer-col a { display:block;font-size:.875rem;color:var(--text-2);margin-bottom:10px;transition:.15s; }
.footer-col a:hover { color:var(--text-1); }
.footer-bottom { max-width:1160px;margin:0 auto;padding:24px 32px 0;border-top:1px solid var(--border-1);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px; }
.footer-copy { font-size:.8125rem;color:var(--text-3); }

/* Stats row */
.stats-row { display:grid;grid-template-columns:repeat(5,1fr);gap:0;max-width:1000px;margin:0 auto; }
.stat-block { text-align:center;padding:0 24px;border-right:1px solid var(--border-1); }
.stat-block:last-child { border-right:none; }
.stat-big { font-family:var(--font-h);font-size:clamp(2rem,3.5vw,3rem);font-weight:900;letter-spacing:-.06em;background:var(--grad-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1;margin-bottom:6px; }
.stat-label { font-size:.775rem;color:var(--text-3);font-weight:500;line-height:1.4; }

/* Tag pills */
.tag { display:inline-flex;align-items:center;gap:5px;background:var(--glass-2);border:1px solid var(--border-1);color:var(--text-2);font-size:.72rem;font-weight:600;padding:4px 10px;border-radius:100px; }
.tag.green { background:rgba(34,197,94,0.08);border-color:rgba(34,197,94,0.2);color:var(--green); }
.tag.indigo { background:rgba(99,102,241,0.08);border-color:rgba(99,102,241,0.2);color:var(--indigo); }
.tags-row { display:flex;gap:6px;flex-wrap:wrap;margin-top:16px; }

/* How it works steps */
.steps-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:12px; }
.step-block { background:var(--glass-1);border:1px solid var(--border-1);border-radius:var(--r-xl);padding:32px 28px;position:relative;transition:all .25s; }
.step-block:hover { border-color:var(--border-2);background:var(--glass-2);transform:translateY(-3px); }
.step-num { font-family:var(--font-h);font-size:.65rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--indigo);margin-bottom:18px; }
.step-block h3 { font-family:var(--font-h);font-size:1rem;font-weight:700;color:var(--text-1);margin-bottom:10px; }
.step-block p { font-size:.85rem;color:var(--text-2);line-height:1.75; }

/* Niches grid */
.niches-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:12px; }
.niche-card { background:var(--glass-1);border:1px solid var(--border-1);border-radius:var(--r-xl);padding:32px;transition:all .25s;position:relative;overflow:hidden; }
.niche-card:hover { border-color:var(--indigo);transform:translateY(-4px);box-shadow:0 20px 60px rgba(99,102,241,0.15); }
.niche-emoji { font-size:2rem;margin-bottom:16px;display:block; }
.niche-stat { display:inline-flex;font-size:.67rem;font-weight:700;color:var(--green);background:rgba(34,197,94,0.1);border:1px solid rgba(34,197,94,0.2);padding:3px 10px;border-radius:100px;margin-bottom:14px; }
.niche-card h3 { font-family:var(--font-h);font-size:1rem;font-weight:700;color:var(--text-1);margin-bottom:8px; }
.niche-card p { font-size:.83rem;color:var(--text-2);line-height:1.7; }

/* Testimonials */
.testimonials-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:12px; }
.testi-card { background:var(--glass-1);border:1px solid var(--border-1);border-radius:var(--r-xl);padding:32px;transition:all .25s; }
.testi-card:hover { border-color:var(--border-2);background:var(--glass-2);transform:translateY(-3px);box-shadow:0 16px 48px rgba(0,0,0,0.25); }
.testi-stars { display:flex;gap:3px;margin-bottom:20px; }
.testi-stars svg { width:14px;height:14px;fill:#f59e0b;stroke:none; }
.testi-quote { font-size:.9375rem;color:var(--text-2);line-height:1.75;margin-bottom:24px; }
.testi-author { display:flex;align-items:center;gap:12px; }
.testi-av { width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--indigo),var(--violet));display:flex;align-items:center;justify-content:center;font-family:var(--font-h);font-weight:700;font-size:.85rem;color:#fff;flex-shrink:0; }
.testi-name { font-family:var(--font-h);font-size:.875rem;font-weight:700;color:var(--text-1); }
.testi-role { font-size:.775rem;color:var(--text-3);margin-top:1px; }
.testi-badge { margin-top:20px;display:inline-flex;align-items:center;gap:6px;background:rgba(34,197,94,0.08);border:1px solid rgba(34,197,94,0.2);color:var(--green);font-size:.7rem;font-weight:700;padding:4px 10px;border-radius:100px; }
.testi-badge svg { width:10px;height:10px;stroke:var(--green);fill:none;stroke-width:2.5; }

/* ROI */
.roi-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:48px; }
.roi-card { background:var(--glass-1);border:1px solid var(--border-1);border-radius:var(--r-xl);padding:32px;text-align:center;position:relative;overflow:hidden;transition:all .25s; }
.roi-card.good { border-color:rgba(34,197,94,0.25);background:rgba(34,197,94,0.04); }
.roi-card.bad  { border-color:rgba(239,68,68,0.2);background:rgba(239,68,68,0.03); }
.roi-card:hover { transform:translateY(-3px); }
.roi-label { font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px;color:var(--text-3); }
.roi-amount { font-family:var(--font-h);font-size:3rem;font-weight:900;letter-spacing:-.06em;line-height:1;margin-bottom:8px; }
.roi-card.bad  .roi-amount { color:#ef4444; }
.roi-card.good .roi-amount { color:var(--green); }
.roi-desc { font-size:.85rem;color:var(--text-2);line-height:1.7; }

/* Pricing */
.pricing-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:12px; }
.price-card { background:var(--glass-1);border:1px solid var(--border-1);border-radius:var(--r-xl);padding:40px 32px;position:relative;overflow:hidden;transition:all .25s; }
.price-card:hover { border-color:var(--border-2);background:var(--glass-2);transform:translateY(-4px);box-shadow:0 20px 60px rgba(0,0,0,0.3); }
.price-card.featured { background:var(--glass-2);border-color:transparent;position:relative; }
.price-card.featured::before { content:'';position:absolute;inset:-1px;border-radius:calc(var(--r-xl)+1px);background:linear-gradient(135deg,var(--indigo),var(--violet),#a855f7,var(--indigo));background-size:300% 300%;animation:border-shimmer 3s linear infinite;z-index:-1; }
@keyframes border-shimmer { 0%{background-position:0% 50%} 100%{background-position:300% 50%} }
.price-badge { position:absolute;top:20px;right:20px;background:linear-gradient(135deg,var(--indigo),var(--violet));color:#fff;font-family:var(--font-h);font-size:.65rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:4px 10px;border-radius:100px; }
.price-tier { font-size:.75rem;font-weight:700;color:var(--text-2);letter-spacing:.1em;text-transform:uppercase;margin-bottom:12px; }
.price-amount { font-family:var(--font-h);font-size:3.2rem;font-weight:900;letter-spacing:-.06em;color:var(--text-1);line-height:1;margin-bottom:4px; }
.price-amount sup { font-size:1.4rem;vertical-align:super;font-weight:700; }
.price-period { font-size:.8rem;color:var(--text-3);margin-bottom:20px; }
.price-desc { font-size:.875rem;color:var(--text-2);line-height:1.7;margin-bottom:28px; }
.price-divider { height:1px;background:var(--border-1);margin:24px 0; }
.price-features { list-style:none;display:flex;flex-direction:column;gap:11px;margin-bottom:32px; }
.price-features li { display:flex;align-items:flex-start;gap:10px;font-size:.875rem;color:var(--text-2);line-height:1.5; }
.price-features li svg { width:15px;height:15px;stroke:var(--green);fill:none;stroke-width:2.5;flex-shrink:0;margin-top:2px; }
.price-features li.muted svg { stroke:var(--text-3); }
.price-features li.muted { color:var(--text-3); }

/* Billing toggle */
.billing-toggle { display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:52px; }
.billing-label { font-family:var(--font-h);font-size:.9rem;font-weight:600;color:var(--text-2); }
.billing-label.active { color:var(--text-1); }
.toggle-switch { position:relative;width:52px;height:28px;background:var(--glass-3);border:1px solid var(--border-2);border-radius:100px;cursor:pointer;transition:.2s; }
.toggle-switch.on { background:var(--indigo);border-color:var(--indigo); }
.toggle-knob { position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.2);transition:.25s cubic-bezier(.4,0,.2,1); }
.toggle-switch.on .toggle-knob { left:27px; }
.save-badge { background:rgba(34,197,94,0.1);border:1px solid rgba(34,197,94,0.2);color:var(--green);font-size:.67rem;font-weight:700;padding:2px 8px;border-radius:100px; }

/* Form elements */
.form-group { margin-bottom:18px; }
.form-label { display:block;font-family:var(--font-h);font-size:.8rem;font-weight:600;color:var(--text-2);margin-bottom:8px; }
.form-input { width:100%;background:var(--glass-2);border:1px solid var(--border-1);border-radius:var(--r-md);padding:13px 16px;font-size:.9375rem;color:var(--text-1);font-family:var(--font-b);transition:.15s;outline:none; }
.form-input::placeholder { color:var(--text-3); }
.form-input:focus { border-color:var(--indigo);background:var(--glass-3);box-shadow:0 0 0 3px rgba(99,102,241,0.15); }

/* Mobile drawer */
.mobile-drawer { display:none;position:fixed;inset:0;top:68px;background:rgba(3,4,10,0.97);backdrop-filter:blur(24px);z-index:490;padding:28px 32px;flex-direction:column;gap:0; }
.mobile-drawer.open { display:flex; }
.mobile-drawer a { padding:16px 0;border-bottom:1px solid var(--border-1);font-family:var(--font-h);font-size:1.2rem;font-weight:700;color:var(--text-2);transition:.15s; }
.mobile-drawer a:hover { color:var(--text-1); }
.mobile-drawer .m-cta { margin-top:28px;background:linear-gradient(135deg,var(--indigo),var(--violet));color:#fff;text-align:center;padding:16px;border-radius:var(--r-lg);border:none;font-size:1rem;font-family:var(--font-h);font-weight:700;cursor:pointer; }

/* Mini chat (bento card) */
.mini-chat { background:var(--bg-3);border:1px solid var(--border-1);border-radius:16px;overflow:hidden;margin-top:20px; }
.mini-chat-bar { display:flex;align-items:center;gap:5px;padding:10px 14px;background:var(--glass-2);border-bottom:1px solid var(--border-1); }
.mini-chat-dot { width:8px;height:8px;border-radius:50%; }
.mc-r{background:#ff5f57}.mc-y{background:#ffbd2e}.mc-g{background:#28c941}
.mini-chat-body { padding:14px;display:flex;flex-direction:column;gap:9px; }
.mc-row { display:flex;gap:7px;align-items:flex-end; }
.mc-row.user { flex-direction:row-reverse; }
.mc-av { width:22px;height:22px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:.5rem;font-weight:800; }
.mc-av.ai { background:linear-gradient(135deg,var(--indigo),var(--violet)); }
.mc-av.u  { background:var(--glass-3);color:var(--text-3); }
.mc-av svg { width:9px;height:9px;stroke:white;fill:none;stroke-width:2.5; }
.mc-bubble { max-width:80%;padding:8px 12px;border-radius:12px;font-size:.75rem;line-height:1.55; }
.mc-bubble.ai   { background:var(--glass-2);border:1px solid var(--border-1);color:var(--text-2);border-bottom-left-radius:3px; }
.mc-bubble.user { background:linear-gradient(135deg,var(--indigo),var(--violet));color:white;border-bottom-right-radius:3px; }

/* Bento pulse ring */
.bento-pulse-ring { width:80px;height:80px;border-radius:50%;background:rgba(34,197,94,0.12);display:flex;align-items:center;justify-content:center;position:relative;margin:0 auto 20px; }
.bento-pulse-ring::before,.bento-pulse-ring::after { content:'';position:absolute;inset:-10px;border-radius:50%;border:1.5px solid rgba(34,197,94,0.3);animation:bento-ripple 2s ease-out infinite; }
.bento-pulse-ring::after { inset:-22px;animation-delay:.5s; }
@keyframes bento-ripple { 0%{transform:scale(.85);opacity:.7} 100%{transform:scale(1.2);opacity:0} }
.bento-pulse-ring svg { width:32px;height:32px;fill:var(--green);stroke:none; }

/* Responsive */
@media (max-width:900px) { .niches-grid,.testimonials-grid { grid-template-columns:repeat(2,1fr); } .steps-grid,.pricing-grid { grid-template-columns:1fr; } .roi-grid { grid-template-columns:1fr;max-width:360px;margin:48px auto 0; } .footer-grid { grid-template-columns:1fr 1fr;gap:32px; } }
@media (max-width:768px) { .stats-row { grid-template-columns:repeat(2,1fr); } .stat-block { border-right:none;border-bottom:1px solid var(--border-1);padding-bottom:24px; } .footer-grid { grid-template-columns:1fr; } .cta-box { padding:48px 28px; } .niches-grid,.testimonials-grid { grid-template-columns:1fr; } }
@media (max-width:480px) { .container { padding:0 20px; } .cta-actions,.hero-ctas { flex-direction:column;width:100%; } .cta-actions .btn,.hero-ctas .btn { width:100%;justify-content:center; } }
