/* A complete product tour. Everything is visible in the document flow. */
.scroll-intro { text-align:center; padding-block:110px 100px; }
.scroll-intro h2,.tour-chapter-heading h2 { max-width:none; font-size:clamp(48px,6.7vw,88px); line-height:1.02; letter-spacing:-.055em; margin:24px 0 26px; }
.scroll-intro h2 span,.tour-chapter-heading h2 span { color:#7c7c85; }
.scroll-intro>p:not(.product-kicker) { font-size:19px; color:#9999a3; line-height:1.7; }
.scroll-tour-cue { display:inline-flex; align-items:center; gap:15px; color:#595965; font-size:11px; margin-top:44px; }
.scroll-tour-cue>span { color:#b19376; font-size:17px; }
.tour-chapter { padding:105px 0 100px; background:#080809; border-top:1px solid #ffffff08; }
.tour-chapter:nth-of-type(2n) { background:#050506; }
.tour-chapter-heading { max-width:1000px; margin-bottom:64px; }
.tour-chapter-heading .product-kicker { font-size:10px; color:#b49578; letter-spacing:.16em; }
.tour-chapter-heading>p:last-child { color:#92929d; font-size:18px; line-height:1.7; max-width:600px; }
.tour-feature { min-width:0; }
.tour-feature-copy { max-width:490px; }
.tour-label { font-size:10px; color:#a48c74; letter-spacing:.12em; text-transform:uppercase; margin-bottom:17px; }
.tour-feature h3 { color:#e7e7ed; font-size:clamp(25px,2.7vw,35px); line-height:1.13; letter-spacing:-.04em; font-weight:600; }
.tour-feature-copy>p:last-child { color:#878794; font-size:15px; line-height:1.75; margin-top:20px; }
.tour-feature-lead { display:grid; grid-template-columns:.72fr 1.28fr; align-items:center; gap:54px; margin-bottom:80px; }
.tour-feature-lead .tour-feature-copy { max-width:350px; }
.tour-feature-lead h3 { font-size:clamp(31px,3.5vw,46px); }
.tour-chapter:nth-of-type(2n) .tour-feature-lead { grid-template-columns:1.28fr .72fr; }
.tour-chapter:nth-of-type(2n) .tour-feature-lead>.tour-image-button { order:-1; }
.tour-feature-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:75px 65px; }
.tour-feature-grid>.tour-feature { display:flex; flex-direction:column; align-items:stretch; border-top:1px solid #ffffff12; padding-top:27px; }
.tour-feature-grid .tour-feature-copy { min-height:205px; }
.tour-feature-grid .tour-image-button { margin-top:auto; }
.tour-image-button { display:block; position:relative; width:100%; min-width:0; border:0; padding:0; margin:0; background:none; cursor:zoom-in; border-radius:12px; }
.tour-image-button img { display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:contain; filter:drop-shadow(0 24px 35px #0005); }
.tour-zoom-icon { position:absolute; bottom:15px; right:13px; width:30px; height:30px; display:grid; place-items:center; border-radius:50%; border:1px solid #ffffff1a; background:#242427c9; backdrop-filter:blur(10px); color:#a5a5af; font-size:14px; opacity:.45; transition:opacity .25s,background .25s; }
.tour-image-button:hover .tour-zoom-icon,.tour-image-button:focus-visible .tour-zoom-icon { opacity:1; background:#39393f; }
.motion-ready .tour-feature img,.motion-ready .tour-phones figure { transition:transform 1.1s cubic-bezier(.22,1,.36,1); }
.motion-ready .tour-feature:not(.tour-visible) img { transform:translateY(20px); }
.tour-connect-footer { border-top:1px solid #ffffff13; margin-top:60px; padding-top:30px; display:flex; align-items:center; justify-content:space-between; gap:30px; }
.tour-connect-footer strong { font-size:19px; color:#ceced6; font-weight:550; letter-spacing:-.025em; }
.tour-connect-footer p { font-size:12px; color:#72727e; line-height:1.6; margin-top:10px; }
.tour-connect-footer a,.tour-app-link { color:#bda185; font-size:13px; text-decoration:none; }
.tour-connect-footer a { display:flex; gap:20px; white-space:nowrap; }
.tour-mobile { padding:105px 0 80px; background:radial-gradient(ellipse at 50% 50%,#382c1e1a,transparent 65%),#09090b; border-top:1px solid #ffffff09; }
.tour-mobile .tour-chapter-heading { text-align:center; margin-inline:auto; }
.tour-mobile .tour-chapter-heading>p:last-child { margin:auto; }
.tour-phones { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:26px; align-items:start; }
.tour-phones figure { margin:0; min-width:0; }
.tour-phones img { aspect-ratio:1/2; filter:drop-shadow(0 20px 30px #0005); }
.tour-phones .tour-zoom-icon { bottom:10px; right:2px; width:25px; height:25px; font-size:12px; }
.tour-phones figcaption { padding:24px 3px 0; }
.tour-phones strong { font-size:14px; font-weight:550; color:#bdbdc8; letter-spacing:-.02em; }
.tour-phones p { color:#70707c; font-size:12px; line-height:1.7; margin-top:12px; }
.tour-app-link { display:block; width:fit-content; margin:50px auto 0; }
.tour-service-note { border-top:1px solid #ffffff0e; padding-top:28px; margin-top:65px; color:#555561; font-size:11px; line-height:1.8; max-width:950px; }
.screen-view-open { overflow:hidden; }
.screen-lightbox { width:calc(100% - 40px); max-width:1800px; height:calc(100svh - 40px); max-height:none; padding:0; margin:auto; background:#0b0b0e; color:#e7e7ee; border:1px solid #ffffff1b; border-radius:20px; overflow:hidden; }
.screen-lightbox::backdrop { background:#000d; backdrop-filter:blur(15px); }
.screen-lightbox[open] { display:flex; flex-direction:column; }
.screen-lightbox-bar { display:flex; align-items:center; justify-content:space-between; flex-shrink:0; gap:20px; padding:18px 24px; border-bottom:1px solid #ffffff12; }
.screen-lightbox-bar h2 { font-size:16px; max-width:none; font-weight:500; letter-spacing:-.02em; }
.screen-lightbox-bar>div { display:flex; gap:10px; }
.screen-lightbox-bar button { border:1px solid #ffffff15; background:#1d1d23; color:#bdbdc8; font-size:12px; border-radius:50px; padding:9px 16px; cursor:pointer; }
.screen-lightbox-bar button:hover { background:#33333b; }
.screen-lightbox-body { flex:1; min-height:0; overflow:auto; padding:20px; display:grid; place-items:center; }
.screen-lightbox-body img { width:100%; height:100%; max-height:calc(100svh - 160px); object-fit:contain; }
.screen-lightbox.is-zoomed .screen-lightbox-body { display:block; }
.screen-lightbox.is-zoomed img { width:2400px; max-width:none; height:auto; max-height:none; }
@media (max-width:1000px) {
 .tour-feature-lead { gap:30px; }.tour-feature-grid { gap:60px 35px; }.tour-feature-grid .tour-feature-copy { min-height:235px; }.tour-phones { gap:17px; }
}
@media (max-width:700px) {
 .scroll-intro { padding-block:75px 65px; }.scroll-intro h2,.tour-chapter-heading h2 { font-size:clamp(39px,10.2vw,57px); }.scroll-intro>p:not(.product-kicker) { font-size:16px; }.scroll-tour-cue { margin-top:30px; }
 .tour-chapter { padding:70px 0 65px; }.tour-chapter-heading { margin-bottom:40px; }.tour-chapter-heading>p:last-child { font-size:16px; }.tour-chapter-heading .product-kicker { font-size:9px; }
 .tour-feature-lead,.tour-chapter:nth-of-type(2n) .tour-feature-lead { display:flex; flex-direction:column; gap:23px; margin-bottom:45px; align-items:stretch; }.tour-chapter:nth-of-type(2n) .tour-feature-lead>.tour-image-button { order:0; }.tour-feature-lead .tour-feature-copy { max-width:none; }.tour-feature-lead h3 { font-size:32px; }
 .tour-feature-grid { grid-template-columns:1fr; gap:42px; }.tour-feature-grid .tour-feature-copy { min-height:0; }.tour-feature-grid .tour-image-button { margin-top:23px; }.tour-feature-grid>.tour-feature { padding-top:25px; }.tour-feature h3 { font-size:29px; }.tour-label { font-size:9px; margin-bottom:14px; }.tour-feature-copy>p:last-child { font-size:14px; margin-top:16px; }
 .tour-image-button img { filter:drop-shadow(0 15px 22px #0005); }.tour-zoom-icon { bottom:10px; right:8px; opacity:.7; width:27px; height:27px; }
 .tour-connect-footer { flex-direction:column; align-items:flex-start; gap:24px; margin-top:38px; }.tour-connect-footer strong { font-size:18px; }.tour-connect-footer p { font-size:12px; }
 .tour-mobile { padding:70px 0 55px; }.tour-phones { grid-template-columns:repeat(2,minmax(0,1fr)); gap:40px 26px; }.tour-phones figure:last-child { grid-column:1/-1; width:calc((100% - 26px) / 2); justify-self:center; }.tour-phones figcaption { padding-top:20px; }.tour-phones strong { font-size:14px; }.tour-phones p { font-size:12px; }.tour-app-link { margin-top:36px; }.tour-service-note { margin-top:40px; font-size:10px; }
 .screen-lightbox { width:calc(100% - 16px); height:calc(100svh - 16px); border-radius:14px; }.screen-lightbox-bar { gap:12px; padding:14px; }.screen-lightbox-bar h2 { font-size:13px; }.screen-lightbox-bar button { font-size:10px; padding:8px 10px; }.screen-lightbox-body { padding:8px; }.screen-lightbox.is-zoomed img { width:1500px; }
}
@media (prefers-reduced-motion:reduce) { .motion-ready .tour-feature img,.motion-ready .tour-phones figure { transition:none; transform:none !important; } }
/* Scroll-directed moments between the open feature chapters. */
.scroll-cinema { --fan-x:230px; --fan-y:28px; --fan-angle:7deg; --map-scale:1; --map-tilt:0deg; --map-rise:0px; position:relative; background:#050506; }
.cinema-frame { position:relative; min-height:800px; display:flex; flex-direction:column; align-items:center; overflow:hidden; isolation:isolate; }
.cinema-copy { position:relative; z-index:3; text-align:center; padding:70px 24px 0; }
.cinema-copy .product-kicker { color:#aa896a; font-size:10px; }
.cinema-copy h2 { max-width:none; margin:22px 0; color:#f2f2f5; font-size:clamp(48px,5.8vw,80px); line-height:1; letter-spacing:-.055em; }
.cinema-copy h2 span { background:linear-gradient(105deg,#d5d1cc,#c4a17d 60%,#8a6a4e); background-clip:text; -webkit-background-clip:text; color:transparent; }
.cinema-copy>p:last-child { color:#82828f; font-size:17px; line-height:1.65; }
.cinema-light { position:absolute; inset:20% -10% -20%; background:radial-gradient(ellipse at 50% 70%,#a3652b22,transparent 60%); pointer-events:none; }
.cinema-devices { position:relative; width:100%; height:480px; margin:35px 0 30px; perspective:1600px; }
.cinema-device { position:absolute; left:50%; top:50%; width:min(49vw,620px,calc(95svh - 220px)); margin:0; will-change:transform; }
.cinema-device img { width:100%; aspect-ratio:4/3; object-fit:contain; filter:drop-shadow(0 25px 40px #0009); }
.cinema-device-center { transform:translate(-50%,-56%); z-index:2; }
.cinema-device-left { transform:translate(calc(-50% - var(--fan-x)),calc(-50% + var(--fan-y))) rotate(calc(-1 * var(--fan-angle))); opacity:.75; }
.cinema-device-right { transform:translate(calc(-50% + var(--fan-x)),calc(-50% + var(--fan-y))) rotate(var(--fan-angle)); opacity:.75; }
.cinema-device figcaption { text-align:center; font-size:10px; color:#78737a; margin-top:12px; }
.cinema-scroll-note { position:relative; display:flex; align-items:center; gap:14px; color:#54545f; font-size:10px; margin:0 0 27px; }
.cinema-scroll-note>span { display:block; width:35px; height:1px; background:#4b3827; }
.cinema-scroll-note>span::after { content:""; display:block; width:100%; height:100%; background:#d2a06c; transform:scaleX(var(--cinema-progress,1)); transform-origin:left; }
.cinema-ready .scroll-cinema { height:190svh; }
.cinema-ready .cinema-frame { position:sticky; top:54px; height:calc(100svh - 54px); min-height:0; }
.cinema-ready .cinema-copy { padding-top:clamp(30px,5svh,65px); }
.cinema-ready .cinema-devices { flex:1; height:auto; width:100%; min-height:0; margin:20px 0 0; }
.cinema-ready .cinema-copy h2 { font-size:clamp(42px,7svh,82px); }
.cinema-ready .cinema-copy>p:last-child { font-size:clamp(14px,1.9svh,18px); }
.cinema-map { background:radial-gradient(ellipse at 50% 70%,#16333c29,transparent 65%),#06080a; border-block:1px solid #ffffff08; }
.cinema-map .cinema-copy h2 span { background:linear-gradient(100deg,#d8e6e9,#96b7bd 65%,#6c9198); background-clip:text; -webkit-background-clip:text; color:transparent; }
.map-cinema-device { position:relative; width:min(920px,88vw); margin:40px auto 35px; perspective:1500px; }
.map-cinema-device img { width:100%; aspect-ratio:4/3; object-fit:contain; transform:translateY(var(--map-rise)) rotateX(var(--map-tilt)) scale(var(--map-scale)); transform-origin:center; filter:drop-shadow(0 25px 45px #0009); }
.map-scene-caption { display:block; text-align:center; color:#53636a; font-size:10px; margin-top:15px; }
.map-cinema-orbit { position:absolute; width:80vw; height:80vw; max-width:1100px; max-height:1100px; border-radius:50%; border:1px solid #93c8d010; top:27%; left:50%; transform:translateX(-50%); box-shadow:0 0 0 90px #93c8d005,0 0 0 180px #93c8d004; z-index:-1; }
.cinema-ready .map-cinema-device { width:min(840px,82vw,calc(115svh - 250px)); margin:25px auto 0; flex:1; min-height:0; display:flex; align-items:center; justify-content:center; }
.cinema-ready .map-cinema-device img { max-height:100%; }
.cinema-ready .map-scene-caption { position:absolute; bottom:12px; left:0; right:0; }
.cinema-ready .tour-feature img { transform:translateY(var(--device-y,0px)) rotate(var(--device-angle,0deg)) scale(var(--device-scale,1)); transition:none; will-change:transform; }
.tour-chapter-heading h2 { background:linear-gradient(105deg,#f3f3f7 20%,#b1a79c 75%,#7f6d5b); background-clip:text; -webkit-background-clip:text; color:transparent; }
.tour-chapter-heading h2 span { color:#767680; }
.tour-chapter-heading { position:relative; }
.tour-chapter-heading::before { content:""; position:absolute; top:0; left:-22px; width:2px; height:42px; background:linear-gradient(#c39365,transparent); }
.tour-feature-grid>.tour-feature:last-child:nth-child(odd) { grid-column:1/-1; display:grid; grid-template-columns:.65fr 1.35fr; gap:60px; align-items:center; padding-top:45px; }
.tour-feature-grid>.tour-feature:last-child:nth-child(odd) .tour-feature-copy { min-height:0; max-width:340px; }
.tour-feature-grid>.tour-feature:last-child:nth-child(odd) .tour-image-button { margin:0; }
.tour-feature-grid>.tour-feature:last-child:nth-child(odd) h3 { font-size:clamp(28px,3.2vw,42px); }
.tour-phones figure { transform:translateY(var(--phone-y,0px)); }
.finale-flight { padding-top:80px; background:radial-gradient(ellipse at 50% 35%,#7a4a2620,transparent 62%),#070708; }
.finale-product { position:relative; width:min(750px,85vw); margin:0 auto 80px; perspective:1400px; }
.finale-product .finale-ipad { width:92%; aspect-ratio:4/3; object-fit:contain; transform:translateY(var(--finale-y,0px)) rotateX(var(--finale-angle,0deg)); filter:drop-shadow(0 30px 50px #0009); }
.finale-product .finale-iphone { position:absolute; width:18%; right:0; bottom:0; height:auto; aspect-ratio:1/2; object-fit:contain; transform:translateY(var(--finale-phone-y,0px)) rotate(-6deg); filter:drop-shadow(0 18px 25px #0009); }
.finale-flight h2 { max-width:none; width:100%; font-size:clamp(64px,9.5vw,130px); line-height:.98; }
.finale-flight>p:not(.product-kicker) { line-height:1.7; }
.finale-platforms { display:flex; gap:22px; color:#686873; font-size:11px; margin-top:26px; }
.finale-platforms>span+span::before { content:"·"; margin-right:22px; color:#3e3e49; }
.finale-flight .pill { background:#f2dfc9; padding:17px 29px; font-size:16px; }
.finale-flight .pill:hover { background:#ffcd98; box-shadow:0 12px 45px #c7803b2b; }
@media (max-width:700px) {
 .cinema-frame { min-height:650px; }.cinema-copy { padding:55px 20px 0; }.cinema-copy h2 { font-size:43px; }.cinema-copy>p:last-child { font-size:14px; max-width:350px; }
 .cinema-devices { height:300px; margin-top:20px; }.cinema-device { width:72vw; }.scroll-cinema { --fan-x:75px; --fan-y:22px; --fan-angle:8deg; }
 .cinema-ready .scroll-cinema { height:155svh; }.cinema-ready .cinema-frame { top:50px; height:calc(100svh - 50px); }.cinema-ready .cinema-copy { padding-top:65px; }.cinema-ready .cinema-copy h2 { font-size:clamp(35px,9.5vw,48px); }.cinema-ready .cinema-copy>p:last-child { font-size:14px; }.cinema-scroll-note { font-size:9px; margin-bottom:35px; }
 .cinema-ready .cinema-devices { margin-top:0; }.cinema-ready .cinema-device { width:78vw; }.cinema-device figcaption { font-size:9px; }
 .cinema-ready .map-cinema-device { width:102vw; margin-top:10px; max-height:55svh; }.map-scene-caption { font-size:9px; }.cinema-ready .map-scene-caption { bottom:20px; }.map-cinema-orbit { width:120vw; height:120vw; }
 .tour-chapter-heading::before { left:-10px; height:30px; }.tour-feature-grid>.tour-feature:last-child:nth-child(odd) { display:flex; flex-direction:column; gap:23px; padding-top:25px; align-items:stretch; }.tour-feature-grid>.tour-feature:last-child:nth-child(odd) .tour-feature-copy { max-width:none; }.tour-feature-grid>.tour-feature:last-child:nth-child(odd) h3 { font-size:29px; }
 .finale-flight { padding-top:55px; }.finale-product { width:92vw; margin-bottom:60px; }.finale-flight h2 { font-size:clamp(58px,14vw,85px); }.finale-flight .pill { font-size:14px; padding:15px 24px; }
}
@media (prefers-reduced-motion:reduce) {
 .scroll-cinema { height:auto !important; }.cinema-frame { position:relative !important; height:auto !important; min-height:650px; }.cinema-devices { height:350px; flex:none !important; }.cinema-device-left { transform:translate(-85%,-45%) rotate(-5deg); }.cinema-device-right { transform:translate(-15%,-45%) rotate(5deg); }
 .map-cinema-device { margin-bottom:40px !important; flex:none !important; }.map-cinema-device img { transform:none !important; }.cinema-ready .tour-feature img,.tour-phones figure,.finale-ipad,.finale-iphone { transform:none !important; transition:none !important; }
}