:root {
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  --bg: #020805;
  --surface: rgba(5, 22, 13, 0.72);
  --surface-soft: rgba(7, 28, 17, 0.55);
  --green: #22c55e;
  --neon: #39ff88;
  --mint: #7dff9b;
  --deep: #075b32;
  --text: #effff4;
  --muted: #9cb8a6;
  --border: rgba(57, 255, 136, 0.22);
  --border-2: rgba(57, 255, 136, 0.42);
  --glow: rgba(57, 255, 136, 0.42);
  --warning: #f6ad55;
  --mono: ui-monospace, "Cascadia Code", Menlo, Consolas, monospace;
  color: var(--text);
  background: var(--bg);
}

/* Calm, branded scrollbars for the page and every scrollable panel. */
html {
  scrollbar-gutter: stable;
  scrollbar-color: rgba(49, 214, 119, .72) #020a06;
  scrollbar-width: thin;
}
* {
  scrollbar-color: rgba(49, 214, 119, .6) rgba(2, 10, 6, .72);
  scrollbar-width: thin;
}
*::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
*::-webkit-scrollbar-track {
  border-left: 1px solid rgba(33, 245, 139, .055);
  background: #020a06;
}
*::-webkit-scrollbar-thumb {
  min-height: 48px;
  border: 2px solid #020a06;
  border-radius: 999px;
  background: linear-gradient(180deg, #35df82, #137c46);
  box-shadow: inset 0 0 0 1px rgba(173, 255, 211, .16);
}
*::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #52f59b, #1a9b57);
  box-shadow: 0 0 12px rgba(33, 245, 139, .22);
}
*::-webkit-scrollbar-thumb:active {
  background: #20c96d;
}
*::-webkit-scrollbar-button {
  display: none;
  width: 0;
  height: 0;
}
*::-webkit-scrollbar-corner {
  background: #020a06;
}

/* Adam's guided explanation keeps the spoken topic aligned with the page. */
main > section,
main > aside {
  scroll-margin-top: 92px;
}
.adam-page-guide {
  position: fixed;
  z-index: 90;
  right: clamp(200px, 20vw, 320px);
  bottom: 24px;
  display: grid;
  grid-template-columns: 10px 1fr auto;
  min-width: 230px;
  padding: 12px 14px;
  align-items: center;
  gap: 4px 10px;
  border: 1px solid rgba(33, 245, 139, .3);
  border-radius: 13px;
  background: rgba(2, 18, 9, .92);
  box-shadow: 0 18px 55px -28px #000, 0 0 34px -24px var(--glow);
  backdrop-filter: blur(18px);
}
.adam-page-guide[hidden] {
  display: none;
}
.adam-page-guide > span {
  grid-row: 1 / 3;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--neon);
  box-shadow: 0 0 13px var(--glow);
}
.adam-page-guide small {
  color: #718a7b;
  font: 700 8px/1 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.adam-page-guide strong {
  color: #dbf4e4;
  font-size: 12px;
}
.adam-page-guide b {
  grid-column: 3;
  grid-row: 1 / 3;
  color: #68dfa0;
  font: 700 9px/1 var(--mono);
}
@media (max-width: 640px) {
  .adam-page-guide {
    right: 12px;
    bottom: 14px;
    left: 12px;
    min-width: 0;
  }
}

/* Production SaaS shell */
.nav { min-height: 72px; }
.nav-cta {
  padding: 9px 16px;
  border: 1px solid var(--border-2);
  border-radius: 999px;
  background: rgba(57,255,136,.1);
  color: var(--text) !important;
}
.nav-toggle { display: none; width: 42px; height: 42px; padding: 0; border: 1px solid var(--border); border-radius: 12px; background: rgba(5,22,13,.85); }
.nav-toggle span { display: block; width: 18px; height: 1px; margin: 5px auto; background: var(--text); }
.logo-strip { display: grid; grid-template-columns: repeat(4,1fr); margin: 96px 0 32px; padding: 22px 0; border-block: 1px solid var(--border); color: rgba(210,235,220,.55); font: 700 10px/1.3 var(--mono); letter-spacing: .14em; text-align: center; }
.split-section { display: grid; grid-template-columns: minmax(0,1fr) minmax(380px,.82fr); gap: clamp(48px,8vw,110px); align-items: center; padding: 112px 0; }
.section-title-xl { max-width: 680px; margin: 12px 0 20px; color: var(--text); font-size: clamp(34px,4.8vw,58px); line-height: 1.04; letter-spacing: -.035em; }
.section-lede { max-width: 650px; font-size: 18px; }
.text-link { display: inline-flex; gap: 12px; margin-top: 18px; color: var(--mint); font-weight: 750; text-decoration: none; }
.text-link span { transition: transform .18s; }.text-link:hover span { transform: translateX(4px); }
.workflow-card { padding: 10px 28px; border: 1px solid var(--border); border-radius: 26px; background: linear-gradient(150deg,rgba(7,28,17,.88),rgba(3,12,8,.62)); box-shadow: 0 30px 90px -50px var(--glow); }
.workflow-step { display: grid; grid-template-columns: 48px 1fr; gap: 18px; padding: 28px 0; border-bottom: 1px solid rgba(57,255,136,.13); }
.workflow-step:last-child { border: 0; }
.workflow-step>span { color: var(--neon); font: 700 11px/1.5 var(--mono); }
.workflow-step strong,.workflow-step small { display: block; }.workflow-step strong { margin-bottom: 5px; color: var(--text); font-size: 17px; }.workflow-step small { color: var(--muted); line-height: 1.55; }
.metrics-band { display: grid; grid-template-columns: repeat(4,1fr); border: 1px solid var(--border); border-radius: 24px; background: rgba(5,22,13,.62); overflow: hidden; }
.metrics-band article { padding: 30px 24px; border-right: 1px solid var(--border); }.metrics-band article:last-child{border:0}
.metrics-band strong,.metrics-band span { display: block; }.metrics-band strong { color: var(--neon); font-size: 28px; }.metrics-band span { margin-top: 6px; color: var(--muted); font-size: 13px; }
.security-visual { position: relative; display: grid; place-items: center; min-height: 390px; }
.shield-core { display: grid; place-items: center; width: 126px; height: 146px; border: 1px solid var(--border-2); border-radius: 55% 55% 70% 70%; background: radial-gradient(circle,rgba(57,255,136,.24),rgba(5,22,13,.9) 64%); color: var(--neon); font: 800 28px/1 Orbitron,system-ui; box-shadow: 0 0 60px rgba(57,255,136,.2); }
.security-ring { position: absolute; width: 270px; height: 270px; border: 1px solid var(--border); border-radius: 50%; }.ring-b{width:360px;height:360px;border-style:dashed;animation:orb-spin 35s linear infinite}.security-visual small{position:absolute;bottom:20px;color:var(--mint);font:700 10px/1 var(--mono);letter-spacing:.16em}
.check-list { display: grid; gap: 13px; padding: 0; list-style: none; }.check-list li{color:var(--text)}.check-list li::before{content:"✓";display:inline-grid;place-items:center;width:22px;height:22px;margin-right:10px;border:1px solid var(--border-2);border-radius:50%;color:var(--neon);font-size:12px}
.cta-panel { margin: 50px 0 0; padding: clamp(40px,7vw,78px); border: 1px solid var(--border-2); border-radius: 30px; text-align: center; background: radial-gradient(circle at 50% 0,rgba(57,255,136,.15),transparent 60%),rgba(5,22,13,.72); }.cta-panel h2{max-width:760px;margin:12px auto;color:var(--text);font-size:clamp(34px,5vw,58px);line-height:1.06}.cta-panel p{max-width:620px;margin-inline:auto}.cta-panel .actions{justify-content:center;margin-bottom:0}
.site-footer { display: grid; grid-template-columns: 2fr repeat(3,1fr); gap: 48px; padding-block: 54px; }.site-footer>div{display:flex;flex-direction:column;align-items:flex-start;gap:10px}.site-footer strong{margin-bottom:5px;color:var(--text);font-size:13px}.site-footer a:not(.brand),.site-footer span{color:var(--muted);font-size:13px;text-decoration:none}.site-footer a:hover{color:var(--text)}

/* Account pages */
.auth-page { min-height: 100vh; background: radial-gradient(800px 700px at 15% 45%,rgba(7,91,50,.25),transparent 65%),var(--bg); }
.auth-back { color: var(--muted); font-size: 13px; text-decoration: none; }.auth-back:hover{color:var(--text)}
.auth-shell { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(420px,.75fr); gap: clamp(50px,9vw,130px); align-items: center; width: min(1160px,calc(100% - 40px)); min-height: calc(100vh - 72px); padding: 70px 0; }
.auth-story h1 { max-width: 680px; font-size: clamp(42px,5.7vw,72px); }.auth-story>p:not(.eyebrow){max-width:600px;font-size:18px}
.auth-benefits { display: grid; gap: 4px; max-width: 620px; margin: 38px 0; padding: 0; list-style:none; }
.auth-benefits li { display:grid;grid-template-columns:42px 1fr;gap:15px;padding:17px 0;border-top:1px solid rgba(57,255,136,.13) }.auth-benefits li>span{color:var(--neon);font:700 10px/1.5 var(--mono)}.auth-benefits strong,.auth-benefits small{display:block}.auth-benefits strong{color:var(--text);margin-bottom:4px}.auth-benefits small{color:var(--muted);font-size:13px;line-height:1.5}
.auth-proof { display:flex;align-items:center;gap:10px;color:var(--muted);font:600 11px/1.4 var(--mono);letter-spacing:.04em }.live-indicator{width:7px;height:7px;border-radius:50%;background:var(--neon);box-shadow:0 0 12px var(--glow)}
.auth-card { position:relative;padding:clamp(28px,4vw,44px);border:1px solid var(--border);border-radius:26px;background:linear-gradient(155deg,rgba(7,28,17,.96),rgba(3,12,8,.91));box-shadow:0 36px 100px -45px rgba(0,0,0,.9),0 0 60px -40px var(--glow) }.auth-card h2{margin:6px 0 8px;color:var(--text);font-size:clamp(28px,3.5vw,39px);letter-spacing:-.03em}.auth-kicker{margin:0;color:var(--neon);font:700 10px/1.3 var(--mono);letter-spacing:.18em;text-transform:uppercase}.auth-intro{margin:0 0 28px}
.auth-card form{display:grid;gap:18px}.auth-card label{display:grid;gap:8px;color:var(--text);font-size:13px;font-weight:650}.auth-card label>span{display:flex;justify-content:space-between}.auth-card label a,.auth-switch a{color:var(--mint);text-decoration:none}.auth-card input:not([type="checkbox"]){width:100%;height:48px;border:1px solid var(--border);border-radius:12px;padding:0 14px;background:rgba(2,8,5,.72);color:var(--text);outline:none}.auth-card input:focus{border-color:var(--neon);box-shadow:0 0 0 3px rgba(57,255,136,.12)}.auth-card label small,.optional{color:var(--muted);font-weight:400}.check-row{grid-template-columns:18px 1fr!important;align-items:start;line-height:1.45}.check-row input{accent-color:var(--green)}
.auth-submit{display:flex;width:100%;justify-content:space-between;margin-top:4px;cursor:pointer}.auth-submit:disabled{opacity:.65;cursor:wait}.auth-switch{margin:22px 0 0;text-align:center;font-size:13px}.auth-security{margin:24px 0 0;padding-top:20px;border-top:1px solid rgba(57,255,136,.12);font-size:11px;text-align:center}.form-notice{margin-top:18px;padding:12px 14px;border:1px solid var(--border);border-radius:12px;color:var(--muted);font-size:13px}.form-notice[data-kind="error"]{border-color:rgba(246,173,85,.5);color:#ffd49b;background:rgba(246,173,85,.08)}.form-notice[data-kind="success"]{color:var(--mint);background:rgba(57,255,136,.08)}.auth-state-icon{display:grid;place-items:center;width:52px;height:52px;margin-bottom:22px;border:1px solid var(--border-2);border-radius:50%;color:var(--neon);font-size:22px}

@media (max-width: 820px) {
  .nav-toggle{display:block}.nav-links{position:absolute;top:calc(100% + 1px);left:16px;right:16px;display:none;flex-direction:column;align-items:stretch;padding:18px;border:1px solid var(--border);border-radius:16px;background:rgba(3,12,8,.98);box-shadow:0 20px 60px rgba(0,0,0,.55)}.nav-links.is-open{display:flex}.nav-links a{padding:9px 4px}.nav-cta{text-align:center}
  .logo-strip{grid-template-columns:1fr 1fr;gap:18px}.split-section{grid-template-columns:1fr;padding:80px 0}.metrics-band{grid-template-columns:1fr 1fr}.metrics-band article:nth-child(2){border-right:0}.metrics-band article{border-bottom:1px solid var(--border)}.site-footer{grid-template-columns:1fr 1fr}
  .auth-shell{grid-template-columns:1fr;max-width:620px}.auth-story{display:none}
}

.pricing-hero { max-width: 900px; text-align: center; margin: 0 auto 58px; }.pricing-hero h1,.pricing-hero .lede{margin-inline:auto}
.pricing-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch }
.price-card { position:relative;display:flex;flex-direction:column;padding:30px;border:1px solid var(--border);border-radius:24px;background:linear-gradient(180deg,var(--surface),rgba(3,12,8,.72)) }.price-card.featured{border-color:var(--border-2);box-shadow:0 25px 80px -50px var(--glow)}.popular{position:absolute;top:0;right:24px;transform:translateY(-50%);padding:5px 10px;border-radius:99px;background:var(--neon);color:#04170c;font:800 9px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}.plan-name{margin:0;color:var(--text);font-size:18px;font-weight:750}.price-card .price{margin:18px 0 8px}.price-card .price small{color:var(--muted);font:500 12px/1.2 system-ui}.price-card>.button{justify-content:center;margin:14px 0 25px}.price-card .check-list{margin-top:auto}.faq-list{max-width:820px;margin-inline:auto}.faq-list details{border-bottom:1px solid var(--border);padding:20px 0}.faq-list summary{color:var(--text);font-weight:700;cursor:pointer}.faq-list details p{margin-bottom:0}
.feature-stack{display:grid;gap:110px;margin:100px 0}.feature-row{display:grid;grid-template-columns:1fr .9fr;gap:clamp(50px,9vw,120px);align-items:center}.feature-row.reverse>div:first-child{order:2}.feature-row h2{max-width:650px;margin:12px 0;color:var(--text);font-size:clamp(32px,4vw,52px);line-height:1.05}.feature-row p{font-size:17px}.product-ui{padding:28px;border:1px solid var(--border);border-radius:24px;background:linear-gradient(150deg,rgba(7,28,17,.92),rgba(3,12,8,.8));box-shadow:0 30px 90px -55px var(--glow)}.ui-label{display:block;margin-bottom:24px;color:var(--neon);font:700 9px/1 var(--mono);letter-spacing:.16em}.product-ui>strong{display:block;margin-bottom:22px;color:var(--text);font-size:32px}.source-row,.policy-row{display:flex;align-items:center;gap:10px;padding:13px 0;border-top:1px solid rgba(57,255,136,.12);color:var(--text);font-size:13px}.source-row i{width:7px;height:7px;border-radius:50%;background:var(--neon);box-shadow:0 0 8px var(--glow)}.source-row b,.policy-row b{margin-left:auto;color:var(--mint);font-size:11px}.policy-row .warn{color:var(--warning)}.mini-message{margin:12px 0 12px 15%;padding:12px 14px;border:1px solid var(--border);border-radius:14px 14px 4px 14px;background:rgba(57,255,136,.12);color:var(--text);font-size:13px}.assistant-mini{margin-left:0;margin-right:12%;border-radius:14px 14px 14px 4px;background:rgba(7,40,23,.8)}.wave-bars{display:flex;align-items:center;justify-content:center;gap:4px;height:50px}.wave-bars i{width:3px;height:14px;border-radius:4px;background:var(--neon);animation:voice-wave 1.1s ease-in-out infinite}.wave-bars i:nth-child(2n){height:28px;animation-delay:.14s}.wave-bars i:nth-child(3n){height:20px;animation-delay:.28s}@keyframes voice-wave{50%{transform:scaleY(.45);opacity:.55}}
.docs-layout{display:grid;grid-template-columns:230px minmax(0,760px);gap:70px;align-items:start}.docs-sidebar{position:sticky;top:105px;display:flex;flex-direction:column;gap:9px}.docs-sidebar strong{margin:18px 0 4px;color:var(--text);font:800 9px/1 var(--mono);letter-spacing:.14em}.docs-sidebar a{color:var(--muted);font-size:13px;text-decoration:none}.docs-sidebar a:hover{color:var(--mint)}.docs-content h1{font-size:clamp(42px,6vw,68px)}.docs-content .section{padding-top:42px;margin-top:48px;scroll-margin-top:95px}.docs-content .section h2{font-size:28px}.code-block{margin-top:24px;border:1px solid var(--border);border-radius:16px;overflow:hidden;background:#010503}.code-block span{display:block;padding:9px 14px;border-bottom:1px solid var(--border);color:var(--muted);font:700 9px/1 var(--mono)}.code-block code{display:block;overflow:auto;padding:20px;color:#c7f9d8;font:13px/1.7 var(--mono);white-space:pre}.docs-grid{grid-template-columns:1fr}
@media(max-width:900px){.pricing-grid{grid-template-columns:1fr;max-width:620px;margin-inline:auto}.feature-row{grid-template-columns:1fr;gap:35px}.feature-row.reverse>div:first-child{order:0}.docs-layout{grid-template-columns:1fr}.docs-sidebar{display:none}}
.legal-page{max-width:820px}.legal-page h1{font-size:clamp(44px,7vw,72px)}.legal-page section{margin-top:55px;padding-top:30px;border-top:1px solid var(--border)}.legal-page h2{margin:36px 0 8px;color:var(--text);font-size:23px}.legal-page a{color:var(--mint)}

/* Expanded premium landing experience */
.hero-proof{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 24px;margin-top:-38px;color:var(--muted);font:600 11px/1.4 var(--mono);letter-spacing:.03em}.home-hero .hero-orb{margin-top:20px}.home-hero h1{margin-top:24px}.section-heading{max-width:780px;margin:0 auto 46px;text-align:center}.section-heading .section-lede{margin-inline:auto}.benefits-section,.comparison-section,.dashboard-preview,.testimonials-section{padding:110px 0}.benefit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.benefit-card{min-height:220px;padding:24px;border:1px solid var(--border);border-radius:22px;background:linear-gradient(150deg,rgba(7,28,17,.72),rgba(3,12,8,.58));transition:transform .22s,border-color .22s,box-shadow .22s}.benefit-card:hover{transform:translateY(-4px);border-color:var(--border-2);box-shadow:0 24px 70px -45px var(--glow)}.benefit-card>span{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--border-2);border-radius:12px;background:rgba(57,255,136,.08);color:var(--neon);font:800 12px/1 var(--mono)}.benefit-card h3{margin:32px 0 8px;color:var(--text);font-size:18px}.benefit-card p{margin:0;font-size:14px}
.interactive-demo{border-block:1px solid var(--border)}.demo-orb-panel{display:grid;place-items:center;gap:12px}.demo-orb-stage{position:relative;width:min(390px,80vw);aspect-ratio:1}.demo-orb-stage::before{content:"";position:absolute;inset:7%;border:1px solid var(--border);border-radius:50%;background:radial-gradient(circle,rgba(57,255,136,.1),transparent 65%)}.demo-orb-stage canvas{position:absolute;inset:0;width:100%;height:100%;border-radius:50%}.demo-orb-stage button{position:absolute;inset:0;border:0;border-radius:50%;background:transparent;cursor:pointer}.demo-live{display:inline-flex;align-items:center;gap:8px;padding:6px 11px;border:1px solid var(--border);border-radius:999px;color:var(--muted);font:700 9px/1 var(--mono);letter-spacing:.14em}.demo-live i{width:6px;height:6px;border-radius:50%;background:var(--neon);box-shadow:0 0 9px var(--glow)}.prompt-chips{display:flex;flex-wrap:wrap;gap:9px;margin:24px 0}.prompt-chips button{padding:10px 13px;border:1px solid var(--border);border-radius:999px;background:rgba(57,255,136,.06);color:var(--text);cursor:pointer}.prompt-chips button:hover{border-color:var(--border-2);background:rgba(57,255,136,.12)}.privacy-copy{font-size:12px}
.comparison-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:900px;margin:auto}.comparison-grid article{padding:34px;border:1px solid var(--border);border-radius:24px;background:rgba(5,22,13,.5)}.comparison-grid article.better{border-color:var(--border-2);background:linear-gradient(145deg,rgba(7,91,50,.24),rgba(5,22,13,.72));box-shadow:0 28px 80px -55px var(--glow)}.comparison-grid article>span{color:var(--text);font-size:20px;font-weight:800}.comparison-grid ul{display:grid;gap:14px;margin:26px 0 0;padding:0;list-style:none}.comparison-grid li{color:var(--muted)}.comparison-grid li::before{content:"×";margin-right:10px;color:var(--warning)}.comparison-grid .better li::before{content:"✓";color:var(--neon)}
.preview-window{overflow:hidden;border:1px solid var(--border-2);border-radius:24px;background:#06100b;box-shadow:0 40px 120px -55px rgba(0,0,0,.9),0 0 80px -60px var(--glow)}.preview-top{display:flex;align-items:center;gap:7px;padding:13px 17px;border-bottom:1px solid var(--border);background:rgba(255,255,255,.02)}.preview-top i{width:8px;height:8px;border-radius:50%;background:rgba(156,184,166,.32)}.preview-top span{margin-left:10px;color:var(--muted);font:600 10px/1 var(--mono)}.preview-layout{display:grid;grid-template-columns:190px 1fr;min-height:430px}.preview-layout aside{display:flex;flex-direction:column;gap:16px;padding:30px 22px;border-right:1px solid var(--border);color:var(--muted);font-size:12px}.preview-layout aside b{padding:9px;border-radius:8px;background:rgba(57,255,136,.1);color:var(--text)}.preview-layout>div{padding:30px}.preview-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.preview-metrics article{padding:18px;border:1px solid var(--border);border-radius:15px;background:rgba(7,28,17,.55)}.preview-metrics small,.preview-metrics strong,.preview-metrics em{display:block}.preview-metrics small{color:var(--muted)}.preview-metrics strong{margin:12px 0 5px;color:var(--text);font-size:26px}.preview-metrics em{color:var(--mint);font-size:11px;font-style:normal}.preview-chart{display:flex;align-items:end;gap:14px;height:220px;margin-top:22px;padding:24px;border:1px solid var(--border);border-radius:16px;background:linear-gradient(to top,rgba(57,255,136,.04),transparent)}.preview-chart span{flex:1;min-height:10%;border-radius:7px 7px 2px 2px;background:linear-gradient(var(--neon),rgba(34,197,94,.28));opacity:.78}
.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.testimonial-grid blockquote{margin:0;padding:28px;border:1px solid var(--border);border-radius:22px;background:rgba(5,22,13,.62);color:var(--text);font-size:16px;line-height:1.65}.testimonial-grid footer{display:flex;flex-direction:column;gap:2px;margin-top:24px;padding:0;border:0;background:none}.testimonial-grid footer strong{font-size:13px}.testimonial-grid footer span{color:var(--muted);font-size:12px}
@media(max-width:950px){.benefit-grid{grid-template-columns:repeat(2,1fr)}.preview-layout{grid-template-columns:130px 1fr}.testimonial-grid{grid-template-columns:1fr}.home-hero .hero-orb{order:0}}
@media(max-width:620px){.benefit-grid,.comparison-grid{grid-template-columns:1fr}.preview-layout{grid-template-columns:1fr}.preview-layout aside{display:none}.preview-metrics{grid-template-columns:1fr}.preview-chart{height:170px;padding:16px;gap:7px}.hero-proof{margin-top:-22px;flex-direction:column}.benefits-section,.comparison-section,.dashboard-preview,.testimonials-section{padding:76px 0}}
@media (max-width: 520px) {
  .metrics-band{grid-template-columns:1fr}.metrics-band article{border-right:0}.logo-strip{grid-template-columns:1fr}.site-footer{grid-template-columns:1fr}.auth-shell{width:min(100% - 24px,620px);padding:28px 0}.auth-card{padding:26px 20px}.security-note{grid-template-columns:1fr}
}

* { box-sizing: border-box; }
body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(1100px 520px at 50% 118%, rgba(7, 91, 50, 0.5), transparent 60%),
    radial-gradient(900px 500px at 82% -10%, rgba(34, 197, 94, 0.1), transparent 55%),
    var(--bg);
  color: var(--text);
}
a { color: inherit; }

/* Decorative cinematic starfield injected by site.js (aria-hidden) */
#cin-bg {
  position: fixed;
  inset: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: 0.9;
}

.nav,
.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 16px clamp(20px, 6vw, 84px);
  border-bottom: 1px solid var(--border);
  background: rgba(3, 12, 8, 0.62);
  -webkit-backdrop-filter: blur(14px) saturate(1.1);
  backdrop-filter: blur(14px) saturate(1.1);
}

.brand {
  font-family: Orbitron, ui-sans-serif, system-ui, sans-serif;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--text);
}
.brand span { color: var(--neon); text-shadow: 0 0 18px var(--glow); }
.nav-links { display: flex; align-items: center; gap: 22px; }
.nav-links a,
.site-header nav a {
  color: var(--muted);
  text-decoration: none;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.02em;
  transition: color 0.15s;
}
.nav-links a:hover,
.site-header nav a:hover { color: var(--text); }
.site-header nav a[aria-current="page"] { color: var(--neon); }
.nav-links strong,
.site-header nav strong { color: var(--mint); }

main { width: min(1120px, calc(100% - 40px)); margin: 0 auto; padding: 84px 0 140px; position: relative; z-index: 1; }
.eyebrow {
  color: var(--neon);
  font-family: ui-monospace, "Cascadia Code", Menlo, Consolas, monospace;
  font-weight: 700;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  font-size: 12px;
}
h1 {
  font-family: Orbitron, ui-sans-serif, system-ui, sans-serif;
  max-width: 900px;
  margin: 14px 0 20px;
  font-size: clamp(40px, 6.4vw, 74px);
  line-height: 1.02;
  letter-spacing: -0.02em;
  color: var(--text);
  text-shadow: 0 0 40px rgba(57, 255, 136, 0.12);
}
.hero h1, .hero p { max-width: 820px; }
.lede { max-width: 680px; color: var(--muted); font-size: clamp(16px, 2.2vw, 20px); line-height: 1.65; }
p { color: var(--muted); line-height: 1.65; }

.actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 34px 0 64px; }
.button {
  display: inline-flex;
  align-items: center;
  padding: 13px 22px;
  border-radius: 999px;
  border: 1px solid transparent;
  background: linear-gradient(180deg, var(--neon), var(--green));
  color: #04170c;
  text-decoration: none;
  font-weight: 700;
  letter-spacing: 0.01em;
  box-shadow: 0 12px 34px -14px var(--glow);
  transition: filter 0.15s, transform 0.15s;
}
.button:hover { filter: brightness(1.07); transform: translateY(-1px); }
.button.secondary {
  background: rgba(57, 255, 136, 0.08);
  color: var(--text);
  border-color: var(--border);
  box-shadow: none;
}
.button.secondary:hover { background: rgba(57, 255, 136, 0.16); }

.security-note {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  max-width: 720px;
  padding: 18px 20px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: var(--surface);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.security-note strong { color: var(--mint); }
.security-note span { color: var(--muted); }

.grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 40px; }
.card {
  padding: 24px;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: linear-gradient(180deg, var(--surface), var(--surface-soft));
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  box-shadow: 0 20px 50px -28px rgba(0, 0, 0, 0.8);
  transition: border-color 0.18s, transform 0.18s, box-shadow 0.18s;
}
.card:hover {
  border-color: rgba(57, 255, 136, 0.4);
  transform: translateY(-3px);
  box-shadow: 0 26px 60px -30px var(--glow);
}
.card h2 { margin: 0 0 8px; font-size: 21px; color: var(--text); font-family: Orbitron, ui-sans-serif, system-ui, sans-serif; letter-spacing: 0.01em; }
.card p { color: var(--muted); line-height: 1.6; }
.card small { color: rgba(156, 184, 166, 0.7); font-family: ui-monospace, "Cascadia Code", Menlo, Consolas, monospace; font-size: 11.5px; }
.price { font-size: 38px; font-weight: 800; letter-spacing: -0.02em; color: var(--neon); text-shadow: 0 0 26px var(--glow); font-family: Orbitron, ui-sans-serif, system-ui, sans-serif; }
.product[hidden] { display: none; }
[data-search-result] { min-height: 24px; color: var(--mint); font-weight: 700; }

.hero { padding: 12px 0 4px; }
.section { margin-top: 40px; padding-top: 28px; border-top: 1px solid var(--border); }
.section h2 { font-family: Orbitron, ui-sans-serif, system-ui, sans-serif; color: var(--text); letter-spacing: 0.01em; }
.section h3 { color: var(--mint); margin-bottom: 4px; }

footer {
  padding: 30px clamp(20px, 6vw, 84px);
  color: var(--muted);
  border-top: 1px solid var(--border);
  background: rgba(3, 12, 8, 0.5);
  position: relative;
  z-index: 1;
}

/* Homepage hero: centred layout with the big Voice Orb as centrepiece */
.home-hero { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 8px 0 20px; }
.home-hero .eyebrow { text-align: center; }
.home-hero h1 { text-align: center; }
.home-hero .lede { margin-left: auto; margin-right: auto; }
.home-hero .actions { justify-content: center; margin: 8px 0 0; }

