:root {
  --bg:#07100f;
  --surface:rgba(12,25,23,.76);
  --line:rgba(213,236,224,.14);
  --text:#f4fbf7;
  --muted:#a9bbb2;
  --accent:#39d98a;
  --accent2:#14b8a6;
  --gold:#f2c14e;
  --red:#ff6b4a;
  --shadow:0 24px 80px rgba(0,0,0,.36);
  --r-xl:34px;
  --r-lg:24px;
  --container:1180px;
  --brand-page-watermark:url("/brand-watermark.svg?v=2") right -10rem top 5.5rem / min(48vw, 600px) auto no-repeat
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth
}

body {
  margin:0;
  min-height:100vh;
  overflow-x:hidden;
  font-family:var(--font-sans);
  color:var(--text);
  background:var(--brand-page-watermark),radial-gradient(circle at 15% 10%,rgba(57,217,138,.15),transparent 28rem),radial-gradient(circle at 86% 2%,rgba(242,193,78,.12),transparent 22rem),linear-gradient(135deg,var(--bg),#091514 48%,#11160d)
}

body:before {
  content:"";
  position:fixed;
  inset:0;
  z-index:-3;
  pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 78%)
}

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

a:focus-visible,
button:focus-visible,
summary:focus-visible {
  outline:3px solid rgba(57,217,138,.72);
  outline-offset:4px
}

button,input,textarea,select {
  font:inherit
}

.container {
  width:min(100% - 32px,var(--container));
  margin:0 auto
}

.section {
  position:relative;
  padding:92px 0
}

.section[id] {
  scroll-margin-top:104px
}

.ambient {
  position:fixed;
  inset:0;
  z-index:-2;
  overflow:hidden;
  pointer-events:none
}

.ambient span {
  position:absolute;
  width:32rem;
  aspect-ratio:1;
  border-radius:50%;
  filter:blur(20px);
  opacity:.18;
  animation:drift 18s ease-in-out infinite alternate
}

.ambient span:first-child {
  left:-9rem;
  top:8rem;
  background:radial-gradient(circle,var(--accent),transparent 62%)
}

.ambient span:nth-child(2) {
  right:-10rem;
  top:26rem;
  background:radial-gradient(circle,var(--gold),transparent 64%);
  animation-delay:-7s
}

.ambient i {
  position:absolute;
  inset:8% 7% auto auto;
  width:22rem;
  height:22rem;
  border:1px solid rgba(255,255,255,.08);
  border-radius:50%;
  background:repeating-conic-gradient(from 20deg,rgba(57,217,138,.22) 0 8deg,transparent 8deg 20deg);
  mask:radial-gradient(circle,transparent 48%,#000 49%,#000 55%,transparent 56%);
  animation:spin 32s linear infinite
}

.legal-page {
  --brand-page-watermark:url("/brand-watermark.svg?v=2") right -13rem top 7rem / min(52vw, 620px) auto no-repeat
}

.site-header {
  position:sticky;
  top:0;
  z-index:20;
  border-bottom:1px solid rgba(255,255,255,.07);
  background:rgba(7,16,15,.78);
  backdrop-filter:blur(18px)
}

.header-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:78px;
  min-width:0;
  gap:20px
}

.brand {
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:var(--font-sans);
  font-size:20px;
  font-weight:700;
  letter-spacing:0;
  flex:0 0 auto
}

.brand-text {
  padding:10px 0
}

.site-header .of-brand__mark {
  width:40px;
  height:40px
}

.site-header .of-brand__word {
  font-size:21px
}

.brand-footer {
  margin-bottom:12px
}

.brand b {
  display:grid;
  width:38px;
  height:38px;
  place-items:center;
  border:1px solid rgba(57,217,138,.42);
  border-radius:14px;
  color:#06100e;
  background:linear-gradient(135deg,var(--accent),var(--gold));
  box-shadow:0 12px 30px rgba(57,217,138,.24);
  font-size:12px
}

.header-nav,.header-actions,.footer-links {
  display:flex;
  align-items:center;
  gap:18px
}

.header-nav {
  flex:1 1 auto;
  min-width:0;
  justify-content:center;
  gap:14px
}

.header-actions {
  flex:0 0 auto;
  gap:10px
}

.header-nav a,.footer-links a,.footer-text {
  color:var(--muted);
  font-size:15px
}

.header-nav a {
  white-space:nowrap;
  font-size:14px
}

.header-nav a:hover,.footer-links a:hover {
  color:var(--text)
}

.mobile-anchor-nav {
  position:sticky;
  top:78px;
  z-index:15;
  display:none;
  gap:8px;
  overflow-x:auto;
  padding-top:14px;
  padding-bottom:2px;
  background:linear-gradient(180deg,rgba(7,16,15,.96),rgba(7,16,15,0));
  scroll-padding-inline:12px;
  scrollbar-width:none
}

.mobile-anchor-nav::-webkit-scrollbar {
  display:none
}

.mobile-anchor-nav a {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  min-height:44px;
  padding:10px 13px;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--text);
  background:rgba(255,255,255,.065);
  font-size:14px;
  font-weight:700
}

.btn {
  position:relative;
  display:inline-flex;
  min-height:48px;
  align-items:center;
  justify-content:center;
  padding:0 22px;
  overflow:hidden;
  border:1px solid transparent;
  border-radius:999px;
  font-weight:700;
  isolation:isolate;
  transition:transform .2s ease,background .2s ease
}

.btn:after {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  opacity:0;
  background:linear-gradient(110deg,transparent,rgba(255,255,255,.22),transparent);
  transform:translateX(-100%)
}

.btn:hover {
  transform:translateY(-2px)
}

.btn:hover:after {
  opacity:1;
  animation:shine .8s ease
}

.btn-primary {
  color:#06100e;
  background:linear-gradient(135deg,var(--accent),var(--gold));
  box-shadow:0 18px 42px rgba(57,217,138,.25)
}

.btn-ghost {
  border-color:var(--line);
  background:rgba(255,255,255,.045);
  color:var(--text)
}

.site-header .btn {
  min-height:44px;
  padding:0 18px;
  white-space:nowrap
}

.hero {
  display:grid;
  min-height:calc(100svh - 78px);
  align-items:center;
  padding-top:clamp(34px,5vh,56px);
  padding-bottom:clamp(42px,6vh,68px)
}

.hero .reveal {
  opacity:1;
  transform:none
}

.hero-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(420px,.92fr);
  align-items:center;
  gap:clamp(28px,4vw,46px)
}

.eyebrow {
  display:inline-flex;
  align-items:center;
  max-width:100%;
  min-height:36px;
  padding:0 13px;
  border:1px solid rgba(57,217,138,.26);
  border-radius:999px;
  color:#cdf8df;
  background:rgba(57,217,138,.09);
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  line-height:1.25;
  text-transform:uppercase;
  white-space:normal
}

h1,h2,h3,p {
  margin:0
}

h1,h2,h3 {
  font-family:var(--font-sans);
  letter-spacing:0
}

h1 {
  max-width:18ch;
  margin-top:18px;
  font-size:clamp(34px,4.4vw,54px);
  line-height:1.04
}

h2 {
  margin-top:16px;
  font-size:clamp(30px,4vw,54px);
  line-height:1.04
}

h3 {
  font-size:23px;
  line-height:1.15
}

p {
  color:var(--muted);
  font-size:18px;
  line-height:1.7
}

.hero-text {
  max-width:43rem;
  margin-top:18px;
  color:#d7e4de;
  font-size:17px;
  line-height:1.58
}

.hero-pillars {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  max-width:680px;
  margin-top:18px
}

.hero-pillars div {
  min-width:0;
  padding:14px;
  border:1px solid rgba(213,236,224,.13);
  border-radius:18px;
  background:rgba(255,255,255,.045)
}

.hero-pillars strong {
  display:block;
  color:#f4fbf7;
  font-size:14px;
  line-height:1.2
}

