.m-home .hero {
  padding-block: var(--section-y-lg);
  background-image: var(--hero-surface);
  border-block-end: var(--hairline) solid var(--line);
}

.m-home .hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(19rem, .82fr);
  align-items: center;
  gap: clamp(var(--sp-7), 7vw, 6rem);
}

.m-home .hero__grid > div { min-width: 0; }
.m-home .hero .display { max-width: 15ch; }
.m-home .hero .lede { max-width: 45rem; }

.m-home__slides { min-block-size: 27rem; }
.m-home__slide > * + * { margin-block-start: var(--sp-5); }
.m-home__slide:not([hidden]) { animation: m-home-slide-in var(--dur-2) var(--ease); }
@keyframes m-home-slide-in {
  from { opacity: 0; transform: translateY(.4rem); }
  to { opacity: 1; transform: none; }
}

.m-home__hero-actions { margin-block-start: var(--sp-6); }
.m-home__hero-actions .btn { box-shadow: var(--shadow-1); }

.m-home__marquee-controls {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  margin-block-start: var(--sp-5);
}
.m-home__marquee-controls button {
  width: 2.25rem;
  height: 1.5rem;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.m-home__marquee-controls button span {
  display: block;
  width: 100%;
  height: 2px;
  border-radius: var(--radius-pill);
  background: var(--line-strong);
  transition: height var(--dur-1) var(--ease), background var(--dur-1) var(--ease);
}
.m-home__marquee-controls button[aria-pressed="true"] span {
  height: 4px;
  background: linear-gradient(90deg, var(--accent), var(--accent-2));
}
.m-home__marquee-controls button:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

.m-home__visual { display: grid; place-items: center; min-width: 0; }
.m-home__vm {
  width: min(118%, 42rem);
  max-width: none;
  height: auto;
  overflow: visible;
  filter: drop-shadow(0 12px 18px var(--line));
}
.m-home__vm * { vector-effect: non-scaling-stroke; }
.m-home__device { fill: var(--surface); stroke: var(--line-strong); stroke-width: 1.5; }
.m-home__screen { fill: var(--bg-sunken); stroke: var(--line); }
.m-home__camera { fill: var(--ink-ui); }
.m-home__stand { fill: var(--surface); stroke: var(--line-strong); stroke-width: 1.5; }
.m-home__base { fill: none; stroke: var(--line-strong); stroke-width: 5; stroke-linecap: round; }
.m-home__scene-bg { fill: var(--bg-sunken); }
.m-home__gradient-edge { stop-color: var(--surface); }
.m-home__gradient-core { stop-color: var(--monitor-purple); }
.m-home__gradient-flare { stop-color: var(--monitor-blue); }
.m-home__screen-gradient {
  fill: url(#slate-screen-gradient);
  opacity: .22;
  transform-origin: center;
  animation: m-home-gradient-drift 5s ease-in-out infinite alternate;
}
@keyframes m-home-gradient-drift {
  from { opacity: .14; transform: translateX(-12px) scale(1.03); }
  to { opacity: .34; transform: translateX(12px) scale(1.08); }
}
[data-visual-scene][hidden] { display: none; }
[data-visual-scene]:not([hidden]) > * { animation: m-home-scene-in .55s var(--ease) both; }
@keyframes m-home-scene-in {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: none; }
}
.m-home__svg-kicker,.m-home__svg-title,.m-home__svg-copy,.m-home__svg-step,.m-home__svg-mini { font-family: var(--font); fill: var(--ink); }
.m-home__svg-kicker { font-size: 10px; font-weight: 700; letter-spacing: 1.5px; fill: var(--ink-2); }
.m-home__svg-title { font-size: 18px; font-weight: 700; letter-spacing: -.35px; }
.m-home__svg-copy { font-size: 12px; fill: var(--ink-2); }
.m-home__svg-step { font-size: 15px; font-weight: 750; }
.m-home__svg-mini { font-size: 9px; font-weight: 750; letter-spacing: .7px; }
.m-home__svg-center { text-anchor: middle; }
.m-home__svg-right { text-anchor: end; }
.m-home__os-card,.m-home__platform-card,.m-home__window { fill: var(--surface); stroke: var(--line-strong); }
.m-home__platform-node,.m-home__life-node,.m-home__mcp-core { fill: var(--accent-quiet); stroke: var(--accent); stroke-width: 2; }
.m-home__apple-mark { fill: var(--ink); }
.m-home__linux-mark { fill: var(--linux-outer); }
:root[data-theme="dark"] .m-home__linux-mark {
  fill: var(--line);
  stroke: var(--ink-2);
  stroke-width: 12px;
  stroke-linejoin: round;
  paint-order: stroke fill;
}
:root[data-theme="dark"] .m-home__mac-window {
  fill: var(--accent-quiet);
  stroke: var(--ink-ui);
}
:root[data-theme="dark"] .m-home__mac-studio {
  fill: var(--accent-quiet);
  stroke: var(--ink-ui);
}
:root[data-theme="dark"] .m-home__mac-studio-top {
  fill: var(--surface-2);
  stroke: var(--ink-ui);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .m-home__linux-mark {
    fill: var(--line);
    stroke: var(--ink-2);
    stroke-width: 12px;
    stroke-linejoin: round;
    paint-order: stroke fill;
  }
  :root:not([data-theme="light"]) .m-home__mac-window {
    fill: var(--accent-quiet);
    stroke: var(--ink-ui);
  }
  :root:not([data-theme="light"]) .m-home__mac-studio {
    fill: var(--accent-quiet);
    stroke: var(--ink-ui);
  }
  :root:not([data-theme="light"]) .m-home__mac-studio-top {
    fill: var(--surface-2);
    stroke: var(--ink-ui);
  }
}
.m-home__linux-beak,.m-home__linux-feet { fill: url(#slate-linux-yellow-gradient); stroke: var(--ink-ui); stroke-width: 1; }
.m-home__linux-yellow-light { stop-color: var(--linux-yellow-light); }
.m-home__linux-yellow-shade { stop-color: var(--linux-yellow-shade); }
.m-home__windows-mark { fill: #0078d4; }
.m-home__flow-line,.m-home__flow-arrow,.m-home__lifecycle-line,.m-home__tool-line { fill: none; stroke: var(--accent); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.m-home__window-bar { stroke: var(--line-strong); }
.m-home__tool-node { fill: var(--surface); stroke: var(--line-strong); stroke-width: 1.5; }
.m-home__tool-line { stroke: var(--accent-2); stroke-width: 1.5; }
.m-home__journey-card,.m-home__blueprint,.m-home__env-card,.m-home__prompt,.m-home__result-card { fill: var(--surface); stroke: var(--line-strong); stroke-width: 1.25; }
.m-home__journey-card--ready,.m-home__result-card { fill: var(--accent-quiet); stroke: var(--accent); }
.m-home__setting-line,.m-home__desktop-line,.m-home__blueprint-rule { fill: none; stroke: var(--line-strong); stroke-width: 2; stroke-linecap: round; }
.m-home__setting-dot,.m-home__env-status { fill: var(--accent-2); }
.m-home__ready-check { fill: none; stroke: var(--accent); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.m-home__window-dot { fill: var(--line-strong); }
.m-home__window-side { fill: var(--surface-2); stroke: var(--line); }
.m-home__desktop-card { fill: var(--accent-quiet); stroke: var(--line-strong); }
.m-home__blueprint { fill: var(--surface-2); }
.m-home__function-chip { fill: var(--surface); stroke: var(--accent); stroke-width: 1.25; }
.m-home__bundle-tab { fill: none; stroke: var(--line); stroke-width: 1.25; }
.m-home__repeat-arrow { fill: none; stroke: var(--accent); stroke-width: 2.5; stroke-linecap: round; }
.m-home__host-link { fill: none; stroke: var(--accent); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.m-home__mac-window { fill: var(--surface); stroke: var(--line-strong); stroke-width: 1.5; }
.m-home__mac-studio { fill: var(--surface); stroke: var(--line-strong); stroke-width: 1.5; }
.m-home__mac-studio-top { fill: var(--surface-2); stroke: var(--line-strong); stroke-width: 1.25; }
.m-home__mac-studio-light { fill: var(--accent-2); }
.m-home__traffic--close { fill: var(--status-error-bg); }
.m-home__traffic--minimize { fill: var(--status-warn-bg); }
.m-home__traffic--maximize { fill: var(--status-ok-bg); }
.m-home__abstract-list circle { fill: var(--accent-2); }
.m-home__abstract-list path { fill: none; stroke: var(--line-strong); stroke-width: 4; stroke-linecap: round; }
.m-home__dotted-arrow { fill: none; stroke: var(--accent); stroke-width: 3; stroke-linecap: round; stroke-dasharray: 3 9; }
.m-home__dotted-arrow-head { fill: none; stroke: var(--accent); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.m-home__vm-cube { fill: none; stroke: var(--accent); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.m-home__config-label { fill: var(--ink-2); font-family: var(--font-mono); font-size: 10px; font-weight: 700; letter-spacing: 1px; }
.m-home__config-change { fill: var(--ink); font-family: var(--font-mono); font-size: 14px; font-weight: 700; }
.m-home__chat-user { fill: var(--accent); stroke: color-mix(in srgb, var(--accent) 70%, white); stroke-width: 1; }
.m-home__chat-user-pointer { fill: var(--accent); }
.m-home__chat-slate { fill: var(--accent-2); stroke: color-mix(in srgb, var(--accent-2) 60%, white); stroke-width: 1; }
.m-home__chat-slate-pointer { fill: var(--accent-2); }
.m-home__chat-text { fill: var(--ink); font-family: var(--font-mono); font-size: 12px; }
.m-home__chat-user-text { fill: var(--on-accent); }
.m-home__chat-phase { fill: var(--ink); font-family: var(--font-mono); font-size: 9px; font-weight: 750; letter-spacing: 1.2px; }
.m-home__chat-response { opacity: 0; }
[data-visual-scene="llm"]:not([hidden]) .m-home__chat-response {
  animation: m-home-chat-phase 8s linear infinite;
  animation-delay: var(--m-home-chat-delay, 0s);
}
.m-home__chat-response--see { opacity: 1; }
.m-home__chat-response--understand { --m-home-chat-delay: -6s; }
.m-home__chat-response--operate { --m-home-chat-delay: -4s; }
.m-home__chat-response--verify { --m-home-chat-delay: -2s; }
.m-home__chat-progress circle { fill: var(--accent); opacity: .22; }
.m-home__chat-progress-active circle { fill: var(--accent); }
@keyframes m-home-chat-phase {
  0%, 21% { opacity: 1; }
  25%, 96% { opacity: 0; }
  100% { opacity: 1; }
}

.m-home .hero-proof {
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  padding: clamp(var(--sp-6), 4vw, var(--sp-8));
  background: var(--surface);
  border: var(--hairline) solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-2);
}

.m-home .hero-proof .proof-label {
  color: var(--accent);
  font-size: var(--fs-xs);
  font-weight: 700;
  letter-spacing: var(--tr-eyebrow);
  text-transform: uppercase;
}

.m-home .hero-proof strong {
  color: var(--ink);
  font-size: var(--fs-h3);
  line-height: var(--lh-snug);
  text-wrap: balance;
}

.m-home .hero-proof p { color: var(--ink-2); }

.m-home .split {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  align-items: start;
  gap: clamp(var(--sp-7), 7vw, 6rem);
}

.m-home .stat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sp-4);
}

.m-home .stat {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  min-width: 0;
  padding: var(--sp-5);
  background: var(--surface);
  border: var(--hairline) solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-1);
}

.m-home .stat strong {
  color: var(--ink);
  font-size: var(--fs-h3);
  line-height: var(--lh-snug);
}

.m-home .stat span {
  color: var(--ink-2);
  font-size: var(--fs-sm);
  line-height: var(--lh-body);
}

.m-home__agent-intro { align-items: center; }
.m-home__agent-intro .btn-row { flex-wrap: nowrap; }
.m-home__agent-prompt { gap: var(--sp-5); background: var(--surface); }
.m-home__agent-prompt > p:not(.eyebrow) { color: var(--ink); font-size: var(--fs-body); line-height: var(--lh-body); }
.m-home__agent-prompt > span { color: var(--accent-hover); font-family: var(--font-mono); font-size: var(--fs-sm); }

@media (max-width: 52rem) {
  .m-home .hero__grid,
  .m-home .split { grid-template-columns: minmax(0, 1fr); }
  .m-home__rotator { display: contents; }
  .m-home__visual { order: 1; }
  .m-home__slides { order: 2; min-block-size: 19rem; }
  .m-home__hero-actions { order: 3; margin-block-start: 0; }
  .m-home__marquee-controls { order: 4; margin-block-start: 0; }
  .m-home__vm { width: min(100%, 35rem); max-width: 100%; }
}

@media (max-width: 34rem) {
  .m-home .stat-grid { grid-template-columns: minmax(0, 1fr); }
  .m-home__slides { min-block-size: 24rem; }
  .m-home__marquee-controls { justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  .m-home__slide:not([hidden]),
  .m-home__screen-gradient,
  [data-visual-scene]:not([hidden]) > *,
  [data-visual-scene="llm"]:not([hidden]) .m-home__chat-response { animation: none; }
  .m-home__chat-response:not(.m-home__chat-response--see) { opacity: 0; }
}

/* ── marquee: an infinite horizontal strip, one pill per capability ──────── */
.m-home__marquee {
  overflow: hidden;
  border-block: var(--hairline) solid var(--line);
  background: var(--surface-2);
  padding-block: var(--sp-6);
}
.m-home__marquee-track {
  display: flex;
  width: max-content;
  gap: var(--sp-4);
  padding-inline: var(--sp-4);
  animation: m-home-scroll 38s linear infinite;
}
.m-home__marquee:hover .m-home__marquee-track { animation-play-state: paused; }
.m-home__marquee-item {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-1);
  min-width: 13rem;
  max-width: 15rem;
  padding: var(--sp-4) var(--sp-5);
  background: var(--surface);
  border: var(--hairline) solid var(--line);
  border-radius: var(--radius-md);
  text-decoration: none;
  color: inherit;
  text-align: center;
}
.m-home__marquee-stat {
  font-size: var(--fs-body);
  font-weight: 700;
  line-height: var(--lh-tight);
  color: var(--ink);
}
.m-home__marquee-label {
  font-size: var(--fs-xs);
  color: var(--ink-2);
  line-height: var(--lh-snug);
}
.m-home__marquee-item--accent {
  background: var(--ink);
  border-color: var(--ink);
}
.m-home__marquee-item--accent .m-home__marquee-stat,
.m-home__marquee-item--accent .m-home__marquee-label {
  color: var(--bg);
}
.m-home__marquee-note { text-align: center; margin-block-start: var(--sp-5); }

@keyframes m-home-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  .m-home__marquee-track { animation: none; }
  .m-home__marquee { overflow-x: auto; }
}