.hero-orb {
  --orb-accent: #55f99a;
  --orb-accent-rgb: 85, 249, 154;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 13px;
  margin: 36px 0 34px;
}
.orb-stage {
  position: relative;
  width: clamp(300px, 42vw, 448px);
  aspect-ratio: 1 / 1;
  isolation: isolate;
  transition: transform .45s cubic-bezier(.2,.8,.2,1), filter .45s ease;
}
.orb-stage::before {
  content: "";
  position: absolute;
  inset: 9%;
  z-index: -1;
  border-radius: 50%;
  background: rgba(4, 24, 14, .58);
  border: 1px solid rgba(113, 255, 174, .1);
  box-shadow: inset 0 0 70px rgba(4, 12, 8, .8), 0 28px 80px rgba(0, 0, 0, .48);
}
.orb-stage canvas { position: absolute; inset: 6%; width: 88%; height: 88%; border-radius: 50%; z-index: 3; }
.orb-atmosphere {
  position: absolute;
  inset: -9%;
  z-index: -2;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle, rgba(var(--orb-accent-rgb), .2) 0%, rgba(var(--orb-accent-rgb), .08) 34%, transparent 68%);
  filter: blur(12px);
  animation: orb-breathe 4.8s ease-in-out infinite;
}
.orb-aurora {
  position: absolute;
  inset: -18%;
  z-index: -1;
  border-radius: 50%;
  pointer-events: none;
  opacity: 0;
  background:
    radial-gradient(circle at 50% 50%, rgba(112,255,181,.18) 0 19%, rgba(33,245,139,.11) 34%, rgba(21,180,105,.045) 51%, transparent 71%),
    conic-gradient(from 32deg, transparent 0 15%, rgba(78,255,170,.11) 22%, transparent 31% 56%, rgba(68,238,255,.07) 65%, transparent 75%);
  filter: blur(18px);
  mix-blend-mode: screen;
  transition: opacity .18s ease;
}
.orb-scanlines {
  position: absolute;
  inset: 7%;
  z-index: 4;
  border-radius: 50%;
  pointer-events: none;
  opacity: .58;
  background:
    repeating-linear-gradient(to bottom, transparent 0 5px, rgba(var(--orb-accent-rgb),.022) 6px, transparent 7px),
    linear-gradient(105deg, transparent 28%, rgba(230,255,242,.11) 49%, transparent 63%);
  -webkit-mask: radial-gradient(circle, transparent 0 51%, #000 69%, transparent 76%);
  mask: radial-gradient(circle, transparent 0 51%, #000 69%, transparent 76%);
  animation: orb-scan-sweep 6.5s ease-in-out infinite;
}
@keyframes orb-aurora-drift {
  from { transform: scale(.94) rotate(-5deg); opacity: .68; }
  to { transform: scale(1.06) rotate(7deg); opacity: 1; }
}
@keyframes orb-scan-sweep {
  0%,100% { transform: rotate(-8deg); opacity: .34; }
  50% { transform: rotate(10deg); opacity: .68; }
}
.orb-reticle {
  position: absolute;
  inset: 4%;
  z-index: 1;
  border-radius: 50%;
  opacity: .55;
  pointer-events: none;
  background: conic-gradient(from 12deg, transparent 0 8%, rgba(var(--orb-accent-rgb), .38) 8.2% 8.45%, transparent 8.7% 24%, rgba(var(--orb-accent-rgb), .18) 24.2% 24.35%, transparent 24.6% 58%, rgba(var(--orb-accent-rgb), .28) 58.2% 58.4%, transparent 58.7%);
  -webkit-mask: radial-gradient(circle, transparent 68%, #000 68.4% 69%, transparent 69.4%);
  mask: radial-gradient(circle, transparent 68%, #000 68.4% 69%, transparent 69.4%);
  animation: orb-spin 32s linear infinite;
}
.orb-orbit {
  position: absolute;
  z-index: 2;
  border-radius: 50%;
  border: 1px solid rgba(var(--orb-accent-rgb), .14);
  pointer-events: none;
}
.orb-orbit i {
  position: absolute;
  top: 50%;
  left: -3px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--orb-accent);
  box-shadow: 0 0 14px var(--orb-accent);
}
.orbit-outer { inset: 2%; animation: orb-spin 23s linear infinite; }
.orbit-inner { inset: 13%; border-color: rgba(var(--orb-accent-rgb), .09); animation: orb-spin 17s linear infinite reverse; }
.orbit-inner i { left: auto; right: -2px; width: 4px; height: 4px; opacity: .65; }
.orb-ripple {
  position: absolute;
  inset: 16%;
  z-index: 0;
  border: 1px solid rgba(var(--orb-accent-rgb), .22);
  border-radius: 50%;
  opacity: 0;
  pointer-events: none;
}
@keyframes orb-spin { to { transform: rotate(360deg); } }
@keyframes orb-breathe { 0%,100% { transform: scale(.96); opacity: .7; } 50% { transform: scale(1.035); opacity: 1; } }
@keyframes orb-ripple-out { 0% { transform: scale(.72); opacity: 0; } 18% { opacity: .62; } 100% { transform: scale(1.38); opacity: 0; } }
.orb-hit {
  position: absolute; inset: 0; border: 0; border-radius: 50%; background: transparent; cursor: pointer;
  z-index: 5;
}
.orb-hit:focus-visible { outline: none; box-shadow: 0 0 0 2px rgba(var(--orb-accent-rgb), .72), 0 0 0 8px rgba(var(--orb-accent-rgb), .1); }
.orb-stage:hover { transform: scale(1.018); filter: brightness(1.06); }
.orb-presence {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: -2px;
  padding: 5px 11px;
  border: 1px solid rgba(var(--orb-accent-rgb), .14);
  border-radius: 999px;
  background: rgba(5, 22, 13, .62);
  color: rgba(210, 235, 220, .72);
  font: 600 10px/1.2 ui-monospace, "Cascadia Code", Menlo, Consolas, monospace;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.presence-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--orb-accent);
  box-shadow: 0 0 10px rgba(var(--orb-accent-rgb), .9);
  animation: presence-pulse 2.8s ease-in-out infinite;
}
@keyframes presence-pulse { 0%,100% { opacity: .55; transform: scale(.85); } 50% { opacity: 1; transform: scale(1.15); } }
.orb-status {
  margin: 0; font-family: var(--mono); font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--muted);
  transition: color .25s ease, letter-spacing .25s ease;
}
.orb-transcript { min-height: 22px; margin: 0; max-width: 560px; color: var(--text); font-size: 16px; line-height: 1.5; }
.voice-actor-tag {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-bottom: -5px;
  padding: 5px 10px;
  border: 1px solid rgba(var(--orb-accent-rgb), .18);
  border-radius: 999px;
  background: rgba(5, 22, 13, .72);
  color: rgba(210, 235, 220, .62);
  font: 600 9px/1.2 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
}
.voice-actor-tag strong {
  color: var(--orb-accent);
  font-size: 10px;
  letter-spacing: .08em;
}
.orb-link {
  margin-top: 4px; background: transparent; border: 1px solid var(--border); color: var(--muted);
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
  padding: 7px 15px; border-radius: 999px; cursor: pointer; transition: 0.15s;
}
.orb-link:hover, .orb-link:focus-visible { color: var(--text); border-color: var(--border-2); background: rgba(57, 255, 136, 0.08); outline: none; }

.hero-orb[data-state="listening"] { --orb-accent: #72f7cb; --orb-accent-rgb: 114, 247, 203; }
.hero-orb[data-state="processing"] { --orb-accent: #b4ff7a; --orb-accent-rgb: 180, 255, 122; }
.hero-orb[data-state="speaking"] { --orb-accent: #66eaff; --orb-accent-rgb: 102, 234, 255; }
.hero-orb[data-state="listening"] .orb-stage { transform: scale(1.035); }
.hero-orb[data-state="processing"] .orbit-inner { animation-duration: 3.2s; }
.hero-orb[data-state="processing"] .orbit-outer { animation-duration: 7s; animation-direction: reverse; }
.hero-orb[data-state="speaking"] .orb-ripple,
.hero-orb[data-state="listening"] .orb-ripple { animation: orb-ripple-out 2.35s cubic-bezier(.2,.65,.35,1) infinite; }
.hero-orb .ripple-2 { animation-delay: .78s !important; }
.hero-orb .ripple-3 { animation-delay: 1.56s !important; }
.hero-orb[data-state="listening"] .orb-status,
.hero-orb[data-state="speaking"] .orb-status { color: var(--neon); }
.hero-orb[data-state="processing"] .orb-status { color: var(--mint); }
.hero-orb[data-state="error"] .orb-status,
.hero-orb[data-state="permission-denied"] .orb-status { color: var(--warning); }
.hero-orb[data-state="listening"] .orb-atmosphere,
.hero-orb[data-state="speaking"] .orb-atmosphere { filter: blur(16px); }

/* Legacy-inspired particle renderer chrome. The renderer is selected in
   site.js; these rules preserve the wider, airier framing from UI_UX_design. */
.hero-orb[data-design="particle"] .orb-stage canvas {
  inset: 1%;
  width: 98%;
  height: 98%;
}
.hero-orb[data-design="particle"] .orb-stage::before {
  inset: 5%;
  background: radial-gradient(circle, rgba(5, 27, 16, .42), rgba(2, 8, 5, .12) 58%, transparent 76%);
  border-color: rgba(var(--orb-accent-rgb), .07);
  box-shadow:
    inset 0 0 86px rgba(2, 8, 5, .54),
    inset 0 0 34px rgba(var(--orb-accent-rgb), .08),
    0 0 58px rgba(var(--orb-accent-rgb), .12),
    0 28px 90px rgba(0, 0, 0, .34);
}
.hero-orb[data-design="particle"] .orbit-outer {
  inset: -2%;
  border-style: dashed;
  border-color: rgba(var(--orb-accent-rgb), .22);
  animation-duration: 28s;
}
.hero-orb[data-design="particle"] .orbit-inner {
  inset: 7%;
  opacity: .45;
  animation-duration: 38s;
}
.hero-orb[data-design="particle"] .orb-reticle { opacity: .26; }
.hero-orb[data-design="particle"] .orb-atmosphere {
  inset: -14%;
  opacity: 0;
  filter: blur(20px);
  animation: none;
  transition: opacity .18s ease;
}
.hero-orb[data-design="particle"][data-state="speaking"] .orb-atmosphere {
  opacity: 1;
  animation: orb-breathe 1.8s ease-in-out infinite;
}
.hero-orb[data-state="speaking"] .orb-aurora {
  opacity: 1;
  animation: orb-aurora-drift 2.4s ease-in-out infinite alternate;
}
.hero-orb[data-design="particle"][data-state="processing"] .orbit-inner { animation-duration: 4.2s; }
.hero-orb[data-design="particle"][data-state="processing"] .orbit-outer { animation-duration: 9s; }

@media (max-width: 760px) {
  .grid { grid-template-columns: 1fr; }
  .nav, .site-header { flex-wrap: wrap; gap: 12px; }
  .nav-links { gap: 14px; flex-wrap: wrap; }
  main { padding-top: 54px; }
  .orb-stage { width: clamp(240px, 78vw, 340px); }
  .orb-transcript { font-size: 15px; }
}

@media (prefers-reduced-motion: reduce) {
  .orb-atmosphere, .orb-aurora, .orb-scanlines, .orb-reticle, .orb-orbit, .orb-ripple, .presence-dot { animation: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  #cin-bg { opacity: 0.6; }
  * { scroll-behavior: auto !important; }
}

@media (max-width: 820px) {
  .nav .nav-toggle { display: block; }
  .nav .nav-links { position: absolute; top: calc(100% + 1px); left: 16px; right: 16px; display: none; flex-direction: column; align-items: stretch; padding: 18px; border: 1px solid var(--border); border-radius: 16px; background: rgba(3,12,8,.98); box-shadow: 0 20px 60px rgba(0,0,0,.55); }
  .nav .nav-links.is-open { display: flex; }
}

/* Horizon 2026 — shared cinematic product system */
:root {
  --bg: #030611;
  --surface: rgba(11, 18, 34, .74);
  --surface-soft: rgba(8, 14, 27, .58);
  --green: #36dc89;
  --neon: #75f4bd;
  --mint: #c0ffe0;
  --deep: #0d7651;
  --text: #f5fbff;
  --muted: #9aabba;
  --border: rgba(134, 228, 207, .15);
  --border-2: rgba(117, 244, 189, .34);
  --glow: rgba(68, 229, 167, .34);
  --cyan: #55d8ff;
  --violet: #8d7dff;
  --shadow-xl: 0 34px 100px -48px rgba(0, 0, 0, .92);
  --pointer-x: 50%;
  --pointer-y: 18%;
}

html { scroll-behavior: smooth; }
body {
  overflow-x: hidden;
  background:
    radial-gradient(920px 620px at var(--pointer-x) var(--pointer-y), rgba(58, 188, 161, .13), transparent 64%),
    radial-gradient(900px 580px at 92% 5%, rgba(86, 111, 255, .12), transparent 60%),
    radial-gradient(760px 520px at 5% 42%, rgba(20, 180, 141, .1), transparent 64%),
    linear-gradient(180deg, #030611 0%, #02050d 54%, #040812 100%);
  background-attachment: fixed;
}
body::before, body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}
body::before {
  opacity: .32;
  background-image:
    radial-gradient(circle at 12% 18%, rgba(255,255,255,.9) 0 1px, transparent 1.5px),
    radial-gradient(circle at 76% 32%, rgba(117,244,189,.85) 0 1px, transparent 1.6px),
    radial-gradient(circle at 38% 76%, rgba(85,216,255,.72) 0 1px, transparent 1.6px);
  background-size: 193px 193px, 277px 277px, 351px 351px;
}
body::after {
  opacity: .17;
  background-image:
    linear-gradient(rgba(125, 238, 213, .09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(125, 238, 213, .09) 1px, transparent 1px);
  background-size: 72px 72px;
  -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.82), transparent 76%);
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.82), transparent 76%);
}
#cin-bg { z-index: 0; opacity: .58; mix-blend-mode: screen; }

.nav, .site-header {
  top: 14px;
  width: min(1180px, calc(100% - 28px));
  min-height: 64px;
  margin: 0 auto;
  padding: 10px 12px 10px 20px;
  border: 1px solid rgba(155, 226, 213, .17);
  border-radius: 18px;
  background: rgba(6, 11, 23, .74);
  box-shadow: 0 18px 70px -38px rgba(0,0,0,.95), inset 0 1px rgba(255,255,255,.035);
  -webkit-backdrop-filter: blur(22px) saturate(1.35);
  backdrop-filter: blur(22px) saturate(1.35);
}
.nav::before {
  content: "";
  position: absolute;
  left: 20px;
  bottom: -1px;
  width: 72px;
  height: 1px;
  background: linear-gradient(90deg, var(--neon), transparent);
  box-shadow: 0 0 18px var(--glow);
}
.brand {
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 15px;
  font-weight: 850;
  letter-spacing: .075em;
}
.brand span {
  background: linear-gradient(105deg, var(--neon), var(--cyan));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-shadow: none;
}
.nav-links { gap: 6px; }
.nav-links a {
  position: relative;
  padding: 10px 12px;
  border-radius: 10px;
  color: #9dafbb;
  font-size: 13px;
  transition: color .2s ease, background .2s ease, transform .2s ease;
}
.nav-links a:hover, .nav-links a[aria-current="page"] {
  color: var(--text);
  background: rgba(255,255,255,.045);
}
.nav-links a:hover { transform: translateY(-1px); }
.nav-links .nav-cta {
  margin-left: 4px;
  padding: 10px 17px;
  border-color: rgba(117,244,189,.45);
  background: linear-gradient(135deg, rgba(117,244,189,.17), rgba(85,216,255,.08));
  box-shadow: inset 0 1px rgba(255,255,255,.08), 0 8px 28px -16px var(--glow);
}

main { width: min(1180px, calc(100% - 40px)); padding-top: 106px; }
.eyebrow, .auth-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--neon);
  font-size: 10px;
  letter-spacing: .24em;
}
.eyebrow::before, .auth-kicker::before {
  content: "";
  width: 22px;
  height: 1px;
  background: linear-gradient(90deg, var(--neon), var(--cyan));
  box-shadow: 0 0 10px var(--glow);
}
h1, .section-title-xl, .feature-row h2, .cta-panel h2, .auth-card h2 {
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  text-wrap: balance;
}
h1 {
  letter-spacing: -.055em;
  line-height: .99;
  text-shadow: 0 0 54px rgba(87, 227, 181, .08);
}
.lede, .section-lede { color: #a7b7c2; line-height: 1.72; }

.home-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(400px, .95fr);
  grid-template-rows: auto auto auto auto auto;
  column-gap: clamp(42px, 7vw, 96px);
  min-height: calc(100vh - 120px);
  padding: 34px 0 100px;
  text-align: left;
}
.home-hero > .eyebrow, .home-hero > h1, .home-hero > .lede,
.home-hero > .actions, .home-hero > .hero-proof { grid-column: 1; }
.home-hero > .eyebrow { align-self: end; margin: 0 0 20px; text-align: left; }
.home-hero > h1 {
  align-self: center;
  max-width: 690px;
  margin: 0;
  font-size: clamp(52px, 6vw, 82px);
}
.home-hero > .lede { max-width: 620px; margin: 24px 0 0; font-size: clamp(17px, 1.7vw, 20px); }
.home-hero > .actions { justify-content: flex-start; margin: 30px 0 22px; }
.home-hero > .hero-proof { justify-content: flex-start; margin: 0; color: #8fa4b1; }
.home-hero .hero-orb {
  grid-column: 2;
  grid-row: 1 / span 5;
  align-self: center;
  min-width: 0;
  margin: 0;
  padding: 26px 18px 22px;
  border: 1px solid rgba(140, 231, 211, .13);
  border-radius: 34px;
  background:
    radial-gradient(circle at 50% 35%, rgba(68,229,167,.13), transparent 50%),
    linear-gradient(155deg, rgba(12,21,37,.58), rgba(5,10,21,.28));
  box-shadow: var(--shadow-xl), inset 0 1px rgba(255,255,255,.035);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.home-hero .orb-stage { width: min(100%, 470px); }
.home-hero .orb-transcript { max-width: 430px; font-size: 14px; }

.button, .auth-submit, .primary-link, .upgrade-button {
  position: relative;
  justify-content: center;
  min-height: 46px;
  overflow: hidden;
  border-radius: 12px;
  background: linear-gradient(110deg, #8affc8, #43dea0 52%, #55d8ff);
  color: #03130f;
  box-shadow: 0 16px 42px -20px rgba(68,229,167,.72), inset 0 1px rgba(255,255,255,.5);
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
}
.button::after, .auth-submit::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-120%) skewX(-22deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.38), transparent);
  transition: transform .55s ease;
}
.button:hover::after, .auth-submit:hover::after { transform: translateX(120%) skewX(-22deg); }
.button:hover, .auth-submit:hover, .primary-link:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 52px -20px rgba(68,229,167,.76);
}
.button.secondary {
  border-color: rgba(150,220,210,.2);
  border-radius: 12px;
  background: rgba(10,18,32,.62);
  color: var(--text);
  box-shadow: inset 0 1px rgba(255,255,255,.04);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.button.secondary:hover { background: rgba(20,38,50,.78); border-color: rgba(117,244,189,.4); }

.security-note, .card, .benefit-card, .workflow-card, .price-card, .product-ui,
.comparison-grid article, .preview-window, .testimonial-grid blockquote, .cta-panel,
.code-block, .faq-list details {
  border-color: rgba(139, 224, 207, .15);
  background: linear-gradient(145deg, rgba(15, 25, 43, .76), rgba(6, 12, 24, .58));
  box-shadow: var(--shadow-xl), inset 0 1px rgba(255,255,255,.035);
}
.card, .benefit-card, .price-card, .product-ui, .comparison-grid article {
  position: relative;
  overflow: hidden;
}
.card::before, .benefit-card::before, .price-card::before,
.product-ui::before, .comparison-grid article::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(420px circle at var(--card-x, 50%) var(--card-y, 0%), rgba(86,216,255,.1), transparent 55%);
  opacity: 0;
  transition: opacity .25s ease;
}
.card:hover::before, .benefit-card:hover::before, .price-card:hover::before,
.product-ui:hover::before, .comparison-grid article:hover::before { opacity: 1; }
.card:hover, .benefit-card:hover, .price-card:hover, .product-ui:hover {
  border-color: rgba(117,244,189,.35);
  transform: translateY(-5px);
  box-shadow: 0 32px 82px -42px rgba(49, 226, 166, .32), inset 0 1px rgba(255,255,255,.05);
}
.benefit-card > span, .shield-core {
  border-color: rgba(117,244,189,.34);
  background: linear-gradient(145deg, rgba(117,244,189,.15), rgba(85,216,255,.08));
  color: var(--mint);
}
.metrics-band {
  border-color: rgba(139,224,207,.16);
  background: rgba(8,15,28,.64);
  box-shadow: var(--shadow-xl);
}
.metrics-band strong, .price { color: var(--mint); text-shadow: 0 0 30px rgba(117,244,189,.2); }
.logo-strip { color: rgba(190,213,222,.62); border-color: rgba(139,224,207,.13); }
.interactive-demo, .section { border-color: rgba(139,224,207,.12); }
.popular { background: linear-gradient(100deg, var(--neon), var(--cyan)); color: #03130f; }
.price-card.featured, .comparison-grid article.better {
  border-color: rgba(117,244,189,.42);
  background:
    radial-gradient(480px circle at 50% -5%, rgba(68,229,167,.15), transparent 55%),
    linear-gradient(145deg, rgba(15, 32, 43, .86), rgba(6, 13, 25, .72));
}
.cta-panel {
  background:
    radial-gradient(620px circle at 50% 0%, rgba(77,224,174,.18), transparent 60%),
    radial-gradient(420px circle at 90% 100%, rgba(91,107,255,.12), transparent 64%),
    rgba(8,15,28,.72);
}
.site-footer {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto 20px;
  padding: 50px 28px;
  border: 1px solid rgba(139,224,207,.13);
  border-radius: 24px;
  background: rgba(7,13,25,.68);
  box-shadow: var(--shadow-xl);
}

.hero:not(.home-hero), .pricing-hero {
  position: relative;
  max-width: 980px;
  padding: 70px 0 86px;
}
.hero:not(.home-hero)::after, .pricing-hero::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 35px;
  width: 120px;
  height: 1px;
  background: linear-gradient(90deg, var(--neon), var(--cyan), transparent);
}
.pricing-hero { text-align: left; margin: 0 0 58px; }
.pricing-hero h1, .pricing-hero .lede { margin-left: 0; }
.docs-content h1, .legal-page h1 { font-family: Inter, ui-sans-serif, system-ui, sans-serif; }
.docs-sidebar {
  padding: 18px;
  border: 1px solid rgba(139,224,207,.13);
  border-radius: 16px;
  background: rgba(8,15,28,.56);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
.docs-sidebar a { padding: 7px 9px; border-radius: 8px; }
.docs-sidebar a:hover { background: rgba(117,244,189,.08); }
.code-block { background: #02060d; }
.code-block code { color: #bdf8df; }

.auth-page {
  background:
    radial-gradient(780px 680px at 8% 48%, rgba(42,187,145,.14), transparent 65%),
    radial-gradient(700px 540px at 93% 18%, rgba(83,105,255,.13), transparent 64%),
    linear-gradient(135deg,#030611,#02050d 62%,#050914);
}
.auth-page .nav { position: relative; top: 14px; }
.auth-shell { min-height: calc(100vh - 92px); }
.auth-story h1 { letter-spacing: -.06em; }
.auth-card {
  border-color: rgba(141,229,211,.22);
  background:
    radial-gradient(360px circle at 100% 0%, rgba(86,216,255,.08), transparent 60%),
    linear-gradient(155deg,rgba(13,24,40,.92),rgba(5,11,22,.9));
  box-shadow: 0 42px 120px -48px rgba(0,0,0,.95), 0 0 80px -55px rgba(68,229,167,.36);
}
.auth-card input:not([type="checkbox"]) {
  height: 52px;
  border-color: rgba(144,214,205,.17);
  background: rgba(2,7,16,.68);
}
.auth-card input:focus {
  border-color: rgba(117,244,189,.7);
  box-shadow: 0 0 0 4px rgba(117,244,189,.09), 0 12px 38px -28px var(--glow);
}

.js-enhanced .reveal-ready {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1);
}
.js-enhanced .reveal-ready.is-revealed { opacity: 1; transform: none; }

@media (max-width: 960px) {
  .home-hero {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    min-height: 0;
    padding-top: 44px;
    text-align: center;
  }
  .home-hero > .eyebrow, .home-hero > h1, .home-hero > .lede,
  .home-hero > .actions, .home-hero > .hero-proof, .home-hero .hero-orb {
    grid-column: 1;
    grid-row: auto;
  }
  .home-hero > .eyebrow { justify-self: center; margin-bottom: 18px; text-align: center; }
  .home-hero > h1, .home-hero > .lede { margin-inline: auto; }
  .home-hero .hero-orb { grid-row: 3; width: min(620px,100%); margin: 38px auto; }
  .home-hero > .actions, .home-hero > .hero-proof { justify-content: center; }
}
@media (max-width: 820px) {
  .nav { top: 8px; width: calc(100% - 16px); padding: 9px 10px 9px 16px; }
  .nav .nav-links {
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    background: rgba(5,11,22,.97);
    border-color: rgba(139,224,207,.18);
    -webkit-backdrop-filter: blur(22px);
    backdrop-filter: blur(22px);
  }
  .auth-page .nav { top: 8px; }
}
@media (max-width: 620px) {
  main { width: min(100% - 28px, 1180px); padding-top: 76px; }
  .home-hero { padding-top: 28px; }
  .home-hero > h1 { font-size: clamp(42px, 13vw, 58px); }
  .home-hero .hero-orb { margin: 28px auto 34px; padding-inline: 8px; border-radius: 26px; }
  .home-hero .orb-stage { width: min(100%, 370px); }
  .site-footer { width: calc(100% - 28px); padding: 34px 24px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .js-enhanced .reveal-ready { opacity: 1; transform: none; transition: none; }
}

/* UI_UX_design reference fidelity
   Mirrors the supplied ARIA composition while retaining VoiceControl content,
   routes, accessibility, and the production assistant integration. */
:root {
  --bg: #020805;
  --surface: #07130d;
  --surface-soft: rgba(3, 14, 9, .78);
  --green: #22c55e;
  --neon: #39ff88;
  --mint: #7dff9b;
  --deep: #075b32;
  --text: #effff4;
  --muted: #a9c7b9;
  --border: rgba(57, 255, 136, .2);
  --border-2: rgba(57, 255, 136, .36);
  --glow: rgba(57, 255, 136, .48);
  --cyan: #39ff88;
  --violet: #075b32;
  --shadow-xl: 0 22px 70px -34px rgba(0, 0, 0, .94);
}
body {
  background:
    radial-gradient(ellipse 76% 54% at 50% 0%, rgba(7, 91, 50, .26), transparent 62%),
    radial-gradient(ellipse 62% 44% at var(--pointer-x) var(--pointer-y), rgba(57, 255, 136, .055), transparent 66%),
    #020805;
}
body::before {
  opacity: .22;
  background-image:
    radial-gradient(circle at 12% 18%, rgba(239,255,244,.82) 0 1px, transparent 1.4px),
    radial-gradient(circle at 76% 32%, rgba(57,255,136,.76) 0 1px, transparent 1.5px),
    radial-gradient(circle at 38% 76%, rgba(125,255,155,.62) 0 1px, transparent 1.5px);
  background-size: 193px 193px, 277px 277px, 351px 351px;
}
body::after {
  opacity: .14;
  background-image:
    linear-gradient(rgba(57,255,136,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(57,255,136,.055) 1px, transparent 1px),
    repeating-linear-gradient(to bottom, rgba(255,255,255,.02) 0 1px, transparent 1px 4px);
  background-size: 44px 44px, 44px 44px, 100% 4px;
  -webkit-mask-image: radial-gradient(ellipse 88% 68% at 50% 18%, #000 34%, transparent 100%);
  mask-image: radial-gradient(ellipse 88% 68% at 50% 18%, #000 34%, transparent 100%);
}
#cin-bg { opacity: .72; mix-blend-mode: screen; }

.scroll-progress-bar {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  width: 0;
  height: 2px;
  pointer-events: none;
  background: linear-gradient(90deg, var(--deep), var(--neon));
  box-shadow: 0 0 14px var(--glow);
}

.nav, .site-header {
  top: 12px;
  width: calc(100% - 24px);
  max-width: 1220px;
  min-height: 64px;
  padding: 10px 12px 10px 20px;
  border-color: rgba(57,255,136,.2);
  border-radius: 16px;
  background: rgba(3,14,9,.8);
  box-shadow: 0 10px 40px -20px rgba(0,0,0,.9), inset 0 1px rgba(255,255,255,.025);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
.nav::before {
  left: 20px;
  width: 72px;
  background: linear-gradient(90deg, var(--neon), transparent);
}
.brand {
  font-size: 16px;
  font-weight: 800;
  letter-spacing: .08em;
}
.brand span {
  background: none;
  color: var(--neon);
}
.nav-links { gap: 10px; }
.nav-links a {
  border-radius: 8px;
  color: var(--muted);
}
.nav-links a:not(.nav-cta)::after {
  content: "";
  position: absolute;
  right: 12px;
  bottom: 5px;
  left: 12px;
  height: 1px;
  background: var(--neon);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .2s ease;
}
.nav-links a:not(.nav-cta):hover,
.nav-links a:not(.nav-cta)[aria-current="page"] { background: transparent; color: var(--text); }
.nav-links a:not(.nav-cta):hover::after,
.nav-links a:not(.nav-cta)[aria-current="page"]::after { transform: scaleX(1); }
.nav-links .nav-cta {
  border-color: rgba(57,255,136,.45);
  background: rgba(57,255,136,.09);
  box-shadow: 0 0 25px -12px var(--glow);
}

main { width: min(1152px, calc(100% - 32px)); padding-top: 116px; }
.eyebrow, .auth-kicker {
  color: var(--neon);
  font-family: "Share Tech Mono", "Roboto Mono", ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: .28em;
}
.eyebrow::before, .auth-kicker::before { background: var(--neon); }
h1, h2, h3, .section-title-xl, .feature-row h2, .cta-panel h2, .auth-card h2 {
  color: var(--text);
}

.home-hero {
  display: flex;
  min-height: calc(100vh - 100px);
  padding: 76px 16px 110px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.home-hero > .eyebrow {
  order: 2;
  align-self: auto;
  margin: 0 0 18px;
  text-align: center;
}
.home-hero > h1 {
  order: 3;
  width: min(100%, 820px);
  max-width: 820px;
  margin: 0 auto;
  font-size: clamp(44px, 6.2vw, 72px);
  line-height: 1.04;
  letter-spacing: -.045em;
  text-align: center;
  text-shadow: 0 2px 20px rgba(0,0,0,.65), 0 0 34px rgba(57,255,136,.06);
}
.home-hero > h1 span {
  color: var(--neon);
  text-shadow: 0 0 8px var(--glow), 0 0 18px rgba(57,255,136,.22);
}
.home-hero > .lede {
  order: 4;
  width: min(100%, 690px);
  max-width: 690px;
  margin: 24px auto 0;
  color: var(--muted);
  font-size: clamp(16px, 1.6vw, 19px);
  text-align: center;
}
.home-hero .hero-orb {
  order: 1;
  width: min(100%, 620px);
  margin: 0 auto 42px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.home-hero .orb-stage { width: min(88vw, 340px); }
.home-hero .orb-stage::before {
  content: "";
  position: absolute;
  inset: -42%;
  z-index: -1;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle, transparent 0 22%, rgba(2,8,5,.44) 36%, rgba(57,255,136,.14) 57%, rgba(57,255,136,.035) 74%, transparent 90%);
}
.home-hero .orb-transcript {
  max-width: 460px;
  border-color: rgba(57,255,136,.2);
  background: rgba(3,14,9,.76);
  font-family: "Share Tech Mono", "Roboto Mono", ui-monospace, monospace;
  font-size: 13px;
}
.home-hero > .actions {
  order: 5;
  justify-content: center;
  margin: 30px 0 20px;
}
.home-hero > .hero-proof {
  order: 6;
  justify-content: center;
  margin: 0;
  color: #82a393;
}

.button, .auth-submit, .primary-link, .upgrade-button {
  min-height: 46px;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--neon), var(--deep));
  color: #02150d;
  box-shadow: 0 0 25px -6px rgba(57,255,136,.7);
}
.button:hover, .auth-submit:hover, .primary-link:hover {
  filter: brightness(1.08);
  box-shadow: 0 0 35px -4px rgba(57,255,136,.9);
}
.button.secondary {
  border-color: rgba(57,255,136,.4);
  border-radius: 8px;
  background: rgba(3,14,9,.64);
}
.button.secondary:hover {
  border-color: rgba(57,255,136,.8);
  background: rgba(57,255,136,.08);
}

.security-note, .card, .benefit-card, .workflow-card, .price-card, .product-ui,
.comparison-grid article, .preview-window, .testimonial-grid blockquote, .cta-panel,
.code-block, .faq-list details, .docs-sidebar, .auth-card {
  border-color: rgba(57,255,136,.2);
  background: rgba(3,14,9,.78);
  box-shadow: 0 10px 40px -20px rgba(0,0,0,.86), inset 0 1px rgba(255,255,255,.025);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
.card::after, .benefit-card::after, .price-card::after, .product-ui::after {
  content: "";
  position: absolute;
  right: -1px;
  bottom: -1px;
  width: 14px;
  height: 14px;
  border-right: 2px solid var(--neon);
  border-bottom: 2px solid var(--neon);
  opacity: .6;
}
.card:hover, .benefit-card:hover, .price-card:hover, .product-ui:hover {
  border-color: rgba(57,255,136,.5);
  box-shadow: 0 0 30px -8px rgba(57,255,136,.4);
}
.card::before, .benefit-card::before, .price-card::before,
.product-ui::before, .comparison-grid article::before {
  background: radial-gradient(420px circle at var(--card-x, 50%) var(--card-y, 0%), rgba(57,255,136,.1), transparent 55%);
}
.metrics-band, .logo-strip { border-color: rgba(57,255,136,.15); background: rgba(3,14,9,.72); }
.metrics-band strong, .price { color: var(--mint); }
.price-card.featured, .comparison-grid article.better {
  border-color: rgba(57,255,136,.48);
  background: radial-gradient(480px circle at 50% -5%, rgba(57,255,136,.13), transparent 55%), rgba(3,18,11,.9);
}
.popular { background: var(--neon); }
.cta-panel {
  background: radial-gradient(620px circle at 50% 0%, rgba(57,255,136,.14), transparent 60%), rgba(3,18,11,.88);
}
.site-footer {
  border-color: rgba(57,255,136,.12);
  background: rgba(3,14,9,.72);
}
.auth-page {
  background: radial-gradient(ellipse 78% 64% at 50% 0%, rgba(7,91,50,.24), transparent 64%), #020805;
}
.auth-card {
  background: radial-gradient(400px circle at 100% 0%, rgba(57,255,136,.07), transparent 60%), rgba(3,18,11,.9);
}
.auth-card input:not([type="checkbox"]) {
  border-color: rgba(57,255,136,.18);
  background: rgba(2,8,5,.72);
}
.auth-card input:focus { border-color: rgba(57,255,136,.7); box-shadow: 0 0 0 4px rgba(57,255,136,.09); }

@media (max-width: 820px) {
  .nav { top: 8px; width: calc(100% - 16px); }
  .nav .nav-links { background: rgba(3,14,9,.98); }
  .home-hero { padding-top: 54px; }
}
@media (max-width: 620px) {
  .home-hero { padding: 42px 0 84px; }
  .home-hero > h1 { font-size: clamp(40px, 12.5vw, 56px); }
  .home-hero .hero-orb { margin: 0 auto 34px; padding: 0; border-radius: 0; }
  .home-hero .orb-stage { width: min(84vw, 340px); }
  .home-hero > .actions { width: min(100%, 380px); }
  .home-hero > .actions .button { flex: 1 1 160px; }
}

/* VoiceControl production landing page — supplied SaaS design specification */
:root {
  --bg: #020906;
  --surface: #06110c;
  --surface-card: rgba(7, 24, 16, .72);
  --neon: #21f58b;
  --green: #00c96b;
  --mint: #8dffc5;
  --deep: #087545;
  --text: #f3fff7;
  --muted: #a7bdb1;
  --muted-2: #74877c;
  --border: rgba(33, 245, 139, .22);
  --border-2: rgba(33, 245, 139, .5);
  --glow: rgba(33, 245, 139, .34);
}
.skip-link {
  position: fixed;
  z-index: 200;
  top: 10px;
  left: 12px;
  padding: 10px 14px;
  border-radius: 8px;
  background: var(--neon);
  color: #02140c;
  font-weight: 800;
  transform: translateY(-150%);
  transition: transform .16s ease;
}
.skip-link:focus { transform: translateY(0); }
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
:where(a, button, input, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--neon);
  outline-offset: 3px;
}
body {
  background:
    radial-gradient(ellipse 74% 48% at 72% 2%, rgba(0, 201, 107, .13), transparent 62%),
    radial-gradient(ellipse 64% 44% at 8% 38%, rgba(33, 245, 139, .065), transparent 66%),
    #020906;
}

.nav {
  max-width: 1240px;
  transition: min-height .22s ease, padding .22s ease, background .22s ease, box-shadow .22s ease;
}
.nav.is-scrolled {
  min-height: 56px;
  padding-block: 6px;
  background: rgba(2, 13, 8, .92);
  box-shadow: 0 16px 48px -28px rgba(0,0,0,.94);
}
.brand-wave { display: inline-flex; align-items: center; gap: 9px; }
.brand-wave svg { width: 26px; height: 22px; fill: none; stroke: var(--neon); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 7px rgba(33,245,139,.32)); }
.brand-wave .brand-name { color: var(--text); }
.brand-wave .brand-name b { color: var(--neon); }
.nav-resources { position: relative; }
.nav-resources summary {
  min-height: 40px;
  padding: 11px 12px;
  color: var(--muted);
  font-size: 13px;
  list-style: none;
  cursor: pointer;
}
.nav-resources summary::-webkit-details-marker { display: none; }
.nav-resources summary::after { content: "⌄"; margin-left: 6px; color: var(--neon); }
.nav-resources[open] summary, .nav-resources summary:hover { color: var(--text); }
.nav-resources > div {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  display: grid;
  width: 180px;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(3, 18, 11, .98);
  box-shadow: 0 24px 60px -30px #000;
}
.nav-resources > div a { padding: 9px 10px; }

main { width: min(1240px, calc(100% - 40px)); }
.home-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(390px, .95fr);
  gap: clamp(42px, 7vw, 92px);
  min-height: min(760px, calc(100vh - 94px));
  padding: 68px 0 96px;
  align-items: center;
  text-align: left;
}
.hero-copy { grid-column: 1; min-width: 0; }
.hero-copy .eyebrow { margin: 0 0 20px; }
.hero-copy h1 {
  max-width: 720px;
  margin: 0;
  color: var(--text);
  font-size: clamp(50px, 6vw, 78px);
  line-height: .99;
  letter-spacing: -.06em;
  text-wrap: balance;
  text-shadow: 0 2px 22px rgba(0,0,0,.6);
}
.hero-copy h1 span {
  color: var(--neon);
  background: linear-gradient(105deg, #78ffba, var(--neon) 52%, #00b960);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: none;
  filter: drop-shadow(0 0 18px rgba(33,245,139,.16));
}
.hero-copy .lede { max-width: 640px; margin: 25px 0 0; font-size: clamp(17px, 1.7vw, 20px); }
.hero-copy .actions { justify-content: flex-start; margin: 31px 0 20px; }
.hero-copy .hero-proof { justify-content: flex-start; margin: 0; color: var(--muted-2); }
.home-hero > .hero-orb {
  grid-column: 2;
  order: initial;
  width: min(100%, 520px);
  margin: 0 auto;
  padding: 12px 0 0;
}
.home-hero .orb-stage { width: min(38vw, 410px); max-width: 100%; }
.home-hero .orb-transcript {
  min-height: 48px;
  max-width: 440px;
  margin-top: 12px;
  border-color: var(--border);
  background: rgba(3, 18, 11, .68);
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 13px;
}
.orb-controls { display: flex; justify-content: center; align-items: center; gap: 10px; margin-top: 12px; }
.orb-controls .voice-actor-tag, .orb-controls .orb-link { margin: 0; }
.hero-waveform { display: flex; height: 20px; margin: 8px auto 0; align-items: center; justify-content: center; gap: 3px; }
.hero-waveform i { width: 2px; height: 4px; border-radius: 2px; background: var(--neon); opacity: .45; }
.hero-orb[data-state="listening"] .hero-waveform i,
.hero-orb[data-state="speaking"] .hero-waveform i { animation: vc-wave .72s ease-in-out infinite alternate; opacity: .9; }
.hero-waveform i:nth-child(2), .hero-waveform i:nth-child(6) { animation-delay: -.18s !important; }
.hero-waveform i:nth-child(3), .hero-waveform i:nth-child(5) { animation-delay: -.36s !important; }
.hero-waveform i:nth-child(4) { animation-delay: -.54s !important; }
@keyframes vc-wave { from { height: 4px; } to { height: 18px; } }

.trust-strip {
  display: flex;
  margin: 0;
  padding: 18px 24px;
  align-items: center;
  gap: clamp(24px, 4vw, 58px);
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: rgba(7,24,16,.54);
  scrollbar-width: thin;
  white-space: nowrap;
}
.trust-strip strong { color: var(--text); font-size: 12px; }
.trust-strip span { color: var(--muted-2); }

.benefits-section, .comparison-section, .dashboard-preview, .outcomes-section,
.use-cases-section, .pricing-preview, .faq-section { padding: clamp(84px, 9vw, 126px) 0; }
.section-heading { margin-bottom: clamp(38px, 5vw, 58px); }
.section-title-xl { letter-spacing: -.045em; }
.benefit-grid-six { grid-template-columns: repeat(3, 1fr); gap: 16px; }
.benefit-grid-six .benefit-card { min-height: 220px; }
.benefit-card {
  border-radius: 18px;
  background: var(--surface-card);
}
.benefit-card h3 { margin-top: 26px; }
.benefit-card > span {
  position: relative;
  isolation: isolate;
  width: 58px;
  height: 58px;
  border-color: rgba(92,255,171,.5);
  border-radius: 17px;
  background:
    radial-gradient(circle at 50% 42%, rgba(105,255,180,.18), transparent 58%),
    linear-gradient(145deg, rgba(39,151,101,.22), rgba(4,38,23,.82));
  overflow: visible;
  box-shadow:
    inset 0 1px rgba(220,255,235,.1),
    inset 0 -10px 24px rgba(0,20,11,.3),
    0 0 0 1px rgba(33,245,139,.035),
    0 0 32px -10px rgba(33,245,139,.65);
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
}
.benefit-card > span::before {
  content: "";
  position: absolute;
  inset: 5px;
  z-index: 1;
  border: 1px solid rgba(154,255,204,.09);
  border-radius: 12px;
  pointer-events: none;
}
.benefit-card > span::after {
  content: "";
  position: absolute;
  inset: 12%;
  z-index: 0;
  border-radius: 50%;
  background: rgba(33,245,139,.32);
  filter: blur(15px);
}
.benefit-card > span svg {
  position: relative;
  z-index: 2;
  width: 30px;
  height: 30px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 7px rgba(33,245,139,.58));
  transition: transform .2s ease, filter .2s ease;
}
.benefit-card:hover > span {
  transform: translateY(-2px);
  border-color: rgba(115,255,185,.72);
  background:
    radial-gradient(circle at 50% 42%, rgba(105,255,180,.25), transparent 60%),
    linear-gradient(145deg, rgba(39,151,101,.3), rgba(4,38,23,.86));
  box-shadow:
    inset 0 1px rgba(230,255,240,.14),
    inset 0 -10px 24px rgba(0,20,11,.26),
    0 0 0 1px rgba(33,245,139,.06),
    0 0 40px -8px rgba(33,245,139,.76);
}
.benefit-card:hover > span svg {
  transform: scale(1.1);
  filter: drop-shadow(0 0 10px rgba(33,245,139,.78));
}

.demo-experience {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(350px, .95fr);
  gap: clamp(46px, 7vw, 94px);
  padding: clamp(84px, 9vw, 126px) 0;
  align-items: center;
}
.demo-experience::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 10% -12% 4%;
  pointer-events: none;
  background:
    radial-gradient(circle at 24% 48%, rgba(33,245,139,.09), transparent 32%),
    radial-gradient(circle at 78% 42%, rgba(33,245,139,.045), transparent 26%);
  filter: blur(20px);
}
.assistant-demo {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(58,255,147,.38);
  border-radius: 26px;
  background:
    radial-gradient(circle at 18% 0, rgba(33,245,139,.055), transparent 32%),
    rgba(3, 17, 10, .94);
  box-shadow:
    inset 0 1px rgba(222,255,237,.045),
    0 34px 100px -48px #000,
    0 0 70px -46px rgba(33,245,139,.55);
}
.assistant-demo::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  box-shadow: inset 0 0 80px rgba(0,0,0,.14);
}
.demo-browser-bar { display: flex; min-height: 62px; padding: 0 20px; align-items: center; gap: 13px; border-bottom: 1px solid rgba(33,245,139,.16); background: linear-gradient(180deg, rgba(25,74,47,.14), rgba(1,13,7,.18)); font-size: 12px; }
.demo-browser-dots { display: flex; gap: 5px; }
.demo-browser-dots i { width: 7px; height: 7px; border-radius: 50%; background: rgba(167,189,177,.26); box-shadow: inset 0 1px rgba(255,255,255,.08); }
.demo-browser-bar strong { display: inline-flex; align-items: center; gap: 8px; color: var(--text); font-size: 12px; }
.demo-browser-bar strong > i { width: 7px; height: 7px; border-radius: 50%; background: var(--neon); box-shadow: 0 0 0 4px rgba(33,245,139,.08), 0 0 12px rgba(33,245,139,.72); animation: presence-pulse 2.2s ease-in-out infinite; }
.demo-secure { display: inline-flex; margin-left: auto; padding: 7px 10px; align-items: center; gap: 6px; border: 1px solid rgba(33,245,139,.13); border-radius: 999px; background: rgba(33,245,139,.035); color: #91a79b; font: 700 8.5px/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; }
.demo-secure svg { width: 13px; height: 13px; fill: none; stroke: var(--neon); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.demo-conversation { display: flex; min-height: 440px; max-height: 490px; padding: 30px 27px; flex-direction: column; gap: 16px; overflow-y: auto; background: linear-gradient(rgba(33,245,139,.018) 1px, transparent 1px), linear-gradient(90deg, rgba(33,245,139,.014) 1px, transparent 1px); background-size: 32px 32px; }
.demo-message { position: relative; width: fit-content; max-width: 78%; padding: 13px 16px; border: 1px solid var(--border); border-radius: 16px; color: var(--text); font-size: 13px; line-height: 1.55; box-shadow: 0 16px 32px -28px #000; }
.demo-message span { display: block; margin-bottom: 5px; color: var(--neon); font: 750 9px/1.3 var(--mono); letter-spacing: .1em; text-transform: uppercase; }
.user-message { align-self: flex-end; border-color: rgba(190,220,203,.16); border-bottom-right-radius: 5px; background: linear-gradient(145deg, rgba(180,213,195,.09), rgba(109,151,128,.045)); }
.assistant-message { align-self: flex-start; border-bottom-left-radius: 5px; border-color: rgba(33,245,139,.25); background: linear-gradient(145deg, rgba(33,245,139,.09), rgba(7,47,26,.24)); box-shadow: 0 18px 38px -30px rgba(33,245,139,.5); }
.confirmation-message { padding-left: 18px; border-color: rgba(246,173,85,.38); background: linear-gradient(145deg, rgba(246,173,85,.09), rgba(56,37,13,.2)); }
.confirmation-message::before { content: ""; position: absolute; top: 13px; bottom: 13px; left: 7px; width: 2px; border-radius: 2px; background: #ffc37a; box-shadow: 0 0 9px rgba(255,195,122,.35); }
.confirmation-message span { color: #ffc37a; }
.demo-composer { display: grid; grid-template-columns: 50px 1fr auto; gap: 10px; padding: 14px; border-top: 1px solid rgba(33,245,139,.18); background: linear-gradient(180deg, rgba(4,27,15,.86), rgba(2,12,7,.94)); }
.demo-mini-orb { position: relative; width: 48px; height: 48px; border: 1px solid rgba(33,245,139,.36); border-radius: 50%; background: radial-gradient(circle, rgba(33,245,139,.09), transparent 68%); box-shadow: 0 0 26px -12px rgba(33,245,139,.72); }
.demo-mini-orb canvas, .demo-mini-orb button { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; border-radius: 50%; background: transparent; }
.demo-mini-orb button { cursor: pointer; }
.demo-composer input { min-width: 0; min-height: 48px; padding: 0 16px; border: 1px solid rgba(33,245,139,.2); border-radius: 13px; outline: 0; background: rgba(1,12,7,.84); color: var(--text); transition: border-color .18s ease, box-shadow .18s ease, background .18s ease; }
.demo-composer input:focus { border-color: rgba(33,245,139,.58); background: rgba(3,20,11,.96); box-shadow: 0 0 0 3px rgba(33,245,139,.085); }
.demo-composer input::placeholder { color: var(--muted-2); }
.demo-composer > button { display: inline-flex; min-height: 48px; padding: 0 17px; align-items: center; gap: 8px; border: 1px solid #42ff9a; border-radius: 13px; background: linear-gradient(145deg, #54ffa6, #19e879); color: #02140c; font-weight: 850; cursor: pointer; box-shadow: 0 12px 30px -18px rgba(33,245,139,.9), inset 0 1px rgba(255,255,255,.35); transition: transform .18s ease, box-shadow .18s ease, filter .18s ease; }
.demo-composer > button svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.demo-composer > button:hover { transform: translateY(-1px); filter: brightness(1.06); box-shadow: 0 16px 34px -17px rgba(33,245,139,1), inset 0 1px rgba(255,255,255,.4); }
.demo-copy { position: relative; padding: clamp(10px, 2vw, 28px) 0; }
.demo-copy .eyebrow { width: fit-content; padding: 7px 11px; border: 1px solid rgba(33,245,139,.24); border-radius: 999px; background: rgba(33,245,139,.035); letter-spacing: .18em; }
.demo-copy .section-title-xl { max-width: 560px; margin-top: 18px; font-size: clamp(42px, 4.8vw, 62px); line-height: 1.02; }
.demo-copy .section-lede { max-width: 550px; color: #a7bbb0; line-height: 1.65; }
.demo-copy .prompt-chips { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; margin: 28px 0 24px; }
.demo-copy .prompt-chips button { display: flex; min-height: 44px; padding: 10px 13px; align-items: center; justify-content: space-between; gap: 10px; border-color: rgba(33,245,139,.2); border-radius: 12px; background: rgba(3,24,14,.66); color: #d8eee1; text-align: left; transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease; }
.demo-copy .prompt-chips button::after { content: "↗"; flex: 0 0 auto; color: var(--neon); font-size: 14px; opacity: .66; transition: transform .18s ease, opacity .18s ease; }
.demo-copy .prompt-chips button:hover { transform: translateY(-2px); border-color: rgba(33,245,139,.45); background: rgba(33,245,139,.075); box-shadow: 0 18px 34px -28px rgba(33,245,139,.68); }
.demo-copy .prompt-chips button:hover::after { transform: translate(2px,-2px); opacity: 1; }
.demo-copy .privacy-copy { display: flex; align-items: center; gap: 8px; color: #81978b; font-size: 11px; line-height: 1.5; }
.demo-copy .privacy-copy svg { width: 15px; height: 15px; flex: 0 0 15px; fill: none; stroke: #65d89b; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

.comparison-section {
  position: relative;
  isolation: isolate;
}
.comparison-section::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 22% -8% 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 27% 54%, rgba(246,173,85,.035), transparent 25%),
    radial-gradient(circle at 73% 54%, rgba(33,245,139,.075), transparent 28%);
  filter: blur(24px);
}
.comparison-section .section-heading {
  max-width: 850px;
}
.comparison-section .section-heading .eyebrow {
  width: fit-content;
  margin-inline: auto;
  padding: 7px 11px;
  border: 1px solid rgba(33,245,139,.24);
  border-radius: 999px;
  background: rgba(33,245,139,.035);
  letter-spacing: .18em;
}
.comparison-grid {
  position: relative;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 24px;
  max-width: 1040px;
}
.comparison-grid .comparison-card {
  position: relative;
  min-height: 390px;
  padding: 28px;
  overflow: hidden;
  border-radius: 25px;
  background:
    radial-gradient(circle at 0 0, rgba(255,255,255,.025), transparent 34%),
    linear-gradient(150deg, rgba(8,29,18,.9), rgba(2,15,9,.88));
  box-shadow: inset 0 1px rgba(255,255,255,.035), 0 30px 70px -48px #000;
}
.comparison-grid .comparison-card::after {
  content: "";
  position: absolute;
  right: -70px;
  bottom: -80px;
  width: 190px;
  height: 190px;
  pointer-events: none;
  border: 1px solid rgba(255,255,255,.025);
  border-radius: 50%;
  box-shadow: 0 0 0 28px rgba(255,255,255,.012), 0 0 0 58px rgba(255,255,255,.008);
}
.comparison-grid .legacy {
  border-color: rgba(246,173,85,.2);
}
.comparison-grid .better {
  border-color: rgba(33,245,139,.48);
  background:
    radial-gradient(circle at 0 0, rgba(33,245,139,.095), transparent 36%),
    linear-gradient(150deg, rgba(7,49,27,.68), rgba(2,18,10,.94));
  box-shadow:
    inset 0 1px rgba(222,255,237,.05),
    0 34px 80px -46px #000,
    0 0 64px -48px rgba(33,245,139,.68);
}
.comparison-card-head {
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 15px;
  padding-bottom: 22px;
  align-items: center;
  border-bottom: 1px solid rgba(255,255,255,.065);
}
.comparison-card-icon {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border: 1px solid rgba(246,173,85,.3);
  border-radius: 17px;
  background:
    radial-gradient(circle, rgba(246,173,85,.12), transparent 60%),
    rgba(49,30,10,.35);
  color: #f3b967;
  box-shadow: inset 0 1px rgba(255,255,255,.05), 0 0 28px -14px rgba(246,173,85,.6);
}
.better .comparison-card-icon {
  border-color: rgba(92,255,171,.5);
  background:
    radial-gradient(circle, rgba(105,255,180,.18), transparent 60%),
    rgba(5,50,27,.58);
  color: var(--neon);
  box-shadow: inset 0 1px rgba(220,255,235,.08), 0 0 30px -12px rgba(33,245,139,.74);
}
.comparison-card-icon svg {
  width: 29px;
  height: 29px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 6px currentColor);
}
.comparison-card-head small {
  display: block;
  margin-bottom: 6px;
  color: #8ea297;
  font: 750 8.5px/1 var(--mono);
  letter-spacing: .13em;
  text-transform: uppercase;
}
.comparison-card-head h3 {
  margin: 0;
  color: var(--text);
  font-size: 21px;
  line-height: 1.2;
}
.comparison-grid ul {
  gap: 12px;
  margin-top: 24px;
}
.comparison-grid li {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 10px;
  align-items: start;
  color: #a9bbb1;
  font-size: 14px;
  line-height: 1.5;
}
.comparison-grid li::before {
  display: grid;
  width: 22px;
  height: 22px;
  margin: 0;
  place-items: center;
  border: 1px solid rgba(246,173,85,.26);
  border-radius: 7px;
  background: rgba(246,173,85,.055);
  color: #f1b65e;
  font: 750 11px/1 system-ui;
}
.comparison-grid .better li::before {
  border-color: rgba(33,245,139,.32);
  background: rgba(33,245,139,.075);
  color: var(--neon);
  box-shadow: 0 0 18px -10px rgba(33,245,139,.7);
}
.comparison-vs {
  position: absolute;
  z-index: 4;
  top: 50%;
  left: 50%;
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid rgba(33,245,139,.32);
  border-radius: 50%;
  background: #03130b;
  color: var(--neon);
  font: 800 10px/1 var(--mono);
  letter-spacing: .08em;
  box-shadow: 0 0 0 7px rgba(2,8,5,.9), 0 0 28px -9px rgba(33,245,139,.72);
  transform: translate(-50%,-50%);
}
@media (max-width: 760px) {
  .comparison-grid { grid-template-columns: 1fr; gap: 34px; }
  .comparison-vs { top: 50%; }
  .comparison-grid .comparison-card { min-height: 0; }
}
@media (max-width: 520px) {
  .comparison-grid .comparison-card { padding: 21px; border-radius: 20px; }
  .comparison-card-head { grid-template-columns: 52px 1fr; gap: 12px; }
  .comparison-card-icon { width: 52px; height: 52px; border-radius: 15px; }
  .comparison-card-head h3 { font-size: 18px; }
}
.how-section {
  position: relative;
  isolation: isolate;
  grid-template-columns: minmax(0,.92fr) minmax(470px,1.08fr);
  gap: clamp(54px,7vw,96px);
  border-block: 1px solid rgba(33,245,139,.16);
}
.how-section::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 8% -10%;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 48%, rgba(33,245,139,.07), transparent 27%),
    radial-gradient(circle at 82% 52%, rgba(33,245,139,.055), transparent 30%);
  filter: blur(24px);
}
.how-copy .eyebrow {
  width: fit-content;
  padding: 7px 11px;
  border: 1px solid rgba(33,245,139,.24);
  border-radius: 999px;
  background: rgba(33,245,139,.035);
  letter-spacing: .18em;
}
.how-copy .section-title-xl {
  max-width: 610px;
  margin-top: 18px;
  font-size: clamp(42px,4.8vw,62px);
  line-height: 1.02;
}
.how-copy .section-lede {
  max-width: 590px;
  color: #a7bbb0;
  line-height: 1.68;
}
.framework-badges { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 30px; }
.framework-badges span {
  display: inline-flex;
  min-height: 38px;
  padding: 8px 11px;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(33,245,139,.18);
  border-radius: 11px;
  background: rgba(3,24,14,.62);
  color: #b3c7bc;
  font: 650 11px/1 var(--mono);
  box-shadow: inset 0 1px rgba(255,255,255,.025);
  transition: color .18s ease, border-color .18s ease, background .18s ease, transform .18s ease;
}
.framework-badges span:hover {
  transform: translateY(-2px);
  border-color: rgba(33,245,139,.4);
  background: rgba(33,245,139,.065);
  color: var(--text);
}
.framework-badges svg {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  fill: none;
  stroke: #5ef2a4;
  stroke-width: 1.45;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 5px rgba(33,245,139,.32));
}
.workflow-card {
  position: relative;
  display: grid;
  gap: 12px;
  padding: 18px;
  overflow: hidden;
  border-color: rgba(33,245,139,.3);
  border-radius: 26px;
  background:
    radial-gradient(circle at 0 0, rgba(33,245,139,.075), transparent 35%),
    linear-gradient(145deg, rgba(5,31,18,.92), rgba(2,14,8,.9));
  box-shadow:
    inset 0 1px rgba(230,255,240,.045),
    0 34px 90px -50px #000,
    0 0 64px -48px rgba(33,245,139,.62);
}
.workflow-card::before {
  content: "";
  position: absolute;
  top: 83px;
  bottom: 44px;
  left: 50px;
  width: 1px;
  pointer-events: none;
  background: linear-gradient(transparent, rgba(33,245,139,.42) 14%, rgba(33,245,139,.24) 86%, transparent);
  box-shadow: 0 0 9px rgba(33,245,139,.24);
}
.workflow-card-head {
  display: flex;
  min-height: 38px;
  padding: 0 6px 7px;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(33,245,139,.1);
}
.workflow-card-head span {
  color: var(--neon);
  font: 750 9px/1 var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
}
.workflow-card-head strong {
  color: #84998e;
  font: 650 9px/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.workflow-step {
  position: relative;
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 16px;
  min-height: 112px;
  padding: 17px 18px 17px 12px;
  align-items: center;
  border: 1px solid rgba(33,245,139,.1);
  border-radius: 17px;
  background: linear-gradient(145deg, rgba(12,45,27,.36), rgba(2,17,10,.5));
  transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.workflow-step:last-child { border: 1px solid rgba(33,245,139,.1); }
.workflow-step:hover {
  transform: translateX(4px);
  border-color: rgba(33,245,139,.28);
  background: linear-gradient(145deg, rgba(18,61,36,.44), rgba(3,22,12,.58));
  box-shadow: 0 18px 38px -32px rgba(33,245,139,.6);
}
.workflow-marker {
  position: relative;
  z-index: 1;
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border: 1px solid rgba(92,255,171,.42);
  border-radius: 17px;
  background:
    radial-gradient(circle at 50% 42%, rgba(105,255,180,.16), transparent 58%),
    linear-gradient(145deg, rgba(39,151,101,.2), rgba(4,38,23,.9));
  color: var(--neon);
  box-shadow: inset 0 1px rgba(220,255,235,.08), 0 0 28px -13px rgba(33,245,139,.72);
}
.workflow-marker b {
  position: absolute;
  top: 5px;
  left: 7px;
  color: #8effbd;
  font: 750 7px/1 var(--mono);
  letter-spacing: .04em;
}
.workflow-marker svg {
  width: 27px;
  height: 27px;
  margin-top: 6px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 6px rgba(33,245,139,.48));
}
.workflow-step > div strong {
  margin-bottom: 7px;
  color: var(--text);
  font-size: 18px;
  letter-spacing: -.01em;
}
.workflow-step > div small {
  max-width: 440px;
  color: #9db1a6;
  font-size: 12.5px;
  line-height: 1.58;
}
@media (max-width: 820px) {
  .how-section { grid-template-columns: 1fr; }
  .workflow-card { width: 100%; }
}
@media (max-width: 520px) {
  .workflow-card { padding: 12px; border-radius: 20px; }
  .workflow-card::before { left: 41px; }
  .workflow-step { grid-template-columns: 56px 1fr; min-height: 108px; padding: 14px 12px 14px 8px; }
  .workflow-marker { width: 52px; height: 52px; border-radius: 15px; }
  .workflow-marker svg { width: 23px; height: 23px; }
}

.use-cases-section {
  position: relative;
  isolation: isolate;
}
.use-cases-section::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 20% -10% 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 52%, rgba(33,245,139,.055), transparent 25%),
    radial-gradient(circle at 76% 56%, rgba(33,245,139,.075), transparent 31%);
  filter: blur(24px);
}
.use-cases-section .section-heading { max-width: 860px; }
.use-cases-section .section-heading .eyebrow {
  width: fit-content;
  margin-inline: auto;
  padding: 7px 11px;
  border: 1px solid rgba(33,245,139,.24);
  border-radius: 999px;
  background: rgba(33,245,139,.035);
  letter-spacing: .18em;
}
.use-case-layout {
  display: grid;
  grid-template-columns: 310px minmax(0,1fr);
  gap: 24px;
  max-width: 1100px;
  margin: 0 auto;
  align-items: stretch;
}
.use-case-tabs {
  display: grid;
  gap: 8px;
  padding: 10px;
  align-content: start;
  border: 1px solid rgba(33,245,139,.14);
  border-radius: 22px;
  background: linear-gradient(150deg, rgba(5,28,17,.72), rgba(2,14,8,.72));
  box-shadow: inset 0 1px rgba(255,255,255,.025);
}
.use-case-tabs button {
  display: grid;
  grid-template-columns: 42px minmax(0,1fr) 20px;
  gap: 11px;
  min-height: 60px;
  padding: 7px 10px;
  align-items: center;
  border: 1px solid transparent;
  border-radius: 14px;
  background: transparent;
  color: #9eb2a7;
  font-size: 12.5px;
  font-weight: 650;
  text-align: left;
  cursor: pointer;
  transition: color .18s ease, border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
}
.use-case-tab-icon {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid rgba(33,245,139,.12);
  border-radius: 12px;
  background: rgba(3,27,15,.55);
  color: #76c99c;
  transition: color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.use-case-tab-icon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.use-case-tabs button > i {
  color: var(--neon);
  font-style: normal;
  font-size: 16px;
  opacity: 0;
  transform: translateX(-5px);
  transition: opacity .18s ease, transform .18s ease;
}
.use-case-tabs button:hover {
  border-color: rgba(33,245,139,.13);
  background: rgba(33,245,139,.035);
  color: var(--text);
  transform: translateX(2px);
}
.use-case-tabs button[aria-selected="true"] {
  border-color: rgba(33,245,139,.42);
  background:
    radial-gradient(circle at 10% 50%, rgba(33,245,139,.12), transparent 36%),
    linear-gradient(145deg, rgba(33,245,139,.1), rgba(4,45,25,.22));
  color: var(--text);
  box-shadow: inset 3px 0 var(--neon), 0 16px 34px -27px rgba(33,245,139,.75);
}
.use-case-tabs button[aria-selected="true"] .use-case-tab-icon {
  border-color: rgba(92,255,171,.48);
  background: rgba(10,74,40,.5);
  color: var(--neon);
  box-shadow: 0 0 24px -11px rgba(33,245,139,.8);
}
.use-case-tabs button[aria-selected="true"] > i {
  opacity: 1;
  transform: translateX(0);
}
.use-case-panel {
  position: relative;
  min-height: 450px;
  padding: clamp(30px,4vw,44px);
  overflow: hidden;
  border: 1px solid rgba(33,245,139,.32);
  border-radius: 25px;
  outline: none;
  background:
    radial-gradient(circle at 100% 0, rgba(33,245,139,.075), transparent 32%),
    linear-gradient(150deg, rgba(7,39,23,.76), rgba(2,16,9,.94));
  box-shadow:
    inset 0 1px rgba(222,255,237,.04),
    0 34px 80px -48px #000,
    0 0 64px -50px rgba(33,245,139,.65);
}
.use-case-panel::after {
  content: "";
  position: absolute;
  right: -95px;
  top: -100px;
  width: 270px;
  height: 270px;
  pointer-events: none;
  border: 1px solid rgba(33,245,139,.045);
  border-radius: 50%;
  box-shadow: 0 0 0 35px rgba(33,245,139,.016), 0 0 0 70px rgba(33,245,139,.009);
}
.use-case-panel:focus-visible {
  border-color: rgba(33,245,139,.68);
  box-shadow: 0 0 0 3px rgba(33,245,139,.1), 0 34px 80px -48px #000;
}
.use-case-panel-head {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.use-case-panel-head .eyebrow {
  margin: 0;
  padding: 7px 10px;
  border: 1px solid rgba(33,245,139,.2);
  border-radius: 999px;
  background: rgba(33,245,139,.035);
  letter-spacing: .14em;
}
.use-case-panel-head > span {
  display: inline-flex;
  padding: 7px 10px;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(33,245,139,.12);
  border-radius: 999px;
  color: #8da298;
  font: 700 8px/1 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.use-case-panel-head > span i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--neon);
  box-shadow: 0 0 9px rgba(33,245,139,.72);
}
.use-case-panel h3 {
  position: relative;
  z-index: 1;
  max-width: 720px;
  margin: 25px 0 34px;
  font-size: clamp(32px,4vw,48px);
  line-height: 1.08;
  letter-spacing: -.035em;
}
.use-case-panel dl {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 12px;
}
.use-case-panel dl div {
  min-height: 148px;
  padding: 17px;
  border: 1px solid rgba(33,245,139,.14);
  border-radius: 15px;
  background: linear-gradient(145deg, rgba(4,31,18,.72), rgba(1,13,7,.55));
  box-shadow: inset 0 1px rgba(255,255,255,.02);
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.use-case-panel dl div:hover {
  transform: translateY(-3px);
  border-color: rgba(33,245,139,.34);
  background: linear-gradient(145deg, rgba(8,50,28,.76), rgba(1,17,9,.62));
}
.use-case-panel dt {
  display: flex;
  margin-bottom: 12px;
  align-items: center;
  gap: 8px;
  color: var(--neon);
  font: 750 8.5px/1.3 var(--mono);
  letter-spacing: .085em;
  text-transform: uppercase;
}
.use-case-panel dt svg {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 5px rgba(33,245,139,.35));
}
.use-case-panel dd {
  margin: 0;
  color: #a4b7ad;
  font-size: 13px;
  line-height: 1.58;
}

.dashboard-preview {
  position: relative;
  isolation: isolate;
}
.dashboard-preview::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 24% -10% 0;
  pointer-events: none;
  background: radial-gradient(circle at 50% 56%, rgba(33,245,139,.075), transparent 42%);
  filter: blur(28px);
}
.dashboard-preview .section-heading { max-width: 880px; }
.dashboard-preview .section-heading .eyebrow {
  width: fit-content;
  margin-inline: auto;
  padding: 7px 11px;
  border: 1px solid rgba(33,245,139,.24);
  border-radius: 999px;
  background: rgba(33,245,139,.035);
  letter-spacing: .18em;
}
.preview-window {
  position: relative;
  max-width: 1120px;
  margin-inline: auto;
  border-color: rgba(33,245,139,.34);
  border-radius: 26px;
  background:
    radial-gradient(circle at 0 0, rgba(33,245,139,.045), transparent 27%),
    #031109;
  box-shadow:
    inset 0 1px rgba(222,255,237,.04),
    0 42px 110px -54px #000,
    0 0 76px -54px rgba(33,245,139,.7);
}
.preview-top {
  min-height: 64px;
  padding: 0 20px;
  gap: 14px;
  border-bottom-color: rgba(33,245,139,.15);
  background: linear-gradient(180deg, rgba(20,67,41,.13), rgba(2,14,8,.25));
}
.preview-top .preview-window-dots { display: inline-flex; margin-left: 0; gap: 5px; }
.preview-top .preview-window-dots i { width: 7px; height: 7px; background: rgba(167,189,177,.24); box-shadow: inset 0 1px rgba(255,255,255,.08); }
.preview-brand {
  display: flex;
  align-items: center;
  gap: 10px;
}
.preview-brand > svg {
  width: 26px;
  height: 26px;
  padding: 5px;
  overflow: visible;
  border: 1px solid rgba(33,245,139,.22);
  border-radius: 8px;
  fill: none;
  stroke: var(--neon);
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 6px rgba(33,245,139,.38));
}
.preview-brand strong,
.preview-brand small { display: block; }
.preview-brand strong { color: var(--text); font-size: 11px; line-height: 1.2; }
.preview-brand small { margin-top: 3px; color: #70877b; font: 650 8px/1 var(--mono); letter-spacing: .06em; }
.preview-demo-badge {
  display: inline-flex;
  margin-left: auto !important;
  padding: 7px 10px;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(33,245,139,.14);
  border-radius: 999px;
  background: rgba(33,245,139,.035);
  color: #8da298 !important;
  font: 750 8px/1 var(--mono) !important;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.preview-demo-badge i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--neon);
  box-shadow: 0 0 9px rgba(33,245,139,.72);
}
.preview-layout {
  grid-template-columns: 210px minmax(0,1fr);
  min-height: 560px;
}
.preview-layout aside {
  gap: 7px;
  padding: 24px 16px;
  border-right-color: rgba(33,245,139,.13);
  background: rgba(1,13,7,.38);
}
.preview-layout aside > small {
  margin: 0 10px 10px;
  color: #61776b;
  font: 750 8px/1 var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
}
.preview-layout aside b,
.preview-layout aside span {
  display: flex;
  min-height: 44px;
  padding: 0 11px;
  align-items: center;
  gap: 10px;
  border: 1px solid transparent;
  border-radius: 11px;
  color: #83998d;
  font-size: 11px;
  font-weight: 650;
}
.preview-layout aside b {
  border-color: rgba(33,245,139,.2);
  background: linear-gradient(145deg, rgba(33,245,139,.1), rgba(5,46,25,.2));
  color: var(--text);
  box-shadow: inset 2px 0 var(--neon);
}
.preview-layout aside svg {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.preview-layout aside b svg { color: var(--neon); filter: drop-shadow(0 0 5px rgba(33,245,139,.4)); }
.preview-layout > .preview-main { padding: 24px; }
.preview-main-head {
  display: flex;
  margin-bottom: 18px;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
.preview-main-head small,
.preview-main-head h3 { display: block; margin: 0; }
.preview-main-head small { margin-bottom: 5px; color: var(--neon); font: 750 8px/1 var(--mono); letter-spacing: .11em; text-transform: uppercase; }
.preview-main-head h3 { color: var(--text); font-size: 18px; }
.preview-main-head > span {
  padding: 8px 10px;
  border: 1px solid rgba(33,245,139,.14);
  border-radius: 9px;
  color: #8da298;
  font-size: 10px;
}
.preview-main-head > span i { margin-left: 7px; color: var(--neon); font-style: normal; }
.preview-metrics { gap: 12px; }
.preview-metrics article {
  position: relative;
  min-height: 138px;
  padding: 18px;
  overflow: hidden;
  border-color: rgba(33,245,139,.17);
  border-radius: 16px;
  background:
    radial-gradient(circle at 100% 0, rgba(33,245,139,.08), transparent 38%),
    linear-gradient(145deg, rgba(6,38,22,.65), rgba(2,17,9,.62));
  box-shadow: inset 0 1px rgba(255,255,255,.025);
}
.preview-metric-icon {
  position: absolute;
  top: 15px;
  right: 15px;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid rgba(33,245,139,.22);
  border-radius: 10px;
  background: rgba(33,245,139,.055);
  color: var(--neon);
}
.preview-metric-icon svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.preview-metrics small { color: #91a69b; font-size: 11px; }
.preview-metrics strong { margin: 15px 0 7px; font-size: 28px; letter-spacing: -.025em; }
.preview-metrics em { color: #6ee9a5; font: 650 9px/1.3 var(--mono); }
.preview-chart-card {
  margin-top: 14px;
  padding: 17px 18px 12px;
  border: 1px solid rgba(33,245,139,.16);
  border-radius: 17px;
  background: linear-gradient(145deg, rgba(4,28,16,.62), rgba(1,13,7,.58));
}
.preview-chart-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.preview-chart-head small,
.preview-chart-head strong { display: block; }
.preview-chart-head small { margin-bottom: 4px; color: #72877c; font-size: 9px; }
.preview-chart-head strong { color: var(--text); font-size: 13px; }
.preview-chart-head > span { display: inline-flex; align-items: center; gap: 7px; color: #7f9589; font-size: 9px; }
.preview-chart-head > span i { width: 8px; height: 8px; border-radius: 3px; background: var(--neon); box-shadow: 0 0 9px rgba(33,245,139,.5); }
.preview-chart {
  position: relative;
  height: 210px;
  margin-top: 10px;
  padding: 24px 6px 25px;
  gap: 12px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: repeating-linear-gradient(to top, rgba(33,245,139,.075) 0 1px, transparent 1px 42px);
}
.preview-chart span {
  position: relative;
  border: 1px solid rgba(93,255,170,.26);
  border-bottom: 0;
  border-radius: 7px 7px 2px 2px;
  background: linear-gradient(180deg, #35f590, rgba(12,111,58,.38));
  box-shadow: inset 0 1px rgba(255,255,255,.18), 0 0 20px -13px rgba(33,245,139,.7);
  opacity: .88;
}
.preview-chart span::after {
  content: attr(data-day);
  position: absolute;
  right: 0;
  bottom: -19px;
  left: 0;
  color: #677d71;
  font: 650 8px/1 var(--mono);
  text-align: center;
}
.preview-chart span:last-child {
  background: linear-gradient(180deg, #86ffc0, #18c66c);
  box-shadow: 0 0 22px -8px rgba(33,245,139,.74);
  opacity: 1;
}
.analytics-foot {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 10px;
  margin-top: 12px;
}
.analytics-foot > span {
  display: grid;
  grid-template-columns: 25px 1fr;
  padding: 10px 11px;
  align-items: center;
  border: 1px solid rgba(33,245,139,.1);
  border-radius: 11px;
  background: rgba(3,24,14,.46);
}
.analytics-foot b {
  grid-row: 1 / 3;
  color: var(--neon);
  font: 750 8px/1 var(--mono);
}
.analytics-foot small,
.analytics-foot strong { display: block; }
.analytics-foot small { color: #667d71; font-size: 8px; }
.analytics-foot strong { margin-top: 3px; color: #b5c8bd; font-size: 10px; }
@media (max-width: 900px) {
  .preview-layout { grid-template-columns: 165px minmax(0,1fr); }
  .preview-layout aside { padding-inline: 10px; }
  .preview-layout > .preview-main { padding: 18px; }
  .preview-chart { gap: 7px; }
}
@media (max-width: 720px) {
  .preview-layout { grid-template-columns: 1fr; }
  .preview-layout aside { display: none; }
  .preview-metrics { grid-template-columns: 1fr; }
  .preview-chart { height: 180px; }
  .analytics-foot { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .preview-top { padding-inline: 12px; }
  .preview-window-dots { display: none; }
  .preview-brand small { display: none; }
  .preview-layout > .preview-main { padding: 13px; }
  .preview-main-head { align-items: flex-start; }
  .preview-main-head > span { white-space: nowrap; }
  .preview-chart-card { padding-inline: 11px; }
  .preview-chart-head > span { display: none; }
}
.security-trust {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0,.88fr) minmax(500px,1.12fr);
  gap: clamp(54px,7vw,92px);
  padding: clamp(84px,9vw,126px) 0;
  align-items: center;
  border-block: 1px solid rgba(33,245,139,.16);
}
.security-trust::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 10% -10%;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 48%, rgba(33,245,139,.055), transparent 28%),
    radial-gradient(circle at 80% 52%, rgba(33,245,139,.075), transparent 31%);
  filter: blur(26px);
}
.security-copy .eyebrow {
  width: fit-content;
  padding: 7px 11px;
  border: 1px solid rgba(33,245,139,.24);
  border-radius: 999px;
  background: rgba(33,245,139,.035);
  letter-spacing: .18em;
}
.security-copy .section-title-xl {
  max-width: 600px;
  margin-top: 18px;
  font-size: clamp(42px,4.7vw,61px);
  line-height: 1.02;
}
.security-copy .section-lede {
  max-width: 600px;
  color: #a7bbb0;
  line-height: 1.68;
}
.security-checks {
  gap: 9px;
  margin: 27px 0 0;
}
.security-checks li {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 11px;
  min-height: 58px;
  padding: 8px 10px;
  align-items: center;
  border: 1px solid rgba(33,245,139,.1);
  border-radius: 13px;
  background: rgba(3,24,14,.42);
  transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.security-checks li::before { display: none; }
.security-checks li:hover {
  transform: translateX(3px);
  border-color: rgba(33,245,139,.28);
  background: rgba(33,245,139,.055);
}
.security-checks li > span {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid rgba(92,255,171,.28);
  border-radius: 11px;
  background: rgba(33,245,139,.055);
  color: var(--neon);
}
.security-checks svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 5px rgba(33,245,139,.35));
}
.security-checks strong,
.security-checks small { display: block; }
.security-checks strong { color: var(--text); font-size: 13px; line-height: 1.25; }
.security-checks small { margin-top: 4px; color: #7f9589; font-size: 10px; line-height: 1.35; }
.security-link {
  min-height: 43px;
  padding: 0 13px;
  align-items: center;
  border: 1px solid rgba(33,245,139,.22);
  border-radius: 11px;
  background: rgba(33,245,139,.045);
  font-size: 12px;
  transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.security-link:hover {
  transform: translateY(-2px);
  border-color: rgba(33,245,139,.46);
  background: rgba(33,245,139,.085);
}
.security-link > svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: var(--neon);
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.security-pipeline {
  position: relative;
  padding: 18px;
  overflow: hidden;
  border: 1px solid rgba(33,245,139,.31);
  border-radius: 26px;
  background:
    radial-gradient(circle at 0 0, rgba(33,245,139,.075), transparent 34%),
    linear-gradient(145deg, rgba(5,31,18,.92), rgba(2,14,8,.92));
  box-shadow:
    inset 0 1px rgba(222,255,237,.045),
    0 36px 90px -50px #000,
    0 0 68px -50px rgba(33,245,139,.68);
}
.security-pipeline::after {
  content: "";
  position: absolute;
  right: -105px;
  top: -105px;
  width: 270px;
  height: 270px;
  pointer-events: none;
  border: 1px solid rgba(33,245,139,.04);
  border-radius: 50%;
  box-shadow: 0 0 0 38px rgba(33,245,139,.014), 0 0 0 76px rgba(33,245,139,.008);
}
.security-pipeline-head {
  position: relative;
  z-index: 1;
  display: flex;
  min-height: 54px;
  padding: 0 7px 13px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid rgba(33,245,139,.1);
}
.security-pipeline-head span,
.security-pipeline-head strong { display: block; }
.security-pipeline-head span { margin-bottom: 5px; color: var(--neon); font: 750 8.5px/1 var(--mono); letter-spacing: .13em; text-transform: uppercase; }
.security-pipeline-head strong { color: var(--text); font-size: 14px; }
.security-pipeline-head em {
  display: inline-flex;
  padding: 7px 9px;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(33,245,139,.14);
  border-radius: 999px;
  color: #8fa49a;
  font: 700 8px/1 var(--mono);
  font-style: normal;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.security-pipeline-head em i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--neon);
  box-shadow: 0 0 9px rgba(33,245,139,.72);
}
.security-flow {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 9px;
  min-width: 0;
  padding-top: 13px;
}
.security-step {
  position: relative;
  display: grid;
  grid-template-columns: 50px minmax(0,1fr) 26px;
  gap: 13px;
  min-height: 68px;
  padding: 9px 12px;
  align-items: center;
  border: 1px solid rgba(33,245,139,.1);
  border-radius: 15px;
  background: linear-gradient(145deg, rgba(8,42,25,.48), rgba(2,17,10,.58));
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.security-step:hover {
  transform: translateX(3px);
  border-color: rgba(33,245,139,.3);
  background: linear-gradient(145deg, rgba(12,58,33,.58), rgba(2,21,11,.64));
  box-shadow: 0 16px 34px -30px rgba(33,245,139,.72);
}
.security-step:not(:last-child)::after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: -10px;
  left: 36px;
  width: 1px;
  height: 10px;
  background: rgba(33,245,139,.42);
  box-shadow: 0 0 7px rgba(33,245,139,.3);
}
.security-step-icon {
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border: 1px solid rgba(92,255,171,.36);
  border-radius: 13px;
  background: rgba(33,245,139,.065);
  color: var(--neon);
}
.security-step-icon svg {
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 6px rgba(33,245,139,.42));
}
.security-step > div small,
.security-step > div strong { display: block; }
.security-step > div small { margin-bottom: 5px; color: #68d99c; font: 700 8px/1 var(--mono); letter-spacing: .09em; text-transform: uppercase; }
.security-step > div strong { color: var(--text); font-size: 13px; }
.security-step > i {
  display: grid;
  width: 23px;
  height: 23px;
  place-items: center;
  border: 1px solid rgba(33,245,139,.32);
  border-radius: 50%;
  background: rgba(33,245,139,.07);
  color: var(--neon);
  font: 750 10px/1 system-ui;
  font-style: normal;
}

.outcomes-section {
  position: relative;
  isolation: isolate;
}
.outcomes-section::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 18% -10% 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 58%, rgba(33,245,139,.045), transparent 24%),
    radial-gradient(circle at 50% 54%, rgba(33,245,139,.075), transparent 29%),
    radial-gradient(circle at 82% 58%, rgba(33,245,139,.045), transparent 24%);
  filter: blur(26px);
}
.outcomes-section .section-heading { max-width: 880px; }
.outcomes-section .section-heading .eyebrow {
  width: fit-content;
  margin-inline: auto;
  padding: 7px 11px;
  border: 1px solid rgba(33,245,139,.24);
  border-radius: 999px;
  background: rgba(33,245,139,.035);
  letter-spacing: .18em;
}
.outcome-grid {
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 18px;
  max-width: 1120px;
  margin-inline: auto;
}
.outcome-grid .outcome-card {
  position: relative;
  display: flex;
  min-height: 330px;
  margin: 0;
  padding: 25px;
  overflow: hidden;
  flex-direction: column;
  border: 1px solid rgba(33,245,139,.17);
  border-radius: 23px;
  background:
    radial-gradient(circle at 0 0, rgba(33,245,139,.05), transparent 34%),
    linear-gradient(150deg, rgba(6,31,18,.8), rgba(2,15,9,.9));
  box-shadow: inset 0 1px rgba(255,255,255,.03), 0 30px 68px -48px #000;
  transition: transform .22s ease, border-color .22s ease, background .22s ease, box-shadow .22s ease;
}
.outcome-grid .outcome-card::before {
  content: "";
  position: absolute;
  right: -66px;
  bottom: -72px;
  width: 170px;
  height: 170px;
  pointer-events: none;
  border: 1px solid rgba(33,245,139,.035);
  border-radius: 50%;
  box-shadow: 0 0 0 27px rgba(33,245,139,.012), 0 0 0 54px rgba(33,245,139,.007);
}
.outcome-grid .outcome-card:hover {
  transform: translateY(-6px);
  border-color: rgba(33,245,139,.43);
  background:
    radial-gradient(circle at 0 0, rgba(33,245,139,.09), transparent 36%),
    linear-gradient(150deg, rgba(8,43,24,.86), rgba(2,17,9,.94));
  box-shadow: inset 0 1px rgba(255,255,255,.04), 0 34px 76px -45px #000, 0 0 44px -35px rgba(33,245,139,.62);
}
.outcome-grid .primary-outcome {
  border-color: rgba(33,245,139,.42);
  background:
    radial-gradient(circle at 0 0, rgba(33,245,139,.105), transparent 38%),
    linear-gradient(150deg, rgba(8,49,27,.86), rgba(2,17,10,.94));
  box-shadow: inset 0 1px rgba(222,255,237,.045), 0 34px 76px -48px #000, 0 0 58px -45px rgba(33,245,139,.7);
}
.outcome-card-head {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.outcome-icon {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border: 1px solid rgba(92,255,171,.4);
  border-radius: 17px;
  background:
    radial-gradient(circle, rgba(105,255,180,.16), transparent 60%),
    rgba(4,47,25,.54);
  color: var(--neon);
  box-shadow: inset 0 1px rgba(220,255,235,.08), 0 0 30px -13px rgba(33,245,139,.72);
}
.outcome-icon svg {
  width: 28px;
  height: 28px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 6px rgba(33,245,139,.44));
}
.outcome-card-head b {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid rgba(33,245,139,.13);
  border-radius: 10px;
  color: #66d99c;
  font: 750 8px/1 var(--mono);
}
.outcome-card > em {
  width: fit-content;
  margin-top: 25px;
  padding: 6px 8px;
  border: 1px solid rgba(33,245,139,.14);
  border-radius: 999px;
  background: rgba(33,245,139,.035);
  color: #74dba2;
  font: 750 8px/1 var(--mono);
  font-style: normal;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.outcome-grid h3 {
  position: relative;
  z-index: 1;
  margin: 13px 0 9px;
  color: var(--text);
  font-size: 22px;
  letter-spacing: -.02em;
}
.outcome-grid p {
  position: relative;
  z-index: 1;
  margin: 0;
  color: #a5b8ae;
  font-size: 13.5px;
  line-height: 1.6;
}
.outcome-grid small {
  position: relative;
  z-index: 1;
  display: flex;
  width: fit-content;
  min-height: 36px;
  margin-top: auto;
  padding: 8px 10px;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(33,245,139,.1);
  border-radius: 10px;
  background: rgba(2,18,10,.58);
  color: #82978c;
  font-size: 10px;
  line-height: 1.3;
}
.outcome-grid small svg {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  fill: none;
  stroke: #64d99b;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
}
@media (max-width: 900px) {
  .outcome-grid { grid-template-columns: 1fr; max-width: 660px; }
  .outcome-grid .outcome-card { min-height: 300px; }
}
@media (max-width: 520px) {
  .outcome-grid .outcome-card { min-height: 310px; padding: 21px; border-radius: 20px; }
  .outcome-icon { width: 52px; height: 52px; border-radius: 15px; }
  .outcome-icon svg { width: 25px; height: 25px; }
}
.pricing-preview .pricing-grid { margin-top: 0; }
.pricing-note { margin: 24px auto 0; color: var(--muted-2); font-size: 12px; text-align: center; }
.faq-section { border-top: 1px solid var(--border); }
.faq-list details { padding: 0; border: 1px solid var(--border); border-radius: 12px; background: rgba(7,24,16,.56); }
.faq-list details + details { margin-top: 9px; }
.faq-list summary { position: relative; min-height: 58px; padding: 18px 52px 18px 18px; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; position: absolute; top: 50%; right: 19px; color: var(--neon); font-size: 22px; transform: translateY(-50%); }
.faq-list details[open] summary::after { content: "−"; }
.faq-list details p { margin: 0; padding: 0 18px 20px; color: var(--muted); }
.cta-panel small { display: block; margin-top: 18px; color: var(--muted-2); }

.site-footer { grid-template-columns: 1.6fr repeat(3, 1fr); }
.site-footer .footer-brand p { max-width: 280px; }
.site-footer .footer-brand > a:not(.brand) { color: var(--neon); }

@media (max-width: 1040px) {
  .nav-links { gap: 2px; }
  .nav-links a, .nav-resources summary { padding-inline: 8px; }
  .home-hero { grid-template-columns: minmax(0,1fr) minmax(350px,.8fr); gap: 32px; }
  .hero-copy h1 { font-size: clamp(48px, 6.2vw, 68px); }
  .benefit-grid-six { grid-template-columns: repeat(2,1fr); }
  .demo-experience { grid-template-columns: 1fr 1fr; gap: 38px; }
  .security-trust { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  main { width: min(100% - 28px, 1240px); }
  .nav .nav-links { padding: 10px; }
  .nav-resources { width: 100%; }
  .nav-resources summary { padding: 11px 12px; }
  .nav-resources > div { position: static; width: 100%; margin-top: 4px; box-shadow: none; }
  .home-hero { grid-template-columns: 1fr; min-height: 0; padding: 64px 0 84px; text-align: center; }
  .hero-copy { grid-column: 1; }
  .hero-copy .eyebrow { justify-content: center; }
  .hero-copy h1, .hero-copy .lede { margin-inline: auto; }
  .hero-copy .actions, .hero-copy .hero-proof { justify-content: center; }
  .home-hero > .hero-orb { grid-column: 1; width: min(100%, 520px); margin-top: 42px; }
  .home-hero .orb-stage { width: min(76vw, 380px); }
  .demo-experience { grid-template-columns: 1fr; }
  .demo-copy { order: -1; text-align: center; }
  .demo-copy .eyebrow { justify-content: center; }
  .demo-copy .section-lede { margin-inline: auto; }
  .demo-copy .prompt-chips { justify-content: center; }
  .use-case-layout { grid-template-columns: 1fr; }
  .use-case-tabs { display: flex; overflow-x: auto; padding-bottom: 6px; }
  .use-case-tabs button { flex: 0 0 auto; }
  .use-case-panel dl { grid-template-columns: 1fr; }
  .site-footer { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
  .home-hero { padding-top: 46px; }
  .hero-copy h1 { font-size: clamp(42px, 13vw, 58px); }
  .hero-copy .actions { display: grid; width: 100%; }
  .hero-copy .actions .button { width: 100%; }
  .hero-copy .hero-proof { flex-direction: column; gap: 8px; }
  .home-hero .orb-stage { width: min(84vw, 340px); }
  .orb-controls { flex-direction: column; }
  .benefit-grid-six, .comparison-grid { grid-template-columns: 1fr; }
  .assistant-demo { border-radius: 16px; }
  .demo-conversation { min-height: 390px; padding: 17px; }
  .demo-message { max-width: 90%; }
  .demo-composer { grid-template-columns: 42px minmax(0,1fr); }
  .demo-mini-orb { width: 42px; height: 42px; }
  .demo-composer > button { grid-column: 1 / -1; }
  .security-flow { display: grid; grid-template-columns: 1fr; }
  .security-flow .security-step { min-height: 68px; }
  .site-footer { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-waveform i { animation: none !important; }
}

/* Compact reference hero — matches the supplied composition closely */
.nav {
  top: 0;
  width: min(1280px, calc(100% - 24px));
  min-height: 58px;
  border-top: 0;
  border-radius: 0 0 18px 18px;
  background: rgba(2, 9, 6, .72);
}
.nav.is-scrolled { min-height: 52px; }
main { padding-top: 76px; }
.home-hero {
  position: relative;
  isolation: isolate;
  grid-template-columns: minmax(0, .93fr) minmax(400px, 1.07fr);
  gap: clamp(28px, 5vw, 72px);
  min-height: 0;
  padding: 58px 0 34px;
  overflow: hidden;
}
.hero-copy, .home-hero > .hero-orb { position: relative; z-index: 2; }
.hero-copy { align-self: center; padding-bottom: 14px; }
.hero-copy .eyebrow {
  width: fit-content;
  margin-bottom: 15px;
  padding: 6px 10px;
  border: 1px solid rgba(33,245,139,.44);
  border-radius: 999px;
  background: rgba(33,245,139,.045);
  font-size: 8px;
  letter-spacing: .15em;
}
.hero-copy .eyebrow::before { width: 8px; height: 8px; border: 1px solid var(--neon); border-radius: 50%; background: transparent; box-shadow: inset 0 0 0 2px rgba(33,245,139,.18), 0 0 8px var(--glow); }
.hero-copy h1 {
  max-width: 620px;
  font-size: clamp(48px, 5.4vw, 70px);
  line-height: .96;
  letter-spacing: -.058em;
}
.hero-copy h1 span { filter: drop-shadow(0 0 12px rgba(33,245,139,.14)); }
.hero-copy .lede {
  max-width: 540px;
  margin-top: 18px;
  color: #9cb2a6;
  font-size: clamp(14px, 1.25vw, 16px);
  line-height: 1.58;
}
.hero-copy .actions { margin: 24px 0 17px; }
.hero-copy .actions .button { min-height: 44px; padding-inline: 20px; }
.hero-copy .hero-proof { gap: 9px 22px; font-size: 9px; }
.hero-copy .hero-proof span { white-space: nowrap; }
.home-hero > .hero-orb {
  align-self: center;
  width: min(100%, 560px);
  padding-top: 0;
  transform: translateY(-8px);
}
.home-hero .orb-stage { width: min(36vw, 400px); }
.home-hero .orb-stage::before {
  inset: -36%;
  background: radial-gradient(circle, rgba(33,245,139,.1), rgba(2,9,6,.48) 40%, rgba(33,245,139,.055) 58%, transparent 76%);
}
.home-hero .orb-presence {
  position: relative;
  z-index: 4;
  width: fit-content;
  margin: -4px auto 0;
  padding: 6px 11px;
  border: 1px solid rgba(33,245,139,.26);
  border-radius: 999px;
  background: rgba(2, 14, 8, .86);
  color: #94ad9f;
  font-size: 8px;
  letter-spacing: .14em;
}
.home-hero .hero-waveform { margin-top: 5px; transform: scale(.7); transform-origin: center; }
.home-hero .orb-status {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
}
.home-hero .orb-transcript {
  min-height: 0;
  max-width: 390px;
  margin: 3px auto 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #8ba195;
  font-size: 10px;
  line-height: 1.35;
}
.home-hero .orb-controls { margin-top: 7px; transform: scale(.86); transform-origin: top center; }
.home-hero .voice-actor-tag { padding: 5px 8px; }
.home-hero .orb-link { padding: 6px 10px; }
.hero-signal-landscape {
  position: absolute;
  z-index: 0;
  right: -4%;
  bottom: -16px;
  left: 32%;
  height: 50%;
  pointer-events: none;
  opacity: .46;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 18%, #000 88%, transparent);
  mask-image: linear-gradient(to right, transparent, #000 18%, #000 88%, transparent);
}
.hero-signal-landscape svg { width: 100%; height: 100%; overflow: visible; }
.hero-signal-landscape path {
  fill: none;
  stroke: rgba(33,245,139,.28);
  stroke-width: .75;
  vector-effect: non-scaling-stroke;
  stroke-dasharray: 2 4;
  animation: signal-drift 14s linear infinite;
}
.hero-signal-landscape path:nth-child(even) { stroke: rgba(0,201,107,.2); animation-direction: reverse; animation-duration: 18s; }
@keyframes signal-drift { to { stroke-dashoffset: -120; } }

.trust-strip {
  min-height: 62px;
  margin-top: 0;
  padding: 13px 18px;
  border-radius: 10px;
  gap: clamp(22px, 4.2vw, 64px);
  background: rgba(7,24,16,.68);
}
.trust-strip strong { font-size: 8px; letter-spacing: .08em; }
.trust-strip span { position: relative; padding-left: 17px; font-size: 8px; letter-spacing: .02em; }
.trust-strip span::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 11px;
  height: 11px;
  border: 1px solid rgba(167,189,177,.48);
  border-radius: 50%;
  transform: translateY(-50%);
  box-shadow: inset 0 0 0 2px rgba(33,245,139,.06);
}
.benefits-section { padding-top: 26px; }
.benefits-section .section-heading { margin-bottom: 32px; }
.benefits-section .section-heading .eyebrow {
  padding: 6px 11px;
  border: 1px solid rgba(33,245,139,.28);
  border-radius: 999px;
  background: rgba(33,245,139,.04);
  font-size: 11px;
  letter-spacing: .12em;
}
.benefits-section .section-heading .eyebrow::before { width: 5px; height: 5px; border-radius: 50%; }
.benefits-section .section-title-xl { margin-top: 10px; font-size: clamp(28px,3.4vw,46px); }
.benefits-section .section-title-xl { color: var(--text); }
.benefits-section .section-title-xl span { color: var(--neon); }

@media (max-width: 1040px) {
  .home-hero { grid-template-columns: minmax(0,1fr) minmax(340px,.9fr); }
  .home-hero .orb-stage { width: min(38vw,370px); }
}
@media (max-width: 820px) {
  .nav { top: 0; border-radius: 0 0 14px 14px; }
  main { padding-top: 68px; }
  .home-hero { grid-template-columns: 1fr; padding: 48px 0 42px; text-align: center; }
  .hero-copy .eyebrow { margin-inline: auto; }
  .home-hero > .hero-orb { margin-top: 30px; transform: none; }
  .home-hero .orb-stage { width: min(74vw,360px); }
  .hero-signal-landscape { right: -25%; left: -25%; bottom: -18px; height: 38%; }
  .trust-strip { margin-top: 0; }
}
@media (max-width: 620px) {
  .home-hero { padding-top: 36px; }
  .hero-copy h1 { font-size: clamp(42px,13vw,56px); }
  .hero-copy .lede { font-size: 15px; }
  .home-hero .orb-transcript { max-width: 300px; font-size: 9px; }
  .trust-strip { padding-inline: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-signal-landscape path { animation: none; }
}

/* Hero polish pass — clearer hierarchy, calmer energy, stronger usability */
.nav {
  top: 10px;
  width: min(1210px, calc(100% - 28px));
  min-height: 58px;
  padding: 8px 10px 8px 18px;
  border: 1px solid rgba(33,245,139,.2);
  border-radius: 16px;
  background: rgba(2, 13, 8, .84);
  box-shadow: 0 18px 60px -42px #000, inset 0 1px rgba(255,255,255,.025);
}
.nav.is-scrolled {
  top: 7px;
  min-height: 54px;
  border-radius: 14px;
}
.brand-wave { gap: 8px; }
.brand-wave svg { width: 24px; }
.brand-wave .brand-name { font-size: 16px; letter-spacing: .06em; }
.nav-links { gap: 3px; }
.nav-links a, .nav-resources summary {
  min-height: 42px;
  padding: 11px 11px;
  font-size: 14px;
}
.nav-links .nav-cta { min-width: 92px; margin-left: 5px; text-align: center; }
.nav-resources summary::after { content: "▾"; position: relative; top: -1px; margin-left: 5px; font-size: 8px; }

main { padding-top: 78px; }
.home-hero {
  grid-template-columns: minmax(0, .94fr) minmax(380px, 1.06fr);
  gap: clamp(34px, 5vw, 68px);
  padding: 42px 8px 24px;
}
.hero-copy { padding: 0 0 8px; }
.hero-copy .eyebrow {
  margin-bottom: 18px;
  padding: 8px 14px;
  background: rgba(2, 20, 12, .72);
  font-size: 10px;
  letter-spacing: .17em;
}
.hero-copy .eyebrow::before { width: 10px; height: 10px; }
.hero-copy h1 {
  max-width: 580px;
  font-size: clamp(48px, 5vw, 64px);
  line-height: .98;
}
.hero-copy .lede {
  max-width: 525px;
  margin-top: 20px;
  color: #aec2b7;
  font-size: clamp(14px, 1.18vw, 16px);
  line-height: 1.62;
}
.hero-copy .actions { gap: 11px; margin: 25px 0 18px; }
.hero-copy .actions .button {
  min-height: 46px;
  padding-inline: 21px;
  border-radius: 9px;
  font-size: 13px;
}
.hero-copy .actions .button:first-child {
  background: linear-gradient(110deg, #63ffb0, #21df83 62%, #08b967);
  box-shadow: 0 16px 34px -22px rgba(33,245,139,.78), inset 0 1px rgba(255,255,255,.4);
}
.hero-copy .actions .button.secondary {
  border-color: rgba(33,245,139,.38);
  background: rgba(4, 20, 12, .62);
}
.hero-copy .hero-proof {
  gap: 9px 20px;
  color: #8fa69a;
  font-size: 9.5px;
  letter-spacing: .015em;
}

.home-hero > .hero-orb {
  width: min(100%, 520px);
  transform: translateY(-38px);
}
.home-hero .orb-stage { width: min(38vw, 430px); }
.home-hero .orb-stage canvas {
  filter: brightness(1.02) saturate(1.05) contrast(1.08);
  transition: filter .18s ease;
}
.home-hero .hero-orb[data-state="speaking"] .orb-stage canvas {
  filter: brightness(1.2) saturate(1.22) contrast(1.06) drop-shadow(0 0 22px rgba(33,245,139,.34));
}
.home-hero .orb-stage::before {
  inset: -32%;
  opacity: .78;
  background: radial-gradient(circle, rgba(4,28,16,.38), rgba(2,9,6,.5) 48%, transparent 77%);
  transition: background .18s ease, box-shadow .18s ease;
}
.home-hero .hero-orb[data-state="speaking"] .orb-stage::before {
  background: radial-gradient(circle, rgba(74,255,160,.15), rgba(2,34,18,.54) 42%, rgba(33,245,139,.075) 62%, transparent 78%);
  box-shadow: 0 0 70px rgba(33,245,139,.15);
}
.home-hero .orb-presence {
  margin-top: 2px;
  padding: 6px 12px;
  border-color: rgba(33,245,139,.34);
  background: rgba(2, 17, 10, .92);
  color: #a7bdb1;
  font-size: 8.5px;
  box-shadow: 0 10px 30px -24px var(--glow);
}
.home-hero .presence-dot { box-shadow: 0 0 8px var(--neon); }
.home-hero .hero-waveform { margin-top: 6px; opacity: .75; }
.home-hero .orb-transcript {
  width: min(100%, 390px);
  min-height: 38px;
  margin: 5px auto 0;
  padding: 10px 14px;
  border: 1px solid rgba(33,245,139,.12);
  border-radius: 10px;
  background: rgba(2, 13, 8, .64);
  color: #9fb4a8;
  font-size: 11px;
  line-height: 1.45;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.home-hero .orb-controls {
  gap: 8px;
  margin-top: 8px;
  transform: none;
}
.home-hero .voice-actor-tag,
.home-hero .orb-link {
  min-height: 28px;
  padding: 7px 10px;
  border-color: rgba(33,245,139,.2);
  background: rgba(2, 16, 10, .76);
  font-size: 8px;
}
.home-hero .orb-link:hover { border-color: rgba(33,245,139,.5); background: rgba(33,245,139,.08); }

.hero-signal-landscape {
  right: -2%;
  bottom: -4px;
  left: 38%;
  height: 37%;
  opacity: .28;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 38%, #000 80%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0, #000 38%, #000 80%, transparent 100%);
}
.hero-signal-landscape path { stroke-width: .65; }
#cin-bg { opacity: .56; }

.trust-strip {
  min-height: 58px;
  margin-top: 8px;
  padding: 12px 18px;
  border-color: rgba(33,245,139,.14);
  background: rgba(6, 20, 13, .72);
  box-shadow: inset 0 1px rgba(255,255,255,.018);
}
.trust-strip strong { color: #91a99c; }
.benefits-section { padding-top: 22px; }
.benefits-section .section-heading { margin-bottom: 28px; }

@media (max-width: 1040px) {
  .home-hero { grid-template-columns: minmax(0,1fr) minmax(330px,.84fr); }
  .home-hero > .hero-orb { transform: translateY(-24px); }
  .home-hero .orb-stage { width: min(39vw,390px); }
}
@media (max-width: 820px) {
  .nav { top: 7px; width: calc(100% - 14px); }
  main { padding-top: 72px; }
  .home-hero { grid-template-columns: 1fr; padding: 44px 0 32px; }
  .home-hero > .hero-orb { margin-top: 26px; transform: translateY(-12px); }
  .home-hero .orb-stage { width: min(78vw,380px); }
  .hero-signal-landscape { right: -20%; bottom: 0; left: -20%; height: 28%; opacity: .2; }
}
@media (max-width: 620px) {
  .home-hero { padding-top: 32px; }
  .hero-copy h1 { font-size: clamp(42px, 12vw, 54px); }
  .hero-copy .lede { font-size: 14.5px; }
  .home-hero .orb-stage { width: min(88vw,370px); }
  .home-hero .orb-transcript { width: min(92%,350px); }
}

/* Calm background: no decorative or flickering page dots */
body::before {
  opacity: 0;
  background-image: none;
}

/* Transcript remains an accessible live region without occupying hero space. */
.home-hero .orb-transcript {
  position: absolute;
  width: 1px;
  height: 1px;
  min-height: 0;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Reference-accurate left hero treatment */
.hero-copy { transform: translateY(-18px); }
.hero-copy .eyebrow {
  display: inline-flex;
  min-height: 30px;
  padding: 7px 12px;
  align-items: center;
  gap: 7px;
  border-color: rgba(33,245,139,.5);
  background: rgba(2,18,11,.78);
  font-size: 9px;
  letter-spacing: .145em;
}
.hero-copy .eyebrow::before { display: none; }
.hero-copy .eyebrow svg {
  width: 15px;
  height: 11px;
  fill: none;
  stroke: var(--neon);
  stroke-width: 1.35;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 5px rgba(33,245,139,.55));
}
.hero-copy h1 {
  max-width: 610px;
  font-size: clamp(49px, 5vw, 64px);
  line-height: .95;
}
.hero-copy .lede {
  max-width: 490px;
  margin-top: 18px;
  font-size: clamp(13.5px, 1.12vw, 15px);
  line-height: 1.55;
}
.hero-copy .actions { margin-top: 23px; }
.hero-copy .actions .button:first-child { min-width: 174px; }
.hero-copy .actions .button.secondary { min-width: 124px; }
.hero-copy .hero-proof { display: flex; gap: 11px 24px; }
.hero-copy .hero-proof span { display: inline-flex; align-items: center; gap: 8px; }
.hero-copy .hero-proof i {
  display: inline-grid;
  width: 14px;
  height: 14px;
  place-items: center;
  border: 1px solid rgba(33,245,139,.5);
  border-radius: 50%;
  color: var(--neon);
  font: 700 8px/1 system-ui;
  font-style: normal;
}
@media (max-width: 820px) {
  .hero-copy { transform: none; }
}

/* Purpose-built trust strip icons */
.trust-strip {
  justify-content: space-between;
  gap: 18px;
  padding: 13px 20px;
}
.trust-strip strong {
  padding-right: 20px;
  border-right: 1px solid rgba(33,245,139,.13);
  color: #9cb1a6;
  font-size: 8px;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.trust-strip span {
  display: inline-flex;
  min-height: 30px;
  padding: 4px 8px;
  align-items: center;
  gap: 7px;
  border-radius: 7px;
  color: #91a69b;
  font-size: 9px;
  letter-spacing: .015em;
  text-transform: none;
  transition: color .18s ease, background .18s ease;
}
.trust-strip span::before { display: none; }
.trust-strip span:hover { color: var(--text); background: rgba(33,245,139,.055); }
.trust-strip svg {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  fill: none;
  stroke: #9db4a8;
  stroke-width: 1.35;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: stroke .18s ease, filter .18s ease;
}
.trust-strip span:hover svg { stroke: var(--neon); filter: drop-shadow(0 0 5px rgba(33,245,139,.38)); }
@media (max-width: 820px) {
  .trust-strip { justify-content: flex-start; }
  .trust-strip strong { position: sticky; left: 0; z-index: 1; background: rgba(6,20,13,.96); }
}

/* Stronger, consistently left-aligned hero typography */
.hero-copy h1 {
  max-width: 660px;
  font-size: clamp(56px, 5.55vw, 72px);
  text-align: left;
}
.hero-copy .lede {
  max-width: 550px;
  font-size: clamp(15px, 1.24vw, 17px);
}
.hero-copy .actions .button { font-size: 14px; }
.hero-copy .hero-proof { font-size: 13px; }
@media (max-width: 820px) {
  .home-hero { text-align: left; }
  .hero-copy .eyebrow { margin-right: 0; margin-left: 0; justify-content: flex-start; }
  .hero-copy h1, .hero-copy .lede { margin-right: 0; margin-left: 0; text-align: left; }
  .hero-copy .actions, .hero-copy .hero-proof { justify-content: flex-start; }
  .hero-copy h1 { max-width: 650px; font-size: clamp(54px, 8.4vw, 66px); }
  .hero-copy .lede { font-size: 16px; }
}
@media (max-width: 620px) {
  .hero-copy h1 { font-size: clamp(48px, 11.2vw, 62px); }
  .hero-copy .lede { font-size: 15.5px; }
  .hero-copy .hero-proof { align-items: flex-start; }
}

/* Give the message more visual weight than the orb on wide screens. */
@media (min-width: 1041px) {
  .home-hero {
    grid-template-columns: minmax(0, 1.16fr) minmax(400px, .84fr);
    gap: clamp(30px, 3.8vw, 54px);
  }
  .hero-copy h1 {
    max-width: 720px;
    font-size: clamp(62px, 5.9vw, 78px);
  }
  .hero-copy .lede {
    max-width: 590px;
    font-size: clamp(16px, 1.3vw, 18px);
  }
  .hero-copy .actions .button { min-height: 48px; }
  .hero-copy .hero-proof { font-size: 13px; }
}

/* Remove the outermost dashed orb border; retain the inner orbital system. */
.home-hero .orbit-outer { display: none; }

/* Keep all orb metadata and controls on one clean horizontal line. */
.home-hero .orb-controls {
  display: flex;
  width: max-content;
  max-width: 100%;
  margin: 8px auto 0;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}
.home-hero .orb-controls .orb-presence {
  min-height: 28px;
  margin: 0;
}
@media (max-width: 620px) {
  .home-hero .orb-controls {
    gap: 5px;
    flex-direction: row;
    transform: scale(.88);
    transform-origin: top center;
  }
}

/* Wide conversation-reactive waveform */
.home-hero .hero-waveform {
  width: 260px;
  height: 42px;
  margin-top: 7px;
  gap: 0;
  justify-content: space-between;
  opacity: .9;
  transform: none;
}
.home-hero .hero-waveform i {
  width: 3px;
  height: var(--wave-height, 6px);
  flex: 0 0 3px;
  border-radius: 999px;
  background: linear-gradient(to top, #00a95b, var(--neon));
  box-shadow: 0 0 5px rgba(33,245,139,.32);
  transform-origin: center;
  animation-delay: calc(var(--wave-index) * -.045s) !important;
}
.hero-orb[data-state="idle"] .hero-waveform i {
  animation: waveform-idle 2.2s ease-in-out infinite alternate;
}
.hero-orb[data-state="listening"] .hero-waveform i {
  animation: waveform-listening .58s ease-in-out infinite alternate;
}
.hero-orb[data-state="processing"] .hero-waveform i {
  animation: waveform-processing .9s ease-in-out infinite;
}
.hero-orb[data-state="speaking"] .hero-waveform i {
  animation: waveform-speaking var(--wave-speed, .48s) ease-in-out infinite alternate;
}
.hero-orb[data-state="error"] .hero-waveform i,
.hero-orb[data-state="permission-denied"] .hero-waveform i,
.hero-orb[data-state="disconnected"] .hero-waveform i {
  background: #f6ad55;
  box-shadow: 0 0 5px rgba(246,173,85,.3);
  animation: waveform-error 1.1s ease-in-out infinite;
}
@keyframes waveform-idle {
  from { transform: scaleY(.45); opacity: .38; }
  to { transform: scaleY(.8); opacity: .62; }
}
@keyframes waveform-listening {
  from { transform: scaleY(.45); opacity: .58; }
  to { transform: scaleY(2.4); opacity: 1; }
}
@keyframes waveform-processing {
  0%,100% { transform: scaleY(.4); opacity: .42; }
  45% { transform: scaleY(1.85); opacity: .95; }
}
@keyframes waveform-speaking {
  from { transform: scaleY(.5); opacity: .65; }
  to { transform: scaleY(2.85); opacity: 1; }
}
@keyframes waveform-error {
  0%,100% { opacity: .34; }
  50% { opacity: .9; }
}
@media (max-width: 620px) {
  .home-hero .hero-waveform { width: 220px; height: 38px; }
}
@media (prefers-reduced-motion: reduce) {
  .home-hero .hero-waveform i { animation: none !important; transform: scaleY(.7); }
}

/* Larger interactive service-team selector */
.trust-strip {
  display: grid;
  grid-template-columns: minmax(255px, 1.35fr) repeat(5, minmax(135px, 1fr));
  min-height: 64px;
  padding: 6px 10px;
  gap: 2px;
  align-items: center;
  overflow: hidden;
}
.trust-strip strong {
  min-height: 42px;
  padding: 0 28px 0 10px;
  display: flex;
  align-items: center;
  border-right-color: rgba(33,245,139,.16);
  color: #a9bbb1;
  font-size: 10.5px;
  line-height: 1.25;
  letter-spacing: .085em;
  white-space: nowrap;
}
.trust-strip button {
  display: flex;
  min-width: 0;
  min-height: 42px;
  padding: 6px 9px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: #a8b9b0;
  font: 700 11.5px/1.2 var(--mono);
  letter-spacing: .005em;
  white-space: nowrap;
  cursor: pointer;
  transition: color .2s ease, background .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.trust-strip button svg {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  fill: none;
  stroke: #9db4a8;
  stroke-width: 1.4;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: stroke .2s ease, transform .2s ease, filter .2s ease;
}
.trust-strip button:hover,
.trust-strip button:focus-visible {
  border-color: transparent;
  background: rgba(33,245,139,.04);
  color: var(--text);
  transform: none;
}
.trust-strip button:hover svg,
.trust-strip button:focus-visible svg,
.trust-strip button[aria-pressed="true"] svg {
  stroke: var(--neon);
  transform: scale(1.08);
  filter: drop-shadow(0 0 6px rgba(33,245,139,.42));
}
.trust-strip button[aria-pressed="true"] {
  border-color: transparent;
  background: linear-gradient(to top, rgba(33,245,139,.075), transparent 72%);
  color: var(--text);
  box-shadow: inset 0 -2px rgba(33,245,139,.72);
}
.trust-detail {
  grid-column: 1 / -1;
  min-height: 0;
  max-height: 0;
  margin: 0;
  padding: 0 14px;
  overflow: hidden;
  border-top: 1px solid transparent;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.5;
  text-align: center;
  opacity: 0;
  transition: max-height .25s ease, padding .25s ease, opacity .2s ease, border-color .2s ease;
}
.trust-strip.has-selection .trust-detail {
  max-height: 50px;
  padding: 10px 14px 2px;
  border-color: rgba(33,245,139,.11);
  opacity: 1;
}
@media (max-width: 900px) {
  .trust-strip {
    grid-template-columns: 255px repeat(5, 170px);
    justify-content: start;
    overflow-x: auto;
    scrollbar-width: thin;
  }
  .trust-strip .trust-detail {
    position: sticky;
    left: 0;
    width: calc(100vw - 58px);
  }
}

/* Production landing-page completion: billing controls and complete footer. */
.billing-switch {
  display: flex;
  width: max-content;
  margin: -20px auto 34px;
  padding: 4px;
  gap: 3px;
  border: 1px solid rgba(33,245,139,.2);
  border-radius: 999px;
  background: rgba(2,9,6,.86);
  box-shadow: inset 0 1px rgba(255,255,255,.035);
}
.billing-switch button {
  min-width: 104px;
  min-height: 42px;
  padding: 9px 18px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  font: 750 11px/1 var(--mono);
  letter-spacing: .08em;
  cursor: pointer;
  transition: color .2s ease, background .2s ease, box-shadow .2s ease;
}
.billing-switch button:hover { color: var(--text); }
.billing-switch button.is-active {
  background: linear-gradient(135deg, var(--neon), #13d978);
  color: #031109;
  box-shadow: 0 8px 24px -14px var(--glow);
}
.billing-switch button:focus-visible {
  outline: 2px solid var(--text);
  outline-offset: 3px;
}
.pricing-note {
  max-width: 760px;
  min-height: 22px;
  margin: 24px auto 0;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}

.site-footer {
  grid-template-columns: minmax(210px,1.45fr) repeat(3,minmax(120px,.72fr)) minmax(250px,1.25fr);
  width: min(calc(100% - 32px),1280px);
  margin: 88px auto 18px;
  padding: 44px;
  border: 1px solid rgba(33,245,139,.18);
  border-radius: 24px;
  background:
    radial-gradient(circle at 6% 0,rgba(33,245,139,.08),transparent 30%),
    rgba(3,14,9,.83);
  box-shadow: 0 24px 90px -72px var(--glow);
}
.site-footer .footer-brand p,
.site-footer .footer-newsletter p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.65;
}
.footer-social { display: flex; gap: 14px; }
.footer-social a { color: var(--neon) !important; }
.footer-newsletter form,
.footer-newsletter form > div { width: 100%; }
.footer-newsletter label {
  display: block;
  margin: 5px 0 7px;
  color: var(--text);
  font-size: 12px;
  font-weight: 700;
}
.footer-newsletter form > div {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(1,8,5,.82);
}
.footer-newsletter input {
  min-width: 0;
  min-height: 46px;
  padding: 0 13px;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text);
}
.footer-newsletter input::placeholder { color: #6f8579; }
.footer-newsletter input[aria-invalid="true"] { box-shadow: inset 0 0 0 1px #f6ad55; }
.footer-newsletter form > div:focus-within {
  border-color: var(--neon);
  box-shadow: 0 0 0 3px rgba(33,245,139,.11);
}
.footer-newsletter button {
  min-width: 64px;
  border: 0;
  background: var(--neon);
  color: #031109;
  font-weight: 800;
  cursor: pointer;
}
.footer-newsletter button:hover { background: #5dffad; }
.footer-newsletter button:focus-visible { outline: 2px solid var(--text); outline-offset: -4px; }
.footer-newsletter small {
  display: block;
  margin-top: 8px;
  color: var(--muted-2);
  font-size: 10px;
  line-height: 1.5;
}
.site-footer .footer-bottom {
  grid-column: 1 / -1;
  display: flex;
  min-height: 44px;
  margin-top: 14px;
  padding-top: 20px;
  border-top: 1px solid rgba(33,245,139,.12);
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

@media (max-width: 1100px) {
  .site-footer { grid-template-columns: 1.3fr repeat(3,1fr); }
  .site-footer .footer-newsletter { grid-column: 1 / -1; max-width: 560px; }
}
@media (max-width: 760px) {
  .site-footer { grid-template-columns: 1fr 1fr; margin-top: 60px; padding: 32px 26px; }
  .site-footer .footer-brand,
  .site-footer .footer-newsletter { grid-column: 1 / -1; }
  .site-footer .footer-bottom { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 480px) {
  .billing-switch { margin-top: -8px; }
  .billing-switch button { min-width: 96px; }
  .site-footer { grid-template-columns: 1fr; padding: 28px 20px; }
  .site-footer .footer-brand,
  .site-footer .footer-newsletter,
  .site-footer .footer-bottom { grid-column: 1; }
}

/* Keep Adam's readiness visible without restoring the removed transcript box. */
.home-hero .orb-status {
  position: static;
  width: auto;
  height: auto;
  min-height: 18px;
  margin: 0 auto 7px;
  padding: 0;
  overflow: visible;
  clip: auto;
  white-space: normal;
  color: #91a99c;
  font: 700 8.5px/1.5 var(--mono);
  letter-spacing: .14em;
  text-align: center;
}
.home-hero[data-state="disconnected"] .orb-status,
.home-hero .hero-orb[data-state="disconnected"] .orb-status { color: #f6ad55; }
@media (max-width: 620px) {
  .home-hero .orb-status {
    max-width: 310px;
    font-size: 8px;
    letter-spacing: .1em;
  }
}

/* Single-plan pricing experience */
.pricing-preview {
  position: relative;
  padding-block: clamp(84px, 10vw, 132px);
}
.pricing-preview::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 16%;
  left: 50%;
  width: min(920px, 92vw);
  height: 560px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(27, 255, 135, .09), rgba(10, 90, 52, .025) 48%, transparent 72%);
  filter: blur(16px);
  transform: translateX(-50%);
  pointer-events: none;
}
.pricing-preview .section-heading {
  max-width: 850px;
  margin-bottom: 30px;
}
.pricing-preview .section-heading h2 {
  letter-spacing: -.055em;
  text-wrap: balance;
}
.billing-switch {
  width: max-content;
  margin: 0 auto 34px;
}
.billing-switch button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.billing-switch button span {
  padding: 4px 7px;
  border-radius: 999px;
  background: rgba(33, 245, 139, .1);
  color: var(--mint);
  font-size: 8px;
  letter-spacing: .02em;
}
.billing-switch button.is-active span {
  background: rgba(3, 17, 9, .17);
  color: #031109;
}
.pricing-offer {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr);
  width: min(100%, 980px);
  margin-inline: auto;
  overflow: hidden;
  border: 1px solid rgba(42, 255, 145, .34);
  border-radius: 30px;
  background: rgba(2, 14, 8, .84);
  box-shadow: 0 42px 130px -76px rgba(36, 255, 145, .72), inset 0 1px rgba(255, 255, 255, .035);
}
.pricing-offer .pricing-plan-card,
.pricing-offer .provider-card {
  min-width: 0;
  border: 0;
  border-radius: 0;
}
.pricing-offer .pricing-plan-card {
  padding: clamp(30px, 4.5vw, 52px);
  background:
    radial-gradient(circle at 18% 0, rgba(49, 255, 153, .13), transparent 34%),
    linear-gradient(145deg, rgba(8, 42, 24, .95), rgba(3, 18, 10, .94));
  box-shadow: none;
}
.plan-topline {
  display: flex;
  min-height: 30px;
  align-items: center;
  gap: 12px;
}
.plan-topline .popular {
  position: static;
  order: 2;
  margin-left: auto;
  transform: none;
}
.plan-fit {
  color: var(--muted);
  font: 650 10px/1.3 var(--mono);
  letter-spacing: .06em;
  text-transform: uppercase;
}
.pricing-plan-card .price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 26px 0 10px;
}
.pricing-plan-card .price > span {
  color: #f1fff7;
  font-size: clamp(52px, 7vw, 76px);
  font-weight: 850;
  letter-spacing: -.065em;
  line-height: .95;
  text-shadow: 0 0 30px rgba(80, 255, 166, .12);
}
.pricing-plan-card .price small {
  font-size: 13px;
}
.plan-summary {
  max-width: 470px;
  margin: 0;
  color: #afc5b8;
  font-size: 15px;
  line-height: 1.7;
}
.pricing-features {
  grid-template-columns: 1fr 1fr;
  gap: 13px 22px;
  margin: 32px 0 30px;
  padding-top: 27px;
  border-top: 1px solid rgba(63, 255, 157, .14);
}
.pricing-features li {
  color: #d8e8de;
  font-size: 13px;
  line-height: 1.45;
}
.pricing-features li::before {
  display: inline-grid;
  width: 19px;
  height: 19px;
  margin-right: 8px;
  place-items: center;
  border: 1px solid rgba(42, 255, 145, .48);
  border-radius: 50%;
  color: var(--neon);
  font-size: 10px;
}
.pricing-plan-card > .pricing-cta {
  display: flex;
  min-height: 54px;
  margin: 0;
  justify-content: space-between;
  box-shadow: 0 16px 36px -20px var(--glow);
}
.trial-note {
  display: block;
  margin-top: 13px;
  color: var(--muted-2);
  font-size: 10.5px;
  text-align: center;
}
.provider-card {
  position: relative;
  padding: clamp(30px, 4vw, 48px);
  border-left: 1px solid rgba(42, 255, 145, .16) !important;
  background:
    linear-gradient(rgba(255, 255, 255, .012), rgba(255, 255, 255, 0)),
    rgba(2, 11, 7, .94);
}
.provider-icon {
  display: grid;
  width: 54px;
  height: 54px;
  margin-bottom: 30px;
  place-items: center;
  border: 1px solid rgba(42, 255, 145, .38);
  border-radius: 16px;
  background: rgba(29, 222, 121, .08);
  color: #6dffb4;
  box-shadow: 0 0 34px -18px var(--glow), inset 0 0 18px rgba(46, 255, 148, .05);
}
.provider-icon svg {
  width: 28px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.provider-card .eyebrow {
  margin-bottom: 13px;
}
.provider-card h2,
.provider-card h3 {
  max-width: 420px;
  margin: 0 0 14px;
  color: var(--text);
  font-size: clamp(25px, 3vw, 34px);
  line-height: 1.08;
  letter-spacing: -.035em;
}
.provider-card > p:not(.eyebrow):not(.provider-footnote) {
  margin: 0;
  color: var(--muted);
  font-size: 13.5px;
  line-height: 1.72;
}
.provider-links {
  display: grid;
  gap: 10px;
  margin: 27px 0 20px;
}
.provider-links a {
  display: flex;
  min-height: 68px;
  padding: 14px 16px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border: 1px solid rgba(42, 255, 145, .18);
  border-radius: 14px;
  background: rgba(8, 35, 21, .55);
  text-decoration: none;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}
.provider-links a:hover {
  border-color: rgba(42, 255, 145, .48);
  background: rgba(11, 54, 30, .72);
  transform: translateY(-2px);
}
.provider-links b,
.provider-links small {
  display: block;
}
.provider-links b {
  color: var(--text);
  font-size: 13px;
}
.provider-links small {
  margin-top: 4px;
  color: var(--muted-2);
  font-size: 10.5px;
  line-height: 1.4;
}
.provider-links i {
  color: var(--neon);
  font-style: normal;
  font-size: 17px;
}
.provider-security {
  margin-top: 20px;
  padding: 15px 16px;
  border: 1px solid rgba(42, 255, 145, .14);
  border-radius: 13px;
  background: rgba(40, 255, 146, .035);
}
.provider-security b {
  color: #c9f9dd;
  font-size: 12px;
}
.provider-security p {
  margin: 5px 0 0;
  color: var(--muted-2);
  font-size: 11px;
  line-height: 1.55;
}
.provider-card .provider-footnote {
  margin: 0;
  color: #71877a;
  font-size: 9.5px;
  line-height: 1.55;
}
.pricing-page-offer {
  padding-top: 0;
}
.pricing-page-offer::before {
  top: 0;
}

@media (max-width: 820px) {
  .pricing-offer { grid-template-columns: 1fr; max-width: 620px; }
  .provider-card { border-top: 1px solid rgba(42, 255, 145, .16) !important; border-left: 0 !important; }
}
@media (max-width: 520px) {
  .pricing-preview { padding-block: 72px; }
  .billing-switch { width: 100%; }
  .billing-switch button { min-width: 0; flex: 1; padding-inline: 10px; }
  .billing-switch button span { display: none; }
  .pricing-offer { border-radius: 22px; }
  .pricing-offer .pricing-plan-card,
  .pricing-offer .provider-card { padding: 27px 21px; }
  .plan-topline { align-items: flex-start; flex-wrap: wrap; }
  .plan-topline .popular { order: 0; width: 100%; margin: 0 0 4px; }
  .pricing-features { grid-template-columns: 1fr; }
  .pricing-plan-card .price > span { font-size: 54px; }
}

/* Editorial FAQ — quick scanning on the left, focused answers on the right */
.faq-section {
  position: relative;
  overflow: visible;
  border-top: 1px solid rgba(33, 245, 139, .12);
}
.faq-section::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: -20vw;
  width: 760px;
  height: 760px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(28, 235, 126, .075), transparent 68%);
  filter: blur(16px);
  pointer-events: none;
}
.faq-shell {
  display: grid;
  grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr);
  gap: clamp(48px, 8vw, 112px);
  max-width: 1120px;
  margin-inline: auto;
  align-items: start;
}
.faq-intro {
  position: sticky;
  top: 112px;
}
.faq-intro .eyebrow {
  margin-bottom: 20px;
}
.faq-intro .section-title-xl {
  max-width: 470px;
  margin: 0 0 22px;
  font-size: clamp(43px, 5vw, 66px);
  line-height: .98;
  letter-spacing: -.055em;
  text-wrap: balance;
}
.faq-intro > p:not(.eyebrow) {
  max-width: 420px;
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.75;
}
.faq-jump-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 26px;
}
.faq-jump-links a {
  padding: 8px 12px;
  border: 1px solid rgba(33, 245, 139, .18);
  border-radius: 999px;
  background: rgba(20, 130, 71, .06);
  color: #a6bbae;
  font: 700 9px/1 var(--mono);
  letter-spacing: .08em;
  text-decoration: none;
  text-transform: uppercase;
  transition: color .2s ease, border-color .2s ease, background .2s ease;
}
.faq-jump-links a:hover {
  border-color: rgba(33, 245, 139, .48);
  background: rgba(33, 245, 139, .09);
  color: var(--neon);
}
.faq-help-card {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 32px;
  gap: 13px;
  max-width: 390px;
  margin-top: 34px;
  padding: 15px;
  align-items: center;
  border: 1px solid rgba(33, 245, 139, .18);
  border-radius: 17px;
  background:
    radial-gradient(circle at 0 0, rgba(33, 245, 139, .08), transparent 42%),
    rgba(3, 18, 10, .72);
}
.faq-help-card > span {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .28);
  border-radius: 13px;
  background: rgba(33, 245, 139, .07);
  color: var(--neon);
}
.faq-help-card svg {
  width: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.faq-help-card strong,
.faq-help-card small {
  display: block;
}
.faq-help-card strong {
  color: var(--text);
  font-size: 12px;
}
.faq-help-card small {
  margin-top: 4px;
  color: var(--muted-2);
  font-size: 10px;
  line-height: 1.4;
}
.faq-help-card > a {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 50%;
  background: var(--neon);
  color: #031109;
  font-size: 16px;
  font-weight: 800;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease;
}
.faq-help-card > a:hover {
  transform: translateX(2px);
  box-shadow: 0 0 22px -8px var(--glow);
}
.faq-section .faq-list {
  display: grid;
  gap: 11px;
  max-width: none;
  margin: 0;
  counter-reset: faq-item;
}
.faq-section .faq-list details {
  position: relative;
  overflow: hidden;
  padding: 0;
  scroll-margin-top: 110px;
  counter-increment: faq-item;
  border: 1px solid rgba(33, 245, 139, .14);
  border-radius: 17px;
  background:
    linear-gradient(120deg, rgba(12, 40, 24, .56), rgba(2, 15, 8, .72));
  box-shadow: inset 0 1px rgba(255, 255, 255, .018);
  transition: border-color .24s ease, background .24s ease, box-shadow .24s ease, transform .24s ease;
}
.faq-section .faq-list details + details {
  margin-top: 0;
}
.faq-section .faq-list details:hover {
  border-color: rgba(33, 245, 139, .3);
  transform: translateX(-3px);
}
.faq-section .faq-list details[open] {
  border-color: rgba(33, 245, 139, .48);
  background:
    radial-gradient(circle at 94% 0, rgba(33, 245, 139, .09), transparent 30%),
    linear-gradient(135deg, rgba(9, 43, 24, .86), rgba(2, 17, 9, .88));
  box-shadow: 0 20px 54px -42px var(--glow), inset 3px 0 var(--neon);
}
.faq-section .faq-list summary {
  position: relative;
  display: block;
  min-height: 82px;
  padding: 38px 76px 19px 24px;
  list-style: none;
  color: #eaf7ef;
  font-size: 15px;
  font-weight: 760;
  line-height: 1.4;
  cursor: pointer;
}
.faq-section .faq-list summary::-webkit-details-marker {
  display: none;
}
.faq-section .faq-list summary::before {
  content: counter(faq-item, decimal-leading-zero) "  ·  " attr(data-category);
  position: absolute;
  top: 18px;
  left: 24px;
  color: #54d894;
  font: 750 8px/1 var(--mono);
  letter-spacing: .13em;
  text-transform: uppercase;
}
.faq-section .faq-list summary::after {
  content: "+";
  position: absolute;
  top: 50%;
  right: 22px;
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .24);
  border-radius: 50%;
  background: rgba(33, 245, 139, .055);
  color: var(--neon);
  font: 400 21px/1 system-ui;
  transform: translateY(-50%);
  transition: color .22s ease, background .22s ease, border-color .22s ease, transform .22s ease;
}
.faq-section .faq-list details[open] summary::after {
  content: "−";
  border-color: var(--neon);
  background: var(--neon);
  color: #031109;
  transform: translateY(-50%) rotate(180deg);
}
.faq-section .faq-list details p {
  max-width: 670px;
  margin: 0;
  padding: 0 76px 25px 24px;
  color: #9db4a6;
  font-size: 13.5px;
  line-height: 1.72;
}

@media (max-width: 900px) {
  .faq-shell {
    grid-template-columns: 1fr;
    max-width: 700px;
    gap: 42px;
  }
  .faq-intro {
    position: static;
    text-align: center;
  }
  .faq-intro .section-title-xl,
  .faq-intro > p:not(.eyebrow),
  .faq-help-card {
    margin-inline: auto;
  }
  .faq-intro .eyebrow,
  .faq-jump-links {
    justify-content: center;
  }
}
@media (max-width: 520px) {
  .faq-section {
    padding-block: 76px;
  }
  .faq-intro .section-title-xl {
    font-size: 42px;
  }
  .faq-help-card {
    grid-template-columns: 40px minmax(0, 1fr) 30px;
    text-align: left;
  }
  .faq-help-card > span {
    width: 40px;
    height: 40px;
  }
  .faq-section .faq-list summary {
    min-height: 88px;
    padding: 39px 62px 18px 19px;
    font-size: 14px;
  }
  .faq-section .faq-list summary::before {
    top: 18px;
    left: 19px;
  }
  .faq-section .faq-list summary::after {
    right: 15px;
    width: 33px;
    height: 33px;
  }
  .faq-section .faq-list details p {
    padding: 0 19px 23px;
  }
}

/* Final conversion panel */
.launch-cta {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .72fr);
  gap: clamp(44px, 8vw, 106px);
  margin-top: clamp(70px, 9vw, 120px);
  padding: clamp(34px, 5.5vw, 72px);
  overflow: hidden;
  align-items: center;
  border-color: rgba(33, 245, 139, .28);
  border-radius: 32px;
  background:
    linear-gradient(rgba(33, 245, 139, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(33, 245, 139, .025) 1px, transparent 1px),
    radial-gradient(700px circle at 12% 18%, rgba(33, 245, 139, .13), transparent 61%),
    linear-gradient(135deg, rgba(4, 28, 16, .97), rgba(2, 14, 8, .96));
  background-size: 46px 46px, 46px 46px, auto, auto;
  text-align: left;
  box-shadow: 0 40px 130px -82px var(--glow), inset 0 1px rgba(255, 255, 255, .035);
}
.launch-cta::before,
.launch-cta::after {
  content: "";
  position: absolute;
  border: 1px solid rgba(33, 245, 139, .1);
  border-radius: 50%;
  pointer-events: none;
}
.launch-cta::before {
  right: -190px;
  bottom: -320px;
  width: 600px;
  height: 600px;
}
.launch-cta::after {
  right: -85px;
  bottom: -215px;
  width: 390px;
  height: 390px;
}
.launch-cta-copy {
  position: relative;
  z-index: 1;
}
.launch-cta-copy .eyebrow {
  margin-bottom: 22px;
}
.launch-cta-copy h2 {
  max-width: 680px;
  margin: 0;
  font-size: clamp(44px, 5.2vw, 68px);
  line-height: .98;
  letter-spacing: -.058em;
  text-wrap: balance;
}
.launch-cta-copy > p:not(.eyebrow) {
  max-width: 590px;
  margin: 25px 0 0;
  color: #a8bbae;
  font-size: 16px;
  line-height: 1.72;
}
.launch-proof {
  display: flex;
  flex-wrap: wrap;
  gap: 11px 20px;
  margin: 29px 0 0;
  padding: 0;
  list-style: none;
}
.launch-proof li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #bed0c4;
  font-size: 11px;
  font-weight: 650;
}
.launch-proof li span {
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .4);
  border-radius: 50%;
  color: var(--neon);
  font-size: 10px;
}
.launch-start-card {
  position: relative;
  z-index: 2;
  padding: clamp(25px, 3vw, 34px);
  border: 1px solid rgba(53, 255, 152, .3);
  border-radius: 23px;
  background:
    radial-gradient(circle at 0 0, rgba(33, 245, 139, .105), transparent 40%),
    rgba(2, 13, 7, .88);
  box-shadow: 0 30px 90px -56px rgba(0, 0, 0, .9), inset 0 1px rgba(255, 255, 255, .04);
  backdrop-filter: blur(16px);
}
.launch-card-top {
  display: flex;
  margin-bottom: 22px;
  align-items: center;
  justify-content: space-between;
}
.launch-card-top > span {
  display: inline-flex;
  padding: 7px 10px;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(33, 245, 139, .22);
  border-radius: 999px;
  background: rgba(33, 245, 139, .07);
  color: #a7d7bb;
  font: 750 8px/1 var(--mono);
  letter-spacing: .11em;
  text-transform: uppercase;
}
.launch-card-top > span i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--neon);
  box-shadow: 0 0 10px var(--glow);
}
.launch-mini-orb {
  position: relative;
  width: 48px;
  height: 48px;
  border: 1px solid rgba(33, 245, 139, .26);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(77, 255, 164, .28), rgba(11, 86, 47, .12) 38%, transparent 66%);
  box-shadow: 0 0 30px -12px var(--glow), inset 0 0 20px rgba(33, 245, 139, .08);
}
.launch-mini-orb i {
  position: absolute;
  inset: 7px;
  border: 1px solid rgba(91, 255, 171, .38);
  border-radius: 50%;
  animation: launch-orbit 6s linear infinite;
}
.launch-mini-orb i:nth-child(2) {
  inset: 13px 5px;
  border-color: rgba(68, 255, 157, .2);
  animation-duration: 4.5s;
  animation-direction: reverse;
  transform: rotate(56deg);
}
.launch-mini-orb b {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #d9ffe9;
  box-shadow: 0 0 8px #fff, 0 0 20px var(--neon);
  transform: translate(-50%, -50%);
}
@keyframes launch-orbit {
  to { transform: rotate(360deg); }
}
.launch-start-card h3 {
  max-width: 360px;
  margin: 0 0 10px;
  color: var(--text);
  font-size: clamp(23px, 2.4vw, 30px);
  line-height: 1.08;
  letter-spacing: -.035em;
}
.launch-start-card > p {
  margin: 0;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.65;
}
.launch-price-options {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
  margin: 22px 0;
}
.launch-price-options > div {
  position: relative;
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(33, 245, 139, .14);
  border-radius: 13px;
  background: rgba(7, 31, 18, .55);
}
.launch-price-options > div.best-value {
  border-color: rgba(33, 245, 139, .42);
  background: rgba(16, 76, 40, .42);
}
.launch-price-options small,
.launch-price-options strong,
.launch-price-options span {
  display: block;
}
.launch-price-options small {
  margin-bottom: 9px;
  color: #65d99c;
  font: 700 8px/1 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.launch-price-options strong {
  color: #effff5;
  font-size: 23px;
  line-height: 1;
  letter-spacing: -.04em;
}
.launch-price-options span {
  margin-top: 5px;
  color: var(--muted-2);
  font-size: 9px;
}
.launch-start-card .actions {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(105px, .75fr);
  gap: 9px;
  margin: 0;
}
.launch-start-card .button {
  min-width: 0;
  min-height: 48px;
  padding-inline: 15px;
  justify-content: space-between;
  font-size: 11px;
}
.launch-start-card .button.secondary {
  justify-content: center;
}
.launch-start-card .launch-key-note {
  display: flex;
  margin: 15px 0 0;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: #71887a;
  font-size: 9.5px;
}
.launch-key-note span {
  color: var(--neon);
}

@media (prefers-reduced-motion: reduce) {
  .launch-mini-orb i { animation: none; }
}
@media (max-width: 940px) {
  .launch-cta {
    grid-template-columns: 1fr;
    max-width: 740px;
    margin-inline: auto;
  }
  .launch-cta-copy {
    text-align: center;
  }
  .launch-cta-copy h2,
  .launch-cta-copy > p:not(.eyebrow) {
    margin-inline: auto;
  }
  .launch-cta-copy .eyebrow,
  .launch-proof {
    justify-content: center;
  }
  .launch-start-card {
    width: min(100%, 500px);
    margin-inline: auto;
  }
}
@media (max-width: 540px) {
  .launch-cta {
    width: calc(100% + 4px);
    margin-left: -2px;
    padding: 42px 20px 20px;
    border-radius: 24px;
  }
  .launch-cta-copy h2 {
    font-size: 41px;
  }
  .launch-proof {
    display: grid;
    grid-template-columns: 1fr;
    width: max-content;
    margin-inline: auto;
    text-align: left;
  }
  .launch-start-card {
    padding: 22px 18px;
  }
  .launch-start-card .actions {
    grid-template-columns: 1fr;
  }
  .launch-start-card .button,
  .launch-start-card .button.secondary {
    justify-content: center;
  }
}

/* Premium footer */
.site-footer.home-footer {
  position: relative;
  grid-template-columns: minmax(230px, 1.2fr) repeat(3, minmax(120px, .62fr)) minmax(270px, 1.12fr);
  gap: clamp(28px, 3.6vw, 52px);
  margin-top: clamp(68px, 8vw, 108px);
  padding: clamp(34px, 4vw, 52px);
  overflow: hidden;
  align-items: start;
  border-color: rgba(33, 245, 139, .22);
  border-radius: 27px;
  background:
    radial-gradient(520px circle at 0 0, rgba(33, 245, 139, .095), transparent 58%),
    radial-gradient(460px circle at 100% 100%, rgba(21, 164, 83, .055), transparent 64%),
    linear-gradient(145deg, rgba(3, 22, 12, .96), rgba(2, 13, 7, .94));
  box-shadow: 0 32px 100px -74px var(--glow), inset 0 1px rgba(255, 255, 255, .03);
}
.site-footer.home-footer::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 38%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--neon));
  opacity: .68;
}
.site-footer.home-footer > div,
.site-footer.home-footer > nav {
  position: relative;
  z-index: 1;
}
.site-footer .footer-brand {
  gap: 16px;
  padding-right: clamp(8px, 2vw, 28px);
}
.site-footer .footer-brand .brand {
  min-height: 34px;
  font-size: 17px;
}
.site-footer .footer-brand .brand .brand-name,
.site-footer .footer-brand .brand .brand-name b {
  color: inherit;
  font-size: inherit;
}
.site-footer .footer-brand .brand svg {
  width: 25px;
  filter: drop-shadow(0 0 8px rgba(33, 245, 139, .38));
}
.site-footer .footer-brand p {
  max-width: 310px;
  margin: 0;
  color: #9db2a5;
  font-size: 13px;
  line-height: 1.72;
}
.footer-status {
  display: inline-flex;
  width: max-content;
  padding: 7px 10px;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(33, 245, 139, .17);
  border-radius: 999px;
  background: rgba(33, 245, 139, .045);
  color: #88ab98 !important;
  font: 700 8px/1 var(--mono) !important;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.footer-status i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--neon);
  box-shadow: 0 0 10px var(--glow);
}
.footer-social {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.footer-social a {
  display: inline-flex;
  padding: 8px 11px;
  align-items: center;
  gap: 9px;
  border: 1px solid rgba(33, 245, 139, .14);
  border-radius: 10px;
  background: rgba(0, 0, 0, .1);
  color: #bad1c3 !important;
  font-size: 10px !important;
  transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease;
}
.footer-social a:hover {
  border-color: rgba(33, 245, 139, .38);
  background: rgba(33, 245, 139, .07);
  color: var(--neon) !important;
  transform: translateY(-2px);
}
.footer-social a i {
  color: var(--neon);
  font-style: normal;
}
.footer-links {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}
.site-footer .footer-links strong {
  position: relative;
  margin: 0 0 8px;
  padding-bottom: 12px;
  color: #edf8f1;
  font-size: 12px;
}
.site-footer .footer-links strong::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 24px;
  height: 1px;
  background: var(--neon);
}
.site-footer .footer-links a {
  position: relative;
  color: #91a79a;
  font-size: 12px;
  line-height: 1.35;
  transition: color .18s ease, transform .18s ease;
}
.site-footer .footer-links a::before {
  content: "›";
  position: absolute;
  left: -11px;
  color: var(--neon);
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity .18s ease, transform .18s ease;
}
.site-footer .footer-links a:hover {
  color: #effaf3;
  transform: translateX(7px);
}
.site-footer .footer-links a:hover::before {
  opacity: 1;
  transform: translateX(0);
}
.site-footer .footer-newsletter {
  display: block;
  padding: 23px;
  border: 1px solid rgba(33, 245, 139, .17);
  border-radius: 18px;
  background:
    radial-gradient(circle at 100% 0, rgba(33, 245, 139, .085), transparent 43%),
    rgba(4, 28, 15, .58);
}
.footer-newsletter-kicker {
  display: block;
  margin-bottom: 11px;
  color: var(--neon) !important;
  font: 750 8px/1 var(--mono) !important;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.site-footer .footer-newsletter > strong {
  display: block;
  max-width: 250px;
  margin: 0 0 8px;
  color: var(--text);
  font-size: 16px;
  line-height: 1.25;
}
.site-footer .footer-newsletter p {
  max-width: 285px;
  color: #91a79a;
  font-size: 11px;
  line-height: 1.6;
}
.footer-newsletter form {
  margin-top: 19px;
}
.footer-newsletter label {
  margin: 0 0 8px;
  color: #dcebe2;
  font-size: 10px;
}
.footer-newsletter form > div {
  min-height: 48px;
  border-color: rgba(33, 245, 139, .22);
  border-radius: 11px;
}
.footer-newsletter input {
  font-size: 11px;
}
.footer-newsletter button {
  display: inline-flex;
  min-width: 76px;
  padding-inline: 13px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font-size: 11px;
}
.footer-newsletter button span {
  color: #031109;
  font-size: 14px;
}
.footer-newsletter small {
  margin-top: 9px;
  font-size: 8.5px;
  line-height: 1.55;
}
.site-footer .footer-bottom {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  min-height: 38px;
  margin-top: 0;
  padding-top: 22px;
  align-items: center;
  border-top-color: rgba(33, 245, 139, .13);
}
.site-footer .footer-bottom > span {
  color: #74897c;
  font-size: 10px;
}
.site-footer .footer-bottom > span:last-child {
  justify-self: end;
}
.footer-safety {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.footer-safety i {
  display: grid;
  width: 18px;
  height: 18px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .3);
  border-radius: 50%;
  color: var(--neon);
  font-size: 9px;
  font-style: normal;
}

@media (max-width: 1120px) {
  .site-footer.home-footer {
    grid-template-columns: minmax(230px, 1.2fr) repeat(3, minmax(120px, .7fr));
  }
  .site-footer .footer-newsletter {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(220px, .8fr) minmax(320px, 1.2fr);
    max-width: none;
    gap: 8px 40px;
    align-items: end;
  }
  .footer-newsletter-kicker,
  .site-footer .footer-newsletter > strong,
  .site-footer .footer-newsletter > p {
    grid-column: 1;
  }
  .footer-newsletter form {
    grid-column: 2;
    grid-row: 1 / 4;
    margin-top: 0;
  }
}
@media (max-width: 780px) {
  .site-footer.home-footer {
    grid-template-columns: 1fr 1fr;
    padding: 34px 26px;
  }
  .site-footer .footer-brand {
    grid-column: 1 / -1;
    padding: 0 0 28px;
    border-bottom: 1px solid rgba(33, 245, 139, .11);
  }
  .site-footer .footer-newsletter {
    grid-column: 1 / -1;
    display: block;
  }
  .footer-newsletter form {
    margin-top: 19px;
  }
  .site-footer .footer-bottom {
    grid-template-columns: 1fr;
    gap: 12px;
    align-items: start;
  }
  .site-footer .footer-bottom > span:last-child {
    justify-self: start;
  }
}
@media (max-width: 520px) {
  .site-footer.home-footer {
    grid-template-columns: 1fr;
    width: calc(100% - 20px);
    padding: 30px 21px;
    border-radius: 22px;
  }
  .site-footer .footer-brand,
  .site-footer .footer-newsletter,
  .site-footer .footer-bottom {
    grid-column: 1;
  }
  .footer-links {
    padding: 5px 0 17px;
    border-bottom: 1px solid rgba(33, 245, 139, .08);
  }
}

/* Product page — a focused product tour, not a second homepage */
.product-page {
  width: min(1220px, calc(100% - 32px));
  padding-top: 92px;
}
.product-tour-hero {
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(520px, 1.18fr);
  gap: clamp(48px, 7vw, 96px);
  min-height: 680px;
  padding: 54px 0 104px;
  align-items: center;
}
.product-tour-copy .eyebrow {
  margin-bottom: 23px;
}
.product-tour-copy h1 {
  max-width: 650px;
  margin: 0;
  font-size: clamp(50px, 5.3vw, 72px);
  line-height: .96;
  letter-spacing: -.06em;
  text-wrap: balance;
}
.product-tour-copy .lede {
  max-width: 600px;
  margin: 26px 0 0;
  color: #a9beb2;
  font-size: 16px;
  line-height: 1.75;
}
.product-tour-copy .actions {
  gap: 10px;
  margin: 30px 0 0;
}
.product-tour-copy .button {
  min-height: 50px;
}
.product-hero-proof {
  display: flex;
  flex-wrap: wrap;
  gap: 11px 21px;
  margin-top: 24px;
}
.product-hero-proof span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #82998c;
  font-size: 10.5px;
  font-weight: 650;
}
.product-hero-proof i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--neon);
  box-shadow: 0 0 9px var(--glow);
}
.product-console {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(33, 245, 139, .28);
  border-radius: 24px;
  background: rgba(2, 14, 8, .96);
  box-shadow: 0 46px 140px -80px var(--glow), inset 0 1px rgba(255, 255, 255, .035);
  transform: perspective(1400px) rotateY(-2deg) rotateX(1deg);
}
.product-console::before {
  content: "";
  position: absolute;
  top: -120px;
  right: -100px;
  width: 340px;
  height: 340px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(33, 245, 139, .14), transparent 68%);
  pointer-events: none;
}
.product-console-bar {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  min-height: 48px;
  padding: 0 17px;
  align-items: center;
  border-bottom: 1px solid rgba(33, 245, 139, .13);
  background: rgba(255, 255, 255, .018);
}
.product-console-bar > span {
  display: flex;
  gap: 6px;
}
.product-console-bar > span i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #385145;
}
.product-console-bar b {
  color: #a7baae;
  font: 700 8px/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.product-console-bar em {
  justify-self: end;
  padding: 5px 8px;
  border: 1px solid rgba(33, 245, 139, .2);
  border-radius: 999px;
  color: var(--neon);
  font: 700 7px/1 var(--mono);
  font-style: normal;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.product-console-body {
  display: grid;
  grid-template-columns: 114px minmax(0, 1fr);
  min-height: 475px;
}
.product-console-body > aside {
  display: flex;
  padding: 22px 12px;
  flex-direction: column;
  gap: 7px;
  border-right: 1px solid rgba(33, 245, 139, .11);
  background: rgba(2, 11, 6, .72);
}
.product-console-body > aside strong {
  display: grid;
  width: 32px;
  height: 32px;
  margin: 0 6px 15px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .34);
  border-radius: 10px;
  color: var(--neon);
  font: 800 9px/1 var(--mono);
}
.product-console-body > aside span {
  padding: 9px 10px;
  border-radius: 8px;
  color: #70867a;
  font-size: 9px;
  font-weight: 650;
}
.product-console-body > aside span.is-active {
  background: rgba(33, 245, 139, .1);
  color: #d9f5e4;
}
.product-console-main {
  position: relative;
  padding: 24px;
}
.product-console-main > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.product-console-main header small {
  color: var(--neon);
  font: 700 7px/1 var(--mono);
  letter-spacing: .13em;
}
.product-console-main header h2 {
  margin: 5px 0 0;
  color: var(--text);
  font-size: 25px;
}
.product-console-main header > span {
  display: inline-flex;
  padding: 7px 9px;
  align-items: center;
  gap: 6px;
  border: 1px solid rgba(33, 245, 139, .17);
  border-radius: 999px;
  color: #87a392;
  font-size: 8px;
}
.product-console-main header > span i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--neon);
  box-shadow: 0 0 9px var(--glow);
}
.console-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
  margin-top: 22px;
}
.console-metrics article {
  padding: 15px;
  border: 1px solid rgba(33, 245, 139, .13);
  border-radius: 13px;
  background: rgba(8, 34, 20, .48);
}
.console-metrics small,
.console-metrics strong,
.console-metrics em {
  display: block;
}
.console-metrics small {
  color: #83988c;
  font-size: 8px;
}
.console-metrics strong {
  margin: 11px 0 6px;
  color: #effff5;
  font-size: 22px;
  letter-spacing: -.035em;
}
.console-metrics em {
  color: #57c98c;
  font-size: 7.5px;
  font-style: normal;
}
.console-conversation {
  display: grid;
  grid-template-columns: 68px 1fr;
  gap: 16px;
  margin-top: 12px;
  padding: 19px;
  align-items: center;
  border: 1px solid rgba(33, 245, 139, .14);
  border-radius: 15px;
  background:
    radial-gradient(circle at 0 50%, rgba(33, 245, 139, .08), transparent 33%),
    rgba(2, 16, 9, .78);
}
.console-orb {
  position: relative;
  width: 58px;
  height: 58px;
  border: 1px solid rgba(33, 245, 139, .32);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(96, 255, 174, .27), rgba(13, 88, 49, .08) 45%, transparent 68%);
  box-shadow: 0 0 32px -13px var(--glow);
}
.console-orb i {
  position: absolute;
  inset: 8px 15px;
  border: 1px solid rgba(73, 255, 163, .43);
  border-radius: 50%;
  animation: launch-orbit 5s linear infinite;
}
.console-orb b {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #e7fff1;
  box-shadow: 0 0 9px #fff, 0 0 20px var(--neon);
  transform: translate(-50%, -50%);
}
.console-conversation small {
  color: var(--neon);
  font: 700 7px/1 var(--mono);
  letter-spacing: .12em;
}
.console-conversation p {
  margin: 7px 0;
  color: #e7f4eb;
  font-size: 11px;
  line-height: 1.45;
}
.console-conversation span {
  color: #758b7e;
  font-size: 8px;
}
.console-footer {
  display: flex;
  margin-top: 17px;
  align-items: center;
  justify-content: space-between;
}
.console-footer > span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #70867a;
  font-size: 8px;
}
.console-footer > span i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--neon);
}
.console-footer button {
  padding: 9px 12px;
  border: 0;
  border-radius: 8px;
  background: var(--neon);
  color: #031109;
  font-size: 8px;
  font-weight: 800;
}
.workspace-tour,
.request-lifecycle {
  padding: clamp(86px, 10vw, 132px) 0;
  border-top: 1px solid rgba(33, 245, 139, .12);
}
.product-section-heading {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 25px 70px;
  margin-bottom: 48px;
  align-items: end;
}
.product-section-heading .eyebrow {
  grid-column: 1 / -1;
  margin: 0;
}
.product-section-heading h2 {
  max-width: 630px;
  margin: 0;
  color: var(--text);
  font-size: clamp(40px, 4.8vw, 62px);
  line-height: 1;
  letter-spacing: -.055em;
}
.product-section-heading > p:not(.eyebrow) {
  max-width: 500px;
  margin: 0 0 4px;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.72;
}
.workspace-module-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
}
.workspace-module {
  position: relative;
  display: flex;
  min-height: 475px;
  padding: 27px;
  overflow: hidden;
  flex-direction: column;
  border: 1px solid rgba(33, 245, 139, .16);
  border-radius: 22px;
  background:
    radial-gradient(circle at 100% 0, rgba(33, 245, 139, .055), transparent 37%),
    rgba(3, 19, 11, .72);
  transition: border-color .22s ease, transform .22s ease, box-shadow .22s ease;
}
.workspace-module:hover {
  border-color: rgba(33, 245, 139, .4);
  box-shadow: 0 28px 80px -60px var(--glow);
  transform: translateY(-4px);
}
.module-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.module-head span {
  color: var(--neon);
  font: 800 10px/1 var(--mono);
}
.module-head i {
  padding: 6px 9px;
  border: 1px solid rgba(33, 245, 139, .16);
  border-radius: 999px;
  color: #75a086;
  font: 700 8px/1 var(--mono);
  font-style: normal;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.workspace-module h3 {
  margin: 38px 0 10px;
  color: var(--text);
  font-size: 24px;
  letter-spacing: -.035em;
}
.workspace-module > p {
  margin: 0;
  color: #91a69a;
  font-size: 13px;
  line-height: 1.68;
}
.module-ui {
  display: grid;
  gap: 8px;
  margin: 30px 0 26px;
}
.module-ui label {
  display: flex;
  min-height: 48px;
  padding: 11px 13px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid rgba(33, 245, 139, .11);
  border-radius: 10px;
  background: rgba(1, 12, 6, .55);
  color: #81968a;
  font-size: 9px;
}
.module-ui label b {
  color: #c8ded1;
  font-size: 9px;
}
.action-rules label b {
  color: #68dfa1;
}
.action-rules label:nth-child(2) b {
  color: #f6c76d;
}
.action-rules label:nth-child(3) b {
  color: #a68888;
}
.module-chart {
  display: flex;
  height: 170px;
  margin: 30px 0 26px;
  padding: 24px 18px 15px;
  align-items: end;
  gap: 8px;
  border: 1px solid rgba(33, 245, 139, .11);
  border-radius: 12px;
  background:
    linear-gradient(rgba(33, 245, 139, .04) 1px, transparent 1px),
    rgba(1, 12, 6, .55);
  background-size: 100% 33.333%;
}
.module-chart span {
  flex: 1;
  min-height: 15%;
  border-radius: 5px 5px 2px 2px;
  background: linear-gradient(var(--neon), rgba(21, 151, 76, .2));
  opacity: .75;
}
.workspace-module > a {
  display: flex;
  margin-top: auto;
  align-items: center;
  justify-content: space-between;
  color: #b8ccbf;
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
}
.workspace-module > a span {
  color: var(--neon);
  font-size: 15px;
}
.request-lifecycle {
  display: grid;
  grid-template-columns: minmax(280px, .7fr) minmax(0, 1.3fr);
  gap: clamp(50px, 8vw, 110px);
  align-items: start;
}
.lifecycle-heading {
  position: sticky;
  top: 110px;
}
.lifecycle-heading h2 {
  margin: 18px 0;
  color: var(--text);
  font-size: clamp(40px, 4.8vw, 61px);
  line-height: 1;
  letter-spacing: -.055em;
}
.lifecycle-heading > p:not(.eyebrow) {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.7;
}
.lifecycle-track {
  display: grid;
  margin: 0;
  padding: 0;
  list-style: none;
}
.lifecycle-track li {
  position: relative;
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 18px;
  min-height: 135px;
  padding: 0 0 28px;
}
.lifecycle-track li:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 47px;
  bottom: 0;
  left: 23px;
  width: 1px;
  background: linear-gradient(var(--neon), rgba(33, 245, 139, .1));
}
.lifecycle-track li > span {
  position: relative;
  z-index: 1;
  display: grid;
  width: 47px;
  height: 47px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .36);
  border-radius: 15px;
  background: #04180d;
  color: var(--neon);
  font: 800 9px/1 var(--mono);
  box-shadow: 0 0 24px -16px var(--glow);
}
.lifecycle-track li > div {
  padding: 4px 0 24px;
  border-bottom: 1px solid rgba(33, 245, 139, .1);
}
.lifecycle-track small,
.lifecycle-track strong {
  display: block;
}
.lifecycle-track small {
  margin-bottom: 8px;
  color: #56cf8e;
  font: 700 8px/1 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
}
.lifecycle-track strong {
  color: #e9f6ee;
  font-size: 17px;
}
.lifecycle-track p {
  margin: 8px 0 0;
  color: #82978b;
  font-size: 12px;
  line-height: 1.55;
}
.product-next-step {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 40px;
  margin-top: 20px;
  padding: clamp(34px, 5vw, 54px);
  align-items: center;
  border: 1px solid rgba(33, 245, 139, .24);
  border-radius: 24px;
  background:
    radial-gradient(circle at 0 0, rgba(33, 245, 139, .1), transparent 43%),
    rgba(3, 22, 12, .82);
}
.product-next-step h2 {
  max-width: 700px;
  margin: 13px 0 0;
  color: var(--text);
  font-size: clamp(32px, 4vw, 48px);
  line-height: 1.04;
  letter-spacing: -.045em;
}
.product-next-step > div:last-child {
  display: grid;
  gap: 13px;
  justify-items: center;
}
.product-next-step > div:last-child > a:not(.button) {
  color: #91a79a;
  font-size: 10px;
}