.hero-pillars span {
  display:block;
  margin-top:6px;
  color:var(--muted);
  font-size:13px;
  line-height:1.38
}

.hero-actions {
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:24px
}

.hero-free-note {
  display:flex;
  max-width:680px;
  align-items:center;
  gap:10px;
  margin-top:12px;
  color:#dff8ea;
  font-size:14px;
  line-height:1.45
}

.hero-free-note strong {
  flex:0 0 auto;
  color:#06100e;
  padding:7px 10px;
  border-radius:999px;
  background:var(--accent);
  font-size:12px;
  line-height:1.2
}

.hero-free-note span {
  color:#cfe1d8
}

.hero-free-note-link {
  display:inline-grid;
  width:20px;
  height:20px;
  margin-left:5px;
  place-items:center;
  vertical-align:middle;
  border:1.5px solid rgba(57,217,138,.58);
  border-radius:50%;
  color:#dff8ea;
  background:rgba(57,217,138,.12);
  font-size:13px;
  font-style:normal;
  font-weight:800;
  line-height:1;
  transform:translateY(-1px);
  transition:background .2s ease,border-color .2s ease,color .2s ease,transform .2s ease
}

.hero-free-note-link:hover {
  border-color:rgba(57,217,138,.76);
  color:#06100e;
  background:var(--accent);
  transform:translateY(-2px)
}

.hero-visual {
  display:grid;
  gap:16px
}

.product-stage,.info-card,.feature-card,.step-card,.faq-item,.split-block,.final-cta-box,.result-shell,.broadcast-card,.report-showcase,.report-value-card,.review-card {
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.028));
  box-shadow:var(--shadow)
}

.product-stage {
  position:relative;
  overflow:hidden;
  border-radius:var(--r-xl)
}

.product-stage:before {
  content:"";
  position:absolute;
  inset:-1px;
  background:radial-gradient(circle at 20% 8%,rgba(57,217,138,.28),transparent 28%),radial-gradient(circle at 88% 22%,rgba(242,193,78,.2),transparent 26%);
  pointer-events:none
}

.stage-topbar {
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  gap:8px;
  padding:17px 18px;
  border-bottom:1px solid var(--line);
  background:rgba(6,16,14,.68)
}

.stage-topbar span {
  width:10px;
  height:10px;
  border-radius:50%;
  background:rgba(255,255,255,.28)
}

.stage-topbar span:first-child {
  background:var(--red)
}

.stage-topbar span:nth-child(2) {
  background:var(--gold)
}

.stage-topbar span:nth-child(3) {
  background:var(--accent)
}

.stage-topbar strong {
  margin-left:auto;
  color:rgba(244,251,247,.74);
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase
}

.stage-tabs {
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  padding:12px 14px;
  border-bottom:1px solid rgba(213,236,224,.1);
  background:rgba(6,16,14,.76)
}

.stage-tabs span {
  display:flex;
  min-width:0;
  min-height:40px;
  align-items:center;
  justify-content:center;
  padding:0 8px;
  border:1px solid rgba(213,236,224,.16);
  border-radius:12px;
  color:rgba(244,251,247,.78);
  background:rgba(255,255,255,.055);
  font-size:13px;
  font-weight:800;
  line-height:1.2;
  text-align:center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08)
}

.stage-tabs span.active {
  border-color:rgba(57,217,138,.58);
  color:#06100e;
  background:linear-gradient(135deg,var(--accent),var(--gold));
  box-shadow:0 10px 24px rgba(57,217,138,.18)
}

.stage-screen {
  position:relative;
  min-height:clamp(360px,38vw,430px);
  overflow:hidden;
  padding:clamp(64px,7vw,88px) clamp(20px,2.4vw,28px) 28px;
  background:linear-gradient(145deg,rgba(8,22,20,.9),rgba(12,28,24,.72)),radial-gradient(circle at 50% 20%,rgba(57,217,138,.16),transparent 44%)
}

.stage-screen:after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.04),transparent);
  transform:translateY(-100%);
  animation:scan 4.8s ease-in-out infinite
}

.signal-canvas {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:.9
}

.live-pill {
  position:absolute;
  top:24px;
  left:24px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border:1px solid rgba(57,217,138,.34);
  border-radius:999px;
  color:#dfffe9;
  background:rgba(57,217,138,.12);
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase
}

.live-pill:before {
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 0 0 rgba(57,217,138,.44);
  animation:pulse 1.6s ease-out infinite
}

.quiz-card {
  position:relative;
  z-index:2;
  max-width:420px;
  margin-left:auto;
  padding:24px;
  border:1px solid rgba(244,251,247,.16);
  border-radius:26px;
  background:rgba(7,16,15,.72);
  backdrop-filter:blur(14px);
  box-shadow:0 24px 60px rgba(0,0,0,.34);
  animation:float 5s ease-in-out infinite
}

.quiz-kicker {
  color:var(--gold);
  font-size:12px;
  font-weight:700;
  letter-spacing:.09em;
  text-transform:uppercase
}

.quiz-card h2 {
  margin-top:10px;
  font-family:var(--font-sans);
  font-size:26px;
  letter-spacing:0;
  line-height:1.12
}

.poll-bars {
  display:grid;
  gap:12px;
  margin-top:22px
}

.poll-row {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:44px;
  overflow:hidden;
  padding:0 13px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:rgba(255,255,255,.055)
}

.poll-row:before {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:var(--value);
  border-radius:inherit;
  background:linear-gradient(90deg,rgba(57,217,138,.32),rgba(242,193,78,.2));
  transform-origin:left;
  animation:growBar 1.1s ease both
}

.poll-row span,.poll-row strong {
  position:relative;
  z-index:1
}

.reaction-cloud {
  position:absolute;
  right:20px;
  bottom:18px;
  left:20px;
  z-index:2;
  display:flex;
  justify-content:space-between;
  pointer-events:none
}

.reaction-cloud span {
  padding:8px 12px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  color:#f8fff9;
  background:rgba(255,255,255,.08);
  font-size:13px;
  font-weight:700;
  backdrop-filter:blur(10px);
  animation:bubble 4.5s ease-in-out infinite
}

.reaction-cloud span:nth-child(2) {
  animation-delay:-1s
}

.reaction-cloud span:nth-child(3) {
  animation-delay:-2.1s
}

.reaction-cloud span:nth-child(4) {
  animation-delay:-3s
}

.operator-panel {
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:18px;
  border-top:1px solid var(--line);
  background:rgba(6,16,14,.76)
}

.operator-panel span {
  display:block;
  margin-bottom:5px;
  color:var(--muted);
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase
}

.operator-panel strong {
  display:block;
  font-size:18px
}

.mini-button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:0 17px;
  border:0;
  border-radius:999px;
  color:#06100e;
  background:linear-gradient(135deg,var(--accent),var(--gold));
  font-weight:700;
  cursor:default
}

.visual-stats {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px
}

.stat-card {
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px;
  padding:18px;
  border:1px solid var(--line);
  border-radius:20px;
  background:rgba(255,255,255,.052)
}

.stat-card i {
  width:13px;
  height:13px;
  margin-top:6px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 0 8px rgba(57,217,138,.12)
}

.stat-card.hot i {
  background:var(--gold);
  box-shadow:0 0 0 8px rgba(242,193,78,.12)
}

.stat-card strong {
  font-weight:700
}

.stat-card p {
  margin-top:4px;
  font-size:14px;
  line-height:1.5
}

.section-head {
  max-width:820px;
  margin-bottom:30px
}

.section-head p {
  margin-top:16px
}

.card-grid,.steps-grid,.metrics-grid {
  display:grid;
  gap:18px
}

.steps-grid {
  grid-template-columns:repeat(4,minmax(0,1fr))
}

.grid-3 {
  grid-template-columns:repeat(3,minmax(0,1fr))
}

.grid-4 {
  grid-template-columns:repeat(4,minmax(0,1fr))
}

