/* Scoped cinematic sections. No sticky scroll track, SVG diagrams or explanatory overlays. */
scroll-story{--ss-ink:#173d37;--ss-muted:#526660;--ss-paper:#f3f1e9;--ss-accent:#507966;--ss-panel:#e6e8de;display:block;position:relative;background:var(--ss-paper);color:var(--ss-ink);padding:clamp(40px,6vw,88px) clamp(20px,5vw,80px) 28px;isolation:isolate;font:inherit;line-height:1.5;overflow:hidden}
scroll-story.ss-it{--ss-ink:#f4f0e6;--ss-muted:#c6cbc7;--ss-paper:#171c1e;--ss-accent:#fa795c;--ss-panel:#293235}
scroll-story.ss-md{--ss-ink:#eefaf5;--ss-muted:#b8d2cd;--ss-paper:#06282c;--ss-accent:#76e7d4;--ss-panel:#123e42}
scroll-story.ss-gold{--ss-ink:#142036;--ss-muted:#566076;--ss-paper:#f4f5fb;--ss-accent:#b58b00;--ss-panel:#e8ebf4}
scroll-story.ss-milife{--ss-ink:#183334;--ss-muted:#526d6c;--ss-paper:#f3faf7;--ss-accent:#389d9c;--ss-panel:#e0eeea}
scroll-story.ss-hms{--ss-ink:#142b3a;--ss-muted:#52636d;--ss-paper:#f7f5ef;--ss-accent:#b37825;--ss-panel:#ece7dc}
scroll-story.ss-air{--ss-ink:#122f44;--ss-muted:#4f6b79;--ss-paper:#f1f8fa;--ss-accent:#076caf;--ss-panel:#dfedf2}
scroll-story.ss-pool{--ss-ink:#10364c;--ss-muted:#4d6470;--ss-paper:#f3f2ed;--ss-accent:#126181;--ss-panel:#e4e7df}
scroll-story.ss-cocktail{--ss-ink:#f8eef8;--ss-muted:#d4c0d6;--ss-paper:#190f20;--ss-accent:#cd91e8;--ss-panel:#100c16}
scroll-story.ss-studio{--ss-ink:#343f2c;--ss-muted:#64705b;--ss-paper:#f9f7ef;--ss-accent:#6e7a55;--ss-panel:#e9e6d8}
scroll-story *{box-sizing:border-box}
scroll-story .ss-heading,scroll-story .ss-stage,scroll-story .ss-footer{max-width:1380px;margin-inline:auto}
scroll-story .ss-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;padding-bottom:28px}
scroll-story h2{font:inherit;font-size:clamp(28px,3.6vw,54px);line-height:1.08;letter-spacing:-.04em;font-weight:500;margin:0;max-width:820px;color:inherit}
scroll-story .ss-link{color:inherit;font:inherit;font-size:13px;line-height:1.5;display:inline-flex;align-items:center;gap:18px;text-decoration:none;border-bottom:1px solid currentColor;padding-block:10px;max-width:270px;flex-shrink:0}
scroll-story .ss-link:hover{color:var(--ss-accent)}
scroll-story .ss-stage{position:relative;aspect-ratio:16/9;width:100%;background:var(--ss-panel);border-radius:6px;overflow:hidden;contain:layout paint;perspective:1600px}
scroll-story .ss-photo{display:block;position:absolute;inset:0;opacity:0}
scroll-story .ss-photo:first-child{opacity:1}
scroll-story .ss-photo>img{display:block;width:100%;height:100%;object-fit:cover;max-width:none}
scroll-story.ss-fit-contain .ss-stage{background:#fff}
scroll-story.ss-fit-contain .ss-photo>img{object-fit:contain}
scroll-story.ss-fit-portrait .ss-stage{max-width:900px;aspect-ratio:4/3;background:#100c16}
scroll-story.ss-fit-portrait .ss-photo>img{object-fit:contain}
scroll-story .ss-footer{padding-top:16px;min-height:70px}
scroll-story .ss-progress-track{height:1px;background:color-mix(in srgb,var(--ss-muted) 25%,transparent);overflow:hidden}
scroll-story .ss-progress{height:100%;background:var(--ss-accent);transform-origin:left;transform:scaleX(0)}
scroll-story .ss-controls{display:none;gap:22px;flex-wrap:wrap;align-items:center;padding-top:6px}
scroll-story.ss-ready .ss-controls{display:flex}
scroll-story .ss-controls button{appearance:none;border:0;box-shadow:none;background:none;color:var(--ss-muted);font:inherit;font-size:12px;letter-spacing:0;text-transform:none;padding:8px 0;min-height:44px;cursor:pointer}
scroll-story .ss-controls button:hover{color:var(--ss-ink)}
scroll-story button:focus-visible,scroll-story a:focus-visible{outline:2px solid var(--ss-accent);outline-offset:5px}
scroll-story .ss-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
scroll-story [hidden]{display:none!important}
scroll-story.ss-quiet .ss-progress-track{visibility:hidden}
/* Three-dimensional CSS housings use screenshots of our actual public pages, never private data. */
scroll-story.ss-devices .ss-stage{background:radial-gradient(ellipse at 50% 15%,#46524e 0,#20292a 40%,#0c1317 90%);aspect-ratio:16/10}
scroll-story.ss-md .ss-stage{background:radial-gradient(ellipse at 50% 10%,#346c68 0,#12363c 45%,#061c23 95%)}
scroll-story.ss-gold .ss-stage{background:radial-gradient(ellipse at 50% 8%,#676251 0,#2a2b30 45%,#141821 95%)}
scroll-story .ss-rig{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateY(-12deg) rotateX(7deg) scale(.95)}
scroll-story .ss-laptop{position:absolute;left:8%;top:17%;width:67%;aspect-ratio:1.6;transform-style:preserve-3d;filter:drop-shadow(0 28px 22px #0007)}
scroll-story .ss-display{width:100%;height:100%;padding:1.9% 1.6% 2.3%;background:linear-gradient(125deg,#70767a,#101419 15%,#03090e 80%,#424d52);border:1px solid #9da5aa;border-radius:2.1%/3.3%;box-shadow:2px 0 0 #617079,4px 1px 0 #252a30,inset 0 0 0 3px #0b0e14;overflow:hidden}
scroll-story .ss-display img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;border-radius:1px}
scroll-story .ss-keyboard{height:5%;width:111%;margin-left:-5.5%;background:linear-gradient(#a4b1b8,#d3dce0 25%,#6e7b85 50%,#25343e);border-radius:0 0 50% 50%/0 0 90% 90%;box-shadow:0 12px 18px #0008;position:relative}
scroll-story .ss-keyboard:before{content:'';position:absolute;left:43%;width:14%;height:35%;background:#52636c;border-radius:0 0 6px 6px}
scroll-story .ss-phone{position:absolute;left:77%;top:12%;width:17%;aspect-ratio:390/844;border-radius:13%/6%;background:linear-gradient(130deg,#b2bdc5,#242b33 15%,#03070b 65%,#62717b);padding:.55%;border:1px solid #a4aeb4;box-shadow:3px 0 0 #293945,5px 1px 0 #a1acb3,7px 2px 0 #24333d,16px 24px 25px #0007;transform:translateZ(70px) rotateZ(-3deg);overflow:hidden}
scroll-story .ss-phone img{display:block;width:100%;height:100%;border-radius:11%/5%;object-fit:cover;object-position:top;background:#071116}
scroll-story .ss-phone:after{content:'';position:absolute;width:23%;height:1.8%;left:38.5%;top:2.5%;border-radius:99px;background:#03060a;box-shadow:inset 0 0 2px #8f9a9f}
scroll-story.ss-quiet .ss-rig{transform:none!important}
@media(max-width:699px){scroll-story{padding:34px 20px 20px}scroll-story .ss-heading{display:block;padding-bottom:20px}scroll-story h2{font-size:32px}scroll-story .ss-link{font-size:12px;max-width:100%;margin-top:15px}scroll-story .ss-stage{aspect-ratio:4/5}scroll-story.ss-fit-contain .ss-stage{aspect-ratio:4/3}scroll-story.ss-fit-portrait .ss-stage{aspect-ratio:4/5}scroll-story.ss-devices .ss-stage{aspect-ratio:4/5}scroll-story .ss-laptop{left:4%;top:19%;width:85%}scroll-story .ss-phone{left:58%;top:46%;width:29%;padding:1%}scroll-story .ss-controls{gap:20px}scroll-story .ss-footer{padding-top:12px}}
footer .scroll-story-credit{font:inherit;font-size:11px;line-height:1.6;margin:18px 0;opacity:.7}footer .scroll-story-credit a{color:inherit;text-decoration:none}
@media(max-width:359px){body:has(scroll-story.ss-studio) .site-header{gap:8px;padding-inline:16px}body:has(scroll-story.ss-studio) .site-header .wordmark{font-size:19px}body:has(scroll-story.ss-studio) .site-header .header-book{max-width:85px;white-space:normal;font-size:10px;line-height:1.2;min-height:40px;padding:8px;gap:4px}}
@media(max-width:699px){scroll-story.ss-air .ss-photo>img{object-position:right center}}