:root {
  --ink: #17171b;
  --muted: #62636b;
  --line: #e5e5e8;
  --soft: #f6f6f8;
  --purple: #6555d9;
  --purple-soft: #efedff;
  --green: #23876b;
  --red: #cc5c52;
  --max: 1280px;
}

*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  min-width: 320px;
  color: var(--ink);
  background: #fff;
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
button { font: inherit; }
.section-shell { width: min(var(--max), calc(100% - 96px)); margin-inline: auto; }

.site-header {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  width: 100%;
  min-height: 72px;
  padding: 0 max(32px, calc((100vw - var(--max)) / 2));
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 32px;
  border-bottom: 1px solid transparent;
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(16px);
  transition: border-color .2s, box-shadow .2s;
}

.site-header.is-scrolled {
  border-color: var(--line);
  box-shadow: 0 4px 20px rgba(20, 20, 30, .05);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: max-content;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -.04em;
}

.brand img { display: block; border-radius: 9px; }

.desktop-nav {
  display: flex;
  align-items: center;
  gap: 30px;
  font-size: 14px;
  font-weight: 500;
  color: #4c4d54;
}

.desktop-nav a,
.text-link { transition: color .15s; }
.desktop-nav a:hover,
.text-link:hover { color: var(--purple); }

.header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 20px;
  font-size: 14px;
  font-weight: 600;
}

.button {
  min-height: 50px;
  padding: 0 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 600;
  transition: transform .15s, background .15s, border-color .15s, box-shadow .15s;
}