.mechanics {
  background:linear-gradient(180deg,rgba(255,255,255,0),rgba(57,217,138,.04) 44%,rgba(255,255,255,0))
}

.mechanics-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:14px
}

.mechanic-card {
  position:relative;
  min-height:100%;
  overflow:hidden;
  padding:20px;
  border:1px solid var(--line);
  border-radius:20px;
  background:linear-gradient(180deg,rgba(255,255,255,.064),rgba(255,255,255,.024));
  box-shadow:0 18px 46px rgba(0,0,0,.2)
}

.mechanic-card:before {
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(57,217,138,.55),rgba(242,193,78,.42),transparent)
}

.mechanic-card span {
  display:inline-flex;
  margin-bottom:14px;
  padding:6px 9px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  color:var(--gold);
  background:rgba(255,255,255,.052);
  font-size:11px;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase
}

.mechanic-card h3 {
  font-size:19px
}

.mechanic-card p {
  margin-top:9px;
  font-size:14px;
  line-height:1.5
}

.info-card,.step-card {
  position:relative;
  min-height:100%;
  overflow:hidden;
  padding:26px
}

.info-card:before,.step-card:before,.feature-card:before {
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(57,217,138,.65),transparent)
}

.info-card>span,.step-card>span {
  display:inline-grid;
  width:46px;
  height:46px;
  margin-bottom:22px;
  place-items:center;
  border:1px solid rgba(57,217,138,.25);
  border-radius:16px;
  color:var(--accent);
  background:rgba(57,217,138,.08);
  font-weight:700
}

.info-card p,.step-card p,.feature-card p {
  margin-top:12px;
  font-size:16px
}

.split-block {
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:28px;
  align-items:center;
  padding:34px;
  border-radius:var(--r-xl);
  background:radial-gradient(circle at 100% 0,rgba(242,193,78,.14),transparent 32%),linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025))
}

.solution-note {
  max-width:680px;
  margin-top:16px;
  font-size:16px
}

.solution-note a,.faq-item a,.mode-stack a,.compliance-fact a {
  color:#cdf8df;
  font-weight:700
}

.mode-stack {
  display:grid;
  gap:12px
}

.mode-stack>div {
  display:grid;
  grid-template-columns:auto 1fr;
  gap:8px 14px;
  padding:16px;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(7,16,15,.44)
}

.mode-stack span {
  grid-row:span 2;
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  border-radius:14px;
  color:#06100e;
  background:var(--accent);
  font-weight:700
}

.mode-stack strong {
  font-size:17px
}

.mode-stack p {
  font-size:14px;
  line-height:1.45
}

.compliance {
  padding-top:0
}

.compliance-panel {
  display:grid;
  grid-template-columns:minmax(0,.98fr) minmax(360px,1fr);
  gap:26px;
  align-items:stretch;
  padding:34px;
  border:1px solid rgba(242,193,78,.2);
  border-radius:var(--r-xl);
  background:radial-gradient(circle at 10% 0,rgba(242,193,78,.16),transparent 30%),radial-gradient(circle at 92% 86%,rgba(57,217,138,.14),transparent 32%),linear-gradient(180deg,rgba(12,25,23,.92),rgba(7,16,15,.82));
  box-shadow:var(--shadow)
}

.compliance-copy {
  display:grid;
  align-content:center;
  gap:16px
}

.compliance-copy h2 {
  max-width:620px
}

.compliance-copy p {
  max-width:680px;
  color:var(--muted);
  font-size:17px;
  line-height:1.62
}

.compliance-link {
  display:inline-flex;
  width:max-content;
  max-width:100%;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 15px;
  border:1px solid rgba(242,193,78,.28);
  border-radius:999px;
  color:#07100f;
  background:linear-gradient(135deg,var(--gold),var(--accent));
  font-size:14px;
  font-weight:900;
  line-height:1.2;
  overflow-wrap:anywhere;
  text-align:center
}

.compliance-facts {
  display:grid;
  gap:12px
}

.compliance-fact {
  display:grid;
  grid-template-columns:auto 1fr;
  gap:8px 14px;
  min-height:100%;
  padding:16px;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(255,255,255,.052)
}

.compliance-fact span {
  grid-row:span 2;
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  border-radius:14px;
  color:#07100f;
  background:var(--gold);
  font-size:13px;
  font-weight:900
}

.compliance-fact strong {
  font-size:17px;
  line-height:1.22
}

.compliance-fact p {
  color:var(--muted);
  font-size:14px;
  line-height:1.45
}

.feature-layout {
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:18px
}

.feature-card {
  position:relative;
  overflow:hidden;
  grid-column:span 4;
  min-height:245px;
  padding:26px
}

.feature-card-large {
  grid-column:span 7
}

.feature-card-accent {
  grid-column:span 5;
  border-color:rgba(242,193,78,.32);
  background:radial-gradient(circle at 80% 10%,rgba(242,193,78,.2),transparent 36%),linear-gradient(180deg,rgba(57,217,138,.12),rgba(255,255,255,.03))
}

.feature-card-report {
  grid-column:span 12;
  min-height:190px;
  border-color:rgba(57,217,138,.3);
  background:radial-gradient(circle at 88% 12%,rgba(57,217,138,.18),transparent 30%),radial-gradient(circle at 18% 92%,rgba(242,193,78,.12),transparent 30%),linear-gradient(180deg,rgba(255,255,255,.078),rgba(255,255,255,.026))
}

.feature-card-report>span {
  margin-bottom:24px
}

.feature-card-report p {
  max-width:760px
}

.feature-card>span {
  display:inline-flex;
  margin-bottom:48px;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  color:var(--gold);
  background:rgba(255,255,255,.055);
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase
}

.scenario-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px
}

.scenario-card {
  position:relative;
  min-height:100%;
  overflow:hidden;
  padding:22px;
  border:1px solid var(--line);
  border-radius:20px;
  background:linear-gradient(180deg,rgba(255,255,255,.066),rgba(255,255,255,.026));
  box-shadow:0 18px 52px rgba(0,0,0,.24)
}

.scenario-card:before {
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(57,217,138,.58),rgba(242,193,78,.44),transparent)
}

.scenario-card span {
  display:inline-flex;
  margin-bottom:14px;
  padding:6px 9px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  color:var(--gold);
  background:rgba(255,255,255,.052);
  font-size:12px;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase
}

.scenario-card h3 {
  font-size:21px
}

.scenario-card p {
  margin-top:10px;
  font-size:15px;
  line-height:1.55
}

.scenario-more {
  margin-top:16px;
  padding:15px 18px;
  border:1px solid rgba(57,217,138,.2);
  border-radius:18px;
  color:var(--text);
  background:rgba(57,217,138,.06);
  font-size:15px;
  font-weight:700;
  line-height:1.5
}

.scenario-catalog {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:18px;
  padding:16px;
  border:1px solid rgba(57,217,138,.2);
  border-radius:18px;
  background:rgba(57,217,138,.055)
}

.scenario-catalog span {
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 11px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  color:var(--text);
  background:rgba(255,255,255,.055);
  font-size:13px;
  font-weight:800
}

.reviews {
  background:linear-gradient(180deg,rgba(255,255,255,0),rgba(242,193,78,.035) 34%,rgba(57,217,138,.04) 70%,rgba(255,255,255,0))
}

.reviews-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px
}

.review-card {
  position:relative;
  display:flex;
  min-height:100%;
  flex-direction:column;
  overflow:hidden;
  padding:24px;
  border-radius:22px;
  background:linear-gradient(180deg,rgba(255,255,255,.068),rgba(255,255,255,.026))
}

.review-card:before {
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(242,193,78,.56),rgba(57,217,138,.62),transparent)
}

.review-tag {
  display:inline-flex;
  align-self:flex-start;
  margin-bottom:18px;
  padding:6px 9px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  color:var(--gold);
  background:rgba(255,255,255,.052);
  font-size:11px;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase
}