@media (prefers-reduced-motion: reduce) {
  .console-orb i { animation: none; }
  .workspace-module { transition: none; }
}
@media (max-width: 1050px) {
  .product-tour-hero {
    grid-template-columns: 1fr;
    max-width: 800px;
    margin-inline: auto;
    text-align: center;
  }
  .product-tour-copy h1,
  .product-tour-copy .lede {
    margin-inline: auto;
  }
  .product-tour-copy .eyebrow,
  .product-tour-copy .actions,
  .product-hero-proof {
    justify-content: center;
  }
  .product-console {
    transform: none;
    text-align: left;
  }
  .workspace-module-grid {
    grid-template-columns: 1fr 1fr;
  }
  .workspace-module:last-child {
    grid-column: 1 / -1;
    min-height: 410px;
  }
}
@media (max-width: 780px) {
  .product-page {
    padding-top: 62px;
  }
  .product-tour-hero {
    min-height: 0;
    padding-top: 42px;
  }
  .product-console-body {
    grid-template-columns: 1fr;
  }
  .product-console-body > aside {
    display: none;
  }
  .product-section-heading,
  .request-lifecycle,
  .product-next-step {
    grid-template-columns: 1fr;
  }
  .product-section-heading .eyebrow {
    grid-column: 1;
  }
  .workspace-module-grid {
    grid-template-columns: 1fr;
  }
  .workspace-module:last-child {
    grid-column: 1;
  }
  .lifecycle-heading {
    position: static;
  }
  .product-next-step > div:last-child {
    justify-items: start;
  }
}
@media (max-width: 560px) {
  .product-page {
    width: min(100% - 24px, 1220px);
  }
  .product-tour-copy h1 {
    font-size: 44px;
  }
  .product-tour-copy .actions {
    display: grid;
  }
  .product-tour-copy .button {
    justify-content: center;
  }
  .product-hero-proof {
    display: grid;
    width: max-content;
    margin-inline: auto;
    text-align: left;
  }
  .product-console-main {
    padding: 18px;
  }
  .console-metrics {
    grid-template-columns: 1fr;
  }
  .console-metrics article {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
  }
  .console-metrics article strong {
    grid-column: 2;
    grid-row: 1 / 3;
  }
  .console-conversation {
    grid-template-columns: 1fr;
  }
  .console-orb {
    width: 50px;
    height: 50px;
  }
  .workspace-module {
    min-height: 445px;
    padding: 23px 20px;
  }
  .product-next-step {
    padding: 30px 22px;
  }
}

