/* V2.4 — large side stages and graphic depth choreography. */
.service-chapter-number{display:none}
.practice-line strong{display:block;font-weight:500}
.practice-line em{display:block;font-style:normal;font-size:15px;line-height:1.8;margin-top:14px;max-width:240px;color:#7a7670}
html.cinema-document{scroll-behavior:auto;scroll-padding-top:0;scrollbar-width:none;scrollbar-gutter:auto}
html.cinema-document::-webkit-scrollbar{display:none;width:0}
.motion-ready{--story-gutter:clamp(28px,4.5vw,88px)}
.motion-ready #rolling-home .container{max-width:none;width:100%;padding-inline:var(--story-gutter)}
.motion-ready .site-header{position:fixed;inset:0 0 auto;border:0;background:#f5f2ebed;transition:transform .4s ease,background .4s ease;box-shadow:0 1px 0 #8e826814}
.motion-ready .header-inner{max-width:none;height:64px;padding-inline:var(--story-gutter)}
.motion-ready .brand-word{font-size:18px}.motion-ready .brand-symbol{font-size:26px}.motion-ready .brand-word small{font-size:8px;margin-top:4px}
.motion-ready .nav-cta{padding:8px 14px}.motion-ready .site-header nav>a:after{bottom:-21px}
.motion-ready .site-header.cinema-away{transform:translateY(calc(-100% + 8px))}
.motion-ready .site-header:hover,.motion-ready .site-header:focus-within{transform:translateY(0)}
.motion-ready:is([data-active-scene=practice],[data-active-scene=story-ending]) .site-header{background:#302c26ed;color:#f3edde}
.motion-ready:is([data-active-scene=practice],[data-active-scene=story-ending]) .nav-cta{background:#ede5d5;color:#302c26}
.motion-ready:is([data-active-scene=practice],[data-active-scene=story-ending]) .story-controls{background:#3e3a34ed;border-color:#6f6b6555;box-shadow:none;color:#c1bdb7}
.motion-ready:is([data-active-scene=practice],[data-active-scene=story-ending]) .story-controls button{color:#e9e5df}
.motion-ready #rolling-home:before{inset:0}
.motion-ready .signal-viewport{inset:0;opacity:var(--signal-visibility,1)}
.motion-ready .signal-viewport svg{width:100%;height:100%;transform:none}
.motion-ready .story-sticky{top:0;height:100svh}
.motion-ready .story-scene{scroll-margin-top:0}
.motion-ready #story-film{display:flow-root}
.motion-ready #story-film>.story-scene+.story-scene,.motion-ready #rolling-home>[data-tail-scene]{margin-top:-100svh}
.motion-ready :is(.story-scene,[data-tail-scene])>.story-sticky,.motion-ready [data-tail-scene]>.tail-sticky{opacity:var(--scene-visibility,1)}
.motion-ready #opening{--scene-height:1280svh}.motion-ready #reality{--scene-height:840svh}.motion-ready #reframe{--scene-height:1380svh}.motion-ready #journey{--scene-height:1140svh}.motion-ready #evolution{--scene-height:850svh}.motion-ready #system{--scene-height:1380svh}.motion-ready #future{--scene-height:850svh}
.motion-ready .story-eyebrow{top:88px;left:var(--story-gutter);font-size:12px}
.motion-ready .story-panel{left:var(--story-gutter);top:26%;width:33.5%;max-width:none;transform:none;filter:none;transform-origin:50% 0}
.motion-ready .story-section-foot,.motion-ready .journey-index,.motion-ready .day-timeline{left:var(--story-gutter);right:var(--story-gutter)}
.motion-ready .story-section-foot{bottom:74px}
.motion-ready .opening-copy{left:var(--story-gutter);width:34%;max-width:none;top:24%;transform:none}
.motion-ready .opening-copy h1{font-size:clamp(42px,3.8vw,72px);line-height:1.32}.motion-ready .opening-mask{max-height:300px}
.motion-ready #opening .story-panel{top:25%;width:34%}.motion-ready #opening .story-panel h2{font-size:clamp(34px,3.1vw,58px)}
.motion-ready .story-controls{left:var(--story-gutter);bottom:22px;padding:10px 13px;font-size:11px;z-index:30}
.motion-ready .story-rail{right:var(--story-gutter);left:auto;top:auto;bottom:23px;transform:none;display:flex;gap:7px;z-index:30}
.motion-ready .story-rail a{min-width:19px;min-height:24px;position:relative;justify-content:center}
.motion-ready .story-rail span{position:absolute;bottom:24px;font-size:10px}.motion-ready .story-rail i{width:13px;height:2px}
.motion-ready .story-rail a[aria-current] i{width:22px}
/* The text plane has three independently timed depth layers. Transforming children
   leaves the parent measurable at rest; geometry is fitted outside this rectangle. */
.motion-ready .story-panel>:is(h2,p),.motion-ready .opening-copy>:is(h1,p),.motion-ready [data-depth-layer]{
 opacity:var(--text-alpha,1);transform:perspective(1100px) translate3d(0,var(--text-y,0px),var(--text-z,0px)) rotateX(var(--text-tilt,0deg));
 filter:blur(var(--text-blur,0px));transform-origin:50% 30%;backface-visibility:hidden;
}
.motion-ready .story-panel .story-description,.motion-ready .story-panel .journey-context,.motion-ready .story-panel .capability-context{clip-path:none}
.motion-ready .story-panel .story-description{line-height:1.7}
.motion-ready .story-panel :is(.journey-context,.capability-context,.level-note){line-height:1.7}
.motion-ready :is(#reality,#reframe,#journey,#system,#future) .story-panel{top:26%;transform:none;filter:none}
/* Reality: compact judgement, large demonstration. */
.motion-ready #reality .story-panel{left:var(--story-gutter);width:33.5%;text-align:left}
.motion-ready #reality .story-panel h2{font-size:clamp(32px,3vw,56px);line-height:1.35;max-width:100%}
.motion-ready #reality .story-description{font-size:17px;max-width:700px;margin-top:16px}
.motion-ready #reality .scene-number{position:static;font-size:clamp(40px,4vw,72px);opacity:.55;font-weight:200;margin:0 0 24px}
/* Reframe: copper structure on the left; the statement moves to the right. */
.motion-ready #reframe .story-panel{left:63%;width:32.5%;text-align:left}
.motion-ready #reframe .story-panel h2{font-size:clamp(32px,3vw,56px);line-height:1.4;color:#f5f0e3;font-weight:400}
.motion-ready #reframe .story-panel em{color:#e5b382}
.motion-ready #reframe .story-description{color:#c8c4be;margin:22px 0 0;font-size:17px;max-width:100%}
.motion-ready #reframe .story-eyebrow{color:#a9a59f}.motion-ready #reframe .story-eyebrow>span{color:#d3a675}
.motion-ready[data-active-scene=reframe] #signal-nodes .node-label,.motion-ready[data-active-scene=reframe] #signal-nodes .node-sub{fill:#d2c8b2}
.motion-ready[data-active-scene=reframe] .node-tile{display:none}
.motion-ready[data-active-scene=reframe] #signal-center .center-body{fill:url(#copper-face)}
.motion-ready[data-active-scene=reframe] #center-label,.motion-ready[data-active-scene=reframe] #center-sub{fill:#42392c}
/* Journey: close camera framing for trust, search, choice and repeat purchase. */
.motion-ready #journey .story-panel{left:var(--story-gutter);width:33.5%;text-align:left}
.motion-ready #journey .story-panel h2{font-size:clamp(48px,4.6vw,84px);line-height:1.1}
.motion-ready #journey .story-panel[data-panel=journey-end] h2{font-size:clamp(30px,2.7vw,50px);max-width:100%;margin:0;line-height:1.4}
.motion-ready #journey .story-panel[data-panel=journey-end] h2 br{display:block}
.motion-ready #journey .journey-kicker{font-size:11px;margin-bottom:12px}
.motion-ready #journey .story-description{margin:26px 0 0;max-width:100%;font-size:19px}
.motion-ready #journey .journey-context{margin:18px 0 0;max-width:100%;font-size:16px}
.motion-ready #journey .journey-index{bottom:86px;border-top:0;padding:0}
/* Evolution: a tall sculpture on the left, a raised, restrained reading column. */
.motion-ready #evolution .story-panel{left:63%;top:24%;width:32.5%;transform:none;filter:none}
.motion-ready #evolution .story-panel h2{font-size:clamp(34px,3vw,56px);line-height:1.32}
.motion-ready #evolution .level-kicker{font-size:clamp(62px,6vw,108px);font-weight:200;margin-bottom:18px}
.motion-ready #evolution .story-description{max-width:100%;font-size:17px;margin-top:18px}
.motion-ready #evolution .level-note{max-width:100%;font-size:15px;margin-top:12px}
.motion-ready #evolution .evolution-index{left:63%;bottom:85px;gap:clamp(24px,3vw,58px)}
/* System: an intact circular network; the explanatory third line returns. */
.motion-ready #system .story-panel{left:var(--story-gutter);width:33.5%;text-align:left}
.motion-ready #system .story-panel h2{font-size:clamp(32px,3vw,56px);line-height:1.4}
.motion-ready #system .journey-kicker{font-size:11px;margin-bottom:10px}
.motion-ready #system .story-description{margin:22px 0 0;max-width:100%;font-size:18px}
.motion-ready #system .story-panel .capability-context{display:block;margin:16px 0 0;max-width:100%;font-size:15px}
.motion-ready #system .system-links{left:var(--story-gutter);right:auto;width:34%;bottom:88px;max-width:none;grid-template-columns:repeat(2,1fr);gap:10px 16px}
.motion-ready #system .system-links a{justify-content:flex-start;font-size:12px}
.motion-ready #system .story-panel[data-panel=system-end] h2 br{display:block}
/* Future: an open time landscape alongside the working day. */
.motion-ready #future .story-panel{left:var(--story-gutter);width:33.5%;max-width:none}
.motion-ready #future .story-panel h2{font-size:clamp(30px,2.8vw,52px);line-height:1.45;max-width:100%}
.motion-ready #future .day-time{font-size:13px;letter-spacing:.15em;margin-bottom:14px}
.motion-ready #future .story-description{font-size:17px;margin-top:16px}
.motion-ready #future .day-timeline{bottom:110px}.motion-ready #future .story-section-foot{bottom:73px}
.motion-ready #signal-caption{display:none}
.motion-ready #signal-nodes .node-label{font-size:16px}
/* The final sections now have the same pinned, reversible scroll clock. */
.motion-ready [data-tail-scene]{padding:0;position:relative;z-index:2;scroll-margin-top:0}
.motion-ready .tail-sticky{height:100svh;position:sticky;top:0;overflow:hidden}
.motion-ready .tail-sticky>.container{height:100%;position:relative}
.motion-ready #cooperation{height:580svh;background:#f5f2eb}
.motion-ready #practice{height:520svh;background:#22211f;color:#f6f1e6}
.motion-ready #research-notes{height:450svh;background:#fcfbf8}
.motion-ready #story-ending{height:280svh;background:#1b1a18}
.motion-ready #cooperation .section-heading{position:absolute;top:20%;left:var(--story-gutter);right:var(--story-gutter);margin:0;align-items:center}
.motion-ready #cooperation .section-heading h2{font-size:clamp(32px,3.2vw,58px)}
.motion-ready #cooperation .section-heading>p{font-size:16px}
.motion-ready .service-chapter-number{display:block;position:absolute;right:4vw;top:29%;font:200 clamp(180px,27vw,460px)/1 "Helvetica Neue",sans-serif;color:#dfd4c1;opacity:.34;letter-spacing:-.08em}
.motion-ready #cooperation .service-signal{margin:0;position:static}
.motion-ready #cooperation .service-reading{position:absolute;left:var(--story-gutter);right:var(--story-gutter);top:41%;border:0;box-shadow:none;background:none;padding:0;gap:10vw;grid-template-columns:1.15fr 1fr;transform:translateY(calc((1 - var(--service-enter,1))*15px));opacity:calc(.7 + var(--service-enter,1)*.3)}
.motion-ready #cooperation .service-reading .service-problem{font-size:clamp(21px,2.2vw,40px);line-height:1.6;max-width:780px}
.motion-ready #cooperation .service-reading h3{font-size:24px;margin:15px 0 10px}.motion-ready #cooperation .service-reading p{font-size:17px}
.motion-ready #cooperation .service-reading li{color:#6e6a64;font-size:17px}
.motion-ready #cooperation .service-tabs{position:absolute;bottom:92px;left:var(--story-gutter);right:var(--story-gutter)}
.motion-ready #cooperation .service-tabs button{padding-bottom:0}.motion-ready #cooperation .service-tabs strong{font-size:clamp(21px,2.2vw,36px)}
.motion-ready #cooperation .container>.inline-link{position:absolute;right:var(--story-gutter);bottom:33px;font-size:13px}
.motion-ready #practice .story-eyebrow{color:#b8b4ae}.motion-ready #practice .story-eyebrow>span{color:#d2a878}
.motion-ready #practice .container>h2{position:absolute;left:10%;right:10%;top:33%;text-align:center;font-size:clamp(42px,4.6vw,86px);opacity:var(--practice-intro,1);transform:translateY(calc((1 - var(--practice-intro,1))*-45px))}
.motion-ready #practice .container>h2 em{color:#dcb486}
.motion-ready #practice .practice-line{position:absolute;inset:0;display:block;margin:0;padding:0;border:0;pointer-events:none}
.motion-ready #practice [data-practice-step]{position:absolute;left:4%;right:4%;top:31%;text-align:center;opacity:var(--step-alpha,0);transform:none}
.motion-ready #practice [data-practice-step]:before{display:none}.motion-ready #practice [data-practice-step] small{color:#c49c6e;letter-spacing:.14em;font-size:12px;margin-bottom:22px}
.motion-ready #practice [data-practice-step] strong{font-size:clamp(70px,11vw,210px);font-weight:350;letter-spacing:-.045em;line-height:1.25}
.motion-ready #practice [data-practice-step] em{max-width:none;color:#c1bdb7;font-size:20px;margin:22px auto 0}
.motion-ready #practice .practice-reading{position:absolute;bottom:113px;left:var(--story-gutter);right:var(--story-gutter);margin:0}.motion-ready #practice .practice-reading p{color:#aeaaa4;font-size:16px}.motion-ready #practice .practice-reading a{border-color:#c0b59c}
.motion-ready #practice .note{position:absolute;left:var(--story-gutter);bottom:74px;color:#aeaaa4;font-size:12px}
.motion-ready #research-notes .section-heading{position:absolute;top:20%;left:var(--story-gutter);right:var(--story-gutter);margin:0;opacity:calc(1 - var(--research-out,0))}
.motion-ready #research-notes .section-heading h2{font-size:clamp(32px,3vw,54px)}
.motion-ready #research-notes .article-grid{position:absolute;left:5vw;top:38%;width:max-content;margin:0;display:flex;gap:4vw;transform:translateX(calc(var(--research-travel,0px)*-1)) translateY(calc(var(--research-out,0)*-25px));opacity:calc(1 - var(--research-out,0));pointer-events:auto}
.motion-ready #research-notes .article-card{width:90vw;height:49svh;display:grid;grid-template-columns:40% 1fr;grid-template-rows:auto auto 1fr auto;column-gap:5vw;padding:0 4vw 0 0;background:#f2eee4;overflow:hidden;opacity:var(--card-emphasis,1);transform:none;border:1px solid #ebe5d8}
.motion-ready #research-notes .article-graphic{grid-column:1;grid-row:1 / 5;height:100%;margin:0;display:flex;align-items:center;justify-content:center}
.motion-ready #research-notes .article-meta{grid-column:2;margin:32px 0 15px;font-size:12px}
.motion-ready #research-notes .article-card h3{grid-column:2;font-size:clamp(24px,2.5vw,46px);line-height:1.45;margin:0 0 18px}
.motion-ready #research-notes .article-card>p{grid-column:2;font-size:17px;line-height:1.85;margin:0;max-width:700px}
.motion-ready #research-notes .read-link{grid-column:2;margin:15px 0 28px;font-size:14px}
.motion-ready #research-notes .graphic-nine{font-size:clamp(100px,13vw,220px)}
.motion-ready #research-notes .graphic-words{font-size:clamp(32px,4vw,70px)}
.motion-ready #research-notes .story-about{position:absolute;inset:26% 10% auto;text-align:center;display:block;border:0;margin:0;padding:0;opacity:var(--research-about,0);transform:translateY(calc((1 - var(--research-about,0))*40px));pointer-events:none}
.motion-ready #research-notes .story-about p{font-size:clamp(36px,4.5vw,84px);line-height:1.6;font-weight:400;color:#4a4640}
.motion-ready #research-notes .story-about .inline-link{margin-top:42px;pointer-events:auto}
.motion-ready #story-ending .ending-color-shift{position:absolute;inset:0;height:100%;background:#fcfbf8;opacity:calc(1 - var(--ending-tone,1))}
.motion-ready #story-ending .ending-content{padding-block:70px 55px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;opacity:var(--ending-copy,0);transform:translateY(calc((1 - var(--ending-copy,0))*35px))}
.motion-ready #story-ending .ending-content .story-eyebrow{position:static;margin-bottom:20px}
.motion-ready #story-ending .ending-content h2{font-size:clamp(38px,4vw,72px);line-height:1.5}
.motion-ready #story-ending .ending-content>p{margin:20px 0 27px;font-size:17px}.motion-ready #story-ending .ending-content>small{margin-top:18px}
.motion-ready #story-ending .ending-dot{margin-bottom:22px}.motion-ready #story-ending .ending-tail{height:45px;margin:20px auto 16px}
@media(max-height:760px) and (min-width:801px){
 .motion-ready .story-eyebrow{top:80px;font-size:11px}
 .motion-ready :is(#reality,#reframe,#journey,#system,#future) .story-panel{top:24%}
 .motion-ready .opening-copy{top:23%;transform:none}.motion-ready .opening-copy h1{font-size:clamp(36px,3.5vw,54px)}
 .motion-ready .opening-explanation{font-size:15px;margin-top:18px}.motion-ready .opening-cue{margin-top:22px}
 .motion-ready .story-panel .story-description{font-size:15px;line-height:1.65;margin-top:12px}
 .motion-ready #reality .story-panel h2,.motion-ready #future .story-panel h2,.motion-ready #reframe .story-panel h2{font-size:32px}
 .motion-ready #journey .story-panel h2{font-size:48px}.motion-ready #journey .journey-kicker{margin-bottom:10px}
 .motion-ready #journey .journey-context{font-size:14px;line-height:1.6;margin-top:6px}
 .motion-ready #system .story-panel h2{font-size:32px}.motion-ready #system .story-panel .capability-context{font-size:14px}
 .motion-ready #system .system-links{bottom:78px;gap:7px 12px}.motion-ready #system .system-links a{font-size:11px;line-height:1.5}
 .motion-ready #evolution .story-panel h2{font-size:32px}.motion-ready #evolution .level-kicker{font-size:58px;margin-bottom:14px}.motion-ready #evolution .level-note{font-size:14px;line-height:1.6}
 .motion-ready #cooperation .section-heading{top:21%}.motion-ready #cooperation .section-heading h2{font-size:28px}.motion-ready #cooperation .service-reading{top:40%}.motion-ready #cooperation .service-reading .service-problem{font-size:20px}.motion-ready #cooperation .service-reading h3{font-size:21px;margin-block:10px 6px}.motion-ready #cooperation .service-reading p,.motion-ready #cooperation .service-reading li{font-size:15px}.motion-ready #cooperation .service-tabs{bottom:83px}.motion-ready #cooperation .service-tabs strong{font-size:21px;margin-top:18px}.motion-ready #cooperation .service-tabs:before{top:31px}.motion-ready #cooperation .service-tabs i{top:28px}
 .motion-ready #cooperation .service-reading ul{margin-bottom:16px}.motion-ready #cooperation .service-reading li{padding:6px 0;line-height:1.55}.motion-ready #cooperation .service-reading .button{font-size:13px;min-height:46px;padding:12px 20px}
 .motion-ready #practice [data-practice-step] strong{font-size:clamp(66px,9vw,120px)}.motion-ready #practice [data-practice-step] em{font-size:17px}
 .motion-ready #research-notes .article-card h3{font-size:24px;margin-bottom:12px}.motion-ready #research-notes .article-card>p{font-size:15px}.motion-ready #research-notes .article-meta{margin-top:22px}.motion-ready #research-notes .read-link{margin-bottom:20px}
 .motion-ready #story-ending .ending-content h2{font-size:36px}.motion-ready #story-ending .ending-content>p{margin:15px 0 20px}.motion-ready #story-ending .ending-tail{height:25px;margin-block:16px 10px}.motion-ready #story-ending .ending-dot{margin-bottom:14px}
}
@media(max-height:760px) and (min-width:801px){
 .motion-ready #reality .scene-number{font-size:36px;margin-bottom:16px}
 .motion-ready #system .story-panel{top:22%}.motion-ready #system .story-panel h2{font-size:30px}
 .motion-ready #system .story-panel .capability-context{font-size:14px;margin-top:12px}
 .motion-ready #system .story-description{font-size:15px}
}
@media(max-width:1100px) and (min-width:801px){
 .motion-ready{--story-gutter:28px}.motion-ready .opening-copy h1{font-size:34px}
 .motion-ready #evolution .story-panel h2{font-size:28px}
 .motion-ready #system .system-links a{font-size:10px}.motion-ready #reframe .story-panel h2{font-size:28px}.motion-ready :is(#reality,#future) .story-panel h2{font-size:28px}.motion-ready #journey .story-panel h2{font-size:42px}.motion-ready #journey .story-panel[data-panel=journey-end] h2{font-size:28px}
 .motion-ready #research-notes .article-card{grid-template-columns:34% 1fr;column-gap:4vw}.motion-ready .story-controls #story-chapter{font-size:10px}
}
@media(max-width:800px){.practice-line em{font-size:14px;max-width:100%}.practice-line small{font-size:10px}}
@media print{.tail-sticky{position:static!important;height:auto!important;overflow:visible!important}[data-tail-scene]{height:auto!important}.service-chapter-number{display:none!important}.practice-line{display:grid!important}.practice-line>span,.story-about,.article-grid,.article-card,.ending-content{position:static!important;opacity:1!important;transform:none!important}.article-grid{width:auto!important}.site-header{position:static!important;transform:none!important}}

@media print{.story-panel>*,.opening-copy>*,[data-depth-layer]{opacity:1!important;transform:none!important;filter:none!important}}

/* An explicit sound control, outside both reading and illustration areas. */
.story-music{position:fixed;right:var(--story-gutter,28px);top:78px;z-index:40;color:#605c56;font-size:11px}
.story-music[hidden]{display:none}.story-music>button{display:flex;align-items:center;gap:9px;padding:10px 13px;min-height:38px;background:#f8f5edeb;border:1px solid #b4a78b38;border-radius:3px;color:inherit;font:inherit;cursor:pointer}
.music-bars{display:flex;align-items:center;gap:3px;height:15px;width:16px}.music-bars i{display:block;width:2px;height:4px;background:#b9794c;transform-origin:center}.music-bars i:nth-child(2){height:10px}.music-bars i:nth-child(3){height:6px}
.story-music[data-state=playing] .music-bars i{height:12px}.story-music[data-state=playing] .music-bars i:nth-child(2){height:6px}.story-music[data-state=playing] .music-bars i:nth-child(3){height:15px}
.music-options{position:absolute;right:0;top:calc(100% + 7px);min-width:182px;padding:15px;background:#faf7f0f5;border:1px solid #b4a78b38;border-radius:3px;box-shadow:0 12px 30px #55442712;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .2s,transform .2s,visibility .2s}
.story-music:hover .music-options,.story-music:focus-within .music-options{opacity:1;visibility:visible;transform:none}.music-options:before{content:"";position:absolute;inset:-8px 0 auto;height:8px}.music-options label{display:flex;align-items:center;gap:12px;white-space:nowrap}.music-options input{width:110px;accent-color:#b9794c}.music-options a{display:block;margin-top:13px;color:#8b826f;font-size:10px}
.motion-ready:is([data-active-scene=practice],[data-active-scene=story-ending]) .story-music>button{background:#39352fe8;color:#d9d5cf;border-color:#827e7845}
@media(max-width:800px){.story-music{top:auto;bottom:14px;right:16px}.music-options{top:auto;bottom:calc(100% + 7px)}.music-options:before{inset:auto 0 -8px}.story-music>button{min-height:40px}}
@media print{.story-music{display:none!important}}

/* Broad color fields, directional light and moving shadow; the reading plane stays clear. */
.story-lightfield{display:none}
.motion-ready .story-lightfield{display:block;position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.motion-ready .story-lightfield,.motion-ready .tail-sticky:before{
 background:radial-gradient(ellipse 46% 72% at var(--light-x,80%) var(--light-y,20%),rgb(var(--light-color,244 227 207) / var(--light-strength,.2)),transparent 78%),radial-gradient(ellipse 75% 75% at 92% 100%,rgb(50 44 38 / var(--light-shade,.025)),transparent 75%);
}
.motion-ready .story-lightfield:after,.motion-ready .tail-sticky:after{content:"";position:absolute;left:var(--light-plate-x,80%);top:-20%;height:145%;width:58%;transform:translateX(-50%) rotate(var(--light-angle,-20deg));opacity:var(--light-plate-alpha,.3);background:linear-gradient(90deg,transparent 2%,rgb(var(--light-fill,209 197 183) / .24) 12%,rgb(var(--light-color,244 227 207) / .32) 48%,rgb(255 249 240 / .15) 70%,transparent 91%);pointer-events:none}
.motion-ready .tail-sticky{isolation:isolate}.motion-ready .tail-sticky:before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none}.motion-ready .tail-sticky:after{z-index:0}.motion-ready .tail-sticky>.container{z-index:1}.motion-ready #story-ending .ending-color-shift{z-index:-1}
@media print{.story-lightfield,.tail-sticky:before,.tail-sticky:after{display:none!important}}

/* The upper dark interlude has a separate dissolve before and after its narrative. */
.motion-ready .site-header{background:var(--chrome-bg,#f5f2eb);color:var(--chrome-ink,#3c3832);transition:transform .4s ease}
.motion-ready .story-controls{background:var(--chrome-bg,#f5f2eb);color:var(--chrome-muted,#6d6963)}
.motion-ready .story-controls button{color:var(--chrome-ink,#3c3832)}
.motion-ready .story-music>button{background:var(--chrome-bg,#f5f2eb);color:var(--chrome-ink,#3c3832)}
.motion-ready #reframe .story-content{opacity:var(--reframe-copy-alpha,0)}

.motion-ready .nav-cta{background:var(--chrome-cta-bg,#2d2923);color:var(--chrome-cta-ink,#f8f5ec)}

/* Opening: one explanatory object approaches, pauses and docks at each octagon vertex. */
#opening-assembly text{font-family:var(--font);fill:#4b4741;letter-spacing:0}
#opening-assembly .opening-tile-face{fill:url(#porcelain-face);stroke:#fffdf7;stroke-width:1;filter:url(#tile-shadow)}
#opening-assembly .opening-tile-icon{fill:none;stroke:#8b7759;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
#opening-assembly .opening-tile-icon path{fill:none;stroke:inherit;stroke-width:inherit}
#opening-assembly .opening-tile-title{font-size:22px;font-weight:500}
#opening-assembly .opening-tile-count{font-size:10px;fill:#a08d71;letter-spacing:1px}
#opening-assembly .opening-tile-description{font-size:14.5px;fill:#78746e}
#opening-assembly .opening-tile-rule{fill:none;stroke:#b9ad97;stroke-opacity:.4;stroke-width:.65}
#opening-assembly .opening-tile-effect-bg{fill:#e3ddcd;fill-opacity:.6}
#opening-assembly .opening-tile-effect{font-size:11px;fill:#9a6744}
#opening-assembly .opening-anchor-dot{fill:url(#copper-bead);stroke:#f9d4ad;stroke-width:.7}
#opening-assembly .opening-anchor-halo{fill:url(#signal-bloom)}
.opening-reading{list-style:none;padding:0;margin:34px 0 0;display:grid;gap:18px}
.opening-reading li{display:grid;grid-template-columns:70px 1fr;gap:16px;padding-top:18px;border-top:1px solid #d8d1c1}
.opening-reading strong{font-size:17px;font-weight:500;color:#a56d49}.opening-reading p{font-size:15px;line-height:1.7;color:#7b7771}
.opening-reading p span{display:block;font-size:12px;margin-top:5px;color:#a08d71}
.motion-ready .opening-reading{display:none}
@media print{.opening-reading{display:grid!important}}

.story-bridge{display:none}.motion-ready .story-bridge{display:block;position:fixed;left:50%;top:52%;width:min(74vw,1080px);z-index:15;pointer-events:none;text-align:center;color:var(--bridge-ink,#3e3a34);opacity:var(--bridge-alpha,0);transform:translate(-50%,-50%);background:none}
.story-bridge p{font-size:clamp(32px,3.8vw,58px);line-height:1.4;font-weight:450;letter-spacing:-.035em;transform:translateY(var(--bridge-y,0px)) scale(var(--bridge-scale,1));text-shadow:0 1px 16px #f5f2eb9c,0 1px 32px #f5f2eb80}
.motion-ready:is([data-active-scene=practice],[data-active-scene=story-ending],[data-active-scene=reframe]) .story-bridge p{text-shadow:0 1px 16px #25221eb0,0 1px 32px #25221e80}
.motion-ready .story-content,.motion-ready .tail-sticky>.container{opacity:calc(1 - var(--bridge-copy-fade,0))}
.motion-ready #reframe .story-content{opacity:calc(var(--reframe-copy-alpha,0)*(1 - var(--bridge-copy-fade,0)))}
.motion-ready #reframe .story-panel h2{font-size:clamp(28px,2.6vw,46px)}.motion-ready #reframe .story-panel .capability-context{color:#b3afa9;font-size:15px;margin-top:18px}
.motion-ready[data-active-scene=reframe] #signal-center .center-body{fill:#e5e1db}.motion-ready[data-active-scene=reframe] #center-sub{font-size:12px}
.motion-ready[data-active-scene=journey] #rolling-home:before{opacity:.16}
@media print{.story-bridge{display:none!important}.story-content,.tail-sticky>.container{opacity:1!important}}

.motion-ready .site-header .brand-logo{width:128px;height:61.4px}

.story-step-controls{display:none;align-items:center;gap:7px;white-space:nowrap}
.motion-ready .story-step-controls{display:inline-flex}
.story-step-controls>span{font-size:10px;letter-spacing:.06em}
.story-step-controls button{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;font:300 24px/1 "Helvetica Neue",sans-serif!important;transition:background .2s,color .2s,opacity .2s}
.story-step-controls button:hover,.story-step-controls button:focus-visible{background:#ab765025;outline:1px solid #a86e47}
.story-step-controls button:disabled{opacity:.25;cursor:default;background:none;outline:none}
.capability-result{font-size:14px;line-height:1.7;color:#78746e;border-left:2px solid #cecac4;padding-left:15px;margin-top:20px}.capability-result>span{display:block;font-size:10px;letter-spacing:.1em;color:#9a9690;margin-bottom:5px}
@media(max-height:760px) and (min-width:801px){.capability-result{font-size:12px;line-height:1.55;margin-top:12px}.capability-result>span{font-size:9px}.motion-ready #system .story-panel{top:20%}}