.review-card blockquote {
  margin:0;
  color:var(--text);
  font-size:16px;
  font-weight:700;
  line-height:1.58
}

.review-card footer {
  display:grid;
  gap:5px;
  margin-top:auto;
  padding-top:22px
}

.review-card strong {
  color:var(--text);
  font-size:15px
}

.review-card footer span {
  color:var(--muted);
  font-size:13px;
  font-weight:700;
  line-height:1.35
}

.product-proof {
  background:linear-gradient(180deg,rgba(255,255,255,0),rgba(20,184,166,.045) 42%,rgba(255,255,255,0))
}

.networking {
  background:linear-gradient(180deg,rgba(255,255,255,0),rgba(57,217,138,.045) 36%,rgba(242,193,78,.04) 72%,rgba(255,255,255,0))
}

.networking-block {
  align-items:stretch;
  background:linear-gradient(135deg,rgba(57,217,138,.09),rgba(255,255,255,.04) 48%,rgba(242,193,78,.08))
}

.networking-block>div:first-child {
  align-self:center
}

.networking-preview {
  position:relative;
  display:grid;
  min-height:430px;
  place-items:center;
  overflow:hidden;
  padding:28px;
  border:1px solid rgba(213,236,224,.14);
  border-radius:26px;
  background:linear-gradient(135deg,rgba(7,16,15,.96),rgba(16,36,32,.88));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)
}

.networking-preview:before {
  content:"";
  position:absolute;
  inset:0;
  opacity:.28;
  background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:linear-gradient(135deg,#000,transparent 72%);
  pointer-events:none
}

.networking-phone {
  position:relative;
  z-index:1;
  display:grid;
  gap:13px;
  width:min(100%,380px);
  padding:18px;
  border:1px solid rgba(7,16,15,.1);
  border-radius:28px;
  color:#142820;
  background:#f4fbf7;
  box-shadow:0 26px 70px rgba(0,0,0,.32)
}

.networking-topline {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:#557065;
  font-size:12px;
  font-weight:900
}

.networking-topline strong {
  padding:6px 9px;
  border-radius:999px;
  color:#07100f;
  background:linear-gradient(135deg,var(--accent),var(--gold))
}

.networking-phone h3 {
  color:#142820;
  font-size:26px;
  line-height:1.12
}

.networking-profile {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  padding:13px;
  border:1px solid #dce7e1;
  border-radius:18px;
  background:#fff
}

.networking-profile.is-primary {
  border-color:rgba(57,217,138,.48);
  background:linear-gradient(135deg,rgba(57,217,138,.18),#fff 64%)
}

.networking-avatar {
  display:grid;
  width:44px;
  height:44px;
  place-items:center;
  border-radius:15px;
  color:#07100f;
  background:linear-gradient(135deg,var(--accent),var(--gold));
  font-size:13px;
  font-weight:900
}

.networking-profile strong,
.networking-prompt strong {
  color:#142820;
  line-height:1.28
}

.networking-profile p {
  margin-top:4px;
  color:#5f746a;
  font-size:12px;
  line-height:1.35
}

.networking-profile b {
  display:grid;
  min-width:44px;
  min-height:34px;
  padding:0 10px;
  place-items:center;
  border-radius:999px;
  color:#0c6f46;
  background:rgba(57,217,138,.12);
  font-size:12px;
  line-height:1.1;
  text-align:center
}

.networking-prompt {
  display:grid;
  gap:6px;
  padding:14px;
  border-radius:18px;
  color:#557065;
  background:#eaf5ef;
  font-size:12px;
  font-weight:800
}

.networking-prompt strong {
  font-size:15px;
  overflow-wrap:anywhere
}

.networking-tags {
  display:flex;
  flex-wrap:wrap;
  gap:8px
}

.networking-tags span {
  padding:7px 9px;
  border:1px solid #dce7e1;
  border-radius:999px;
  color:#24463a;
  background:#fff;
  font-size:12px;
  font-weight:900
}

.product-preview-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
  align-items:stretch
}

.product-preview-card {
  position:relative;
  display:grid;
  gap:16px;
  min-height:100%;
  overflow:hidden;
  padding:18px;
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.028));
  box-shadow:var(--shadow)
}

.product-preview-card:before {
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(20,184,166,.74),rgba(242,193,78,.56),transparent)
}

.product-preview-card-wide {
  grid-column:span 2;
  grid-row:span 2;
  padding:22px
}

.product-preview-card-overlay {
  grid-column:span 2;
  grid-template-columns:minmax(0,.72fr) minmax(280px,1fr);
  align-items:center
}

.product-preview-card-gallery {
  grid-column:span 2;
  grid-template-columns:minmax(280px,1fr) minmax(0,.72fr);
  align-items:center
}

.product-preview-card-control {
  grid-column:span 2;
  grid-template-columns:minmax(0,.72fr) minmax(280px,1fr);
  align-items:center
}

.preview-copy {
  position:relative;
  z-index:2
}

.preview-copy>span {
  display:inline-flex;
  margin-bottom:12px;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  color:var(--gold);
  background:rgba(255,255,255,.055);
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase
}

.preview-copy h3 {
  font-size:22px;
  line-height:1.16;
  letter-spacing:0
}

.preview-copy p {
  margin-top:10px;
  font-size:15px;
  line-height:1.55
}

.interface-shot {
  position:relative;
  display:grid;
  min-height:270px;
  overflow:hidden;
  border:1px solid rgba(213,236,224,.14);
  border-radius:18px;
  background:linear-gradient(150deg,rgba(7,16,15,.98),rgba(16,36,32,.9));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)
}

.product-preview-card-wide .interface-shot {
  min-height:376px
}

.product-preview-card-overlay .interface-shot {
  min-height:258px
}

.product-preview-card-gallery .interface-shot {
  min-height:258px
}

.product-preview-card-control .interface-shot {
  min-height:258px
}

.shot-toolbar {
  display:flex;
  align-items:center;
  gap:7px;
  min-height:44px;
  padding:0 14px;
  border-bottom:1px solid rgba(213,236,224,.12);
  background:rgba(6,16,14,.7)
}

.shot-toolbar i {
  width:9px;
  height:9px;
  border-radius:50%;
  background:rgba(255,255,255,.28)
}

.shot-toolbar i:first-child {
  background:var(--red)
}

.shot-toolbar i:nth-child(2) {
  background:var(--gold)
}

.shot-toolbar i:nth-child(3) {
  background:var(--accent)
}

.shot-toolbar strong {
  margin-left:auto;
  color:rgba(244,251,247,.72);
  font-size:11px;
  letter-spacing:.07em;
  text-transform:uppercase
}

.admin-shot {
  grid-template-rows:auto 1fr
}

.admin-shot-layout {
  display:grid;
  grid-template-columns:128px minmax(0,1fr);
  min-height:0
}

.admin-shot-sidebar {
  display:grid;
  align-content:start;
  gap:10px;
  padding:16px 12px;
  border-right:1px solid rgba(213,236,224,.12);
  background:rgba(255,255,255,.035)
}

.admin-shot-sidebar b {
  color:rgba(244,251,247,.72);
  font-size:12px
}

.admin-shot-sidebar span {
  min-height:34px;
  padding:9px 10px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:11px;
  color:var(--muted);
  font-size:12px;
  font-weight:700
}

.admin-shot-sidebar .is-active {
  border-color:rgba(57,217,138,.32);
  color:#dfffe9;
  background:rgba(57,217,138,.12)
}

.admin-shot-main {
  display:grid;
  align-content:start;
  gap:13px;
  min-width:0;
  padding:16px
}

.admin-shot-status {
  display:flex;
  flex-wrap:wrap;
  gap:8px
}

.admin-shot-status span {
  padding:7px 9px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  color:#dfffe9;
  background:rgba(255,255,255,.055);
  font-size:12px;
  font-weight:700
}

