/* Small-screen opening: give the copy, model and controls their own space. */
@media (max-width: 700px) and (orientation: portrait) {
 .home-page .header { height: 64px; }
 .home-page nav { top: 64px; }
 .home-page .device-sticky { min-height: 0; }
 .home-page .device-copy { top: 86px; left: 7%; right: 7%; width: 86%; transform: none; }
 .home-page .device-copy .eyebrow { font-size: .68rem; line-height: 1.45; margin-bottom: 12px; }
 .home-page .device-copy h1 { font-size: clamp(2.25rem, 11vw, 3.35rem); line-height: .98; max-width: none; }
 .home-page .device-copy h1 br { display: initial; }
 .home-page .device-copy .lead { max-width: none; font-size: .94rem; line-height: 1.48; margin-top: 14px; }
 .home-page .device-copy .text-link { font-size: .875rem; margin-top: 5px; padding: 9px 0; min-height: 40px; }
 .home-page .device-copy .quiet-detail { font-size: .75rem; line-height: 1.45; margin-top: 10px; }
 .home-page .device-bottom { left: 7%; right: 7%; bottom: 12px; display: grid; grid-template-columns: 1fr 36px; gap: 7px 12px; align-items: center; }
 .home-page .device-caption { display: contents; }
 .home-page .device-caption p { grid-column: 1 / -1; grid-row: 1; max-width: none; font-size: .65rem; line-height: 1.4; }
 .home-page .story-chapters { grid-column: 1; grid-row: 2; justify-content: space-between; gap: 8px; }
 .home-page .story-chapters button { min-width: 30px; min-height: 36px; padding: 8px 4px; }
 .home-page .device-caption .motion-toggle { grid-column: 2; grid-row: 2; width: 36px; height: 36px; }
 .home-page .scene-labels { left: 7%; right: 7%; top: auto; bottom: 101px; max-width: none; text-align: left; font-size: .6rem; letter-spacing: .04em; }
 .home-page .scene-labels > span { max-width: none; line-height: 1.4; }
 .home-page .device-vignette { background: linear-gradient(0deg, #08191d 0, transparent 19%); }
 .home-page .device-copy[data-chapter="4"] { top: 86px; }
 .home-page .signal-profile { bottom: 76px; }
}
@media (max-width: 700px) and (orientation: portrait) and (max-height: 620px) {
 .home-page .device-copy { top: 78px; }
 .home-page .device-copy .eyebrow { font-size: .63rem; margin-bottom: 9px; }
 .home-page .device-copy h1 { font-size: 2rem; }
 .home-page .device-copy h2 { font-size: 2.5rem; }
 .home-page .device-copy .lead { font-size: .875rem; line-height: 1.45; margin-top: 11px; }
 .home-page .device-copy .text-link { min-height: 36px; padding: 7px 0; margin-top: 4px; }
 .home-page .device-copy[data-chapter="3"] h2 { font-size: 2.25rem; }
 .home-page .device-copy[data-chapter="3"] .lead { font-size: .875rem; }
 .home-page .device-copy[data-chapter="4"] { top: 78px; }
 .home-page .device-copy[data-chapter="4"] h2 { font-size: 2.15rem; }
 .home-page .signal-profile { bottom: 70px; }
 .home-page .profile-header { gap: 8px; }
 .home-page .profile-header h3 { font-size: 1.4rem; }
 .home-page .profile-header > span { font-size: .56rem; }
 .home-page .profile-pipeline > span { font-size: .62rem; }
 .home-page .fingerprint-name { font-size: .8rem; }
}
@media (orientation: landscape) and (max-width: 1100px) and (max-height: 500px) {
 .home-page .header { height: 56px; padding: 0 max(5%, env(safe-area-inset-left)); }
 .home-page .brand { font-size: 1.15rem; gap: 8px; }
 .home-page .brand img { width: 25px; height: 30px; }
 .home-page .nav-cta { display: none; }
 .home-page .menu-toggle { display: flex; align-items: center; gap: 18px; border: 0; background: transparent; font-size: .9rem; }
 .home-page .menu-toggle span { font-size: 1.5rem; }
 .home-page nav { display: none; position: absolute; top: 56px; left: 0; right: 0; padding: 18px 5%; background: var(--night); flex-direction: row; justify-content: center; border-bottom: 1px solid var(--line); gap: 32px; }
 .home-page nav.open { display: flex; }
 .home-page .device-sticky { min-height: 0; }
 .home-page .device-copy, .home-page .device-copy[data-chapter="4"] { top: 70px; left: 5%; right: auto; width: 40%; max-width: none; transform: none; }
 .home-page .device-copy .eyebrow { font-size: .6rem; line-height: 1.4; letter-spacing: .055em; margin-bottom: 8px; max-width: none; }
 .home-page .device-copy h1, .home-page .device-copy h2, .home-page .device-copy[data-chapter="3"] h2, .home-page .device-copy[data-chapter="4"] h2 { font-size: clamp(1.5rem, 7.8svh, 2.45rem); line-height: .98; max-width: none; }
 .home-page .device-copy h1 br { display: initial; }
 .home-page .device-copy .lead { font-size: .84rem; line-height: 1.42; max-width: none; margin-top: 10px; }
 .home-page .device-copy .text-link { font-size: .8rem; padding: 7px 0; min-height: 34px; margin-top: 4px; }
 .home-page .device-copy .quiet-detail { display: block; font-size: .7rem; line-height: 1.4; margin-top: 8px; }
 .home-page .device-copy[data-chapter="3"] .text-link, .home-page .home-signal, .home-page .device-copy[data-chapter="4"] .lead { display: none; }
 .home-page .signal-applications { font-size: .72rem; line-height: 1.35; gap: 10px; margin-top: 10px; }
 .home-page .device-bottom { left: 5%; right: 5%; bottom: 9px; gap: 20px; }
 .home-page .story-chapters { gap: 10px; }
 .home-page .story-chapters button { min-width: 30px; min-height: 34px; padding: 7px 2px; font-size: .7rem; }
 .home-page .story-chapters b { display: none !important; }
 .home-page .device-caption { margin: 0; gap: 14px; }
 .home-page .device-caption p { max-width: none; font-size: .6rem; line-height: 1.4; }
 .home-page .motion-toggle { width: 32px; height: 32px; }
 .home-page .scene-labels { top: 69px; bottom: auto; left: 49%; right: 5%; max-width: none; font-size: .58rem; text-align: right; }
 .home-page .scene-labels > span { max-width: none; }
 .home-page .scene-labels .legend { display: none; }
 .home-page .device-vignette { background: none; }
 .home-page .signal-profile { left: auto; right: 5%; top: 78px; bottom: auto; width: 46%; max-width: none; }
 .home-page .profile-pipeline { gap: 8px; padding-bottom: 8px; margin-bottom: 9px; }
 .home-page .profile-pipeline small { display: none; }
 .home-page .profile-pipeline > span { font-size: .63rem; }
 .home-page .profile-pipeline > span:nth-child(2) { padding: 5px; }
 .home-page .profile-result { padding: 10px 13px 8px; }
 .home-page .profile-header { flex-wrap: nowrap; gap: 8px; margin-bottom: 6px; }
 .home-page .profile-header h3 { font-size: 1.45rem; }
 .home-page .profile-header > span { font-size: .58rem; }
 .home-page .profile-switch { margin-bottom: 2px; }
 .home-page .profile-switch button { font-size: .75rem; padding: 2px 0 5px; }
 .home-page .profile-application, .home-page .profile-focus { display: none; }
 .home-page .fingerprint-row { min-height: 27px; }
 .home-page .fingerprint-row svg { height: 26px; }
 .home-page .fingerprint-name { font-size: .72rem; }
 .home-page .profile-note { font-size: .58rem; margin-top: 6px; }
}

/* Distinct chapter colors keep each mobile scroll step recognizable. */
@media (max-width:700px) and (orientation:portrait), (orientation:landscape) and (max-width:1100px) and (max-height:500px) {
 .home-page{--chapter-background:#08191d;--chapter-accent:#b6ecce;--chapter-glow:#1c403b77}
 .home-page[data-active-chapter="1"]{--chapter-background:#0b1b32;--chapter-accent:#b9d6ff;--chapter-glow:#274c7977}
 .home-page[data-active-chapter="2"]{--chapter-background:#092b2b;--chapter-accent:#75e6ce;--chapter-glow:#28756077}
 .home-page .device-sticky{background-color:var(--chapter-background);transition:background-color .45s ease}
 .home-page .scene-surface{background:radial-gradient(ellipse at 73% 57%,var(--chapter-glow),transparent 62%)}
 .home-page .device-copy h1 em,.home-page .device-copy h2 em{color:var(--chapter-accent)}
 .home-page .device-copy .eyebrow{color:var(--chapter-accent);border-left:3px solid currentColor;padding-left:10px}
 .home-page .device-copy:not([hidden]){animation:mobile-chapter-enter .45s ease-out both}
 .home-page .story-chapters button[aria-current]{color:var(--chapter-accent);border-top:3px solid var(--chapter-accent)}
 @keyframes mobile-chapter-enter{from{opacity:.25;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
}
@media (max-width:700px) and (orientation:portrait) {
 .home-page .device-vignette{background:linear-gradient(0deg,var(--chapter-background),transparent 19%)}
 .home-page .horizon-list button{grid-template-columns:20px minmax(0,1fr);gap:7px 10px}
 .home-page .horizon-list button small{grid-column:2;max-width:none}
}
@media (prefers-reduced-motion:reduce) {
 .home-page .device-copy:not([hidden]){animation:none}
 .home-page .device-sticky{transition:none}
}
