/* The homepage keeps the middle of the viewport for the product story. */
.landing-page .site-header { border-bottom-color: transparent; background: #fffffff2; }
.landing-page .nav-wrap { width: min(1560px, calc(100% - 64px)); }
.landing-page .nav-contact { margin-left: auto; }
.scene-ready .site-header { background: transparent; backdrop-filter: none; pointer-events: none; }
.scene-ready .site-header::before { content: ''; position: absolute; inset: 0; background: #fffffff2; backdrop-filter: blur(14px); opacity: var(--header-surface-opacity, 1); z-index: -1; }
.scene-ready .site-header .brand, .scene-ready .site-header .nav-contact { position: relative; pointer-events: auto; will-change: transform; }
.scene-ready .site-header .brand { width: var(--header-brand-width, auto); height: 44px; overflow: clip; white-space: nowrap; transform: translate3d(var(--header-brand-x, 0px), var(--header-brand-y, 0px), 0); }
.scene-ready .site-header .brand > span { flex-shrink: 0; opacity: var(--header-wordmark-opacity, 1); }
.scene-ready .site-header .brand img { flex-shrink: 0; }
.scene-ready .site-header .nav-contact { min-height: 44px; font-size: 12px; gap: 12px; padding: 10px 14px; white-space: nowrap; transform: translate3d(var(--header-contact-x, 0px), var(--header-contact-y, 0px), 0); }
.discovery-nav, .discovery-toggle { position: fixed; z-index: 30; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .28s ease, transform .28s ease, visibility 0s .28s; }
.discovery-nav { left: 32px; top: 50%; width: 112px; transform: translate(-12px, -50%); }
.discovery-nav.is-visible { opacity: 1; visibility: visible; pointer-events: auto; transform: translate(0, -50%); transition-delay: 0s; }
.discovery-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 17px; }
.discovery-heading > .label { font-size: 10px; letter-spacing: .08em; color: var(--muted); }
.discovery-close { display: none; }
.discovery-nav > a { display: flex; align-items: center; gap: 9px; min-height: 44px; font-size: 12px; color: #666; transition: color .2s; }
.discovery-nav > a:hover, .discovery-nav > a[aria-current] { color: #111; }
.discovery-number { color: #aaa; font: 9px/1 var(--mono); }
.discovery-nav a[aria-current] .discovery-number { color: #111; }
.discovery-arrow { margin-left: auto; font-size: 15px; opacity: 0; transition: opacity .2s; }
.discovery-nav > a:hover .discovery-arrow, .discovery-nav > a:focus-visible .discovery-arrow { opacity: 1; }
.discovery-nav > .discovery-top { border-top: 1px solid var(--line); padding-top: 15px; margin-top: 16px; min-height: 0; color: var(--muted); font-size: 10px; justify-content: space-between; }
.discovery-toggle { display: none; }
.scene-cue { display: none; }
.scene-ready .intro-centred { min-height: calc(100svh - 80px); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0; padding-block: 64px 100px; }
.scene-ready .intro-centred .intro-eyebrow { flex-shrink: 0; }
.scene-ready .intro-centred .intro-actions { flex-shrink: 0; }
.scene-ready .scene-cue { display: flex; align-items: center; gap: 12px; position: absolute; bottom: 28px; margin: 0; font-size: 10px; letter-spacing: .06em; color: #888; }
.scene-cue > span { font-size: 16px; }
.scene-ready [data-scene-content] { opacity: var(--scene-opacity, 1); transform: translate3d(0, var(--scene-y, 0px), 0); }
.scene-ready [data-scene-content]:focus-within { opacity: 1; }

@media (min-width: 1280px) and (min-height: 480px) {
  /* Reserve both margins up front: revealing navigation never shifts a scene. */
  .landing-page main .frame, .landing-page .site-footer .frame { width: min(1200px, calc(100% - 336px)); }
  .landing-page .product-details-bar { flex-wrap: wrap; }
  /* Once docked, the contact shortcut becomes a quiet utility link. */
  .scene-ready .site-header .nav-contact { --contact-fill: calc((1 - var(--header-dock-progress, 0)) * 100%); background: color-mix(in srgb, #111 var(--contact-fill), transparent); color: color-mix(in srgb, #fff var(--contact-fill), #111); border-color: transparent; }
  .scene-ready .site-header .nav-contact:hover { background: #f1f3ed; color: #111; }
}
@media (min-width: 1000px) and (min-height: 640px) and (prefers-reduced-motion: no-preference) {
  .scene-ready .intro { min-height: calc(125svh - 80px); }
  .scene-ready .intro-centred { position: sticky; top: 80px; }
}
@media (max-width: 1279px), (max-height: 479px) {
  .scene-ready .site-header { top: env(safe-area-inset-top, 0px); }
  .scene-ready .site-header::before {
    inset: calc(7px * var(--header-dock-progress, 0)) calc(12px * var(--header-dock-progress, 0));
    opacity: 1;
    border: 1px solid rgb(0 0 0 / calc(.09 * var(--header-dock-progress, 0)));
    border-radius: calc(18px * var(--header-dock-progress, 0));
    box-shadow: 0 6px 24px rgb(0 0 0 / calc(.08 * var(--header-dock-progress, 0)));
    pointer-events: auto;
  }
  .scene-ready .site-header .brand { border-radius: 10px; }
  .scene-ready .site-header .brand img { transform: translateX(var(--header-mark-x, 0px)); }
  .scene-ready .site-header .nav-contact { border-radius: calc(5px + 6px * var(--header-dock-progress, 0)); }
  .discovery-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 10px; left: var(--menu-left, 74px); top: calc(env(safe-area-inset-top, 0px) + var(--menu-top, 18px)); min-height: 44px; padding: 11px 12px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: var(--ink); font-size: 12px; line-height: 1.4; transform: translateY(5px); }
  .discovery-toggle:hover, .discovery-toggle[aria-expanded="true"] { background: #f1f3ed; }
  .discovery-toggle.is-visible { opacity: 1; visibility: visible; pointer-events: auto; transform: none; transition-delay: 0s; }
  .discovery-toggle-icon { display: flex; flex-direction: column; gap: 4px; width: 12px; }
  .discovery-toggle-icon i { display: block; width: 12px; height: 1px; background: currentColor; }
  .discovery-toggle[aria-expanded="true"] .discovery-toggle-icon i:first-child { transform: translateY(2.5px) rotate(45deg); }
  .discovery-toggle[aria-expanded="true"] .discovery-toggle-icon i:last-child { transform: translateY(-2.5px) rotate(-45deg); }
  .discovery-nav { top: calc(env(safe-area-inset-top, 0px) + var(--menu-panel-top, 88px)); left: 12px; width: min(280px, calc(100vw - 24px)); max-height: calc(100dvh - var(--menu-panel-top, 88px) - 12px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); overflow-y: auto; overscroll-behavior: contain; padding: 20px; background: #fff; border: 1px solid #ddd; border-radius: 16px; box-shadow: 0 12px 36px #00000010; transform: translateY(-8px); }
  .discovery-nav.is-visible { transform: none; }
  .discovery-heading { margin-bottom: 10px; }
  .discovery-close { display: grid; place-items: center; width: 32px; height: 32px; border: 0; border-radius: 5px; background: #f5f5f5; color: #111; font-size: 23px; line-height: 1; }
  .discovery-nav > a { font-size: 15px; gap: 16px; min-height: 48px; }
  .discovery-number { font-size: 10px; }
  .discovery-arrow { opacity: 1; font-size: 18px; }
  .discovery-nav > .discovery-top { font-size: 12px; }
}
@media (max-width: 760px) {
  .landing-page .nav-wrap { width: calc(100% - 40px); }
  .landing-page .nav-label { display: inline; }
  .landing-page .nav-short { display: none; }
  .landing-page .brand > span { font-size: 19px; }
  .landing-page .nav-contact { font-size: 12px; padding: 10px 12px; gap: 10px; }
  .scene-ready .intro-centred { min-height: calc(100svh - 68px); padding-block: 54px 90px; }
  .scene-ready .scene-cue { bottom: 90px; font-size: 9px; }
}
@media (max-height: 550px) {
  .scene-ready .intro-centred { min-height: 0; padding-block: 40px 80px; }
}
@media (prefers-reduced-motion: reduce) {
  .scene-ready [data-scene-content] { opacity: 1; transform: none; }
  .discovery-nav, .discovery-toggle { transition: none; }
}
@media print {
  .discovery-nav, .discovery-toggle, .scene-cue { display: none !important; }
  .scene-ready .intro, .scene-ready .intro-centred { min-height: 0; position: static; }
  .scene-ready [data-scene-content] { opacity: 1 !important; transform: none !important; }
}