.admin-shot-question {
  padding:15px;
  border:1px solid rgba(242,193,78,.22);
  border-radius:16px;
  background:rgba(255,255,255,.055);
  font-size:20px;
  font-weight:700;
  line-height:1.22
}

.admin-shot-bars {
  display:grid;
  gap:10px
}

.admin-shot-bars span,
.hall-bars span {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:36px;
  overflow:hidden;
  padding:0 11px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  background:rgba(255,255,255,.055)
}

.admin-shot-bars span:before,
.hall-bars span:before {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:var(--value);
  border-radius:inherit;
  background:linear-gradient(90deg,rgba(57,217,138,.32),rgba(242,193,78,.2))
}

.admin-shot-bars b,
.admin-shot-bars i,
.hall-bars b,
.hall-bars i {
  position:relative;
  z-index:1;
  font-size:12px;
  font-style:normal
}

.admin-shot-links {
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  padding:12px;
  border:1px solid rgba(213,236,224,.12);
  border-radius:14px;
  background:rgba(7,16,15,.52)
}

.admin-shot-links span {
  color:var(--gold);
  font-size:11px;
  font-weight:700;
  letter-spacing:.07em;
  text-transform:uppercase
}

.admin-shot-links strong {
  min-width:0;
  overflow:hidden;
  color:#f4fbf7;
  font-size:13px;
  text-overflow:ellipsis;
  white-space:nowrap
}

.participant-shot {
  place-items:center;
  padding:18px;
  background:linear-gradient(160deg,rgba(20,184,166,.18),rgba(7,16,15,.94))
}

.phone-shell {
  display:grid;
  align-content:start;
  gap:10px;
  width:min(86%,214px);
  min-height:244px;
  padding:16px;
  border:1px solid rgba(244,251,247,.16);
  border-radius:28px;
  background:linear-gradient(180deg,#10231f,#07100f);
  box-shadow:0 24px 58px rgba(0,0,0,.36)
}

.phone-speaker {
  justify-self:center;
  width:58px;
  height:5px;
  border-radius:999px;
  background:rgba(255,255,255,.18)
}

.phone-room {
  color:var(--gold);
  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase
}

.phone-shell h4,
.hall-screen h4 {
  margin:0;
  font-family:var(--font-sans);
  font-size:17px;
  line-height:1.22;
  letter-spacing:0
}

.phone-option {
  min-height:37px;
  padding:10px 11px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  color:#d7e8df;
  background:rgba(255,255,255,.055);
  font-size:12px;
  font-weight:700
}

.phone-option.is-selected {
  border-color:rgba(57,217,138,.36);
  color:#06100e;
  background:linear-gradient(135deg,var(--accent),var(--gold))
}

.phone-actions {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:2px
}

.phone-actions span {
  display:grid;
  min-height:34px;
  place-items:center;
  border:1px solid rgba(255,255,255,.1);
  border-radius:11px;
  color:#dfffe9;
  background:rgba(255,255,255,.055);
  font-size:12px;
  font-weight:700
}

.hall-shot {
  padding:16px;
  background:linear-gradient(145deg,rgba(242,193,78,.16),rgba(7,16,15,.96))
}

.hall-screen {
  position:relative;
  display:grid;
  align-content:start;
  gap:14px;
  width:100%;
  min-height:238px;
  padding:20px;
  overflow:hidden;
  border:1px solid rgba(7,16,15,.12);
  border-radius:16px;
  color:#07100f;
  background:linear-gradient(135deg,#f5fff9,#dff7ee);
  box-shadow:0 18px 42px rgba(0,0,0,.28)
}

.hall-badge {
  justify-self:start;
  padding:6px 9px;
  border-radius:999px;
  color:#064e3b;
  background:rgba(20,184,166,.15);
  font-size:11px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase
}

.hall-screen h4 {
  max-width:13ch;
  color:#07100f;
  font-size:24px
}

.hall-bars {
  display:grid;
  gap:10px;
  margin-right:68px
}

.hall-bars span {
  border-color:rgba(7,16,15,.08);
  background:rgba(7,16,15,.07)
}

.hall-bars span:before {
  background:linear-gradient(90deg,rgba(20,184,166,.46),rgba(242,193,78,.42))
}

.qr-card {
  position:absolute;
  right:18px;
  bottom:18px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:5px;
  width:58px;
  aspect-ratio:1;
  padding:7px;
  border:1px solid rgba(7,16,15,.12);
  border-radius:12px;
  background:#fff;
  box-shadow:0 12px 24px rgba(0,0,0,.18)
}

.qr-card span {
  border-radius:3px;
  background:#07100f
}

.qr-card span:nth-child(2),
.qr-card span:nth-child(3) {
  background:linear-gradient(135deg,#07100f 45%,transparent 46%)
}

.overlay-shot {
  padding:14px;
  background-color:#0a1412;
  background-image:
    linear-gradient(45deg,rgba(255,255,255,.055) 25%,transparent 25%),
    linear-gradient(-45deg,rgba(255,255,255,.055) 25%,transparent 25%),
    linear-gradient(45deg,transparent 75%,rgba(255,255,255,.055) 75%),
    linear-gradient(-45deg,transparent 75%,rgba(255,255,255,.055) 75%);
  background-position:0 0,0 10px,10px -10px,-10px 0;
  background-size:20px 20px
}

.video-frame {
  position:relative;
  min-height:230px;
  overflow:hidden;
  border:1px solid rgba(244,251,247,.12);
  border-radius:16px;
  background:linear-gradient(135deg,#172033,#173b34 58%,#231a12)
}

.video-speaker {
  position:absolute;
  top:28px;
  right:28px;
  width:36%;
  height:48%;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.025))
}

.video-speaker:before {
  content:"";
  position:absolute;
  top:20px;
  left:50%;
  width:42px;
  aspect-ratio:1;
  border-radius:50%;
  background:rgba(244,251,247,.18);
  transform:translateX(-50%)
}

.video-speaker:after {
  content:"";
  position:absolute;
  right:18px;
  bottom:18px;
  left:18px;
  height:42px;
  border-radius:20px 20px 8px 8px;
  background:rgba(244,251,247,.12)
}

.video-caption,
.obs-tag {
  position:absolute;
  top:18px;
  left:18px;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  color:#dfffe9;
  background:rgba(7,16,15,.42);
  font-size:11px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase
}

.obs-tag {
  top:auto;
  right:18px;
  bottom:100px;
  left:auto;
  color:#07100f;
  background:rgba(242,193,78,.92)
}

.overlay-lower-third {
  position:absolute;
  right:18px;
  bottom:18px;
  left:18px;
  padding:16px;
  border:1px solid rgba(242,193,78,.26);
  border-radius:16px;
  background:rgba(7,16,15,.74);
  backdrop-filter:blur(12px)
}

.overlay-lower-third span {
  color:var(--gold);
  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase
}

.overlay-lower-third strong {
  display:block;
  margin-top:7px;
  font-size:17px;
  line-height:1.25
}

.gallery-shot {
  padding:14px;
  background:
    radial-gradient(circle at 18% 16%,rgba(242,193,78,.2),transparent 30%),
    linear-gradient(145deg,rgba(14,31,28,.96),rgba(7,16,15,.96))
}

.gallery-window {
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(94px,.48fr);
  grid-template-rows:auto 1fr;
  gap:12px;
  width:100%;
  min-height:230px;
  padding:14px;
  overflow:hidden;
  border:1px solid rgba(244,251,247,.12);
  border-radius:16px;
  background:rgba(255,255,255,.05)
}

.gallery-header {
  grid-column:1 / -1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px
}

.gallery-header span {
  color:var(--gold);
  font-size:11px;
  font-weight:800;
  letter-spacing:.07em;
  text-transform:uppercase
}

.gallery-header strong {
  padding:6px 9px;
  border:1px solid rgba(57,217,138,.26);
  border-radius:999px;
  color:#dfffe9;
  background:rgba(57,217,138,.1);
  font-size:11px;
  white-space:nowrap
}

.gallery-featured {
  position:relative;
  overflow:hidden;
  border-radius:14px;
  background:
    linear-gradient(150deg,rgba(57,217,138,.3),rgba(242,193,78,.2)),
    linear-gradient(135deg,#193c36,#21384d 56%,#5b3e24);
  box-shadow:0 18px 42px rgba(0,0,0,.24)
}

.gallery-featured:before {
  content:"";
  position:absolute;
  right:12%;
  bottom:12%;
  width:34%;
  aspect-ratio:1;
  border-radius:50%;
  background:rgba(255,255,255,.22)
}

.gallery-featured div {
  position:absolute;
  inset:auto 10% 0;
  height:46%;
  border-radius:28px 28px 0 0;
  background:linear-gradient(180deg,rgba(255,255,255,.2),rgba(255,255,255,.06))
}

.gallery-featured span {
  position:absolute;
  left:14px;
  bottom:14px;
  padding:7px 10px;
  border-radius:999px;
  color:#07100f;
  background:rgba(244,251,247,.9);
  font-size:11px;
  font-weight:800
}

.gallery-thumbs {
  display:grid;
  gap:10px
}

.gallery-thumbs span {
  min-height:42px;
  border:1px solid rgba(244,251,247,.12);
  border-radius:12px;
  background:linear-gradient(135deg,rgba(255,255,255,.18),rgba(255,255,255,.045))
}

.gallery-thumbs span:nth-child(2) {
  background:linear-gradient(135deg,rgba(242,193,78,.28),rgba(255,255,255,.05))
}

.gallery-thumbs span:nth-child(3) {
  background:linear-gradient(135deg,rgba(20,184,166,.24),rgba(255,255,255,.05))
}

.control-shot {
  padding:14px;
  background:
    radial-gradient(circle at 18% 18%,rgba(20,184,166,.22),transparent 31%),
    linear-gradient(145deg,rgba(10,21,32,.96),rgba(7,16,15,.96))
}

.control-window {
  display:grid;
  grid-template-rows:auto 1fr;
  gap:12px;
  width:100%;
  min-height:230px;
  padding:14px;
  overflow:hidden;
  border:1px solid rgba(244,251,247,.12);
  border-radius:16px;
  background:rgba(255,255,255,.05)
}

.control-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px
}

.control-header span {
  color:var(--gold);
  font-size:11px;
  font-weight:800;
  letter-spacing:.07em;
  text-transform:uppercase
}

.control-header strong {
  padding:6px 9px;
  border:1px solid rgba(57,217,138,.26);
  border-radius:999px;
  color:#07100f;
  background:linear-gradient(135deg,var(--accent),var(--gold));
  font-size:11px;
  text-transform:uppercase
}

.control-board {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(116px,.54fr);
  gap:12px;
  min-height:0
}

.control-queue {
  display:grid;
  gap:10px;
  align-content:start
}

.control-question {
  padding:10px;
  border:1px solid rgba(244,251,247,.1);
  border-radius:13px;
  background:rgba(255,255,255,.055)
}

.control-question.is-active {
  border-color:rgba(242,193,78,.32);
  background:rgba(242,193,78,.12)
}

.control-question span,
.control-live-panel span {
  display:block;
  color:var(--gold);
  font-size:10px;
  font-weight:800;
  letter-spacing:.07em;
  text-transform:uppercase
}

.control-question strong {
  display:block;
  margin-top:6px;
  color:#f4fbf7;
  font-size:12px;
  line-height:1.24
}

.control-live-panel {
  display:grid;
  align-content:start;
  gap:10px;
  padding:12px;
  border:1px solid rgba(57,217,138,.2);
  border-radius:14px;
  background:linear-gradient(180deg,rgba(57,217,138,.13),rgba(255,255,255,.045))
}

.control-live-panel strong {
  font-size:15px;
  line-height:1.18
}

.control-progress {
  position:relative;
  height:9px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(255,255,255,.1)
}

.control-progress:before {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:var(--value);
  border-radius:inherit;
  background:linear-gradient(90deg,var(--accent),var(--gold))
}

.control-actions {
  display:grid;
  gap:7px;
  margin-top:2px
}

.control-actions b {
  display:grid;
  min-height:29px;
  place-items:center;
  border:1px solid rgba(255,255,255,.1);
  border-radius:10px;
  color:#dfffe9;
  background:rgba(255,255,255,.06);
  font-size:11px
}

.client-report {
  background:linear-gradient(180deg,rgba(255,255,255,0),rgba(242,193,78,.04) 38%,rgba(57,217,138,.04) 70%,rgba(255,255,255,0))
}

.report-showcase {
  display:grid;
  grid-template-columns:minmax(0,.94fr) minmax(390px,1.06fr);
  gap:30px;
  align-items:center;
  padding:34px;
  border-radius:var(--r-xl);
  background:radial-gradient(circle at 88% 12%,rgba(242,193,78,.18),transparent 28%),radial-gradient(circle at 18% 88%,rgba(57,217,138,.14),transparent 30%),linear-gradient(180deg,rgba(255,255,255,.078),rgba(255,255,255,.026))
}

.report-copy p {
  margin-top:16px
}

.report-check-list {
  margin-top:24px
}

.report-actions {
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:28px
}

.report-preview {
  position:relative;
  min-width:0;
  padding:18px;
  border:1px solid rgba(213,236,224,.14);
  border-radius:26px;
  background:linear-gradient(145deg,rgba(7,16,15,.8),rgba(18,39,34,.62));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)
}

.report-preview:before {
  content:"";
  position:absolute;
  right:8%;
  bottom:4%;
  width:42%;
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle,rgba(57,217,138,.22),transparent 68%);
  filter:blur(8px);
  pointer-events:none
}