/* Pricing page — commercial clarity instead of a repeated landing-page price block */
.pricing-page {
  width: min(1180px, calc(100% - 32px));
  padding-top: 94px;
}
.pricing-decision-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(390px, .72fr);
  gap: clamp(56px, 9vw, 120px);
  min-height: 670px;
  padding: 58px 0 108px;
  align-items: center;
}
.pricing-decision-copy .eyebrow {
  margin-bottom: 23px;
}
.pricing-decision-copy h1 {
  max-width: 720px;
  margin: 0;
  font-size: clamp(52px, 6vw, 78px);
  line-height: .95;
  letter-spacing: -.064em;
  text-wrap: balance;
}
.pricing-decision-copy .lede {
  max-width: 650px;
  margin: 27px 0 0;
  color: #a7bbae;
  font-size: 16px;
  line-height: 1.75;
}
.pricing-at-a-glance {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  max-width: 690px;
  margin: 35px 0 0;
  padding: 0;
  border-block: 1px solid rgba(33, 245, 139, .12);
}
.pricing-at-a-glance > div {
  padding: 18px 17px;
}
.pricing-at-a-glance > div + div {
  border-left: 1px solid rgba(33, 245, 139, .1);
}
.pricing-at-a-glance dt,
.pricing-at-a-glance dd {
  margin: 0;
}
.pricing-at-a-glance dt {
  color: #668071;
  font: 700 8px/1 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.pricing-at-a-glance dd {
  margin-top: 8px;
  color: #d8e9df;
  font-size: 12px;
  font-weight: 700;
}
.pricing-checkout-card {
  position: relative;
  overflow: hidden;
  padding: 30px;
  border: 1px solid rgba(33, 245, 139, .38);
  border-radius: 25px;
  background:
    radial-gradient(circle at 100% 0, rgba(33, 245, 139, .13), transparent 39%),
    linear-gradient(150deg, rgba(6, 39, 21, .96), rgba(2, 16, 9, .96));
  box-shadow: 0 42px 120px -72px var(--glow), inset 0 1px rgba(255, 255, 255, .04);
}
.pricing-checkout-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 18%;
  width: 64%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--neon), transparent);
}
.pricing-checkout-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}
.pricing-checkout-head span,
.pricing-checkout-head small {
  display: block;
}
.pricing-checkout-head span {
  color: var(--text);
  font-size: 17px;
  font-weight: 800;
}
.pricing-checkout-head small {
  margin-top: 5px;
  color: #789083;
  font-size: 9px;
}
.pricing-checkout-head > b {
  padding: 7px 9px;
  border-radius: 999px;
  background: var(--neon);
  color: #031109;
  font: 800 7px/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.pricing-checkout-card .billing-switch {
  width: 100%;
  margin: 27px 0 25px;
}
.pricing-checkout-card .billing-switch button {
  flex: 1;
  min-width: 0;
}
.checkout-price {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.checkout-price > span {
  color: #f1fff7;
  font-size: clamp(56px, 6vw, 76px);
  font-weight: 850;
  line-height: .95;
  letter-spacing: -.07em;
}
.checkout-price > small {
  color: #8ba094;
  font-size: 11px;
}
.pricing-checkout-card > p {
  min-height: 38px;
  margin: 13px 0 0;
  color: #8ca296;
  font-size: 10.5px;
  line-height: 1.55;
}
.pricing-checkout-card > ul {
  display: grid;
  gap: 11px;
  margin: 23px 0;
  padding: 20px 0 0;
  border-top: 1px solid rgba(33, 245, 139, .13);
  list-style: none;
}
.pricing-checkout-card > ul li {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #c5d8cc;
  font-size: 11px;
}
.pricing-checkout-card > ul li span {
  display: grid;
  width: 19px;
  height: 19px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .38);
  border-radius: 50%;
  color: var(--neon);
  font-size: 9px;
}
.pricing-checkout-card > .button {
  display: flex;
  min-height: 52px;
  justify-content: space-between;
}
.pricing-checkout-card .checkout-footnote {
  display: block;
  margin-top: 12px;
  color: #6f8578;
  font-size: 9px;
  text-align: center;
}
.trial-journey,
.cost-ownership,
.billing-clarity {
  padding: clamp(88px, 10vw, 132px) 0;
  border-top: 1px solid rgba(33, 245, 139, .12);
}
.pricing-section-heading {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 23px 70px;
  margin-bottom: 50px;
  align-items: end;
}
.pricing-section-heading .eyebrow {
  grid-column: 1 / -1;
  margin: 0;
}
.pricing-section-heading h2 {
  max-width: 650px;
  margin: 0;
  color: var(--text);
  font-size: clamp(40px, 5vw, 62px);
  line-height: 1;
  letter-spacing: -.055em;
}
.pricing-section-heading > p:not(.eyebrow) {
  max-width: 500px;
  margin: 0 0 4px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.7;
}
.trial-journey > ol {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(33, 245, 139, .17);
  border-radius: 22px;
  background: rgba(3, 19, 11, .64);
  list-style: none;
}
.trial-journey > ol li {
  position: relative;
  min-height: 245px;
  padding: 25px;
}
.trial-journey > ol li + li {
  border-left: 1px solid rgba(33, 245, 139, .11);
}
.trial-journey > ol li > span {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .31);
  border-radius: 13px;
  background: rgba(33, 245, 139, .06);
  color: var(--neon);
  font: 800 9px/1 var(--mono);
}
.trial-journey li small {
  display: block;
  margin-top: 40px;
  color: #55d18e;
  font: 700 8px/1 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.trial-journey li h3 {
  margin: 9px 0 8px;
  color: var(--text);
  font-size: 20px;
}
.trial-journey li p {
  margin: 0;
  color: #83998c;
  font-size: 11.5px;
  line-height: 1.65;
}
.cost-ownership-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
}
.cost-card {
  display: flex;
  min-height: 420px;
  padding: clamp(26px, 3.5vw, 40px);
  flex-direction: column;
  border: 1px solid rgba(33, 245, 139, .16);
  border-radius: 23px;
  background: rgba(3, 19, 11, .7);
}
.voicecontrol-cost {
  border-color: rgba(33, 245, 139, .4);
  background:
    radial-gradient(circle at 0 0, rgba(33, 245, 139, .11), transparent 43%),
    rgba(4, 28, 15, .82);
}
.cost-card-head {
  display: flex;
  align-items: center;
  gap: 15px;
}
.cost-card-head > span {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .3);
  border-radius: 14px;
  background: rgba(33, 245, 139, .065);
  color: var(--neon);
  font: 800 9px/1 var(--mono);
}
.cost-card-head small {
  color: #5fcf92;
  font: 700 8px/1 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.cost-card-head h3 {
  margin: 6px 0 0;
  color: var(--text);
  font-size: 22px;
}
.cost-card > ul {
  display: grid;
  gap: 0;
  margin: 27px 0 25px;
  padding: 0;
  list-style: none;
}
.cost-card > ul li {
  padding: 13px 0;
  border-top: 1px solid rgba(33, 245, 139, .1);
  color: #a9bdb1;
  font-size: 12px;
}
.cost-card > ul li::before {
  content: "✓";
  margin-right: 10px;
  color: var(--neon);
}
.cost-card footer {
  display: flex;
  margin-top: auto;
  padding-top: 18px;
  align-items: baseline;
  gap: 8px;
  border-top: 1px solid rgba(33, 245, 139, .12);
}
.cost-card footer strong {
  color: #effff5;
  font-size: 20px;
}
.cost-card footer span {
  color: #72887b;
  font-size: 10px;
}
.cost-provider-links {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
  margin-top: auto;
}
.cost-provider-links a {
  display: flex;
  min-height: 48px;
  padding: 11px 13px;
  align-items: center;
  justify-content: space-between;
  border: 1px solid rgba(33, 245, 139, .17);
  border-radius: 11px;
  background: rgba(33, 245, 139, .035);
  color: #c1d4c8;
  font-size: 10px;
  font-weight: 700;
  text-decoration: none;
  transition: border-color .2s ease, background .2s ease;
}
.cost-provider-links a:hover {
  border-color: rgba(33, 245, 139, .42);
  background: rgba(33, 245, 139, .08);
}
.cost-provider-links a span {
  color: var(--neon);
}
.cost-disclaimer {
  display: flex;
  max-width: 870px;
  margin: 20px auto 0;
  align-items: flex-start;
  justify-content: center;
  gap: 10px;
  color: #748a7d;
  font-size: 10px;
  line-height: 1.6;
  text-align: center;
}
.cost-disclaimer > span {
  display: grid;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .28);
  border-radius: 50%;
  color: var(--neon);
  font: 700 9px/1 serif;
}
.billing-clarity {
  display: grid;
  grid-template-columns: minmax(280px, .74fr) minmax(0, 1.26fr);
  gap: clamp(50px, 8vw, 110px);
  align-items: start;
}
.billing-clarity > div h2 {
  max-width: 490px;
  margin: 17px 0 0;
  color: var(--text);
  font-size: clamp(38px, 4.6vw, 58px);
  line-height: 1;
  letter-spacing: -.052em;
}
.billing-clarity dl {
  margin: 0;
}
.billing-clarity dl > div {
  padding: 20px 0;
  border-top: 1px solid rgba(33, 245, 139, .13);
}
.billing-clarity dt {
  color: #e5f3e9;
  font-size: 14px;
  font-weight: 750;
}
.billing-clarity dd {
  margin: 7px 0 0;
  color: #849a8e;
  font-size: 12px;
  line-height: 1.6;
}
.pricing-final-action {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 40px;
  margin-top: 10px;
  padding: clamp(34px, 5vw, 55px);
  align-items: center;
  border: 1px solid rgba(33, 245, 139, .25);
  border-radius: 24px;
  background:
    radial-gradient(circle at 0 0, rgba(33, 245, 139, .1), transparent 43%),
    rgba(3, 23, 12, .84);
}
.pricing-final-action h2 {
  max-width: 720px;
  margin: 13px 0 0;
  color: var(--text);
  font-size: clamp(32px, 4vw, 48px);
  line-height: 1.04;
  letter-spacing: -.046em;
}
.pricing-final-action > div:last-child {
  display: grid;
  gap: 13px;
  justify-items: center;
}
.pricing-final-action > div:last-child > a:not(.button) {
  color: #8da397;
  font-size: 10px;
}

