.section-heading { max-width: 42rem; margin-bottom: 2rem; }
.section-heading h2 { margin-bottom: 0.75rem; }
.section-heading p:last-child { margin-bottom: 0; color: var(--muted-ink); }
.section-heading--centered { margin-inline: auto; text-align: center; }
.hero { padding: 5.25rem 0 3.25rem; text-align: center; }
.hero__inner { max-width: 42rem; }
.hero h1 { max-width: 38rem; margin: 0 auto 1.25rem; }
.hero__body { max-width: 38rem; margin: 0 auto 1.75rem; color: var(--muted-ink); font-size: 1.125rem; }
.app-store-badge-link { min-height: 44px; display: inline-flex; align-items: center; line-height: 0; }
.app-store-badge-link img { width: 156px; height: 40px; }
.proof-strip { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.75rem 1.5rem; margin: 1.5rem 0 0; padding: 0; color: var(--muted-ink); font-size: 0.875rem; list-style: none; }
.planning-demo { padding-bottom: 5.5rem; }
.planning-demo__figure, .mcp-demo__figure, .view-figure { margin: 0; }
.media-frame { overflow: hidden; border: 1px solid var(--decorative-border); border-radius: 14px; background: var(--canvas); }
.media-frame--primary { width: 100%; box-shadow: 0 18px 48px rgba(25, 25, 25, 0.12); }
.media-frame--mcp { width: min(60rem, 100%); margin-inline: auto; box-shadow: 0 14px 36px rgba(25, 25, 25, 0.1); }
.media-video, .media-frame img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.media-placeholder { min-height: 100%; aspect-ratio: 16 / 9; display: grid; align-content: center; justify-items: center; gap: 0.5rem; border: 1px dashed var(--control-border); padding: 1.5rem; color: var(--muted-ink); text-align: center; }
.media-placeholder strong { color: var(--ink); }
.media-placeholder__delivery { margin: 0; padding: 0.75rem 1rem; border-top: 1px solid var(--decorative-border); font-size: 0.75rem; overflow-wrap: anywhere; list-style: none; }
.planning-demo figcaption { max-width: 42rem; margin: 1rem auto 0; text-align: center; }
.media-description { margin: 0.35rem 0 0; color: var(--muted-ink); }
.views-section, .mcp-demo, .capabilities-section, .plans-section { padding-block: 5.5rem; border-top: 1px solid var(--decorative-border); }
.view-list { display: grid; }
.view-row { display: grid; grid-template-columns: minmax(10rem, 0.64fr) minmax(0, 1.36fr); grid-template-areas: "copy media"; align-items: center; gap: clamp(2rem, 5vw, 4rem); min-height: 17rem; padding-block: 2rem; }
.view-row + .view-row { border-top: 1px solid var(--decorative-border); }
.view-row--media-start { grid-template-columns: minmax(0, 1.36fr) minmax(10rem, 0.64fr); grid-template-areas: "media copy"; }
.view-row__copy { grid-area: copy; }
.view-row__kicker { margin-bottom: 0.5rem; color: var(--teal); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.view-row__title { margin-bottom: 0.5rem; }
.view-row__body { margin: 0; color: var(--muted-ink); font-size: 0.9375rem; }
.view-figure { grid-area: media; position: relative; min-width: 0; padding: 2.75rem 3rem; }
.view-media-frame { overflow: hidden; border: 1px solid var(--decorative-border); border-radius: 14px; background: var(--canvas); box-shadow: 0 12px 30px rgba(25, 25, 25, 0.09); }
.view-media-frame > img, .view-media-frame > .media-placeholder { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.view-annotations { margin: 0; padding: 0; list-style: none; }
.view-annotation { position: absolute; max-width: 10rem; color: var(--muted-ink); font-size: 0.75rem; font-style: italic; }
.view-annotation--1 { top: 0; left: 0; }
.view-annotation--2 { right: 0; bottom: 0; text-align: right; }
.view-annotation__leader { position: absolute; width: 5rem; height: 2.5rem; overflow: visible; fill: none; stroke: var(--teal); stroke-width: 1.5; stroke-dasharray: 2 4; pointer-events: none; }
.view-annotation--1 .view-annotation__leader { top: 1rem; left: 65%; }
.view-annotation--2 .view-annotation__leader { right: 65%; bottom: 1rem; transform: rotate(180deg); }
.mcp-demo { text-align: center; }
.mcp-demo__copy { max-width: 42rem; }
.mcp-demo__trust { font-weight: 600; }
.mcp-demo__figure figcaption { margin-top: 1rem; }
.mcp-demo__description { max-width: 42rem; margin: 0.5rem auto 0; color: var(--muted-ink); }
.capability-list { margin: 0; border-top: 1px solid var(--decorative-border); }
.capability-row { display: grid; grid-template-columns: minmax(10rem, 0.42fr) 1fr; gap: 1.5rem; padding-block: 1rem; border-bottom: 1px solid var(--decorative-border); }
.capability-row dt { font-weight: 600; }
.capability-row dd { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; margin: 0; color: var(--muted-ink); }
.plans-section { background: var(--comparison-surface); }
.comparison-scroll { overflow-x: auto; padding: 3px; }
.comparison-table { width: 100%; min-width: 660px; border-collapse: collapse; background: var(--canvas); }
.comparison-col--capability { width: 56%; }
.comparison-col--solo { width: 15%; }
.comparison-col--team { width: 29%; }
.comparison-table th, .comparison-table td { border-bottom: 1px solid var(--decorative-border); padding: 0.875rem 1rem; text-align: left; vertical-align: top; }
.comparison-table thead th { border-top: 1px solid var(--decorative-border); font-weight: 600; }
.comparison-table tbody th { font-weight: 400; }
.plan-meta { display: block; color: var(--muted-ink); font-size: 0.75rem; font-weight: 400; }
.included { color: var(--included); font-weight: 600; }
.download-section { padding-block: 6rem; background: var(--quiet-surface); text-align: center; }
.download-section__inner { max-width: 42rem; }
.download-section h2 { margin-bottom: 0.75rem; }
.download-section__inner > p:not(.section-kicker) { color: var(--muted-ink); }
.download-section__meta { margin: 0.75rem 0 0; font-size: 0.875rem; }

@media (max-width: 640px) {
  .hero { padding: 4rem 0 2.5rem; }
  .proof-strip { align-items: center; flex-direction: column; gap: 0.5rem; }
  .views-section, .mcp-demo, .capabilities-section, .plans-section { padding-block: 4rem; }
  .view-row, .view-row--media-start { grid-template-columns: 1fr; grid-template-areas: "copy" "media"; gap: 1rem; padding-block: 1.5rem; }
  .view-figure { padding: 0; }
  .view-annotations { display: grid; gap: 0.25rem; margin-top: 0.75rem; padding-left: 1.25rem; color: var(--muted-ink); font-size: 0.8125rem; list-style: disc; }
  .view-annotation { position: static; max-width: none; font-style: normal; text-align: left; }
  .view-annotation__leader { display: none; }
  .capability-row { grid-template-columns: 1fr; gap: 0.35rem; }
  .download-section { padding-block: 4rem; }
}