.button:hover { transform: translateY(-1px); }
.button.compact { min-height: 40px; padding-inline: 16px; font-size: 14px; }
.button-dark { color: #fff; background: #18181c; }
.button-dark:hover { background: #302f36; box-shadow: 0 5px 16px rgba(20, 20, 25, .16); }
.button-outline { border-color: #cbccd1; background: #fff; }
.button-outline:hover { border-color: #9899a1; background: #fafafa; }

.hero {
  padding-top: 152px;
  text-align: center;
}

.hero-copy { max-width: 940px; margin: 0 auto; }

.eyebrow,
.section-label {
  margin: 0 0 20px;
  color: var(--purple);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 7px 12px;
  border: 1px solid #dedbea;
  border-radius: 999px;
  background: #faf9ff;
  color: #5748bd;
  text-transform: none;
  letter-spacing: 0;
}

.eyebrow span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--purple);
  box-shadow: 0 0 0 4px rgba(101, 85, 217, .12);
}

.hero h1 {
  margin: 0;
  font-size: clamp(50px, 6.2vw, 82px);
  line-height: 1.02;
  letter-spacing: -.065em;
  font-weight: 600;
}

.hero h1 em {
  color: var(--purple);
  font-style: normal;
}

.hero-lead {
  max-width: 760px;
  margin: 28px auto 0;
  color: #52535b;
  font-size: 20px;
  line-height: 1.55;
  letter-spacing: -.015em;
}

.hero-actions {
  margin-top: 32px;
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}

.hero-note {
  margin: 17px 0 0;
  color: #84858c;
  font-size: 13px;
}

.product-stage {
  position: relative;
  margin-top: 72px;
  padding: 0 20px 90px;
}

.product-glow {
  position: absolute;
  inset: 8% -8% 0;
  z-index: -1;
  border-radius: 50%;
  background:
    radial-gradient(circle at 45% 40%, rgba(101, 85, 217, .18), transparent 44%),
    radial-gradient(circle at 70% 48%, rgba(74, 174, 150, .12), transparent 34%);
  filter: blur(16px);
}

.product-window {
  overflow: hidden;
  border: 1px solid #d9d9de;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 34px 80px rgba(24, 24, 32, .16), 0 5px 18px rgba(24, 24, 32, .08);
  text-align: left;
}

.window-bar {
  height: 44px;
  padding: 0 14px;
  display: grid;
  grid-template-columns: 80px 1fr 80px;
  align-items: center;
  border-bottom: 1px solid #e2e2e6;
  background: #fafafa;
}

.window-dots { display: flex; gap: 6px; }
.window-dots i { width: 9px; height: 9px; border-radius: 50%; background: #d7d7da; }
.window-dots i:first-child { background: #ef786f; }
.window-dots i:nth-child(2) { background: #efbe62; }
.window-dots i:nth-child(3) { background: #67c184; }
.window-address { color: #87878e; font-size: 11px; text-align: center; }
.window-user {
  justify-self: end;
  width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #473993;
  background: #ddd7ff;
  font-size: 9px;
  font-weight: 700;
}

.window-body {
  display: grid;
  grid-template-columns: 182px minmax(0, 1fr) 270px;
  min-height: 520px;
}

.mock-sidebar {
  padding: 17px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  color: #aaa9b4;
  background: #17171d;
}

.mock-brand {
  margin: 0 5px 24px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #fff;
  font-size: 13px;
}

.mock-brand img { border-radius: 6px; }
.mock-sidebar small {
  margin: 14px 8px 5px;
  color: #666570;
  font-size: 7px;
  font-weight: 700;
  letter-spacing: .08em;
}

.mock-nav {
  padding: 7px 8px;
  display: flex;
  justify-content: space-between;
  border-radius: 6px;
  font-size: 9px;
}

.mock-nav em {
  color: #777680;
  font-style: normal;
}

.mock-nav.active {
  color: #fff;
  background: #2a2932;
}

.mock-main { padding: 24px; background: #f7f7f5; }
.mock-heading span { color: #7362d5; font-size: 7px; font-weight: 700; letter-spacing: .08em; }
.mock-heading h3 { margin: 5px 0 3px; font-size: 18px; letter-spacing: -.03em; }
.mock-heading p { margin: 0 0 18px; color: #8e8d94; font-size: 9px; }

.mock-hero {
  min-height: 140px;
  padding: 22px;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  border-radius: 12px;
  color: #fff;
  background: linear-gradient(120deg, #27232e, #44385f);
}

.mock-hero small { color: #aea7be; font-size: 7px; font-weight: 700; }
.mock-hero strong { display: block; margin-top: 8px; font-size: 20px; line-height: 1.15; }
.mock-hero button {
  padding: 8px 10px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 6px;
  color: #fff;
  background: rgba(255,255,255,.08);
  font-size: 8px;
}

.mock-metrics {
  margin-top: 11px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}

.mock-metrics > div {
  padding: 12px;
  display: grid;
  grid-template-columns: 1fr auto;
  border: 1px solid #e3e3df;
  border-radius: 9px;
  background: #fff;
}

.mock-metrics span { color: #77767d; font-size: 8px; }
.mock-metrics strong { grid-column: 2; grid-row: 1 / span 2; font-size: 18px; }
.mock-metrics small { margin-top: 4px; color: #aaa9ae; font-size: 7px; }

.mock-priorities {
  margin-top: 11px;
  padding: 14px;
  border: 1px solid #e3e3df;
  border-radius: 9px;
  background: #fff;
  font-size: 8px;
}

.mock-priorities > b { font-size: 10px; }
.mock-priorities p {
  margin: 9px 0 0;
  padding-top: 9px;
  display: flex;
  align-items: center;
  gap: 6px;
  border-top: 1px solid #ededeb;
  color: #57565c;
}

.mock-priorities p span { margin-left: auto; color: #6855d4; font-weight: 600; }
.mock-priorities i { width: 6px; height: 6px; border-radius: 50%; background: var(--red); }
.mock-priorities i.purple { background: var(--purple); }

.mock-agent {
  padding: 17px 14px 14px;
  display: flex;
  flex-direction: column;
  border-left: 1px solid #e2e2e6;
  background: #fff;
}

.agent-header { display: flex; align-items: center; gap: 8px; }
.agent-orb {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: #fff;
  background: var(--purple);
  font-size: 11px;
}
.agent-header div { display: flex; flex-direction: column; }
.agent-header b { font-size: 10px; }
.agent-header small { color: #6c9d86; font-size: 7px; }
.context-chip {
  margin: 14px -14px 20px;
  padding: 8px 14px;
  color: #6658ac;
  background: #faf9ff;
  border-block: 1px solid #edebf7;
  font-size: 7px;
}
.agent-message {
  color: #54545a;
  font-size: 9px;
  line-height: 1.6;
}
.agent-result {
  margin-top: 14px;
  padding: 11px;
  display: flex;
  flex-direction: column;
  gap: 7px;
  border: 1px solid #e7e7e4;
  border-radius: 8px;
  background: #fafaf8;
  font-size: 8px;
}
.agent-result span { padding-top: 6px; border-top: 1px solid #e8e8e4; color: #68676d; }
.agent-input {
  margin-top: auto;
  padding: 10px;
  display: flex;
  justify-content: space-between;
  border: 1px solid #dddde0;
  border-radius: 8px;
  color: #aaa9af;
  font-size: 7px;
}
.agent-input i {
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border-radius: 5px;
  color: #fff;
  background: var(--purple);
  font-style: normal;
}

.confidence-bar {
  padding: 46px 48px;
  border-block: 1px solid var(--line);
  text-align: center;
}
.confidence-bar > p { margin: 0 0 24px; color: #777880; font-size: 14px; }
.confidence-bar > div { display: flex; justify-content: center; gap: 36px; flex-wrap: wrap; }
.confidence-bar span { color: #414249; font-size: 14px; font-weight: 500; }
.confidence-bar i { margin-right: 8px; color: var(--green); font-style: normal; }

.problem,
.use-cases,
.trust,
.fit,
.final-cta { padding-block: 120px; }

.problem > h2,
.platform h2,
.section-center h2,
.trust-copy h2 {
  max-width: 900px;
  margin: 0;
  font-size: clamp(38px, 4.2vw, 58px);
  line-height: 1.08;
  letter-spacing: -.05em;
  font-weight: 600;
}

.section-intro {
  max-width: 720px;
  margin: 24px 0 0;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.65;
}

.comparison {
  margin-top: 54px;
  padding: 28px;
  display: grid;
  grid-template-columns: 1fr 54px 1fr;
  align-items: stretch;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--soft);
}

.comparison-side {
  padding: 24px;
  border-radius: 12px;
  background: #fff;
}
.comparison-side > span { display: block; margin-bottom: 18px; font-size: 14px; font-weight: 600; }
.comparison-side p {
  margin: 0;
  padding: 12px 0;
  border-top: 1px solid #ededf0;
  color: #676870;
  font-size: 15px;
}
.comparison-side.new { color: #fff; background: #1c1c21; }
.comparison-side.new p { color: #d0d0d5; border-color: #36363d; }
.comparison-arrow { display: grid; place-items: center; color: var(--purple); font-size: 25px; }

.platform { padding-block: 120px; background: #f7f7f8; }
.platform .section-intro { margin-bottom: 84px; }
.feature-row {
  padding-block: 88px;
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 88px;
  align-items: center;
  border-top: 1px solid #dedee2;
}
.feature-row.reverse .feature-copy { order: 2; }
.feature-row.reverse .feature-visual { order: 1; }
.feature-number {
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  margin-bottom: 24px;
  border: 1px solid #d4d2e3;
  border-radius: 50%;
  color: var(--purple);
  background: #fff;
  font-size: 13px;
  font-weight: 600;
}
.feature-copy h3 {
  margin: 0;
  font-size: 36px;
  line-height: 1.15;
  letter-spacing: -.045em;
  font-weight: 600;
}
.feature-copy > p { margin: 22px 0 0; color: var(--muted); font-size: 17px; line-height: 1.65; }
.feature-copy ul { margin: 24px 0 0; padding: 0; list-style: none; }
.feature-copy li { position: relative; margin-top: 12px; padding-left: 25px; color: #414249; font-size: 15px; }
.feature-copy li::before { position: absolute; left: 0; content: "✓"; color: var(--green); font-weight: 700; }

.feature-visual {
  min-width: 0;
  padding: 22px;
  border: 1px solid #dddde1;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 16px 44px rgba(25, 25, 35, .08);
}
.visual-top { margin-bottom: 18px; display: flex; align-items: center; justify-content: space-between; }
.visual-top > span { font-size: 15px; font-weight: 600; }
.visual-top button {
  padding: 8px 12px;
  border: 0;
  border-radius: 7px;
  color: #fff;
  background: var(--purple);
  font-size: 12px;
}
.visual-top > em { color: #96969d; font-size: 12px; font-style: normal; }
.visual-top > em.online { color: var(--green); }
.brain-banner {
  padding: 18px;
  display: grid;
  grid-template-columns: 38px 1fr auto;
  align-items: center;
  gap: 12px;
  border-radius: 11px;
  color: #fff;
  background: linear-gradient(115deg, #29252f, #4a3d65);
}
.brain-banner > i {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: rgba(255,255,255,.11);
  font-style: normal;
}
.brain-banner div { display: flex; flex-direction: column; }
.brain-banner small { color: #aaa2bd; font-size: 8px; font-weight: 700; letter-spacing: .08em; }
.brain-banner b { margin-top: 3px; font-size: 13px; }
.brain-banner > strong { display: flex; flex-direction: column; font-size: 19px; }
.brain-banner > strong em { color: #aaa2bd; font-size: 9px; font-style: normal; font-weight: 400; }
.file-row {
  padding: 15px 2px;
  display: grid;
  grid-template-columns: 40px 1fr auto;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid #ebebed;
}
.file-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: #ae514b;
  background: #fbe8e6;
  font-size: 8px;
  font-weight: 700;
}
.file-icon.green { color: #337965; background: #e6f4ee; }
.file-icon.amber { color: #996922; background: #faf0da; }
.file-row div { display: flex; flex-direction: column; }
.file-row b { font-size: 12px; }
.file-row small { margin-top: 3px; color: #96969d; font-size: 10px; }
.file-row > em { padding: 4px 7px; border-radius: 7px; color: var(--green); background: #e8f5ef; font-size: 9px; font-style: normal; }

.customer-title { padding: 16px 0; display: flex; align-items: center; gap: 11px; border-block: 1px solid #e8e8eb; }
.company-avatar { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 9px; color: #5547ad; background: var(--purple-soft); font-size: 11px; font-weight: 700; }
.customer-title > div:nth-child(2) { display: flex; flex: 1; flex-direction: column; }
.customer-title b { font-size: 13px; }
.customer-title small { margin-top: 2px; color: #96969d; font-size: 10px; }
.customer-title > span { padding: 5px 8px; border-radius: 7px; color: var(--green); background: #e7f4ee; font-size: 9px; }
.customer-grid { padding: 17px 0; display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.customer-grid div { display: flex; flex-direction: column; }
.customer-grid small { color: #94949b; font-size: 9px; text-transform: uppercase; }
.customer-grid b { margin-top: 3px; font-size: 12px; }
.next-action { padding: 16px; display: flex; flex-direction: column; border-radius: 10px; background: #f6f4ff; }
.next-action small { color: #7161c4; font-size: 8px; font-weight: 700; }
.next-action b { margin: 5px 0 12px; font-size: 12px; }
.next-action button { width: max-content; padding: 7px 10px; border: 0; border-radius: 6px; color: #fff; background: var(--purple); font-size: 10px; }

.chat-line { display: flex; gap: 10px; }
.chat-line > i { width: 25px; height: 25px; flex: none; display: grid; place-items: center; border-radius: 7px; color: #fff; background: var(--purple); font-style: normal; font-size: 10px; }
.chat-line p { margin: 0; color: #55565e; font-size: 12px; line-height: 1.55; }
.result-card { margin: 17px 0; padding: 13px; border: 1px solid #e6e6e8; border-radius: 10px; background: #fafafa; }
.result-card > div { display: flex; justify-content: space-between; font-size: 11px; }
.result-card > div span { color: #94949b; }
.result-card p { margin: 9px 0 0; padding-top: 9px; display: flex; align-items: center; gap: 7px; border-top: 1px solid #e7e7e8; font-size: 10px; }
.result-card p em { width: 18px; height: 18px; display: grid; place-items: center; border-radius: 5px; color: var(--purple); background: var(--purple-soft); font-style: normal; }
.result-card > button { margin-top: 12px; padding: 0; border: 0; color: var(--purple); background: none; font-size: 10px; font-weight: 600; }
.chat-compose { padding: 11px; display: flex; justify-content: space-between; border: 1px solid #dcdce0; border-radius: 8px; color: #a0a0a6; font-size: 10px; }
.chat-compose i { width: 20px; height: 20px; display: grid; place-items: center; border-radius: 5px; color: #fff; background: var(--purple); font-style: normal; }

.section-center { text-align: center; }
.section-center h2,
.section-center .section-intro { margin-inline: auto; }
.lifecycle-grid { margin-top: 58px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.lifecycle-grid article,
.fit-grid article {
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}
.lifecycle-grid span { color: var(--purple); font-size: 13px; font-weight: 600; }
.lifecycle-grid h3,
.fit-grid h3,
.steps h3,
.trust-grid h3 { margin: 24px 0 9px; font-size: 22px; line-height: 1.2; letter-spacing: -.03em; font-weight: 600; }
.lifecycle-grid p,
.fit-grid p,
.steps p,
.trust-grid p { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.6; }

.how { padding-block: 120px; background: #18181d; color: #fff; }
.how .section-label { color: #a99deb; }
.how .section-intro { color: #aaaab2; }
.steps { margin: 64px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; list-style: none; background: #39393f; border: 1px solid #39393f; border-radius: 14px; overflow: hidden; }
.steps li { min-height: 210px; padding: 32px; display: grid; grid-template-columns: 40px 1fr; gap: 18px; background: #222228; }
.steps em { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid #4d4d55; border-radius: 50%; color: #b4a9f3; font-size: 13px; font-style: normal; }
.steps h3 { margin-top: 5px; color: #fff; }
.steps p { color: #aaaab2; }

.trust { display: grid; grid-template-columns: .75fr 1.25fr; gap: 90px; }
.trust-copy > p:last-child { margin-top: 23px; color: var(--muted); font-size: 17px; line-height: 1.65; }
.trust-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px 38px; }
.trust-grid article { padding-top: 20px; border-top: 1px solid var(--line); }
.trust-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 9px; color: var(--purple); background: var(--purple-soft); font-size: 17px; font-weight: 600; }
.trust-grid h3 { margin-top: 18px; }

.fit { padding-top: 40px; }
.fit-grid { margin-top: 54px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.fit-grid h3 { margin-top: 0; }

.final-card {
  padding: 72px;
  border-radius: 18px;
  color: #fff;
  background:
    radial-gradient(circle at 80% 20%, rgba(116, 96, 226, .32), transparent 34%),
    #18181d;
  text-align: center;
}
.final-card .section-label { color: #aaa0e8; }
.final-card h2 { max-width: 900px; margin: 0 auto; font-size: clamp(38px, 4.3vw, 60px); line-height: 1.1; letter-spacing: -.05em; font-weight: 600; }
.final-card > p:not(.section-label) { margin: 23px auto 0; color: #b7b7be; font-size: 17px; }
.final-card > div { margin-top: 32px; display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.button-white { color: #17171b; background: #fff; }
.button-dark-outline { color: #fff; border-color: #55555d; background: transparent; }

.site-footer {
  width: min(var(--max), calc(100% - 96px));
  margin: 0 auto;
  padding: 70px 0 28px;
  display: grid;
  grid-template-columns: 1fr 160px 160px;
  gap: 40px;
}
.footer-main > p { max-width: 360px; margin: 19px 0 0; color: var(--muted); font-size: 14px; }
.footer-column { display: flex; flex-direction: column; gap: 12px; font-size: 14px; }
.footer-column b { margin-bottom: 5px; font-size: 13px; }
.footer-column a { color: var(--muted); }
.footer-column a:hover { color: var(--purple); }
.footer-bottom {
  grid-column: 1 / -1;
  margin-top: 40px;
  padding-top: 22px;
  display: flex;
  justify-content: space-between;
  border-top: 1px solid var(--line);
  color: #909098;
  font-size: 12px;
}

.reveal { opacity: 0; transform: translateY(18px); transition: opacity .65s ease, transform .65s ease; }
.reveal.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; }
  .reveal { opacity: 1; transform: none; transition: none; }
}

@media (max-width: 1100px) {
  .section-shell,
  .site-footer { width: min(100% - 48px, var(--max)); }
  .site-header { padding-inline: 24px; }
  .desktop-nav { gap: 18px; }
  .window-body { grid-template-columns: 152px minmax(0, 1fr) 220px; }
  .feature-row { gap: 48px; }
  .trust { gap: 50px; }
}

@media (max-width: 900px) {
  .site-header { grid-template-columns: 1fr auto; }
  .desktop-nav { display: none; }
  .product-stage { margin-inline: -16px; padding-inline: 0; }
  .window-body { grid-template-columns: 140px 1fr; }
  .mock-agent { display: none; }
  .feature-row,
  .feature-row.reverse,
  .trust { grid-template-columns: 1fr; }
  .feature-row.reverse .feature-copy,
  .feature-row.reverse .feature-visual { order: initial; }
  .lifecycle-grid { grid-template-columns: 1fr 1fr; }
  .trust-grid { max-width: none; }
}

@media (max-width: 680px) {
  .section-shell,
  .site-footer { width: calc(100% - 36px); }
  .site-header { min-height: 64px; padding-inline: 18px; }
  .header-actions .text-link { display: none; }
  .button.compact { min-height: 38px; }
  .hero { padding-top: 116px; }
  .hero h1 { font-size: 45px; }
  .hero-lead { font-size: 17px; }
  .hero-actions .button { width: 100%; }
  .product-stage { margin-top: 50px; padding-bottom: 62px; }
  .window-body { grid-template-columns: 1fr; min-height: 440px; }
  .mock-sidebar { display: none; }
  .mock-main { padding: 16px; }
  .mock-metrics { grid-template-columns: 1fr; }
  .confidence-bar { padding-inline: 22px; }
  .confidence-bar > div { align-items: flex-start; flex-direction: column; gap: 12px; text-align: left; }
  .problem,
  .use-cases,
  .trust,
  .fit,
  .final-cta,
  .platform,
  .how { padding-block: 80px; }
  .comparison { padding: 14px; grid-template-columns: 1fr; }
  .comparison-arrow { height: 45px; transform: rotate(90deg); }
  .platform .section-intro { margin-bottom: 54px; }
  .feature-row { padding-block: 62px; gap: 34px; }
  .feature-copy h3 { font-size: 30px; }
  .feature-visual { padding: 14px; }
  .brain-banner { grid-template-columns: 34px 1fr; }
  .brain-banner > strong { display: none; }
  .lifecycle-grid,
  .steps,
  .trust-grid,
  .fit-grid { grid-template-columns: 1fr; }
  .steps li { min-height: 0; }
  .final-card { padding: 48px 22px; }
  .final-card > div .button { width: 100%; }
  .site-footer { grid-template-columns: 1fr 1fr; }
  .footer-main { grid-column: 1 / -1; }
}