@media (max-width: 960px) {
  .pricing-decision-hero {
    grid-template-columns: 1fr;
    max-width: 780px;
    margin-inline: auto;
    text-align: center;
  }
  .pricing-decision-copy h1,
  .pricing-decision-copy .lede,
  .pricing-at-a-glance {
    margin-inline: auto;
  }
  .pricing-decision-copy .eyebrow {
    justify-content: center;
  }
  .pricing-checkout-card {
    width: min(100%, 520px);
    margin-inline: auto;
    text-align: left;
  }
  .trial-journey > ol {
    grid-template-columns: 1fr 1fr;
  }
  .trial-journey > ol li:nth-child(3) {
    border-left: 0;
  }
  .trial-journey > ol li:nth-child(n+3) {
    border-top: 1px solid rgba(33, 245, 139, .11);
  }
}
@media (max-width: 760px) {
  .pricing-page {
    padding-top: 64px;
  }
  .pricing-section-heading,
  .billing-clarity,
  .pricing-final-action {
    grid-template-columns: 1fr;
  }
  .pricing-section-heading .eyebrow {
    grid-column: 1;
  }
  .cost-ownership-grid {
    grid-template-columns: 1fr;
  }
  .pricing-final-action > div:last-child {
    justify-items: start;
  }
}
@media (max-width: 520px) {
  .pricing-page {
    width: min(100% - 24px, 1180px);
  }
  .pricing-decision-hero {
    min-height: 0;
    padding-top: 42px;
  }
  .pricing-decision-copy h1 {
    font-size: 45px;
  }
  .pricing-at-a-glance {
    grid-template-columns: 1fr;
  }
  .pricing-at-a-glance > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .pricing-at-a-glance > div + div {
    border-top: 1px solid rgba(33, 245, 139, .1);
    border-left: 0;
  }
  .pricing-at-a-glance dd {
    margin-top: 0;
  }
  .pricing-checkout-card {
    padding: 24px 19px;
  }
  .pricing-checkout-head {
    align-items: center;
  }
  .pricing-checkout-card .billing-switch button span {
    display: none;
  }
  .trial-journey > ol {
    grid-template-columns: 1fr;
  }
  .trial-journey > ol li + li {
    border-top: 1px solid rgba(33, 245, 139, .11);
    border-left: 0;
  }
  .trial-journey > ol li {
    min-height: 0;
  }
  .trial-journey li small {
    margin-top: 25px;
  }
  .cost-card {
    min-height: 390px;
    padding: 25px 20px;
  }
  .cost-provider-links {
    grid-template-columns: 1fr;
  }
  .pricing-final-action {
    padding: 30px 22px;
  }
}

