:root {
  --ink: #0a1020;
  --ink-2: #111a34;
  --ink-soft: #5f6677;
  --blue: #315dff;
  --blue-deep: #2147db;
  --periwinkle: #9fb2ff;
  --violet: #8c72ff;
  --lime: #caff69;
  --coral: #ff806b;
  --paper: #f6f7fb;
  --white: #ffffff;
  --line: rgba(16, 25, 49, 0.12);
  --radius-lg: 36px;
  --radius-md: 22px;
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  background: var(--paper);
}

body {
  margin: 0;
  overflow-x: hidden;
  background: var(--paper);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
button, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.eyebrow {
  margin: 0 0 22px;
  color: var(--blue);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.18em;
}

.brand-lockup {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 19px;
  font-weight: 850;
  letter-spacing: -0.045em;
}

.brand-mark {
  position: relative;
  width: 28px;
  height: 28px;
  display: inline-grid;
  place-items: center;
  overflow: hidden;
  border-radius: 8px;
  background: var(--ink);
  box-shadow: 0 5px 14px rgba(25, 40, 84, 0.18);
  transform: rotate(-4deg);
}

.brand-mark i {
  position: absolute;
  left: 7px;
  width: 14px;
  height: 6px;
  border-radius: 2px;
  background: white;
  transform: skewX(-24deg);
}

.brand-mark i:first-child { top: 7px; }
.brand-mark i:last-child { top: 15px; width: 10px; background: var(--lime); }

.app-glyph {
  position: relative;
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  display: inline-block;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.46);
  border-radius: 13px;
  background: linear-gradient(145deg, #77a6ff, #3157eb);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14), 0 10px 20px rgba(20, 29, 61, 0.16);
}

.app-glyph i {
  position: absolute;
  width: 22px;
  height: 22px;
  left: 9px;
  top: 10px;
  border: 3px solid white;
  border-radius: 50% 50% 45% 55%;
  opacity: 0.9;
}

.app-glyph b {
  position: absolute;
  width: 11px;
  height: 11px;
  right: 8px;
  bottom: 8px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.9);
  transform: rotate(18deg);
}

