/* Opt-in layer for deep public products. Never included by index.html. */
.seo-page {
    --product-gap: var(--space-6);
    --product-radius: var(--radius-lg);
    --product-accent: var(--primary-light);
}
[data-theme="light"] .seo-page { --product-accent: var(--color-primary-hover); }
.seo-page .container { width: min(var(--container), calc(100% - 2.5rem)); }
.seo-page .seo-hero { padding-block: clamp(112px, 10vw, 152px) var(--space-6); }
.seo-page .seo-hero-grid { position: relative; z-index: 1; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: center; gap: clamp(32px, 4vw, 64px); }
.seo-page .hero-title { font-size: clamp(2rem, 3.3vw, 3.5rem); line-height: 1.12; letter-spacing: -.035em; max-width: 24ch; text-wrap: balance; }
[data-theme] .seo-page .hero-title { color: var(--text); }
.seo-page .hero-subtitle, .seo-page .seo-lead { max-width: 65ch; font-size: var(--font-size-lg); line-height: 1.65; }
.seo-page .section-head { display: block; max-width: 76ch; margin-bottom: var(--space-6); }
.seo-page h2 { font-size: clamp(1.65rem, 2.5vw, 2.6rem); line-height: 1.2; letter-spacing: -.025em; text-wrap: balance; }
.seo-page h3 { font-size: 1.18rem; line-height: 1.35; text-wrap: balance; }
.seo-page p { line-height: 1.7; }
.seo-page :where(h1, h2, h3, p, li, strong, span) { overflow-wrap: break-word; }
.seo-page .hero-actions { gap: var(--space-3); align-items: stretch; }
.seo-page .hero-actions .btn { min-height: 48px; white-space: normal; text-align: center; line-height: 1.4; }
.seo-page .hero-chips { gap: var(--space-2); }
.seo-page .hero-chip { font-size: var(--font-size-sm); padding: var(--space-2) var(--space-3); }
.seo-page :where(.seo-card-grid, .seo-data-grid, .seo-use-grid, .seo-role-grid, .seo-steps, .seo-link-grid) { gap: var(--space-5); align-items: stretch; }
.seo-page :where(.seo-card, .seo-data-card, .seo-use-card, .seo-role-card, .seo-step, .seo-note-card, .seo-link-card) { padding: var(--space-5); border-radius: var(--product-radius); box-shadow: none; }
.seo-page .seo-cta-card { display: block; }
.seo-page .seo-cta-card:has(.hero-actions) { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
.seo-page .seo-two-col { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
.seo-page .seo-signal-row { grid-template-columns: minmax(0, .65fr) minmax(0, 1fr); }
.seo-page .seo-faq { max-width: none; }
.seo-page .seo-faq-item { border-radius: var(--product-radius); }
.seo-page .seo-faq-item summary { line-height: 1.5; padding-block: var(--space-1); }
.seo-page .seo-table-wrap { max-width: 100%; border-radius: var(--product-radius); }
.seo-page .seo-table-wrap:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 4px; }
.seo-page .seo-table th { position: sticky; top: 0; }
.seo-product-media { margin: 0; min-width: 0; border: 1px solid var(--border-strong); border-radius: var(--product-radius); overflow: hidden; background: var(--surface); box-shadow: var(--shadow-card); }
.seo-product-media__stage { position: relative; aspect-ratio: 4 / 3; isolation: isolate; touch-action: pan-y; background: var(--bg-soft); }
.seo-product-media__slide { position: absolute; inset: 0; opacity: 0; transition: opacity .45s ease; }
.seo-product-media__slide.is-active { opacity: 1; z-index: 1; }
.seo-product-media__slide img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.seo-product-media--square .seo-product-media__stage { aspect-ratio: 1 / 1; }
.seo-product-media__label { position: absolute; bottom: 0; left: 0; right: 0; z-index: 2; padding: var(--space-6) var(--space-5) var(--space-4); color: #fff; background: linear-gradient(transparent, rgba(2, 6, 23, .88)); font-size: var(--font-size-sm); }
.seo-product-media figcaption { display: grid; padding: var(--space-4) var(--space-5); color: var(--text-muted); font-size: var(--font-size-sm); line-height: 1.55; }
.seo-product-media__caption { grid-area: 1 / 1; visibility: hidden; }
.seo-product-media__caption.is-active { visibility: visible; }
.seo-product-media__controls { display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--border); }
.seo-product-media__controls[hidden] { display: none; }
.seo-product-media__dots { display: flex; gap: var(--space-2); }
.seo-product-media__controls button { min-height: 44px; min-width: 44px; border: 1px solid var(--border-strong); border-radius: var(--radius-md); background: var(--surface); color: var(--text); padding: var(--space-2) var(--space-3); cursor: pointer; font: inherit; font-size: var(--font-size-sm); }
.seo-product-media__dots button[aria-pressed="true"] { background: var(--color-primary-hover); color: #fff; border-color: var(--color-primary-hover); }
.seo-product-media__controls button:disabled { cursor: default; color: var(--text-muted); }
.seo-product-media__fallback { position: absolute; inset: 0; margin: 0; display: grid; place-content: center; padding: var(--space-6); color: var(--text-muted); text-align: center; }
.seo-product-gallery__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: var(--space-5); }
.seo-product-gallery figure { margin: 0; overflow: hidden; border: 1px solid var(--border); border-radius: var(--product-radius); background: var(--surface); }
.seo-product-gallery picture { display: block; aspect-ratio: 4 / 3; }
.seo-product-gallery picture.seo-product-gallery__square { aspect-ratio: 1 / 1; }
.seo-product-gallery img { display: block; width: 100%; height: 100%; object-fit: contain; }
.seo-product-gallery figcaption { padding: var(--space-4); color: var(--text-muted); line-height: 1.55; }
.seo-engineering-chain { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3); list-style: none; padding: 0; margin: 0 0 var(--space-6); }
.seo-engineering-chain li { display: grid; grid-template-columns: auto 1fr; align-items: start; gap: var(--space-3); padding: var(--space-4); border: 1px solid var(--border-strong); border-radius: var(--radius-md); font-weight: 650; line-height: 1.5; background: var(--surface); }
.seo-engineering-chain li > span { color: var(--product-accent); font-size: var(--font-size-sm); font-variant-numeric: tabular-nums; }
.seo-product-evidence { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--product-gap); align-items: start; }
.seo-product-boundaries { display: grid; gap: var(--space-4); }
.seo-product-status { display: block; font-size: var(--font-size-sm); font-weight: 750; color: var(--product-accent); margin-bottom: var(--space-3); }
.seo-product-preview { min-width: 0; }
.seo-product-preview .seo-hero-card { border-radius: var(--product-radius); box-shadow: none; }
#product-pilot .seo-link-grid + .seo-cta-card { margin-top: var(--space-6); }
.seo-road-map { position: relative; min-height: 176px; border: 1px solid var(--border-strong); border-radius: var(--radius-md); margin-block: var(--space-4); background: repeating-linear-gradient(0deg, transparent 0 35px, var(--border) 35px 36px), repeating-linear-gradient(90deg, transparent 0 35px, var(--border) 35px 36px), var(--bg-soft); }
.seo-road-map svg { display: block; width: 100%; height: 176px; }
.seo-road-map path { fill: none; stroke: var(--color-primary); stroke-width: 9; stroke-linecap: round; }
.seo-road-map .seo-road-map__problem { stroke: var(--color-warning); stroke-width: 12; }
.seo-road-map text { fill: var(--text); font: 650 14px var(--font-family-base); }
.seo-road-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); margin: var(--space-4) 0; }
.seo-road-metrics div { padding: var(--space-3); border-left: 2px solid var(--color-primary); }
.seo-road-metrics dt { color: var(--text-muted); font-size: var(--font-size-sm); }
.seo-road-metrics dd { margin: var(--space-2) 0 0; font-size: var(--font-size-lg); font-weight: 750; }
.seo-page .seo-demo-note { font-size: var(--font-size-sm); color: var(--text-muted); }
@media (max-width: 1180px) {
    .seo-page .seo-hero-grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
    .seo-engineering-chain { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .seo-page .seo-cta-card:has(.hero-actions) { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
    .seo-page .seo-hero-grid, .seo-page .seo-two-col, .seo-product-evidence { grid-template-columns: minmax(0, 1fr); }
    .seo-page .hero-title { max-width: 24ch; }
    .seo-product-media { width: 100%; max-width: 680px; }
    .seo-engineering-chain { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
    .seo-page .hero-actions { flex-direction: column; }
    .seo-page .hero-title { font-size: 2rem; }
    .seo-page .hero-subtitle, .seo-page .seo-lead { font-size: var(--font-size-md); }
    .seo-page .fleet-map { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .seo-engineering-chain { grid-template-columns: minmax(0, 1fr); }
    .seo-engineering-chain li { padding: var(--space-3) var(--space-4); }
    .seo-page .seo-signal-row { grid-template-columns: 1fr; gap: var(--space-2); }
}
@media (prefers-reduced-motion: reduce) {
    .seo-product-media__slide { transition: none; }
    .seo-page .seo-link-card:hover { transform: none; }
}