/* Documentation — task-first installation workspace */
.docs-page {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: clamp(48px, 7vw, 92px);
  width: min(1180px, calc(100% - 32px));
  padding-top: 110px;
  align-items: start;
}
.docs-task-nav {
  position: sticky;
  top: 96px;
  display: flex;
  padding: 20px 14px;
  flex-direction: column;
  gap: 4px;
  border: 1px solid rgba(33, 245, 139, .17);
  border-radius: 18px;
  background: rgba(2, 17, 9, .78);
  box-shadow: 0 24px 72px -58px var(--glow);
}
.docs-task-nav > div {
  display: flex;
  margin: 13px 8px 7px;
  align-items: center;
  gap: 9px;
}
.docs-task-nav > div:first-child {
  margin-top: 3px;
}
.docs-task-nav > div span {
  color: var(--neon);
  font: 800 8px/1 var(--mono);
}
.docs-task-nav > div strong {
  color: #dcebe2;
  font: 750 9px/1 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.docs-task-nav > a {
  position: relative;
  padding: 9px 10px 9px 27px;
  border-radius: 9px;
  color: #82988b;
  font-size: 10px;
  text-decoration: none;
  transition: color .18s ease, background .18s ease;
}
.docs-task-nav > a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 11px;
  width: 5px;
  height: 5px;
  border: 1px solid #52705f;
  border-radius: 50%;
  transform: translateY(-50%);
}
.docs-task-nav > a:hover,
.docs-task-nav > a.is-active {
  background: rgba(33, 245, 139, .075);
  color: #dff3e6;
}
.docs-task-nav > a.is-active::before {
  border-color: var(--neon);
  background: var(--neon);
  box-shadow: 0 0 8px var(--glow);
}
.docs-workspace {
  min-width: 0;
}
.docs-hero {
  max-width: 850px;
  padding: 34px 0 90px;
}
.docs-hero .eyebrow {
  margin-bottom: 22px;
}
.docs-hero h1 {
  max-width: 850px;
  margin: 0;
  font-size: clamp(48px, 6vw, 74px);
  line-height: .96;
  letter-spacing: -.062em;
  text-wrap: balance;
}
.docs-hero > p:not(.eyebrow) {
  max-width: 700px;
  margin: 26px 0 0;
  color: #a6baae;
  font-size: 16px;
  line-height: 1.75;
}
.docs-route-summary {
  display: flex;
  width: max-content;
  max-width: 100%;
  margin-top: 31px;
  padding: 10px;
  align-items: center;
  gap: 11px;
  border: 1px solid rgba(33, 245, 139, .14);
  border-radius: 13px;
  background: rgba(3, 23, 12, .6);
}
.docs-route-summary span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #9db1a5;
  font-size: 9.5px;
  font-weight: 650;
}
.docs-route-summary span i {
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .3);
  border-radius: 7px;
  color: var(--neon);
  font: 800 8px/1 var(--mono);
  font-style: normal;
}
.docs-route-summary b {
  color: #3d6a50;
  font-size: 12px;
}
.ai-install-section,
.manual-install-section,
.provider-setup-section,
.launch-checklist-section,
.security-reference-section {
  padding: clamp(78px, 9vw, 110px) 0;
  scroll-margin-top: 90px;
  border-top: 1px solid rgba(33, 245, 139, .12);
}
.docs-section-title {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}
.docs-section-title .eyebrow {
  margin: 0 0 14px;
}
.docs-section-title h2 {
  max-width: 720px;
  margin: 0;
  color: var(--text);
  font-size: clamp(38px, 4.8vw, 58px);
  line-height: 1;
  letter-spacing: -.053em;
}
.recommended-chip,
.time-chip,
.check-count {
  flex: 0 0 auto;
  padding: 7px 10px;
  border: 1px solid rgba(33, 245, 139, .26);
  border-radius: 999px;
  background: rgba(33, 245, 139, .065);
  color: #69df9f;
  font: 750 8px/1 var(--mono);
  letter-spacing: .09em;
  text-transform: uppercase;
}
.docs-section-intro {
  max-width: 780px;
  margin: 20px 0 0;
  color: #91a69a;
  font-size: 14px;
  line-height: 1.72;
}
.ai-prompt-builder {
  display: grid;
  grid-template-columns: minmax(230px, .62fr) minmax(0, 1.38fr);
  gap: 14px;
  margin-top: 35px;
}
.prompt-fields {
  display: flex;
  padding: 22px;
  flex-direction: column;
  gap: 17px;
  border: 1px solid rgba(33, 245, 139, .15);
  border-radius: 18px;
  background: rgba(3, 21, 12, .66);
}
.prompt-fields label {
  display: grid;
  gap: 7px;
  color: #d8e8de;
  font-size: 10px;
  font-weight: 700;
}
.prompt-fields input {
  width: 100%;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid rgba(33, 245, 139, .16);
  border-radius: 10px;
  outline: 0;
  background: rgba(1, 11, 6, .72);
  color: #e8f7ed;
  font: 10px/1 var(--mono);
}
.prompt-fields input:focus {
  border-color: var(--neon);
  box-shadow: 0 0 0 3px rgba(33, 245, 139, .09);
}
.prompt-fields input[aria-invalid="true"] {
  border-color: #f6c76d;
  box-shadow: 0 0 0 3px rgba(246, 199, 109, .09);
}
.prompt-fields input::placeholder {
  color: #557064;
}
.prompt-fields label small {
  color: #687e72;
  font-size: 8px;
  font-weight: 500;
  line-height: 1.35;
}
.prompt-preview {
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(33, 245, 139, .28);
  border-radius: 18px;
  background: #020e08;
  box-shadow: 0 28px 90px -65px var(--glow);
}
.prompt-preview-bar {
  display: flex;
  min-height: 56px;
  padding: 10px 12px 10px 17px;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  border-bottom: 1px solid rgba(33, 245, 139, .13);
  background: rgba(255, 255, 255, .018);
}
.prompt-preview-bar > span {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: #849c8e;
  font: 700 8px/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.prompt-preview-bar > span i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--neon);
  box-shadow: 0 0 10px var(--glow);
}
.prompt-preview-bar button {
  display: inline-flex;
  min-height: 36px;
  padding: 0 12px;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--neon);
  border-radius: 9px;
  background: var(--neon);
  color: #031109;
  cursor: pointer;
  transition: background .18s ease, box-shadow .18s ease;
}
.prompt-preview-bar button:hover {
  background: #69ffb2;
  box-shadow: 0 0 24px -12px var(--glow);
}
.prompt-preview-bar button svg {
  width: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
}
.prompt-preview-bar button b {
  font-size: 9px;
}
.prompt-preview pre {
  max-height: 520px;
  margin: 0;
  overflow: auto;
  scrollbar-color: rgba(33, 245, 139, .3) transparent;
}
.prompt-preview code {
  display: block;
  min-width: 620px;
  padding: 23px;
  color: #b8d8c5;
  font: 10px/1.68 var(--mono);
  white-space: pre-wrap;
}
.prompt-safety {
  display: flex;
  padding: 15px 18px;
  align-items: flex-start;
  gap: 11px;
  border-top: 1px solid rgba(33, 245, 139, .13);
  background: rgba(33, 245, 139, .035);
}
.prompt-safety > span {
  display: grid;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .34);
  border-radius: 50%;
  color: var(--neon);
  font-size: 9px;
}
.prompt-safety strong,
.prompt-safety small {
  display: block;
}
.prompt-safety strong {
  color: #d6eadc;
  font-size: 10px;
}
.prompt-safety small {
  margin-top: 4px;
  color: #71877a;
  font-size: 8.5px;
  line-height: 1.45;
}
.prompt-next-step {
  display: flex;
  margin-top: 14px;
  padding: 13px 16px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border: 1px solid rgba(33, 245, 139, .11);
  border-radius: 12px;
  color: #70867a;
  font-size: 9px;
}
.prompt-next-step a {
  color: #bfe0cb;
  font-weight: 700;
  text-decoration: none;
}
.prompt-next-step a i {
  margin-left: 7px;
  color: var(--neon);
  font-style: normal;
}
.manual-code-card {
  margin-top: 31px;
  overflow: hidden;
  border: 1px solid rgba(33, 245, 139, .22);
  border-radius: 17px;
  background: #020e08;
}
.manual-code-tabs {
  display: flex;
  min-height: 52px;
  padding: 8px 10px 8px 17px;
  align-items: center;
  gap: 18px;
  border-bottom: 1px solid rgba(33, 245, 139, .12);
}
.manual-code-tabs span {
  color: #657d70;
  font-size: 9px;
  font-weight: 700;
}
.manual-code-tabs span.is-active {
  color: var(--neon);
}
.manual-code-tabs button {
  min-height: 34px;
  margin-left: auto;
  padding: 0 12px;
  border: 1px solid rgba(33, 245, 139, .27);
  border-radius: 8px;
  background: rgba(33, 245, 139, .06);
  color: #b8d2c2;
  font-size: 9px;
  font-weight: 700;
  cursor: pointer;
}
.manual-code-card pre {
  margin: 0;
  overflow: auto;
}
.manual-code-card code {
  display: block;
  min-width: 560px;
  padding: 25px;
  color: #b9e2c8;
  font: 11px/1.7 var(--mono);
}
.manual-warning {
  display: grid;
  grid-template-columns: 37px 1fr;
  gap: 13px;
  margin-top: 13px;
  padding: 14px 16px;
  border: 1px solid rgba(246, 199, 109, .2);
  border-radius: 12px;
  background: rgba(246, 199, 109, .035);
}
.manual-warning > span {
  display: grid;
  width: 37px;
  height: 37px;
  place-items: center;
  border: 1px solid rgba(246, 199, 109, .3);
  border-radius: 10px;
  color: #f6c76d;
  font-weight: 800;
}
.manual-warning strong {
  color: #e8dcc5;
  font-size: 10px;
}
.manual-warning p {
  margin: 5px 0 0;
  color: #897f6d;
  font-size: 9px;
  line-height: 1.5;
}
.provider-choice-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 13px;
  margin-top: 31px;
}
.provider-choice-grid > a {
  display: grid;
  grid-template-columns: 50px 1fr 24px;
  gap: 14px;
  min-height: 172px;
  padding: 25px;
  align-items: center;
  border: 1px solid rgba(33, 245, 139, .16);
  border-radius: 17px;
  background:
    radial-gradient(circle at 0 0, rgba(33, 245, 139, .07), transparent 38%),
    rgba(3, 21, 12, .66);
  text-decoration: none;
  transition: border-color .2s ease, transform .2s ease;
}
.provider-choice-grid > a:hover {
  border-color: rgba(33, 245, 139, .42);
  transform: translateY(-3px);
}
.provider-mark {
  display: grid;
  width: 50px;
  height: 50px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .3);
  border-radius: 14px;
  background: rgba(33, 245, 139, .06);
  color: var(--neon);
  font-size: 17px;
  font-weight: 800;
}
.provider-choice-grid small,
.provider-choice-grid strong {
  display: block;
}
.provider-choice-grid small {
  color: #5ccf90;
  font: 700 10px/1 var(--mono);
  letter-spacing: .08em;
}
.provider-choice-grid strong {
  margin-top: 9px;
  color: #e4f2e8;
  font-size: 17px;
  line-height: 1.3;
}
.provider-choice-grid p {
  margin: 10px 0 0;
  color: #7e9487;
  font-size: 12px;
  line-height: 1.58;
}
.provider-choice-grid > a > i {
  color: var(--neon);
  font-size: 16px;
  font-style: normal;
}
.launch-check-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 32px 0 0;
  padding: 0;
  list-style: none;
}
.launch-check-grid li {
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 13px;
  min-height: 142px;
  padding: 22px;
  border: 1px solid rgba(33, 245, 139, .13);
  border-radius: 14px;
  background: rgba(3, 20, 11, .58);
}
.launch-check-grid li > span {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .27);
  border-radius: 11px;
  color: var(--neon);
  font: 800 10px/1 var(--mono);
}
.launch-check-grid strong {
  color: #dfede4;
  font-size: 15px;
  line-height: 1.35;
}
.launch-check-grid p {
  margin: 9px 0 0;
  color: #778d80;
  font-size: 12px;
  line-height: 1.6;
}
.security-reference-section {
  display: grid;
  grid-template-columns: minmax(250px, .7fr) minmax(0, 1.3fr);
  gap: clamp(45px, 7vw, 85px);
  align-items: start;
}
.security-reference-section > div:first-child h2 {
  margin: 16px 0 0;
  color: var(--text);
  font-size: clamp(36px, 4.6vw, 52px);
  line-height: 1;
  letter-spacing: -.05em;
}
.security-value-table {
  border: 1px solid rgba(33, 245, 139, .16);
  border-radius: 16px;
  background: rgba(3, 20, 11, .6);
}
.security-value-table > div {
  display: grid;
  grid-template-columns: 1fr 100px 1.2fr;
  gap: 15px;
  min-height: 82px;
  padding: 18px 20px;
  align-items: center;
}
.security-value-table > div + div {
  border-top: 1px solid rgba(33, 245, 139, .1);
}
.security-value-table span {
  color: #d3e3d9;
  font-size: 13px;
  font-weight: 700;
}
.security-value-table b {
  color: #62da99;
  font-size: 11.5px;
}
.security-value-table b.server-only {
  color: #f6c76d;
}
.security-value-table b.managed-value {
  color: #80a99f;
}
.security-value-table small {
  color: #71877a;
  font-size: 11px;
  line-height: 1.5;
}