.report-sheet {
  position:relative;
  z-index:1;
  display:grid;
  gap:14px;
  min-height:520px;
  padding:22px;
  overflow:hidden;
  border:1px solid rgba(7,16,15,.12);
  border-radius:20px;
  color:#12201c;
  background:#f8fbf9;
  box-shadow:0 24px 64px rgba(0,0,0,.34);
  transform:rotate(-1.2deg)
}

.report-sheet:after {
  content:"";
  position:absolute;
  inset:auto -12% -22% 46%;
  height:220px;
  background:radial-gradient(circle,rgba(57,217,138,.2),transparent 62%);
  pointer-events:none
}

.report-sheet-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  color:#0c6f46;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase
}

.report-sheet-top strong {
  padding:6px 9px;
  border-radius:999px;
  color:#07100f;
  background:linear-gradient(135deg,var(--accent),var(--gold))
}

.report-sheet-cover {
  padding:20px;
  border-radius:18px;
  color:#f4fbf7;
  background:linear-gradient(135deg,#10251f,#1a332d);
  border:1px solid rgba(7,16,15,.12)
}

.report-sheet-cover span {
  color:#8ee5b8;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase
}

.report-sheet-cover h3 {
  margin-top:8px;
  color:#fff;
  font-size:32px;
  letter-spacing:0
}

.report-sheet-cover p {
  margin-top:8px;
  color:#c9ddd4;
  font-size:13px;
  line-height:1.45
}

.report-sheet-kpis {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px
}

.report-sheet-kpis div {
  display:grid;
  gap:3px;
  min-width:0;
  padding:10px;
  border:1px solid #dce7e1;
  border-radius:12px;
  background:#fff
}

.report-sheet-kpis span,
.report-sheet-kpis small {
  color:#63756c;
  font-size:10px;
  font-weight:800
}

.report-sheet-kpis strong {
  color:#142820;
  font-size:24px;
  line-height:1;
  overflow-wrap:anywhere
}

.report-sheet-summary {
  padding:14px;
  border:1px solid #dce7e1;
  border-radius:14px;
  background:#fff
}

.report-sheet-summary b {
  color:#24463a;
  font-size:12px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase
}

.report-sheet-summary p {
  margin-top:7px;
  color:#33483f;
  font-size:13px;
  line-height:1.45
}

.report-sheet-bars {
  display:grid;
  gap:9px
}

.report-sheet-bars span {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:36px;
  overflow:hidden;
  padding:0 11px;
  border:1px solid #dce7e1;
  border-radius:999px;
  background:#fff
}

.report-sheet-bars span:before {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:var(--value);
  border-radius:inherit;
  background:linear-gradient(90deg,rgba(57,217,138,.32),rgba(242,193,78,.25))
}

.report-sheet-bars b,
.report-sheet-bars i {
  position:relative;
  z-index:1;
  color:#142820;
  font-size:12px;
  font-style:normal
}

.report-value-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  margin-top:18px
}