.glyph-violet { background: linear-gradient(145deg, #af9fff, #7354ed); }
.glyph-coral { background: linear-gradient(145deg, #ffb186, #ff6572); }
.glyph-lime { background: linear-gradient(145deg, #dcff88, #72cf67); }
.glyph-lime i { border-color: #31451e; }
.glyph-lime b { background: #31451e; }
.glyph-blue { background: linear-gradient(145deg, #82b8ff, #3157eb); }

.site-header {
  position: absolute;
  z-index: 50;
  top: 0;
  left: 50%;
  width: min(1440px, calc(100% - 64px));
  height: 88px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  transform: translateX(-50%);
}

.brand-link { justify-self: start; }

.site-header nav {
  display: flex;
  align-items: center;
  gap: 38px;
  color: #596071;
  font-size: 14px;
  font-weight: 690;
}

.site-header nav a,
.sign-in { transition: color 180ms ease, transform 180ms ease, border-color 180ms ease; }
.site-header nav a:hover,
.sign-in:hover { color: var(--blue); }

.sign-in {
  justify-self: end;
  padding: 10px 14px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.64);
  font-size: 13px;
  font-weight: 760;
  backdrop-filter: blur(16px);
}

.sign-in span { font-size: 11px; }

.hero {
  position: relative;
  min-height: 100svh;
  padding: 132px 24px 118px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 55%, rgba(255, 255, 255, 0.98) 0 18%, rgba(248, 249, 253, 0.42) 58%),
    linear-gradient(180deg, #fcfcfe 0%, #f1f4ff 100%);
}

.hero-mesh {
  position: absolute;
  inset: 0;
  opacity: 0.3;
  pointer-events: none;
  background-image: radial-gradient(rgba(18, 30, 61, 0.22) 0.65px, transparent 0.65px);
  background-size: 22px 22px;
  mask-image: linear-gradient(to bottom, black, transparent 74%);
}

.ambient {
  position: absolute;
  border-radius: 50%;
  filter: blur(8px);
  pointer-events: none;
}

.ambient-left {
  width: 590px;
  height: 590px;
  left: -350px;
  top: 20%;
  background: radial-gradient(circle, rgba(145, 166, 255, 0.38), rgba(145, 166, 255, 0));
}

.ambient-right {
  width: 520px;
  height: 520px;
  right: -290px;
  top: 13%;
  background: radial-gradient(circle, rgba(202, 255, 105, 0.32), rgba(202, 255, 105, 0));
}

.hero-copy {
  position: relative;
  z-index: 5;
  width: min(940px, 100%);
  text-align: center;
  transform: translateY(-2vh);
}

.hero-proof {
  width: max-content;
  max-width: 100%;
  margin: 0 auto 28px;
  padding: 8px 13px;
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid rgba(20, 31, 59, 0.1);
  border-radius: 999px;
  color: #646b7c;
  background: rgba(255, 255, 255, 0.65);
  font-size: 11px;
  font-weight: 790;
  letter-spacing: 0.035em;
  backdrop-filter: blur(14px);
}

.hero-proof span,
.status-dot,
.live-badge i {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #55d39b;
  box-shadow: 0 0 0 4px rgba(85, 211, 155, 0.13);
}

.hero h1 {
  margin: 0;
  font-family: "Avenir Next", Avenir, "Helvetica Neue", ui-sans-serif, sans-serif;
  font-size: clamp(60px, 7vw, 104px);
  line-height: 0.95;
  font-weight: 540;
  letter-spacing: -0.058em;
}

.hero h1 em {
  color: var(--blue);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 0.94em;
  font-weight: 400;
  letter-spacing: -0.052em;
}

.hero-subtitle {
  width: min(820px, 100%);
  margin: 30px auto 31px;
  color: #5e6576;
  font-size: clamp(16px, 1.35vw, 20px);
  line-height: 1.58;
  letter-spacing: -0.022em;
}

.hero-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.primary-cta {
  padding: 16px 17px 16px 22px;
  display: inline-flex;
  align-items: center;
  gap: 30px;
  border-radius: 14px;
  color: white;
  background: var(--blue);
  box-shadow: 0 18px 42px rgba(49, 93, 255, 0.26), inset 0 0 0 1px rgba(255, 255, 255, 0.13);
  font-size: 15px;
  font-weight: 820;
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.primary-cta > span,
.primary-cta > b {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.14);
  font-size: 14px;
}

.primary-cta:hover {
  color: white;
  background: var(--blue-deep);
  box-shadow: 0 22px 52px rgba(49, 93, 255, 0.34), inset 0 0 0 1px rgba(255, 255, 255, 0.15);
  transform: translateY(-3px);
}

.hero-actions p {
  margin: 13px 0 0;
  color: #7c8392;
  font-size: 10px;
  font-weight: 690;
}

.hero-actions p i {
  width: 3px;
  height: 3px;
  margin: 0 7px 2px;
  display: inline-block;
  border-radius: 50%;
  background: #aeb4bf;
}

.hero .primary-cta {
  color: var(--ink);
  background: #ffffff;
  box-shadow: 0 18px 42px rgba(42, 61, 122, 0.16), inset 0 0 0 1px rgba(49, 93, 255, 0.1);
}

.hero .primary-cta > span {
  color: #ffffff;
  background: var(--blue);
}

.hero .primary-cta:hover {
  color: var(--ink);
  background: #f8f9ff;
  box-shadow: 0 22px 52px rgba(42, 61, 122, 0.22), inset 0 0 0 1px rgba(49, 93, 255, 0.14);
}

.edge-phone {
  position: absolute;
  z-index: 2;
  width: 216px;
  height: 442px;
  padding: 62px 22px 24px;
  overflow: hidden;
  border: 8px solid #101729;
  border-radius: 48px;
  color: var(--ink);
  background: white;
  box-shadow: 0 38px 80px rgba(28, 42, 78, 0.17), inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  pointer-events: none;
}

.edge-phone-left {
  left: max(-74px, calc(50% - 760px));
  top: 30%;
  background: linear-gradient(160deg, #fff 0%, #f4f0ff 100%);
  transform: rotate(-8deg);
}

.edge-phone-right {
  right: max(-68px, calc(50% - 760px));
  top: 23%;
  background: linear-gradient(160deg, #f7fff0 0%, #fff 100%);
  transform: rotate(8deg);
}

.phone-island {
  position: absolute;
  top: 15px;
  left: 50%;
  width: 74px;
  height: 21px;
  border-radius: 99px;
  background: #101729;
  transform: translateX(-50%);
}

.phone-label { color: #858b9b; font-size: 8px; font-weight: 850; letter-spacing: 0.16em; }

.phone-app-row {
  margin-top: 24px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.phone-app-row .app-glyph { width: 52px; height: 52px; }
.phone-app-row strong,
.phone-app-row small { display: block; }
.phone-app-row strong { font-size: 15px; letter-spacing: -0.03em; }
.phone-app-row small { margin-top: 4px; color: #8b91a0; font-size: 8px; }

.mini-chart {
  height: 112px;
  margin-top: 26px;
  padding: 18px 12px 12px;
  display: flex;
  align-items: end;
  gap: 7px;
  border: 1px solid rgba(15, 26, 51, 0.07);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.72);
}

.mini-chart i { flex: 1; border-radius: 6px 6px 3px 3px; background: #cbd5ff; }
.mini-chart i:nth-child(1) { height: 24%; }
.mini-chart i:nth-child(2) { height: 42%; }
.mini-chart i:nth-child(3) { height: 38%; }
.mini-chart i:nth-child(4) { height: 70%; background: var(--violet); }
.mini-chart i:nth-child(5) { height: 90%; background: var(--coral); }

.phone-stat { margin-top: 15px; display: flex; align-items: center; color: #888f9d; font-size: 8px; }
.phone-stat strong { margin-left: auto; color: #5f45d9; font-size: 14px; }

.mini-question {
  margin-top: 23px;
  padding: 16px;
  border-radius: 16px 16px 5px 16px;
  color: white;
  background: var(--ink);
  font-size: 13px;
  line-height: 1.4;
  font-weight: 670;
}

.mini-answer {
  margin: 12px 0 19px;
  padding: 15px;
  display: grid;
  grid-template-columns: 20px 1fr;
  gap: 8px 9px;
  border: 1px solid rgba(15, 26, 51, 0.08);
  border-radius: 5px 16px 16px 16px;
  background: white;
}

.mini-answer span { grid-row: 1 / 4; color: var(--blue); }
.mini-answer i { height: 5px; border-radius: 9px; background: #dfe4ee; }
.mini-answer i:nth-of-type(2) { width: 75%; }
.mini-answer i:nth-of-type(3) { width: 48%; }
.mini-token-row { display: flex; flex-wrap: wrap; gap: 5px; }
.mini-token-row b { padding: 6px 7px; border-radius: 7px; background: var(--lime); font-size: 7px; letter-spacing: 0.07em; }
.mini-token-row b:nth-child(2) { background: #ddd7ff; }
.mini-token-row b:nth-child(3) { background: #ffd8d1; }

.scroll-cue {
  position: absolute;
  z-index: 5;
  bottom: 25px;
  left: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
  color: #747b8b;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  transform: translateX(-50%);
}

.scroll-cue i { width: 1px; height: 25px; background: linear-gradient(var(--blue), transparent); }

.proof-section {
  position: relative;
  padding: 138px 0 126px;
  overflow: hidden;
  color: white;
  background:
    radial-gradient(circle at 8% 10%, rgba(96, 125, 255, 0.26), transparent 31%),
    radial-gradient(circle at 92% 70%, rgba(202, 255, 105, 0.1), transparent 26%),
    var(--ink);
}

.proof-section::before,
.cta-grid {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0.14;
  background-image: linear-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(to bottom, black, transparent 72%);
}

.proof-heading {
  position: relative;
  z-index: 2;
  width: min(1240px, calc(100% - 64px));
  margin: 0 auto 60px;
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  align-items: end;
  gap: 80px;
}

.proof-heading .eyebrow { color: var(--periwinkle); }
.proof-heading h2 { margin: 0; max-width: 790px; font-size: clamp(54px, 6.3vw, 92px); line-height: 0.94; letter-spacing: -0.07em; }
.proof-heading > p { max-width: 470px; margin: 0 0 7px; color: #adb5c7; font-size: 17px; line-height: 1.65; }

.app-ticker {
  position: relative;
  z-index: 2;
  width: 100%;
  padding: 8px 0 30px;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, black 8%, black 92%, transparent);
}

.ticker-track {
  width: max-content;
  display: flex;
  gap: 12px;
  animation: ticker-scroll 48s linear infinite;
}

@keyframes ticker-scroll { to { transform: translateX(-50%); } }
.app-ticker:hover .ticker-track { animation-play-state: paused; }

.ticker-app {
  width: 205px;
  padding: 10px 13px 10px 10px;
  display: flex;
  align-items: center;
  gap: 11px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 17px;
  background: rgba(255, 255, 255, 0.065);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(16px);
}

.ticker-app img { width: 48px; height: 48px; flex: 0 0 auto; border-radius: 13px; object-fit: cover; box-shadow: 0 8px 16px rgba(0, 0, 0, 0.22); }
.ticker-app strong,
.ticker-app small { display: block; }
.ticker-app strong { max-width: 125px; overflow: hidden; color: #f7f8fb; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.ticker-app small { margin-top: 4px; color: #868fa4; font-size: 8px; }

.proof-cards {
  position: relative;
  z-index: 2;
  width: min(1240px, calc(100% - 64px));
  margin: 22px auto 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.proof-card {
  position: relative;
  min-height: 320px;
  padding: 27px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 26px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.045));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.proof-card::after {
  content: "";
  position: absolute;
  width: 230px;
  height: 230px;
  right: -100px;
  bottom: -120px;
  border-radius: 50%;
  background: rgba(140, 114, 255, 0.2);
  filter: blur(8px);
}

.proof-coral::after { background: rgba(255, 128, 107, 0.18); }
.proof-lime::after { background: rgba(202, 255, 105, 0.13); }
.proof-card-top { display: flex; align-items: center; color: #919bb1; font-size: 9px; font-weight: 850; letter-spacing: 0.15em; }
.proof-card-top b { margin-left: auto; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; color: white; background: rgba(140, 114, 255, 0.45); font-size: 16px; }
.proof-coral .proof-card-top b { background: rgba(255, 128, 107, 0.46); }
.proof-lime .proof-card-top b { color: #27341d; background: var(--lime); }
.proof-card h3 { max-width: 340px; margin: 48px 0 0; font-size: clamp(25px, 2.5vw, 37px); line-height: 1.06; letter-spacing: -0.05em; }
.proof-metric { margin-top: 27px; display: flex; align-items: end; gap: 10px; }
.proof-metric strong { color: var(--periwinkle); font-size: 34px; letter-spacing: -0.055em; }
.proof-coral .proof-metric strong { color: #ff9a88; }
.proof-lime .proof-metric strong { color: var(--lime); }
.proof-metric span { margin-bottom: 5px; color: #858fa3; font-size: 9px; }
.proof-card > p { position: absolute; z-index: 2; left: 27px; bottom: 23px; margin: 0; padding: 8px 10px; border-radius: 99px; color: #b7bfd0; background: rgba(255, 255, 255, 0.07); font-size: 8px; font-weight: 760; }
.proof-disclaimer { position: relative; z-index: 2; width: min(1240px, calc(100% - 64px)); margin: 17px auto 0; color: #6f788d; font-size: 9px; text-align: right; }

.capabilities-section {
  position: relative;
  height: 300svh;
  padding: 0;
  background:
    radial-gradient(circle at 4% 12%, rgba(111, 142, 255, 0.14), transparent 28%),
    radial-gradient(circle at 96% 88%, rgba(202, 255, 105, 0.14), transparent 26%),
    #f5f6fb;
}

.section-heading { width: min(1020px, 100%); margin: 0 auto; text-align: center; }
.section-heading h2 { margin: 0; font-size: clamp(55px, 7vw, 100px); line-height: 0.93; letter-spacing: -0.075em; }
.section-heading > p:last-child { margin: 25px auto 0; color: #697080; font-size: 17px; }

.capability-stage {
  position: sticky;
  top: 0;
  height: 100svh;
  padding: 22px clamp(22px, 3.5vw, 58px) 25px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.capability-stage-header {
  width: min(1260px, 100%);
  min-height: 88px;
  margin: 0 auto 18px;
  display: flex;
  align-items: center;
  gap: 30px;
}

.capability-stage-header .eyebrow { margin-bottom: 8px; }
.capability-stage-header h2 { margin: 0; font-size: clamp(29px, 2.8vw, 42px); line-height: 1; font-weight: 630; letter-spacing: -0.052em; }
.capability-progress { margin-left: auto; display: flex; align-items: center; gap: 18px; }
.capability-progress > span { color: #646d80; font-size: 10px; font-weight: 810; letter-spacing: 0.15em; }
.capability-progress > div { display: flex; align-items: center; gap: 7px; }
.capability-progress button { width: 32px; height: 22px; padding: 0; display: grid; place-items: center; border: 0; background: transparent; cursor: pointer; }
.capability-progress button i { width: 100%; height: 3px; display: block; border-radius: 999px; background: #ccd1dd; transition: height 220ms ease, background 220ms ease, transform 220ms ease; }
.capability-progress button:hover i { background: #9ba7c2; }
.capability-progress button.active i { height: 5px; background: var(--blue); transform: scaleX(1.05); }

.capability-deck {
  position: relative;
  width: min(1260px, 100%);
  min-height: 0;
  flex: 1;
  margin: 0 auto;
}

.capability-slide {
  position: absolute;
  inset: 0;
  padding: clamp(32px, 4.4vw, 64px);
  display: grid;
  grid-template-columns: minmax(300px, 0.82fr) minmax(430px, 1.18fr);
  align-items: center;
  gap: clamp(38px, 5.2vw, 78px);
  overflow: hidden;
  border: 1px solid rgba(16, 25, 49, 0.1);
  border-radius: 36px;
  box-shadow: 0 28px 75px rgba(28, 39, 73, 0.12);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(9%) scale(0.965);
  transition: opacity 460ms ease, transform 680ms cubic-bezier(0.22, 1, 0.36, 1), visibility 460ms ease;
}

.capability-slide::after {
  content: "";
  position: absolute;
  width: 520px;
  height: 520px;
  right: -220px;
  top: -250px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.45);
  filter: blur(8px);
}

.capability-slide.is-active { z-index: 3; opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0) scale(1); }
.capability-slide.is-before { transform: translateY(-9%) scale(0.965); }
.capability-slide.is-after { transform: translateY(9%) scale(0.965); }

.capability-watchdog {
  background:
    radial-gradient(circle at 90% 13%, rgba(255, 255, 255, 0.72), transparent 28%),
    linear-gradient(145deg, #d8e0ff, #a9baff 61%, #91a7ff);
}

.capability-competitor {
  color: white;
  background:
    radial-gradient(circle at 78% 10%, rgba(110, 138, 255, 0.34), transparent 32%),
    linear-gradient(150deg, #121a36, #080e1d 68%);
}

.capability-competitor::after { background: rgba(70, 99, 225, 0.22); }
.capability-pulse {
  background:
    radial-gradient(circle at 10% 100%, rgba(202, 255, 105, 0.38), transparent 34%),
    linear-gradient(145deg, #ffffff, #f3f7ed);
}

.capability-copy,
.capability-demo { position: relative; z-index: 2; min-width: 0; }
.capability-number { position: absolute; left: 0; top: -92px; color: rgba(27, 37, 66, 0.11); font-size: 84px; font-weight: 780; letter-spacing: -0.08em; }
.capability-competitor .capability-number { color: rgba(255, 255, 255, 0.1); }
.capability-copy h3 { max-width: 520px; margin: 0; font-size: clamp(40px, 4.3vw, 64px); line-height: 0.96; font-weight: 680; letter-spacing: -0.06em; }
.capability-copy > p:not(.bento-kicker) { max-width: 540px; margin: 22px 0 0; color: #5d6578; font-size: 15px; line-height: 1.65; }
.capability-competitor .capability-copy > p:not(.bento-kicker) { color: #9ea7bb; }
.capability-competitor .bento-kicker { color: #929cb3; }
.capability-competitor .watchlist-button { margin: 27px 0 0; }
.capability-slide .watchdog-ui,
.capability-slide .competitor-ui { margin-top: 0; }
.capability-pulse .leaderboard-ui { background: rgba(249, 250, 252, 0.94); }

.capability-scroll-hint { position: absolute; z-index: 8; left: 50%; bottom: 31px; display: flex; align-items: center; gap: 10px; color: rgba(33, 43, 67, 0.5); font-size: 8px; font-weight: 820; letter-spacing: 0.14em; text-transform: uppercase; transform: translateX(-50%); pointer-events: none; }
.capability-scroll-hint i { width: 20px; height: 28px; display: block; border: 1px solid rgba(33, 43, 67, 0.24); border-radius: 999px; }
.capability-scroll-hint i::after { content: ""; width: 3px; height: 6px; margin: 5px auto 0; display: block; border-radius: 999px; background: var(--blue); animation: scrollDot 1.7s ease-in-out infinite; }
@keyframes scrollDot { 0%, 100% { opacity: 0.35; transform: translateY(0); } 50% { opacity: 1; transform: translateY(9px); } }

.bento-copy { position: relative; z-index: 3; }
.bento-kicker { margin: 0 0 18px; display: flex; align-items: center; gap: 9px; color: #586177; font-size: 9px; font-weight: 850; letter-spacing: 0.16em; }
.status-dot.coral { background: var(--coral); box-shadow: 0 0 0 4px rgba(255, 128, 107, 0.12); }
.status-dot.lime { background: #8ecf3f; box-shadow: 0 0 0 4px rgba(142, 207, 63, 0.13); }

.watchdog-ui { position: relative; z-index: 2; margin-top: 54px; }
.watchdog-ui form {
  position: relative;
  z-index: 2;
  padding: 20px;
  border: 1px solid rgba(255, 255, 255, 0.78);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 24px 56px rgba(48, 65, 128, 0.2);
  backdrop-filter: blur(20px);
}

.watchdog-ui label { display: block; color: #808797; font-size: 8px; font-weight: 850; letter-spacing: 0.14em; }
.watchdog-ui textarea { width: 100%; height: 88px; margin-top: 12px; padding: 0; resize: none; outline: none; border: 0; color: #171e30; background: transparent; font-size: 15px; line-height: 1.5; font-weight: 650; }
.composer-bottom { padding-top: 13px; display: flex; align-items: center; border-top: 1px solid #e2e5ee; }
.composer-bottom > span { display: flex; align-items: center; gap: 7px; color: #858c9b; font-size: 8px; font-weight: 700; }
.composer-bottom > span i { width: 7px; height: 7px; border-radius: 50%; background: #57d69e; }
.composer-bottom button { margin-left: auto; padding: 10px 13px; border: 0; border-radius: 10px; color: white; background: var(--blue); cursor: pointer; font-size: 9px; font-weight: 790; transition: transform 180ms ease, background 180ms ease; }
.composer-bottom button:hover { background: var(--blue-deep); transform: translateY(-1px); }

.email-preview {
  width: 86%;
  margin: -2px auto 0;
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, 0.68);
  border-radius: 0 0 21px 21px;
  background: rgba(249, 250, 255, 0.92);
  box-shadow: 0 24px 42px rgba(48, 65, 128, 0.18);
  transform: translateY(10px) scale(0.97);
  transition: transform 320ms ease, box-shadow 320ms ease;
}

.email-preview.is-armed { box-shadow: 0 27px 55px rgba(48, 65, 128, 0.28), 0 0 0 5px rgba(202, 255, 105, 0.24); transform: translateY(2px) scale(1); }
.email-head { display: flex; align-items: center; gap: 10px; }
.mail-icon { width: 33px; height: 33px; display: grid; place-items: center; border-radius: 10px; color: white; background: var(--blue); }
.email-head p { margin: 0; }
.email-head strong,
.email-head small { display: block; }
.email-head strong { font-size: 11px; }
.email-head small { margin-top: 3px; color: #969cab; font-size: 7px; }
.email-head > b { margin-left: auto; color: #a0a6b1; font-size: 9px; letter-spacing: 0.15em; }
.email-preview h4 { margin: 22px 0 0; font-size: 17px; letter-spacing: -0.03em; }
.growth-line { margin-top: 14px; display: flex; align-items: center; gap: 8px; }
.growth-line strong { color: var(--blue); font-size: 27px; letter-spacing: -0.05em; }
.growth-line span { color: #767e8e; font-size: 8px; }
.growth-line i { height: 4px; flex: 1; border-radius: 99px; background: linear-gradient(90deg, var(--blue) 0 58%, #e0e5f1 58%); }
.email-preview > p { margin: 13px 0 0; color: #777e8e; font-size: 9px; line-height: 1.55; }

.bento-title-row { display: flex; flex-direction: column; align-items: flex-start; }
.watchlist-button { margin: 0 0 23px; padding: 9px 11px; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 99px; color: #9da6b9; background: rgba(255, 255, 255, 0.055); cursor: pointer; font-size: 8px; font-weight: 760; transition: color 180ms ease, background 180ms ease, border-color 180ms ease; }
.watchlist-button.active { color: #29331c; border-color: rgba(202, 255, 105, 0.4); background: var(--lime); }
.competitor-ui { position: relative; z-index: 2; margin-top: 40px; }
.chat-question { width: 92%; margin-left: auto; padding: 15px 17px; border-radius: 17px 17px 5px 17px; color: #eff2f8; background: #253154; box-shadow: 0 14px 30px rgba(0, 0, 0, 0.19); }
.chat-question > span { color: #7d88a2; font-size: 7px; font-weight: 850; letter-spacing: 0.14em; }
.chat-question p { margin: 8px 0 0; font-size: 12px; line-height: 1.5; }
.chat-question b { color: var(--periwinkle); }

.chat-answer { margin-top: 12px; padding: 19px; border: 1px solid rgba(255, 255, 255, 0.11); border-radius: 5px 18px 18px 18px; background: rgba(255, 255, 255, 0.07); backdrop-filter: blur(16px); }
.ai-label { display: flex; align-items: center; gap: 7px; }
.ai-label > span { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 8px; color: white; background: var(--blue); font-size: 10px; }
.ai-label strong { font-size: 9px; }
.ai-label small { margin-left: auto; color: #7e89a0; font-size: 7px; }
.chat-answer > p { margin: 17px 0; color: #b2b9c8; font-size: 10px; line-height: 1.6; }
.tag-cloud { display: flex; flex-wrap: wrap; gap: 7px; }
.tag-cloud span { padding: 8px 9px; border: 1px solid rgba(159, 178, 255, 0.14); border-radius: 9px; color: #aeb9dd; background: rgba(89, 114, 210, 0.11); font-size: 7px; }
.tag-cloud b { margin-left: 5px; color: white; }
.change-feed { margin: 14px 0 0 12px; padding: 13px; display: grid; grid-template-columns: 1fr auto; gap: 5px 12px; border-left: 1px solid rgba(255, 255, 255, 0.13); color: #8e98ad; font-size: 7px; }
.change-feed span { display: flex; align-items: center; gap: 7px; }
.change-feed span i { width: 6px; height: 6px; border-radius: 50%; background: var(--coral); }
.change-feed b { grid-column: 1; color: #d7dbe5; font-size: 9px; }
.change-feed small { grid-column: 2; grid-row: 1; }

.pulse-copy .bento-kicker { color: #707888; }
.pulse-copy h3 { font-size: clamp(42px, 4.2vw, 63px); }
.pulse-note { margin-top: 31px; display: flex; align-items: center; gap: 12px; }
.pulse-note > span { width: 39px; height: 39px; display: grid; place-items: center; border-radius: 12px; color: #324122; background: var(--lime); font-size: 18px; }
.pulse-note p { margin: 0; }
.pulse-note strong,
.pulse-note small { display: block; }
.pulse-note strong { font-size: 10px; }
.pulse-note small { margin-top: 4px; color: #9197a4; font-size: 7px; }

.leaderboard-ui { overflow: hidden; border: 1px solid #e0e4ed; border-radius: 23px; background: #f9fafc; box-shadow: 0 24px 54px rgba(29, 42, 77, 0.1); }
.leaderboard-top { padding: 14px; display: flex; align-items: center; gap: 14px; border-bottom: 1px solid #e2e6ee; background: white; }
.leaderboard-tabs { padding: 4px; display: flex; gap: 4px; border-radius: 11px; background: #f0f2f6; }
.leaderboard-tabs button { padding: 9px 11px; border: 0; border-radius: 8px; color: #858c9a; background: transparent; cursor: pointer; font-size: 8px; font-weight: 760; }
.leaderboard-tabs button.active { color: var(--ink); background: white; box-shadow: 0 4px 12px rgba(30, 42, 74, 0.08); }
.live-badge { margin-left: auto; display: flex; align-items: center; gap: 7px; color: #7e8594; font-size: 7px; font-weight: 690; }
.live-badge i { width: 6px; height: 6px; }
.leaderboard-head,
.leaderboard-row { display: grid; grid-template-columns: 55px minmax(145px, 1.5fr) minmax(80px, 0.7fr) minmax(95px, 0.7fr); align-items: center; }
.leaderboard-head { padding: 14px 18px 9px; color: #9aa0ac; font-size: 6px; font-weight: 850; letter-spacing: 0.13em; }
.leaderboard-row { min-height: 62px; padding: 8px 18px; border-top: 1px solid #e7e9ef; color: #818896; font-size: 9px; }
.leaderboard-row:first-child { border-top: 0; }
.leaderboard-row > span:first-child { color: #a1a7b2; font-size: 7px; font-weight: 760; }
.row-name { display: flex; align-items: center; gap: 9px; }
.row-name .app-glyph { width: 32px; height: 32px; border-radius: 9px; }
.row-name .app-glyph i { width: 15px; height: 15px; left: 7px; top: 7px; border-width: 2px; }
.row-name .app-glyph b { width: 7px; height: 7px; right: 6px; bottom: 6px; }
.row-name strong { color: #222a3b; font-size: 10px; }
.growth-value { color: #388b63; font-weight: 780; }
.competition { width: max-content; padding: 6px 8px; display: block; border-radius: 99px; color: #447545; background: #e9f6dd; font-size: 7px; font-weight: 760; }
.competition-1 { color: #806b3e; background: #fff0d1; }
.model-note { margin: 0; padding: 11px 18px; border-top: 1px solid #e2e6ee; color: #9aa0ad; background: white; font-size: 7px; }

.workflow-section {
  position: relative;
  padding: 155px 32px 170px;
  overflow: hidden;
  color: white;
  background:
    radial-gradient(circle at 50% 105%, rgba(74, 105, 255, 0.31), transparent 40%),
    var(--ink);
}

.workflow-heading { width: min(1180px, 100%); margin: 0 auto; text-align: center; }
.workflow-heading .eyebrow { color: var(--periwinkle); }
.workflow-heading h2 { margin: 0; font-size: clamp(55px, 7vw, 99px); line-height: 0.94; letter-spacing: -0.075em; }
.workflow-heading h2 em { color: var(--lime); font-family: Georgia, "Times New Roman", serif; font-weight: 400; }
.workflow-grid { width: min(1240px, 100%); margin: 85px auto 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.workflow-card { position: relative; min-height: 430px; padding: 30px; display: flex; flex-direction: column; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.11); border-radius: 28px; background: linear-gradient(150deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.035)); cursor: pointer; transition: transform 240ms cubic-bezier(.2,.75,.25,1), border-color 240ms ease, box-shadow 240ms ease; }
.workflow-card::before { content: "↗"; position: absolute; z-index: 3; right: 26px; bottom: 26px; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: var(--ink); background: var(--lime); font-size: 17px; font-weight: 850; opacity: 0; transform: translate(-6px, 6px); transition: opacity 200ms ease, transform 240ms cubic-bezier(.2,.75,.25,1); }
.workflow-card::after { content: ""; position: absolute; width: 240px; height: 240px; left: -100px; bottom: -120px; border-radius: 50%; background: rgba(114, 91, 238, 0.15); }
.workflow-card:nth-child(2)::after { background: rgba(255, 128, 107, 0.12); }
.workflow-card:nth-child(3)::after { background: rgba(202, 255, 105, 0.11); }
.workflow-card:hover { transform: translateY(-8px); border-color: rgba(94, 110, 255, 0.35); box-shadow: 0 34px 78px rgba(30, 41, 75, 0.15); }
.workflow-card:hover::before,
.workflow-card:focus-visible::before { opacity: 1; transform: translate(0, 0); }
.workflow-card:focus-visible { outline: 3px solid rgba(54, 92, 255, 0.44); outline-offset: 5px; }
.workflow-card:active { transform: translateY(-2px) scale(.995); }
.step-top { display: flex; align-items: center; color: #768098; font-size: 10px; font-weight: 850; letter-spacing: 0.14em; }
.step-top .app-glyph { margin-left: auto; }
.workflow-grid h3 { max-width: 280px; margin: 70px 0 0; font-size: clamp(30px, 2.8vw, 42px); line-height: 1; letter-spacing: -0.055em; }
.workflow-grid p { margin: 20px 0 0; color: #a1a9bb; font-size: 13px; line-height: 1.65; }
.step-chip { position: relative; z-index: 2; width: max-content; margin-top: auto; padding: 9px 10px; display: flex; align-items: center; gap: 7px; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 9px; color: #9da6ba; background: rgba(255, 255, 255, 0.05); font-size: 7px; font-weight: 820; letter-spacing: 0.1em; }
.step-chip i { width: 6px; height: 6px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 3px rgba(202, 255, 105, 0.1); }

.comparison-section { padding: 160px 32px 170px; background: #f5f6fa; }
.comparison-heading { width: min(1240px, 100%); margin: 0 auto; }
.comparison-heading h2 { margin: 0; max-width: 980px; font-size: clamp(55px, 7.2vw, 102px); line-height: 0.92; letter-spacing: -0.075em; }
.comparison-heading > p:last-child { margin: 27px 0 0; color: #697081; font-size: 17px; }
.comparison-table { width: min(1240px, 100%); margin: 72px auto 0; overflow: hidden; border: 1px solid #dfe2e9; border-radius: 26px; background: white; box-shadow: 0 28px 70px rgba(30, 41, 75, 0.08); }
.comparison-row { min-width: 900px; display: grid; grid-template-columns: 0.72fr 1fr 1fr 1.12fr; }
.comparison-row > * { min-height: 108px; padding: 24px; display: flex; align-items: center; border-right: 1px solid #e4e7ed; }
.comparison-row > *:last-child { border-right: 0; }
.comparison-row + .comparison-row { border-top: 1px solid #e4e7ed; }
.comparison-header > * { min-height: 78px; color: #8a919f; font-size: 8px; font-weight: 850; letter-spacing: 0.12em; text-transform: uppercase; }
.comparison-header .brand-lockup { color: var(--ink); font-size: 15px; text-transform: none; }
.comparison-header .brand-mark { width: 24px; height: 24px; }
.comparison-row > strong { color: #273043; font-size: 11px; }
.comparison-row > span { gap: 10px; color: #727a8b; font-size: 10px; line-height: 1.55; }
.comparison-row .applode-column { color: #1f2940; background: #eef2ff; font-weight: 680; }
.minus-icon,
.check-icon { width: 23px; height: 23px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 7px; color: #9097a6; background: #f0f2f5; font-style: normal; }
.check-icon { color: #1f522f; background: var(--lime); }

.pricing-section {
  position: relative;
  padding: 155px 32px 175px;
  overflow: hidden;
  background: #eef1ff;
}

.pricing-heading { width: min(1050px, 100%); margin: 0 auto; text-align: center; }
.pricing-heading h2 { margin: 0; font-size: clamp(58px, 7vw, 99px); line-height: 0.92; letter-spacing: -0.075em; }
.pricing-heading > p:last-child { width: min(640px, 100%); margin: 25px auto 0; color: #687085; font-size: 16px; line-height: 1.65; }
.pricing-grid { width: min(1210px, 100%); margin: 78px auto 0; display: grid; grid-template-columns: repeat(3, 1fr); align-items: stretch; gap: 18px; }
.price-card { position: relative; padding: 34px; display: flex; flex-direction: column; border: 1px solid rgba(31, 44, 81, 0.11); border-radius: 27px; background: rgba(255, 255, 255, 0.8); box-shadow: 0 25px 60px rgba(41, 53, 99, 0.1); backdrop-filter: blur(18px); }
.featured-price { color: var(--ink); border-color: rgba(49, 93, 255, 0.34); background: #f7f9ff; box-shadow: inset 0 3px 0 var(--blue), 0 32px 70px rgba(49, 93, 255, 0.14); transform: translateY(-13px); }
.popular-badge { position: absolute; top: 16px; right: 16px; padding: 7px 9px; border-radius: 99px; color: #334022; background: var(--lime); font-size: 7px; font-weight: 850; letter-spacing: 0.1em; }
.pricing-card-heading { min-height: 49px; display: flex; align-items: center; gap: 12px; }
.pricing-plan-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 13px; color: #5f43db; background: #eeeaff; }
.pricing-plan-icon svg { width: 21px; height: 21px; }
.pricing-plan-icon-coral { color: #d85e49; background: #fff0ec; }
.pricing-plan-icon-lime { color: #4f8028; background: #eff8dc; }
.pricing-card-status { display: inline-block; margin-top: 6px; color: #8791a3; font-size: 9px; font-weight: 700; }
.featured-price .pricing-card-status { color: #748099; }
.plan-name { margin: 0; color: #727a8c; font-size: 9px; font-weight: 850; letter-spacing: 0.15em; }
.featured-price .plan-name { color: #59667f; }
.price { min-height: 103px; margin-top: 39px; }
.price strong,
.price span { display: block; }
.price strong { font-size: clamp(39px, 4vw, 57px); line-height: 0.95; letter-spacing: -0.06em; }
.price span { margin-top: 9px; color: #8c94a4; font-size: 9px; }
.price-copy strong { font-size: clamp(31px, 3vw, 43px); }
.featured-price .price span { color: #748099; }
.price-card > p:not(.plan-name) { min-height: 54px; margin: 23px 0 0; color: #737b8b; font-size: 12px; line-height: 1.55; }
.featured-price > p:not(.plan-name) { color: #58657c; }
.price-card > a { margin-top: 25px; padding: 14px 16px; display: flex; align-items: center; border: 1px solid #dfe3eb; border-radius: 12px; color: #283044; background: white; font-size: 11px; font-weight: 790; transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; }
.price-card > a svg { width: 17px; height: 17px; margin-left: auto; color: var(--blue); transition: transform 180ms ease; }
.price-card > a:hover { transform: translateY(-2px); border-color: rgba(49, 93, 255, .34); box-shadow: 0 10px 20px rgba(49, 93, 255, .11); }
.price-card > a:hover svg { transform: translateX(3px); }
.featured-price > a { color: white; border-color: rgba(255, 255, 255, 0.08); background: var(--blue); }
.featured-price > a svg { color: white; }
.price-card ul { margin: 29px 0 0; padding: 24px 0 0; display: grid; gap: 13px; border-top: 1px solid #e2e5eb; list-style: none; color: #555e70; font-size: 10px; }
.featured-price ul { color: #4e5a70; border-top-color: rgba(49, 93, 255, 0.14); }
.price-card li { position: relative; padding-left: 21px; line-height: 1.5; }
.price-card li::before { content: "✓"; position: absolute; left: 0; top: 0; width: 14px; height: 14px; display: grid; place-items: center; border-radius: 5px; color: #28411e; background: var(--lime); font-size: 7px; font-weight: 900; }
.pricing-section-link { width: max-content; margin: 30px auto 0; display: flex; align-items: center; gap: 8px; color: #44547f; font-size: 11px; font-weight: 800; }
.pricing-section-link span { color: var(--blue); transition: transform 180ms ease; }
.pricing-section-link:hover span { transform: translateX(3px); }

.faq-section { padding: 160px 32px; display: grid; grid-template-columns: 0.82fr 1.18fr; align-items: start; gap: 110px; background: #f8f9fc; }
.faq-heading { max-width: 610px; justify-self: end; }
.faq-heading h2 { margin: 0; font-size: clamp(53px, 6vw, 86px); line-height: 0.94; letter-spacing: -0.07em; }
.faq-heading > p:last-child { margin: 25px 0 0; color: #697080; font-size: 15px; line-height: 1.65; }
.faq-list { width: min(690px, 100%); }
.faq-list details { border-top: 1px solid #dfe3ea; }
.faq-list details:last-child { border-bottom: 1px solid #dfe3ea; }
.faq-list summary { min-height: 88px; display: grid; grid-template-columns: 32px 1fr 28px; align-items: center; gap: 15px; color: #242d40; cursor: pointer; list-style: none; font-size: 14px; font-weight: 740; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary > span { color: var(--blue); font-size: 8px; font-weight: 850; letter-spacing: 0.1em; }
.faq-list summary > b { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 9px; color: #6f7788; background: #edf0f6; font-size: 13px; transition: transform 180ms ease, background 180ms ease; }
.faq-list details[open] summary > b { color: #263a19; background: var(--lime); transform: rotate(45deg); }
.faq-list details > p { margin: -5px 40px 29px 47px; color: #737b8a; font-size: 12px; line-height: 1.7; }

.final-cta {
  position: relative;
  min-height: 760px;
  padding: 130px 6vw;
  display: grid;
  align-items: center;
  overflow: hidden;
  color: white;
  background:
    radial-gradient(circle at 79% 52%, rgba(70, 103, 255, 0.38), transparent 27%),
    linear-gradient(145deg, #111a37, #070c18 67%);
}

.final-cta::before { content: ""; position: absolute; width: 660px; height: 660px; right: -170px; top: 10%; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 50%; box-shadow: 0 0 0 90px rgba(255, 255, 255, 0.018), 0 0 0 180px rgba(255, 255, 255, 0.012); }
.cta-grid { opacity: 0.08; mask-image: linear-gradient(90deg, black, transparent 60%); }
.final-copy { position: relative; z-index: 4; width: min(850px, 70%); }
.final-copy > p { margin: 0 0 27px; color: var(--periwinkle); font-size: 10px; font-weight: 850; letter-spacing: 0.16em; }
.final-copy h2 { margin: 0; font-size: clamp(55px, 6.6vw, 96px); line-height: 0.92; letter-spacing: -0.075em; }
.final-copy h2 em { color: var(--lime); font-family: Georgia, "Times New Roman", serif; font-weight: 400; }
.final-copy > span { margin-top: 25px; display: block; color: #a2abbd; font-size: 16px; }
.cta-light { margin-top: 34px; color: var(--ink); background: white; box-shadow: 0 18px 45px rgba(0, 0, 0, 0.25); }
.cta-light > b { color: white; background: var(--blue); }
.cta-light:hover { color: white; }
.goldmine-asset { position: absolute; z-index: 3; width: min(660px, 48vw); right: -1%; bottom: 1%; filter: drop-shadow(0 45px 65px rgba(0, 0, 0, 0.34)); animation: goldmine-float 5.5s ease-in-out infinite; }
@keyframes goldmine-float { 0%, 100% { transform: translateY(5px) rotate(-2deg); } 50% { transform: translateY(-12px) rotate(1deg); } }
.cta-orbit { position: absolute; z-index: 4; }
.orbit-one { right: 5%; top: 15%; transform: rotate(10deg); }
.orbit-two { right: 45%; bottom: 13%; transform: rotate(-12deg) scale(0.84); }

.site-footer { padding: 72px 6vw 30px; display: grid; grid-template-columns: 1.8fr repeat(3, 0.7fr); gap: 45px; color: #7b8290; background: #060a13; }
.footer-brand .brand-lockup { color: white; }
.footer-brand .brand-mark { background: white; }
.footer-brand .brand-mark i { background: var(--ink); }
.footer-brand .brand-mark i:last-child { background: var(--blue); }
.footer-brand p { max-width: 310px; margin: 17px 0 0; font-size: 11px; line-height: 1.6; }
.footer-links { display: flex; flex-direction: column; gap: 12px; font-size: 10px; }
.footer-links strong { margin-bottom: 5px; color: #d4d8e0; font-size: 9px; letter-spacing: 0.09em; text-transform: uppercase; }
.footer-links a:hover { color: white; }
.footer-links span { color: #555c6b; }
.footer-bottom { grid-column: 1 / -1; margin-top: 35px; padding-top: 24px; display: flex; border-top: 1px solid rgba(255, 255, 255, 0.08); color: #4f5664; font-size: 8px; }
.footer-bottom span:last-child { margin-left: auto; }

@media (max-width: 1180px) {
  .edge-phone { opacity: 0.76; }
  .edge-phone-left { left: -105px; }
  .edge-phone-right { right: -100px; }
  .capability-slide { grid-template-columns: minmax(270px, 0.8fr) minmax(390px, 1.2fr); gap: 40px; }
  .faq-section { gap: 60px; }
}

@media (max-width: 900px) {
  .site-header { width: calc(100% - 36px); }
  .site-header nav { display: none; }
  .site-header { grid-template-columns: 1fr 1fr; }
  .hero { min-height: 920px; padding-top: 120px; align-items: start; }
  .hero-copy { margin-top: 42px; transform: none; }
  .hero h1 { font-size: clamp(55px, 10.5vw, 82px); }
  .hero-subtitle { max-width: 670px; }
  .edge-phone { width: 170px; height: 340px; padding: 51px 17px 18px; border-width: 6px; border-radius: 39px; top: auto; bottom: -115px; opacity: 0.95; }
  .edge-phone-left { left: 7%; }
  .edge-phone-right { right: 7%; }
  .phone-island { top: 12px; width: 60px; height: 17px; }
  .phone-app-row { margin-top: 17px; }
  .phone-app-row .app-glyph { width: 40px; height: 40px; }
  .mini-chart { height: 82px; margin-top: 17px; }
  .mini-question { margin-top: 17px; }
  .mini-answer { margin-bottom: 12px; }
  .scroll-cue { display: none; }
  .proof-heading { grid-template-columns: 1fr; gap: 25px; }
  .proof-heading > p { margin: 0; }
  .proof-cards { grid-template-columns: 1fr; }
  .proof-card { min-height: 280px; }
  .capability-stage { padding: 17px 20px 20px; }
  .capability-stage-header { min-height: 78px; margin-bottom: 12px; }
  .capability-stage-header h2 { font-size: 29px; }
  .capability-slide { padding: 34px; grid-template-columns: minmax(230px, 0.76fr) minmax(350px, 1.24fr); gap: 30px; border-radius: 29px; }
  .capability-number { top: -68px; font-size: 62px; }
  .capability-copy h3,
  .pulse-copy h3 { font-size: clamp(35px, 5.2vw, 46px); }
  .capability-copy > p:not(.bento-kicker) { margin-top: 16px; font-size: 13px; }
  .capability-scroll-hint { bottom: 24px; }
  .workflow-grid { grid-template-columns: 1fr; }
  .workflow-card { min-height: 360px; }
  .workflow-grid h3 { margin-top: 48px; }
  .pricing-grid { grid-template-columns: 1fr; }
  .featured-price { transform: none; }
  .faq-section { grid-template-columns: 1fr; }
  .faq-heading { max-width: 720px; justify-self: start; }
  .faq-list { max-width: 720px; }
  .final-cta { min-height: 900px; align-items: start; }
  .final-copy { width: 100%; }
  .goldmine-asset { width: 620px; max-width: 84vw; right: -4%; bottom: -3%; opacity: 0.82; }
  .site-footer { grid-template-columns: 1.4fr repeat(3, 0.8fr); gap: 30px 22px; }
}

@media (max-width: 780px) {
  .capability-stage { padding: 13px 14px 15px; }
  .capability-stage-header { min-height: 70px; margin-bottom: 10px; }
  .capability-stage-header .eyebrow { margin-bottom: 5px; font-size: 7px; }
  .capability-stage-header h2 { font-size: clamp(22px, 5.5vw, 28px); }
  .capability-progress { gap: 10px; }
  .capability-progress > span { display: none; }
  .capability-progress button { width: 24px; }
  .capability-slide { padding: 24px 20px 29px; grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); align-items: start; gap: 18px; border-radius: 25px; }
  .capability-number { display: none; }
  .capability-copy h3,
  .pulse-copy h3 { max-width: 520px; font-size: clamp(31px, 7vw, 39px); line-height: 0.98; }
  .capability-copy > p:not(.bento-kicker) { max-width: 620px; margin-top: 12px; font-size: 12px; line-height: 1.48; }
  .capability-copy .bento-kicker { margin-bottom: 10px; font-size: 7px; }
  .capability-demo { min-height: 0; align-self: stretch; display: flex; flex-direction: column; justify-content: center; }
  .capability-slide .watchdog-ui,
  .capability-slide .competitor-ui { width: min(560px, 100%); margin: 0 auto; }
  .capability-slide .leaderboard-ui { width: min(620px, 100%); margin: 0 auto; }
  .capability-competitor .watchlist-button { position: absolute; right: 0; top: -3px; margin: 0; }
  .pulse-note { display: none; }
  .capability-scroll-hint { display: none; }
}

@media (max-width: 640px) {
  .site-header { height: 74px; }
  .brand-lockup { font-size: 17px; }
  .brand-mark { width: 25px; height: 25px; }
  .sign-in { padding: 9px 11px; }
  .hero { min-height: 860px; padding: 106px 18px 88px; }
  .hero-copy { margin-top: 14px; }
  .hero-proof { margin-bottom: 23px; font-size: 9px; }
  .hero h1 { font-size: clamp(48px, 13.7vw, 64px); line-height: 0.98; }
  .hero-subtitle { margin-top: 24px; font-size: 15px; }
  .primary-cta { padding: 14px 15px 14px 18px; gap: 20px; font-size: 13px; }
  .edge-phone { width: 145px; height: 285px; bottom: -95px; border-radius: 34px; }
  .edge-phone-left { left: -11px; }
  .edge-phone-right { right: -12px; }
  .phone-app-row span,
  .phone-stat,
  .mini-token-row b:nth-child(3) { display: none; }
  .mini-chart { height: 75px; padding: 12px 8px 8px; }
  .mini-question { padding: 12px; font-size: 10px; }
  .mini-answer { padding: 10px; }
  .proof-section,
  .workflow-section,
  .comparison-section,
  .pricing-section { padding: 105px 18px 115px; }
  .capabilities-section { height: 300svh; padding: 0; }
  .proof-section { padding-left: 0; padding-right: 0; }
  .proof-heading,
  .proof-cards,
  .proof-disclaimer { width: calc(100% - 36px); }
  .proof-heading h2,
  .section-heading h2,
  .workflow-heading h2,
  .comparison-heading h2,
  .pricing-heading h2,
  .faq-heading h2 { font-size: clamp(46px, 13vw, 65px); }
  .proof-heading > p,
  .section-heading > p:last-child,
  .comparison-heading > p:last-child,
  .pricing-heading > p:last-child { font-size: 14px; }
  .ticker-app { width: 174px; }
  .ticker-app img { width: 43px; height: 43px; }
  .proof-card { padding: 23px; }
  .proof-card h3 { margin-top: 38px; }
  .capability-stage { padding: 10px 10px 12px; }
  .capability-stage-header { min-height: 67px; padding: 0 4px; }
  .capability-stage-header h2 { font-size: 21px; letter-spacing: -0.04em; }
  .capability-progress button { width: 20px; }
  .capability-slide { padding: 21px 16px 24px; gap: 13px; border-radius: 22px; }
  .capability-copy h3,
  .pulse-copy h3 { font-size: clamp(29px, 8.5vw, 36px); }
  .capability-copy > p:not(.bento-kicker) { font-size: 11px; }
  .watchdog-ui form { padding: 14px; border-radius: 15px; }
  .watchdog-ui textarea { height: 58px; margin-top: 8px; font-size: 12px; }
  .composer-bottom { padding-top: 9px; }
  .composer-bottom button { padding: 8px 9px; }
  .email-preview { width: 92%; padding: 13px; }
  .email-preview h4 { margin-top: 13px; font-size: 14px; }
  .growth-line { margin-top: 8px; }
  .growth-line strong { font-size: 21px; }
  .email-preview > p { display: none; }
  .capability-competitor .watchlist-button { padding: 7px 8px; font-size: 7px; }
  .chat-question { width: 97%; }
  .chat-question { padding: 11px 13px; }
  .chat-answer { margin-top: 8px; padding: 13px; }
  .chat-answer > p { margin: 11px 0; }
  .change-feed { margin-top: 8px; padding: 9px; }
  .leaderboard-ui { margin: 0; border-radius: 16px; }
  .leaderboard-top { align-items: flex-start; }
  .leaderboard-tabs { flex: 1; }
  .leaderboard-tabs button { flex: 1; padding: 8px 6px; }
  .live-badge { display: none; }
  .leaderboard-head,
  .leaderboard-row { grid-template-columns: 35px minmax(110px, 1.4fr) 70px 78px; }
  .leaderboard-head { padding-left: 10px; padding-right: 10px; }
  .leaderboard-row { min-height: 48px; padding-left: 10px; padding-right: 10px; }
  .model-note { padding: 8px 10px; }
  .workflow-grid { margin-top: 55px; }
  .workflow-card { min-height: 340px; padding: 24px; }
  .comparison-table { margin-top: 50px; overflow-x: auto; border-radius: 18px; }
  .comparison-row { min-width: 840px; }
  .price-card { padding: 28px; }
  .faq-section { padding: 105px 18px 115px; gap: 50px; }
  .faq-list summary { min-height: 78px; font-size: 12px; }
  .faq-list details > p { margin-left: 47px; margin-right: 15px; }
  .final-cta { min-height: 860px; padding: 105px 18px 90px; }
  .final-copy h2 { font-size: clamp(47px, 13.5vw, 66px); }
  .final-copy > span { font-size: 13px; line-height: 1.55; }
  .goldmine-asset { width: 520px; max-width: 105vw; right: -22%; bottom: -1%; opacity: 0.74; }
  .orbit-two { display: none; }
  .site-footer { padding: 58px 22px 26px; grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; margin-bottom: 14px; }
  .footer-links:nth-of-type(3) { grid-column: 1 / -1; }
  .footer-bottom { flex-direction: column; gap: 8px; }
  .footer-bottom span:last-child { margin-left: 0; }
}

.proof-market-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 14px;
}

.proof-market-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 9px;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 999px;
  color: #dbe2f0;
  background: rgba(255, 255, 255, 0.07);
  font-size: 9px;
  font-weight: 760;
}

.proof-market-pill .store-logo {
  width: 17px;
  height: 17px;
  display: block;
  flex: 0 0 auto;
  object-fit: contain;
}

.proof-copy-line {
  display: block;
}

.hero-proof.market-coverage {
  width: max-content;
  padding: 0;
  gap: 8px;
  border: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.hero-proof.market-coverage > .market-pill {
  width: auto;
  height: 38px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(20, 31, 59, 0.1);
  border-radius: 999px;
  color: #646b7c;
  background: rgba(255, 255, 255, 0.72);
  font-size: 11px;
  font-weight: 790;
  letter-spacing: 0.035em;
  box-shadow: 0 8px 18px rgba(42, 61, 122, 0.06);
  backdrop-filter: blur(14px);
}

.hero-proof.market-coverage > .market-pill > .store-logo {
  width: 20px;
  height: 20px;
  display: block;
  flex: 0 0 auto;
  object-fit: contain;
}

@media (max-width: 640px) {
  .hero-proof.market-coverage > .market-pill {
    height: 34px;
    padding: 0 10px;
    font-size: 9px;
  }

  .hero-proof.market-coverage > .market-pill > .store-logo {
    width: 18px;
    height: 18px;
  }
}

/* Capability slides use three distinct compositions instead of one repeated outer card. */
.capability-slide {
  padding: clamp(32px, 4.4vw, 64px);
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.capability-slide::after {
  display: none;
}

.capability-copy {
  align-self: center;
  max-width: 540px;
}

.capability-demo {
  align-self: center;
  min-width: 0;
}

.capability-watchdog > .capability-demo,
.capability-competitor > .capability-demo {
  padding: clamp(24px, 3vw, 42px);
  border: 1px solid rgba(16, 25, 49, 0.1);
  border-radius: 32px;
  box-shadow: 0 28px 75px rgba(28, 39, 73, 0.12);
}

.capability-watchdog > .capability-demo {
  background:
    radial-gradient(circle at 92% 10%, rgba(255, 255, 255, 0.78), transparent 28%),
    linear-gradient(145deg, #d8e0ff, #a9baff 61%, #91a7ff);
}

.capability-competitor > .capability-demo {
  color: #ffffff;
  background:
    radial-gradient(circle at 78% 10%, rgba(110, 138, 255, 0.34), transparent 32%),
    linear-gradient(150deg, #121a36, #080e1d 68%);
}

.capability-competitor {
  color: var(--ink);
  background: transparent;
}

.capability-competitor .capability-copy {
  color: var(--ink);
}

.capability-competitor .capability-number {
  color: rgba(27, 37, 66, 0.11);
}

.capability-competitor .capability-copy > p:not(.bento-kicker) {
  color: #5d6578;
}

.capability-competitor .bento-kicker {
  color: #586177;
}

.capability-slide .watchdog-ui,
.capability-slide .competitor-ui {
  margin-top: 0;
}

.capability-pulse > .capability-demo {
  min-width: 0;
}

.capability-pulse .leaderboard-ui {
  border-radius: 32px;
  box-shadow: 0 28px 75px rgba(28, 39, 73, 0.12);
}

.capability-competitor .capability-copy {
  order: 2;
}

.capability-competitor .capability-demo {
  order: 1;
}

@media (max-width: 780px) {
  .capability-slide {
    padding: 24px 20px 29px;
  }

  .capability-competitor .capability-copy,
  .capability-competitor .capability-demo {
    order: initial;
  }

  .capability-watchdog > .capability-demo,
  .capability-competitor > .capability-demo {
    padding: 18px;
    border-radius: 25px;
  }

  .capability-pulse .leaderboard-ui {
    border-radius: 25px;
  }
}

/* Keep the sections in place, but exchange their light/dark visual themes. */
.workflow-section {
  color: var(--ink);
  background: #f5f6fa;
}

.workflow-heading .eyebrow {
  color: var(--blue);
}

.workflow-heading h2 {
  color: var(--ink);
}

.workflow-heading h2 em {
  color: var(--blue);
}

.workflow-card {
  color: var(--ink);
  border-color: #dfe2e9;
  border-radius: 26px;
  background: #ffffff;
  box-shadow: 0 28px 70px rgba(30, 41, 75, 0.08);
}

.workflow-card::after {
  background: rgba(140, 114, 255, 0.12);
}

.workflow-card:nth-child(2)::after {
  background: rgba(255, 128, 107, 0.12);
}

.workflow-card:nth-child(3)::after {
  background: rgba(202, 255, 105, 0.16);
}

@media (prefers-reduced-motion: reduce) {
  .workflow-card,
  .workflow-card::before { transition: none; }
}

.step-top {
  color: #8a919f;
}

.workflow-grid h3 {
  color: var(--ink);
}

.workflow-grid p {
  color: #697081;
}

.step-chip {
  color: #727a8b;
  border-color: #dfe3eb;
  background: #f0f2f5;
}

.step-chip i {
  background: #8ecf3f;
  box-shadow: 0 0 0 3px rgba(142, 207, 63, 0.13);
}

.comparison-section {
  color: #ffffff;
  background: var(--ink);
}

.comparison-heading .eyebrow {
  color: var(--periwinkle);
}

.comparison-heading h2 {
  color: #ffffff;
}

.comparison-heading > p:last-child {
  color: #a1a9bb;
}

.comparison-table {
  border-color: rgba(255, 255, 255, 0.11);
  border-radius: 26px;
  background: #111a34;
  box-shadow: none;
}

.comparison-row > * {
  border-color: rgba(255, 255, 255, 0.1);
}

.comparison-row + .comparison-row {
  border-color: rgba(255, 255, 255, 0.1);
}

.comparison-header > * {
  color: #929cb3;
}

.comparison-header .brand-lockup {
  color: #ffffff;
}

.comparison-row > strong {
  color: #ffffff;
}

.comparison-row > span {
  color: #aeb7c8;
}

.comparison-row .applode-column {
  color: #ffffff;
  background: #19254d;
}

.minus-icon,
.check-icon {
  color: #909aae;
  background: rgba(255, 255, 255, 0.08);
}

.check-icon {
  color: #26341d;
  background: var(--lime);
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .ticker-track,
  .goldmine-asset { animation: none; }
  *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; }
}

/* FAQ is a centered reading section, not a two-column intro + list. */
.faq-section {
  display: block;
  padding: 150px 32px 165px;
}

.faq-heading {
  max-width: 820px;
  margin: 0 auto 66px;
  text-align: center;
}

.faq-heading h2 {
  margin: 0;
}

.faq-heading > p:first-child {
  margin-bottom: 22px;
}

.faq-list {
  width: min(900px, 100%);
  margin: 0 auto;
}

@media (max-width: 900px) {
  .faq-heading {
    max-width: 720px;
    margin-right: auto;
    margin-bottom: 50px;
    text-align: center;
  }
}

@media (max-width: 640px) {
  .faq-section {
    padding: 105px 18px 115px;
  }

  .faq-heading {
    margin-bottom: 42px;
  }
}

/* Keep section headlines readable and consistent across the long page. */
.proof-heading h2 {
  font-size: clamp(44px, 5.2vw, 76px);
  line-height: 0.98;
  letter-spacing: -0.06em;
}

.workflow-heading h2 {
  font-size: clamp(48px, 5.4vw, 78px);
  line-height: 0.96;
  letter-spacing: -0.06em;
}

.workflow-heading h2 em {
  color: var(--blue);
  font-family: inherit;
  font-style: normal;
  font-weight: 600;
}

.comparison-heading h2 {
  font-size: clamp(48px, 5.5vw, 80px);
  line-height: 0.96;
  letter-spacing: -0.06em;
}

.pricing-heading h2 {
  font-size: clamp(48px, 5.6vw, 82px);
  line-height: 0.96;
  letter-spacing: -0.06em;
}

.faq-heading h2 {
  font-size: clamp(46px, 5.2vw, 76px);
  line-height: 0.98;
  letter-spacing: -0.06em;
}

@media (max-width: 640px) {
  .proof-heading h2,
  .workflow-heading h2,
  .comparison-heading h2,
  .pricing-heading h2,
  .faq-heading h2 {
    font-size: clamp(38px, 11vw, 54px);
    line-height: 0.99;
  }
}

/* Final polish after the shortened comparison copy and section-heading audit. */
.comparison-header > * {
  font-size: 9px;
}

.comparison-row > strong {
  font-size: 12px;
}

.comparison-row > span {
  font-size: 11px;
}

.final-copy {
  width: min(800px, 68%);
}

.final-copy h2 {
  font-size: clamp(48px, 5.7vw, 82px);
  line-height: 0.95;
  letter-spacing: -0.065em;
}

.final-copy h2 em {
  font-size: 0.98em;
}

@media (max-width: 640px) {
  .final-copy {
    width: 100%;
  }

  .final-copy h2 {
    font-size: clamp(42px, 12vw, 58px);
  }
}