@media (max-width: 980px) {
  .docs-page {
    grid-template-columns: 1fr;
  }
  .docs-task-nav {
    position: sticky;
    z-index: 5;
    top: 75px;
    display: flex;
    padding: 9px;
    overflow-x: auto;
    flex-direction: row;
    border-radius: 13px;
    backdrop-filter: blur(18px);
  }
  .docs-task-nav > div {
    display: none;
  }
  .docs-task-nav > a {
    flex: 0 0 auto;
    padding: 10px 12px;
  }
  .docs-task-nav > a::before {
    display: none;
  }
}
@media (max-width: 760px) {
  .docs-page {
    padding-top: 78px;
  }
  .docs-hero {
    padding-top: 24px;
  }
  .ai-prompt-builder,
  .security-reference-section {
    grid-template-columns: 1fr;
  }
  .provider-choice-grid {
    grid-template-columns: 1fr;
  }
  .prompt-preview code {
    min-width: 0;
  }
  .docs-section-title {
    align-items: flex-start;
    flex-direction: column;
  }
}
@media (max-width: 540px) {
  .docs-page {
    width: min(100% - 24px, 1180px);
    gap: 34px;
  }
  .docs-task-nav {
    top: 67px;
  }
  .docs-hero h1 {
    font-size: 44px;
  }
  .docs-route-summary {
    display: grid;
    width: 100%;
  }
  .docs-route-summary b {
    display: none;
  }
  .prompt-fields {
    padding: 18px;
  }
  .prompt-preview-bar {
    align-items: flex-start;
    flex-direction: column;
  }
  .prompt-preview-bar button {
    width: 100%;
    justify-content: center;
  }
  .prompt-preview pre {
    max-height: 430px;
  }
  .prompt-preview code {
    padding: 18px;
    font-size: 9px;
  }
  .prompt-next-step {
    align-items: flex-start;
    flex-direction: column;
  }
  .manual-code-tabs span:nth-child(2) {
    display: none;
  }
  .launch-check-grid {
    grid-template-columns: 1fr;
  }
  .security-value-table > div {
    grid-template-columns: 1fr auto;
  }
  .security-value-table small {
    grid-column: 1 / -1;
  }
}