.report-value-card {
  position:relative;
  min-height:100%;
  overflow:hidden;
  padding:24px
}

.report-value-card:before {
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(242,193,78,.56),rgba(57,217,138,.62),transparent)
}

.report-value-card span {
  display:inline-grid;
  width:42px;
  height:42px;
  margin-bottom:18px;
  place-items:center;
  border:1px solid rgba(242,193,78,.26);
  border-radius:14px;
  color:var(--gold);
  background:rgba(242,193,78,.08);
  font-weight:700
}

.report-value-card p {
  margin-top:12px;
  font-size:16px
}

.streaming-block {
  display:grid;
  grid-template-columns:1fr .92fr;
  gap:28px;
  align-items:center;
  padding:36px;
  border:1px solid rgba(57,217,138,.18);
  border-radius:var(--r-xl);
  background:radial-gradient(circle at 88% 18%,rgba(57,217,138,.16),transparent 28%),linear-gradient(180deg,rgba(10,31,27,.92),rgba(7,16,15,.86));
  box-shadow:var(--shadow)
}

.check-list {
  display:grid;
  gap:14px;
  padding:0;
  margin:24px 0 0;
  list-style:none
}

.check-list li {
  position:relative;
  padding-left:32px;
  color:var(--text);
  font-size:17px;
  font-weight:700
}

.check-list li:before {
  content:"";
  position:absolute;
  top:8px;
  left:0;
  width:13px;
  height:13px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--accent),var(--gold));
  box-shadow:0 0 0 7px rgba(57,217,138,.1)
}

.broadcast-card {
  padding:16px
}

.broadcast-window {
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:24px;
  background:#07100f
}

.broadcast-header {
  display:flex;
  justify-content:space-between;
  padding:15px 16px;
  border-bottom:1px solid var(--line);
  color:var(--muted);
  font-size:13px
}

.broadcast-header strong {
  color:var(--text)
}

.broadcast-frame {
  position:relative;
  min-height:330px;
  padding:22px;
  overflow:hidden;
  background:linear-gradient(135deg,rgba(57,217,138,.12),transparent 34%),linear-gradient(160deg,#0f1f1c,#090f0d)
}

.speaker-block {
  position:absolute;
  inset:34px 34px auto auto;
  width:38%;
  height:58%;
  border:1px solid rgba(255,255,255,.1);
  border-radius:28px;
  background:radial-gradient(circle at 50% 24%,rgba(244,251,247,.2),transparent 14%),linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.025))
}

.overlay-question {
  position:absolute;
  right:22px;
  bottom:24px;
  left:22px;
  padding:20px;
  border:1px solid rgba(242,193,78,.28);
  border-radius:22px;
  background:rgba(7,16,15,.78);
  backdrop-filter:blur(12px)
}

.overlay-question span {
  color:var(--gold);
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase
}

.overlay-question strong {
  display:block;
  margin-top:8px;
  font-size:22px;
  line-height:1.2
}

.waveform {
  position:absolute;
  left:26px;
  top:40px;
  display:flex;
  align-items:end;
  gap:7px;
  height:80px
}

.waveform span {
  width:9px;
  height:28px;
  border-radius:999px;
  background:var(--accent);
  animation:wave 1s ease-in-out infinite
}

.waveform span:nth-child(2) {
  height:54px;
  animation-delay:-.18s
}

.waveform span:nth-child(3) {
  height:38px;
  animation-delay:-.34s
}

.waveform span:nth-child(4) {
  height:70px;
  background:var(--gold);
  animation-delay:-.52s
}

.waveform span:nth-child(5) {
  height:46px;
  animation-delay:-.7s
}

.waveform span:nth-child(6) {
  height:30px;
  animation-delay:-.86s
}

.result-shell {
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:26px;
  align-items:center;
  padding:34px;
  border-radius:var(--r-xl)
}

.metrics-grid {
  grid-template-columns:repeat(4,minmax(0,1fr))
}

.metric-card {
  padding:22px;
  border:1px solid var(--line);
  border-radius:22px;
  background:rgba(255,255,255,.046)
}

.metric-number {
  display:block;
  font-family:var(--font-sans);
  color:var(--gold);
  font-size:clamp(34px,5vw,54px);
  line-height:1
}

.metric-card span {
  display:block;
  margin-top:12px;
  color:var(--muted);
  font-size:14px;
  font-weight:700
}

.faq-list {
  display:grid;
  gap:12px
}

.faq-item {
  overflow:hidden;
  padding:0 22px
}

.faq-item[id] {
  scroll-margin-top:104px
}

.faq-item summary {
  position:relative;
  padding:22px 34px 22px 0;
  cursor:pointer;
  font-size:19px;
  font-weight:700;
  list-style:none
}

.faq-item summary::-webkit-details-marker {
  display:none
}

.faq-item summary:after {
  content:"+";
  position:absolute;
  right:0;
  color:var(--accent);
  font-size:24px
}

.faq-item[open] summary:after {
  content:"-"
}

.faq-item p {
  padding-bottom:14px;
  font-size:16px
}

.faq-item ul {
  display:grid;
  gap:8px;
  margin:0 0 18px;
  padding-left:22px;
  color:var(--muted);
  font-size:16px;
  line-height:1.65
}

.faq-item li::marker {
  color:var(--accent)
}

.final-cta-box {
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:24px;
  align-items:center;
  padding:36px;
  border-radius:var(--r-xl);
  background:radial-gradient(circle at 88% 12%,rgba(242,193,78,.18),transparent 30%),linear-gradient(135deg,rgba(57,217,138,.12),rgba(255,255,255,.032))
}

.final-cta-box p {
  margin-top:14px
}

.cta-actions {
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:14px
}

.site-footer {
  padding:28px 0 36px;
  border-top:1px solid rgba(255,255,255,.07)
}

.footer-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px
}

.brand-footer {
  font-size:18px
}

.brand-footer b {
  width:32px;
  height:32px;
  border-radius:12px;
  font-size:10px
}

.footer-text {
  margin-top:8px
}

.footer-links {
  flex-wrap:wrap
}

.footer-contact {
  display:grid;
  gap:8px;
  min-width:190px
}

.footer-contact strong {
  font-size:13px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase
}

.footer-contact a {
  color:var(--muted);
  font-size:15px
}

.footer-contact a:hover {
  color:var(--text)
}

.legal-page h1 {
  max-width:18ch
}

.legal-content {
  display:grid;
  max-width:980px;
  gap:22px
}

.legal-card {
  padding:30px;
  scroll-margin-top:96px
}

.legal-card h2 {
  font-size:clamp(24px,3vw,34px);
  max-width:24ch
}

.legal-card h3 {
  margin:28px 0 10px;
  color:var(--text);
  font-size:18px;
  line-height:1.35
}

.legal-card p,.legal-card li {
  color:var(--muted);
  font-size:16px;
  line-height:1.78
}

.legal-card p {
  margin:12px 0 0
}

.legal-card p strong {
  color:var(--text)
}

.legal-card ul {
  display:grid;
  gap:8px;
  margin:14px 0 0;
  padding-left:20px
}

.legal-card a {
  color:#cdf8df;
  font-weight:700
}

.legal-meta {
  margin-top:14px;
  color:var(--muted);
  font-size:14px
}

.legal-page .reveal {
  opacity:1;
  transform:none;
  transition:none
}

.reveal {
  opacity:0;
  transform:translateY(24px);
  transition:opacity .65s ease,transform .65s ease
}

.reveal.visible {
  opacity:1;
  transform:translateY(0)
}

.reveal-delay-1 {
  transition-delay:.08s
}

.reveal-delay-2 {
  transition-delay:.16s
}

@keyframes drift {
  to {
    transform:translate3d(5rem,-3rem,0) scale(1.08)
  }

}

@keyframes spin {
  to {
    transform:rotate(360deg)
  }

}

@keyframes shine {
  to {
    transform:translateX(100%)
  }

}

@keyframes scan {
  55%,100% {
    transform:translateY(110%)
  }

}

@keyframes pulse {
  to {
    box-shadow:0 0 0 13px rgba(57,217,138,0)
  }

}

@keyframes float {
  50% {
    transform:translateY(-10px) rotate(.6deg)
  }

}

@keyframes growBar {
  from {
    transform:scaleX(.18)
  }

}

@keyframes bubble {
  50% {
    transform:translateY(-16px)
  }

}

@keyframes wave {
  50% {
    transform:scaleY(.45);
    opacity:.62
  }

}

@media (max-width:1180px) {
  .landing-page .header-nav {
    display:none
  }

  .landing-page .mobile-anchor-nav {
    display:flex
  }

}

@media (max-width:1080px) {
  .hero-grid,.streaming-block,.split-block,.compliance-panel,.final-cta-box,.result-shell,.report-showcase {
    grid-template-columns:1fr
  }

  .hero {
    min-height:auto
  }

  .hero-grid {
    gap:34px
  }

  h1 {
    max-width:18ch
  }

  .feature-card,.feature-card-large,.feature-card-accent {
    grid-column:span 12
  }

  .product-preview-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .product-preview-card-wide,
  .product-preview-card-overlay,
  .product-preview-card-gallery,
  .product-preview-card-control {
    grid-column:span 2;
    grid-row:auto
  }

  .product-preview-card-overlay,
  .product-preview-card-gallery,
  .product-preview-card-control {
    grid-template-columns:minmax(0,.8fr) minmax(280px,1fr)
  }

  .steps-grid,.report-value-grid,.grid-4,.metrics-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .scenario-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .cta-actions {
    justify-content:flex-start
  }

}

@media (max-width:860px) {
  .header-nav {
    display:none
  }

  .mobile-anchor-nav {
    display:flex
  }

  .section {
    padding:68px 0
  }

  .hero {
    padding-top:42px;
    padding-bottom:58px
  }

  .hero-grid {
    grid-template-columns:1fr
  }

  .grid-3,.grid-4,.steps-grid,.visual-stats,.metrics-grid,.report-value-grid {
    grid-template-columns:1fr
  }

  .reviews-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .scenario-grid {
    grid-template-columns:1fr
  }

  .product-preview-grid {
    grid-template-columns:1fr
  }

  .product-preview-card-wide,
  .product-preview-card-overlay,
  .product-preview-card-gallery,
  .product-preview-card-control {
    grid-column:span 1
  }

  .product-preview-card-overlay,
  .product-preview-card-gallery,
  .product-preview-card-control {
    grid-template-columns:1fr
  }

  .product-preview-card-wide .interface-shot {
    min-height:340px
  }

  .report-showcase {
    padding:24px
  }

  .report-preview {
    padding:12px
  }

  .report-sheet {
    min-height:0;
    transform:none
  }

  .networking-preview {
    min-height:0
  }

  .stage-screen {
    min-height:360px
  }

  .quiz-card {
    margin-left:0
  }

  .footer-inner {
    align-items:flex-start;
    flex-direction:column
  }

}

@media (max-width:620px) {
  :root {
    --brand-page-watermark:url("/brand-watermark.svg?v=2") right -8rem top 4.5rem / 25rem auto no-repeat
  }

  .container {
    width:min(100% - 24px,var(--container))
  }

  .site-header {
    position:static
  }

  .header-inner {
    align-items:stretch;
    flex-direction:column;
    gap:12px;
    padding:14px 0
  }

  .site-header .of-brand__mark {
    width:38px;
    height:38px
  }

  .site-header .of-brand__word {
    font-size:20px
  }

  .mobile-anchor-nav {
    top:0;
    padding-top:8px;
    padding-bottom:8px;
    flex-wrap:wrap;
    overflow-x:visible
  }

  .mobile-anchor-nav a {
    flex:1 1 auto;
    padding:10px 12px;
    font-size:13px
  }

  .header-actions,.hero-actions,.report-actions,.cta-actions,.footer-links {
    width:100%
  }

  .header-actions {
    align-items:stretch;
    flex-direction:column
  }

  .header-actions .btn,.hero-actions .btn,.report-actions .btn,.cta-actions .btn,.btn {
    width:100%
  }

  .section {
    padding:54px 0
  }

  .hero {
    padding-top:24px;
    padding-bottom:44px
  }

  h1 {
    font-size:clamp(28px,8.6vw,34px);
    line-height:1.06
  }

  .hero-text {
    font-size:16px;
    line-height:1.55
  }

  .hero-free-note {
    align-items:flex-start;
    flex-direction:column;
    gap:8px
  }

  .hero-pillars {
    grid-template-columns:1fr
  }

  .stage-screen {
    min-height:330px;
    padding:70px 16px 76px
  }

  .quiz-card {
    padding:18px
  }

  .quiz-card h2 {
    font-size:22px
  }

  .reaction-cloud {
    flex-wrap:wrap;
    gap:8px;
    justify-content:flex-start
  }

  .product-preview-card,
  .product-preview-card-wide {
    padding:16px
  }

  .reviews-grid {
    grid-template-columns:1fr
  }

  .interface-shot {
    min-height:240px
  }

  .product-preview-card-wide .interface-shot {
    min-height:360px
  }

  .admin-shot-layout {
    grid-template-columns:1fr
  }

  .admin-shot-sidebar {
    grid-template-columns:repeat(2,minmax(0,1fr));
    border-right:0;
    border-bottom:1px solid rgba(213,236,224,.12)
  }

  .admin-shot-sidebar b {
    grid-column:1 / -1
  }

  .admin-shot-main {
    padding:14px
  }

  .admin-shot-question {
    font-size:17px
  }

  .product-preview-card-overlay .interface-shot {
    min-height:250px
  }

  .product-preview-card-gallery .interface-shot {
    min-height:250px
  }

  .product-preview-card-control .interface-shot {
    min-height:250px
  }

  .networking-preview {
    padding:16px;
    border-radius:22px
  }

  .networking-phone {
    padding:15px;
    border-radius:22px
  }

  .networking-profile {
    grid-template-columns:auto minmax(0,1fr)
  }

  .networking-profile b {
    grid-column:1 / -1;
    justify-self:start
  }

  .report-sheet {
    padding:16px;
    border-radius:16px
  }

  .report-sheet-cover h3 {
    font-size:25px
  }

  .report-sheet-kpis {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .hall-bars {
    margin-right:0
  }

  .qr-card {
    position:relative;
    right:auto;
    bottom:auto;
    width:54px
  }

  .operator-panel,.split-block,.compliance-panel,.streaming-block,.final-cta-box,.result-shell {
    padding:22px
  }

  .operator-panel {
    align-items:flex-start;
    flex-direction:column
  }

  .mini-button {
    width:100%
  }

  .broadcast-frame {
    min-height:360px
  }

  .speaker-block {
    width:52%;
    height:42%
  }

}

@media (prefers-reduced-motion:reduce) {
  *,*:before,*:after {
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important
  }

}