/* Account experience — focused, route-aware, and accessible */
.auth-page {
  min-height: 100vh;
  background:
    radial-gradient(760px circle at 5% 52%, rgba(33, 245, 139, .105), transparent 66%),
    radial-gradient(620px circle at 94% 12%, rgba(21, 141, 72, .07), transparent 64%),
    #020906;
}
.auth-page [hidden] {
  display: none !important;
}
.auth-header {
  position: relative;
  z-index: 10;
  display: flex;
  width: min(1220px, calc(100% - 32px));
  min-height: 64px;
  margin: 14px auto 0;
  padding: 10px 13px 10px 19px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border: 1px solid rgba(33, 245, 139, .2);
  border-radius: 17px;
  background: rgba(2, 15, 8, .86);
  box-shadow: 0 18px 60px -44px #000, inset 0 1px rgba(255, 255, 255, .025);
  backdrop-filter: blur(20px);
}
.auth-header::after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 20px;
  width: 82px;
  height: 1px;
  background: linear-gradient(90deg, var(--neon), transparent);
}
.auth-header .brand-wave {
  font-size: 16px;
}
.auth-header-actions {
  display: flex;
  align-items: center;
  gap: 11px;
}
.auth-header-actions > span {
  display: inline-flex;
  padding: 8px 11px;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(33, 245, 139, .12);
  border-radius: 999px;
  color: #748b7d;
  font: 700 10px/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.auth-header-actions > span i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--neon);
  box-shadow: 0 0 9px var(--glow);
}
.auth-back {
  display: inline-flex;
  min-height: 38px;
  padding: 0 12px;
  align-items: center;
  gap: 8px;
  border-radius: 10px;
  color: #9aafa2;
  font-size: 11px;
  font-weight: 650;
}
.auth-back b {
  color: var(--neon);
}
.auth-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(440px, .78fr);
  gap: clamp(36px, 6vw, 82px);
  width: min(1180px, calc(100% - 40px));
  min-height: calc(100vh - 92px);
  padding: 54px 0 70px;
  align-items: center;
}
.auth-page[data-auth-mode="signup"] .auth-shell {
  grid-template-columns: minmax(350px, .72fr) minmax(570px, 1fr);
  width: min(1240px, calc(100% - 40px));
}
.auth-story {
  position: relative;
  display: flex;
  min-height: 600px;
  padding: clamp(34px, 4.5vw, 54px);
  overflow: hidden;
  flex-direction: column;
  justify-content: flex-end;
  border: 1px solid rgba(33, 245, 139, .14);
  border-radius: 28px;
  background:
    linear-gradient(rgba(33, 245, 139, .021) 1px, transparent 1px),
    linear-gradient(90deg, rgba(33, 245, 139, .021) 1px, transparent 1px),
    radial-gradient(circle at 78% 8%, rgba(33, 245, 139, .12), transparent 36%),
    rgba(3, 19, 11, .66);
  background-size: 48px 48px, 48px 48px, auto, auto;
}
.auth-story::after {
  content: "";
  position: absolute;
  right: -170px;
  bottom: -250px;
  width: 460px;
  height: 460px;
  border: 1px solid rgba(33, 245, 139, .08);
  border-radius: 50%;
}
.auth-orb-scene {
  position: absolute;
  top: 42px;
  right: 50px;
  width: 185px;
  height: 185px;
  border: 1px solid rgba(33, 245, 139, .12);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(49, 255, 151, .15), rgba(11, 78, 43, .045) 45%, transparent 69%);
  box-shadow: 0 0 70px -40px var(--glow), inset 0 0 40px rgba(33, 245, 139, .035);
}
.auth-orbit {
  position: absolute;
  border: 1px solid rgba(78, 255, 165, .25);
  border-radius: 50%;
  animation: auth-orbit-spin 11s linear infinite;
}
.auth-orbit.orbit-one {
  inset: 18px 52px;
}
.auth-orbit.orbit-two {
  inset: 52px 18px;
  animation-duration: 8s;
  animation-direction: reverse;
}
.auth-orbit.orbit-three {
  inset: 31px;
  border-color: rgba(78, 255, 165, .13);
  animation-duration: 15s;
  transform: rotate(42deg);
}
.auth-orb-scene > i {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #eafff2;
  box-shadow: 0 0 10px #fff, 0 0 28px var(--neon);
  transform: translate(-50%, -50%);
}
.auth-orb-scene > b {
  position: absolute;
  top: 22%;
  left: 22%;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--neon);
  box-shadow: 0 0 10px var(--glow);
}
@keyframes auth-orbit-spin {
  to { transform: rotate(360deg); }
}
.auth-story-view {
  position: relative;
  z-index: 1;
  max-width: 620px;
}
.auth-story-view .eyebrow {
  margin-bottom: 18px;
}
.auth-story-view h1 {
  max-width: 650px;
  margin: 0;
  font-size: clamp(43px, 4.8vw, 64px);
  line-height: .97;
  letter-spacing: -.06em;
  text-wrap: balance;
}
.auth-story-view > p:not(.eyebrow) {
  max-width: 570px;
  margin: 22px 0 0;
  color: #99aea1;
  font-size: 14px;
  line-height: 1.72;
}
.auth-context-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
  max-width: 470px;
  margin-top: 27px;
}
.auth-context-grid article {
  padding: 14px;
  border: 1px solid rgba(33, 245, 139, .12);
  border-radius: 12px;
  background: rgba(1, 12, 6, .5);
}
.auth-context-grid small,
.auth-context-grid strong {
  display: block;
}
.auth-context-grid small {
  color: #5ed593;
  font: 700 10px/1 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.auth-context-grid strong {
  margin-top: 7px;
  color: #c9dbd0;
  font-size: 13px;
}
.auth-trial-steps {
  display: grid;
  gap: 8px;
  max-width: 500px;
  margin: 26px 0 0;
  padding: 0;
  list-style: none;
}
.auth-trial-steps li {
  display: flex;
  min-height: 42px;
  padding: 10px 12px;
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(33, 245, 139, .11);
  border-radius: 10px;
  background: rgba(1, 12, 6, .45);
  color: #afc2b6;
  font-size: 13px;
}
.auth-trial-steps li span {
  color: var(--neon);
  font: 800 10px/1 var(--mono);
}
.auth-recovery-note {
  display: flex;
  max-width: 490px;
  margin-top: 27px;
  padding: 15px;
  align-items: flex-start;
  gap: 12px;
  border: 1px solid rgba(33, 245, 139, .13);
  border-radius: 12px;
  background: rgba(33, 245, 139, .035);
}
.auth-recovery-note > span {
  display: grid;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .32);
  border-radius: 50%;
  color: var(--neon);
  font-size: 9px;
}
.auth-recovery-note strong,
.auth-recovery-note small {
  display: block;
}
.auth-recovery-note strong {
  color: #d6e7dc;
  font-size: 13px;
}
.auth-recovery-note small {
  margin-top: 5px;
  color: #748a7d;
  font-size: 11px;
  line-height: 1.45;
}
.auth-proof {
  position: relative;
  z-index: 1;
  display: flex;
  margin-top: 32px;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  color: #6f8578;
  font: 650 10px/1.4 var(--mono);
  letter-spacing: .04em;
}
.auth-proof i {
  color: #355842;
  font-style: normal;
}
.auth-card {
  position: relative;
  width: 100%;
  padding: clamp(30px, 4vw, 43px);
  overflow: hidden;
  border: 1px solid rgba(33, 245, 139, .28);
  border-radius: 25px;
  background:
    radial-gradient(circle at 100% 0, rgba(33, 245, 139, .09), transparent 35%),
    linear-gradient(150deg, rgba(5, 31, 17, .97), rgba(2, 15, 8, .97));
  box-shadow: 0 40px 120px -68px var(--glow), inset 0 1px rgba(255, 255, 255, .035);
}
.auth-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 15%;
  width: 70%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--neon), transparent);
  opacity: .7;
}
.auth-card-heading {
  display: flex;
  align-items: center;
  gap: 14px;
}
.auth-card-icon {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .32);
  border-radius: 14px;
  background: rgba(33, 245, 139, .065);
  color: var(--neon);
  box-shadow: 0 0 28px -18px var(--glow);
}
.auth-card-icon svg {
  width: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.auth-card .auth-kicker {
  margin: 0 0 6px;
  color: #66dc9c;
  font-size: 10px;
}
.auth-card h2 {
  margin: 0;
  color: var(--text);
  font-size: clamp(30px, 3.3vw, 39px);
  line-height: 1;
  letter-spacing: -.04em;
}
.auth-card .auth-intro {
  margin: 19px 0 26px;
  color: #8fa599;
  font-size: 15px;
  line-height: 1.65;
}
.auth-card form {
  display: grid;
  gap: 17px;
}
.auth-field {
  display: grid;
  gap: 8px;
  color: #dcebe2;
  font-size: 13px;
  font-weight: 700;
}
.auth-field > span {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.auth-field > span a {
  color: #73e2a6;
  font-size: 12px;
  text-decoration: none;
}
.auth-field > span i {
  color: #70867a;
  font-size: 11px;
  font-style: normal;
  font-weight: 500;
}
.auth-field > div {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  min-height: 52px;
  padding: 0 12px;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(33, 245, 139, .17);
  border-radius: 11px;
  background: rgba(1, 10, 5, .68);
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.auth-field > div:focus-within {
  border-color: rgba(33, 245, 139, .68);
  background: rgba(2, 16, 8, .82);
  box-shadow: 0 0 0 3px rgba(33, 245, 139, .085);
}
.auth-field > div > svg {
  width: 18px;
  fill: none;
  stroke: #6e8a79;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.auth-card .auth-field input:not([type="checkbox"]) {
  width: 100%;
  height: 50px;
  min-width: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: #edfaf2;
  font-size: 15px;
  box-shadow: none;
}
.auth-field input::placeholder {
  color: #546b5d;
}
.auth-field > div > button {
  padding: 7px 8px;
  border: 0;
  border-radius: 7px;
  background: rgba(33, 245, 139, .06);
  color: #74dca4;
  font-size: 11px;
  font-weight: 750;
  cursor: pointer;
}
.auth-field > small {
  color: #667d70;
  font-size: 11px;
}
.auth-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
}
.auth-page[data-auth-mode="signup"] .auth-card {
  padding: 35px;
}
.auth-page[data-auth-mode="signup"] .auth-card .auth-intro {
  margin-bottom: 22px;
}
.check-row {
  display: grid;
  grid-template-columns: 18px 1fr !important;
  gap: 9px !important;
  align-items: start;
  color: #849a8d !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.5;
}
.check-row input {
  width: 15px;
  height: 15px;
  margin-top: 1px;
  accent-color: var(--neon);
}
.check-row a {
  color: #75dca4;
}
.auth-submit {
  display: flex;
  width: 100%;
  min-height: 51px;
  margin-top: 2px;
  padding-inline: 17px;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  box-shadow: 0 14px 32px -20px var(--glow);
}
.auth-submit > span {
  color: #031109;
  font-size: 14px;
}
.auth-submit > b {
  color: #031109;
  font-size: 12px;
}
.auth-submit.is-loading {
  filter: saturate(.45);
}
.auth-divider {
  position: relative;
  margin: 24px 0 16px;
  border-top: 1px solid rgba(33, 245, 139, .1);
  text-align: center;
}
.auth-divider span {
  position: relative;
  top: -8px;
  padding: 0 10px;
  background: #04180d;
  color: #6d8376;
  font-size: 11px;
}
.auth-secondary-action {
  display: flex;
  min-height: 48px;
  padding: 0 13px;
  align-items: center;
  justify-content: space-between;
  border: 1px solid rgba(33, 245, 139, .16);
  border-radius: 11px;
  background: rgba(33, 245, 139, .035);
  color: #d0e1d7;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}
.auth-secondary-action span {
  color: #67d99c;
  font-size: 11px;
}
.auth-switch {
  margin: 20px 0 0;
  color: #7b9184;
  font-size: 12px;
  text-align: center;
}
.auth-switch a {
  color: #73e2a6;
  font-weight: 700;
}
.recovery-explainer {
  display: grid;
  grid-template-columns: 26px 1fr;
  gap: 10px;
  margin-top: 20px;
  padding: 13px;
  border: 1px solid rgba(33, 245, 139, .11);
  border-radius: 10px;
  background: rgba(33, 245, 139, .025);
}
.recovery-explainer > span {
  display: grid;
  width: 26px;
  height: 26px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .25);
  border-radius: 50%;
  color: var(--neon);
  font: 700 9px/1 serif;
}
.recovery-explainer strong,
.recovery-explainer small {
  display: block;
}
.recovery-explainer strong {
  color: #cbdcd1;
  font-size: 12px;
}
.recovery-explainer small {
  margin-top: 5px;
  color: #6d8376;
  font-size: 11px;
  line-height: 1.45;
}
.auth-security {
  display: flex;
  margin: 24px 0 0;
  padding-top: 18px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-top: 1px solid rgba(33, 245, 139, .1);
  color: #647a6d;
  font-size: 10px;
  line-height: 1.5;
  text-align: center;
}
.auth-security > span {
  display: grid;
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  place-items: center;
  border: 1px solid rgba(33, 245, 139, .25);
  border-radius: 50%;
  color: var(--neon);
  font-size: 7px;
}
.form-notice {
  margin-top: 16px;
  padding: 12px 14px;
  border-radius: 10px;
  font-size: 12px;
  line-height: 1.5;
}

@media (prefers-reduced-motion: reduce) {
  .auth-orbit { animation: none; }
}
@media (max-width: 980px) {
  .auth-shell,
  .auth-page[data-auth-mode="signup"] .auth-shell {
    grid-template-columns: 1fr;
    width: min(620px, calc(100% - 32px));
    padding-top: 42px;
  }
  .auth-story {
    min-height: 320px;
    padding: 32px;
  }
  .auth-orb-scene {
    top: 28px;
    right: 34px;
    width: 125px;
    height: 125px;
  }
  .auth-story-view h1 {
    max-width: 480px;
    font-size: 42px;
  }
  .auth-story-view > p:not(.eyebrow) {
    max-width: 450px;
  }
  .auth-context-grid,
  .auth-trial-steps,
  .auth-recovery-note {
    display: none;
  }
  .auth-proof {
    margin-top: 22px;
  }
}
@media (max-width: 640px) {
  .auth-header {
    width: calc(100% - 20px);
    margin-top: 10px;
    padding-left: 14px;
  }
  .auth-header-actions > span {
    display: none;
  }
  .auth-back {
    padding-inline: 9px;
    font-size: 9px;
  }
  .auth-shell,
  .auth-page[data-auth-mode="signup"] .auth-shell {
    width: min(100% - 20px, 620px);
    padding: 28px 0 45px;
  }
  .auth-story {
    display: none;
  }
  .auth-card,
  .auth-page[data-auth-mode="signup"] .auth-card {
    padding: 27px 20px;
    border-radius: 21px;
  }
  .auth-card-heading {
    align-items: flex-start;
  }
  .auth-card-icon {
    width: 43px;
    height: 43px;
    flex-basis: 43px;
  }
  .auth-form-grid {
    grid-template-columns: 1fr;
  }
}

/* Account experience v2 — one clear task, one calm surface */
.auth-page {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  background:
    radial-gradient(520px circle at 50% 42%, rgba(30, 220, 118, .075), transparent 72%),
    linear-gradient(180deg, #020a06 0%, #031009 48%, #020a06 100%);
}
.auth-header {
  width: min(1120px, calc(100% - 40px));
  min-height: 58px;
  margin-top: 18px;
  padding: 8px 10px 8px 17px;
  border-radius: 14px;
  background: rgba(2, 13, 7, .78);
  box-shadow: none;
}
.auth-header::after {
  width: 64px;
}
.auth-header-actions > span {
  padding: 7px 10px;
  font-size: 9px;
}
.auth-back {
  min-height: 36px;
  border: 1px solid transparent;
}
.auth-back:hover {
  border-color: rgba(33, 245, 139, .16);
  background: rgba(33, 245, 139, .045);
  color: #dcebe2;
}
.auth-shell,
.auth-page[data-auth-mode="signup"] .auth-shell {
  position: relative;
  display: flex;
  width: min(100% - 32px, 620px);
  min-height: auto;
  margin: auto;
  padding: 54px 0 72px;
  align-items: center;
  justify-content: center;
}
.auth-page[data-auth-mode="signup"] .auth-shell {
  width: min(100% - 32px, 620px);
}
.auth-shell::before,
.auth-shell::after {
  content: "";
  position: absolute;
  z-index: 0;
  border-radius: 50%;
  pointer-events: none;
}
.auth-shell::before {
  top: 16px;
  left: 50%;
  width: 330px;
  height: 330px;
  border: 1px solid rgba(33, 245, 139, .045);
  box-shadow: inset 0 0 80px rgba(33, 245, 139, .018);
  transform: translateX(-50%);
}
.auth-shell::after {
  top: 105px;
  left: 50%;
  width: 8px;
  height: 8px;
  background: rgba(210, 255, 231, .8);
  box-shadow: 0 0 18px var(--neon), 0 0 55px rgba(33, 245, 139, .48);
  transform: translateX(-50%);
}
.auth-story {
  display: none;
}
.auth-card,
.auth-page[data-auth-mode="signup"] .auth-card {
  position: relative;
  z-index: 1;
  width: 100%;
  padding: 38px;
  overflow: visible;
  border: 1px solid rgba(33, 245, 139, .21);
  border-radius: 22px;
  background:
    linear-gradient(180deg, rgba(5, 25, 14, .97), rgba(2, 15, 8, .985));
  box-shadow:
    0 32px 90px -54px rgba(0, 0, 0, .95),
    0 20px 70px -58px var(--glow),
    inset 0 1px rgba(255, 255, 255, .035);
}
.auth-card::before {
  left: 24%;
  width: 52%;
  opacity: .55;
}
.auth-card-heading {
  display: block;
  text-align: center;
}
.auth-card-icon {
  width: 46px;
  height: 46px;
  margin: 0 auto 17px;
  border-radius: 13px;
}
.auth-card .auth-kicker {
  margin-bottom: 10px;
  font: 750 10px/1 var(--mono);
  letter-spacing: .16em;
}
.auth-card h2 {
  font-size: clamp(32px, 5vw, 42px);
  line-height: 1.08;
  letter-spacing: -.045em;
}
.auth-card .auth-intro {
  max-width: 490px;
  margin: 14px auto 28px;
  color: #90a599;
  font-size: 14px;
  line-height: 1.6;
  text-align: center;
}
.auth-social {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 11px;
  margin-bottom: 22px;
}
.auth-social a {
  display: flex;
  min-height: 52px;
  padding: 0 15px;
  align-items: center;
  justify-content: center;
  gap: 11px;
  border: 1px solid rgba(145, 179, 158, .2);
  border-radius: 11px;
  background: rgba(2, 12, 7, .8);
  color: #dce9e1;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.auth-social a:hover {
  border-color: rgba(33, 245, 139, .45);
  background: rgba(8, 31, 18, .92);
  transform: translateY(-1px);
}
.auth-social svg {
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
}
.auth-social .github-logo {
  color: #f0f6f3;
}
.auth-method-divider {
  display: flex;
  margin: 0 0 22px;
  align-items: center;
  gap: 12px;
  color: #647a6d;
  font-size: 10px;
  text-align: center;
}
.auth-method-divider::before,
.auth-method-divider::after {
  content: "";
  height: 1px;
  flex: 1;
  background: rgba(33, 245, 139, .12);
}
.auth-method-divider span {
  flex: 0 0 auto;
}
.auth-card form {
  gap: 18px;
}
.auth-field {
  gap: 8px;
  font-size: 13px;
}
.auth-field > span {
  min-height: 18px;
}
.auth-field > div {
  display: flex;
  min-height: 54px;
  padding: 0 14px;
  border-color: rgba(33, 245, 139, .16);
  border-radius: 12px;
  background: #020d07;
}
.auth-field > div:hover {
  border-color: rgba(33, 245, 139, .28);
}
.auth-field > div:focus-within {
  border-color: rgba(33, 245, 139, .7);
  background: #03120a;
  box-shadow: 0 0 0 3px rgba(33, 245, 139, .08);
}
.auth-field > div > svg {
  width: 18px;
  flex: 0 0 18px;
}
.auth-card .auth-field input:not([type="checkbox"]) {
  height: 52px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #edf9f1;
  font-size: 15px;
  box-shadow: none;
}
.auth-card .auth-field input:not([type="checkbox"]):focus {
  border: 0;
  box-shadow: none;
}
.auth-card .auth-field input:-webkit-autofill,
.auth-card .auth-field input:-webkit-autofill:hover,
.auth-card .auth-field input:-webkit-autofill:focus {
  -webkit-text-fill-color: #edf9f1;
  caret-color: #edf9f1;
  box-shadow: 0 0 0 1000px #020d07 inset;
  transition: background-color 9999s ease-out 0s;
}
.auth-field > div > button {
  min-width: 48px;
  padding: 8px 10px;
  border: 1px solid rgba(33, 245, 139, .12);
  border-radius: 8px;
  background: rgba(33, 245, 139, .055);
  font-size: 11px;
}
.auth-field > div > button:hover {
  background: rgba(33, 245, 139, .1);
  color: #baf8d4;
}
.auth-form-grid {
  gap: 18px 16px;
}
.auth-page[data-auth-mode="signup"] .auth-form-grid {
  grid-template-columns: 1fr;
}
.check-row {
  display: flex !important;
  grid-template-columns: none !important;
  min-height: 24px;
  align-items: flex-start !important;
  gap: 10px !important;
  color: #96aa9e !important;
  font-size: 12px !important;
}
.check-row > span {
  display: block !important;
  min-height: 0;
  line-height: 1.55;
}
.check-row input {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  margin: 1px 0 0;
}
.check-row a {
  display: inline;
  font-weight: 700;
}
.auth-submit {
  min-height: 54px;
  margin-top: 2px;
  border-radius: 11px;
  box-shadow: 0 14px 34px -22px var(--glow);
}
.auth-submit:hover {
  filter: brightness(1.06);
  transform: translateY(-1px);
}
.signup-submit {
  position: relative;
  justify-content: center;
  gap: 10px;
}
.signup-submit > span {
  font-size: 14px;
}
.signup-submit > b {
  position: absolute;
  right: 18px;
}
.auth-divider {
  margin: 26px 0 18px;
}
.auth-divider span {
  top: -9px;
  background: #031009;
}
.auth-secondary-action {
  min-height: 50px;
  border-radius: 11px;
}
.auth-switch {
  margin-top: 22px;
}
.auth-security {
  margin-top: 25px;
  padding-top: 18px;
  color: #64786c;
  font-size: 10px;
}
.recovery-explainer {
  margin-top: 22px;
}
.form-notice {
  margin-top: 18px;
  border: 1px solid rgba(33, 245, 139, .16);
}

@media (max-width: 700px) {
  .auth-page[data-auth-mode="signup"] .auth-shell,
  .auth-shell {
    width: min(100% - 24px, 620px);
    padding: 34px 0 48px;
  }
  .auth-form-grid {
    grid-template-columns: 1fr;
  }
  .auth-card,
  .auth-page[data-auth-mode="signup"] .auth-card {
    padding: 30px 24px;
    border-radius: 18px;
  }
  .auth-shell::before {
    width: 240px;
    height: 240px;
  }
}
@media (max-width: 480px) {
  .auth-header {
    width: calc(100% - 20px);
    min-height: 54px;
    margin-top: 10px;
  }
  .auth-header .brand-name {
    font-size: 13px;
  }
  .auth-back {
    font-size: 0;
  }
  .auth-back::before {
    content: "Back";
    font-size: 11px;
  }
  .auth-card,
  .auth-page[data-auth-mode="signup"] .auth-card {
    padding: 27px 19px;
  }
  .auth-card h2 {
    font-size: 31px;
  }
  .auth-card .auth-intro {
    font-size: 13px;
  }
  .auth-secondary-action {
    padding-inline: 12px;
    font-size: 12px;
  }
  .auth-secondary-action span {
    font-size: 10px;
  }
  .auth-social {
    grid-template-columns: 1fr;
  }
}
/* Prevent an account-form flash while an existing secure session is resolved. */
.auth-page.auth-checking .auth-shell {
  opacity: 0;
  pointer-events: none;
}