/* 3STP: a public-space object read through steps, mass and movement. */
body[data-story="3stp"]{--ex-accent:#d65327}
body[data-story="3stp"] .top{border-bottom:2px solid #1b2926}
body[data-story="3stp"] .chapters{background:#1b2926;color:#e9e8df;border:0;gap:32px;font-family:Mono,monospace}
body[data-story="3stp"] .chapters a{font-size:10px;text-transform:uppercase;letter-spacing:.04em}
.seat-hero{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:0;padding:42px 0 0;align-items:start}
.seat-hero>.seat-intro{position:relative;z-index:2;grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;align-items:start}
.seat-hero .eyebrow{grid-column:1/-1;margin-bottom:32px;font-size:10px;letter-spacing:.15em}
.seat-hero h1{font-size:clamp(180px,28vw,400px);line-height:.73;letter-spacing:-.09em;margin:0;position:relative;z-index:2}
.seat-title-piece{display:inline-block;transform:translateY(calc((var(--section-progress,.25) - .25)*var(--step-title,50px)))}
.seat-title-piece:nth-child(2){--step-title:-75px}.seat-title-piece:nth-child(3){--step-title:120px}.seat-title-piece:nth-child(4){--step-title:-45px}
.seat-hero .seat-intro p{align-self:end;justify-self:end;max-width:275px;border-top:3px solid #d65327;padding-top:18px;margin:0 0 7px;font-size:20px}
.seat-viewer{grid-column:1/-1;display:grid;grid-template-columns:145px 1fr;gap:30px;margin-top:50px;border-top:2px solid #1b2926;padding-top:20px}
.seat-view-rail{display:flex;flex-direction:column;align-items:stretch;gap:12px;padding-top:5px}
.seat-view-rail>span{font:9px/1.7 Mono,monospace;letter-spacing:.07em;margin-bottom:20px}
.seat-view-buttons{display:none}.steps-ready .seat-view-buttons{display:grid;gap:8px}
.seat-view-buttons button{cursor:pointer;text-align:left;border:1px solid #1b2926;background:transparent;padding:15px 12px;font:11px/1.5 Mono,monospace;display:flex;gap:12px;align-items:center;transition:background .2s,color .2s,transform .2s}
.seat-view-buttons button b{font:24px Display,Arial}.seat-view-buttons button[aria-pressed="true"]{background:#d65327;color:#fffaf0;border-color:#d65327;transform:translateX(8px)}
.seat-hero .seat-viewer figure{max-width:none;width:100%;border:0;box-shadow:none;transform:none;background:transparent;position:relative}
.seat-viewport{position:relative;overflow:hidden;background:#fff;aspect-ratio:1.85;display:block}
.seat-viewport:after{content:'';position:absolute;inset:16px;pointer-events:none;background:linear-gradient(#1b2926,#1b2926) left top/22px 2px no-repeat,linear-gradient(#1b2926,#1b2926) left top/2px 22px no-repeat,linear-gradient(#1b2926,#1b2926) right bottom/22px 2px no-repeat,linear-gradient(#1b2926,#1b2926) right bottom/2px 22px no-repeat}
.seat-viewport img{width:100%;height:100%;object-fit:contain;transform:scale(1.18);transition:opacity .18s}
.seat-hero figcaption{font:10px/1.6 Mono,monospace;opacity:1;display:flex;justify-content:space-between;gap:20px;padding:10px 0}
.seat-hero .view-turn-note{font:9px Mono,monospace;text-transform:uppercase;letter-spacing:.1em}
.verbs{position:relative;grid-template-columns:repeat(4,1fr);gap:0;align-items:end;margin-top:60px;padding:0;border:0;min-height:215px;overflow:hidden}
.verbs span{display:block;position:relative;background:#1b2926;color:#e9e8df;padding:20px 20px 25px;min-height:95px;transform:translateY(calc((1 - var(--section-progress,.5))*var(--verb-shift,15px)));font-size:clamp(32px,5.5vw,80px);line-height:.9}
.verbs span:nth-child(2){min-height:135px;background:#1f625d;color:#e9e8df;--verb-shift:45px}.verbs span:nth-child(3){min-height:175px;background:#d65327;--verb-shift:75px}.verbs span:nth-child(4){min-height:215px;background:#e98450;color:#1b2926;--verb-shift:105px}
body[data-story="3stp"] h2{font-size:clamp(42px,6.4vw,90px);text-transform:uppercase;line-height:.94;letter-spacing:-.055em}
body[data-story="3stp"] .section{padding-block:115px}
body[data-story="3stp"] .intro{gap:8vw;margin-bottom:65px}
body[data-story="3stp"] #context>.eyebrow,body[data-story="3stp"] #form>.eyebrow,body[data-story="3stp"] #technical>.eyebrow,body[data-story="3stp"] #identity>.eyebrow{border-top:2px solid;padding-top:16px}
body[data-story="3stp"] #context>figure{width:78%;margin-left:auto;border-left:16px solid #d65327}
body[data-story="3stp"] #context>figure .picture{background:#fff;overflow:hidden}
body[data-story="3stp"] #context>figure img{transform:scale(1.04) translateX(calc((var(--section-progress,.5) - .5)*35px))}
body[data-story="3stp"] #research{position:relative;overflow:hidden}
body[data-story="3stp"] #research:before{content:'MOVE';position:absolute;right:-.04em;bottom:-.18em;font:clamp(120px,27vw,400px)/1 Display,Arial;letter-spacing:-.08em;color:#fffaf014;pointer-events:none;transform:translateX(calc((var(--section-progress,.5) - .5)*80px))}
body[data-story="3stp"] #research>.wrap{position:relative;z-index:1}.scribble-grid{gap:5vw;align-items:start}.scribble-grid figure:nth-child(2){margin-top:75px;transform:rotate(2deg) translateY(calc((var(--section-progress,.5) - .5)*-70px))}
.concept-steps{margin:65px 0 85px;min-height:320px;align-items:end;border-bottom:3px solid #1b2926}
.concept-steps>div{position:relative;min-height:180px;padding:30px;transform:translateY(calc((1 - var(--section-progress,.5))*var(--level-shift,20px)))}
.concept-steps>div:nth-child(2){min-height:250px;--level-shift:55px}.concept-steps>div:nth-child(3){min-height:320px;--level-shift:90px}
.concept-steps h3{font-family:Mono,monospace;font-size:14px;text-transform:uppercase;letter-spacing:.05em}
.concept-steps p{font-size:18px;line-height:1.4;max-width:260px;margin-top:25px}
body[data-story="3stp"] .viewer{padding:28px;box-shadow:15px 15px 0 #123f3b}
body[data-story="3stp"] .switches{gap:0;margin-bottom:25px}
body[data-story="3stp"] .switches button{font:11px Mono,monospace;min-height:48px;padding:14px 23px;border:2px solid #1b2926}
body[data-story="3stp"] .switches button+button{border-left:0}
body[data-story="3stp"] .viewer img{max-height:640px}
body[data-story="3stp"] .technical-aside h2{font-size:clamp(42px,5.2vw,75px)}
body[data-story="3stp"] .technical-layout{grid-template-columns:1.1fr .9fr;gap:6vw}.tech-number{border-top:2px solid;line-height:1.6;font-size:10px;letter-spacing:.02em}
.seat-identity-source{margin:40px 0 65px;position:relative;overflow:hidden}.seat-identity-source img{transform:scale(1.01)}
body[data-story="3stp"] .branding-pair{align-items:start;gap:5vw}.branding-pair>figure:last-child{margin-top:65px;transform:translateY(calc((var(--section-progress,.5) - .5)*-60px))}
body[data-story="3stp"] .end{max-width:none;font-size:clamp(58px,10.8vw,155px);transform:translateX(calc((var(--section-progress,.5) - .5)*30px))}
@media(max-width:900px){.seat-hero .seat-intro p{max-width:230px;font-size:17px}.seat-viewer{grid-template-columns:115px 1fr;gap:20px}.seat-viewport{aspect-ratio:1.45}.seat-view-buttons button{padding:12px 8px;font-size:10px}.seat-view-buttons button b{font-size:20px}.verbs{min-height:185px}.verbs span{padding-inline:12px}.verbs span:nth-child(4){min-height:185px}.verbs span:nth-child(3){min-height:155px}.verbs span:nth-child(2){min-height:125px}.concept-steps>div{padding:22px}.concept-steps p{font-size:16px}}
@media(max-width:760px){.seat-hero{padding-top:30px;display:block}.seat-hero>.seat-intro{grid-template-columns:1fr}.seat-hero h1{font-size:48vw;line-height:.8}.seat-hero .eyebrow{font-size:8px;margin-bottom:30px}.seat-hero .seat-intro p{justify-self:end;max-width:260px;font-size:18px;margin-top:28px;padding-top:15px}.seat-viewer{grid-template-columns:1fr;margin-top:30px;padding-top:15px;gap:15px}.seat-view-rail{padding:0;gap:10px}.seat-view-rail>span{margin:0;font-size:8px}.steps-ready .seat-view-buttons{grid-template-columns:repeat(3,1fr);gap:5px}.seat-view-buttons button{padding:10px 7px;gap:8px;justify-content:center;min-height:45px}.seat-view-buttons button[aria-pressed="true"]{transform:translateY(-3px)}.seat-viewport{aspect-ratio:1.2}.seat-viewport img{transform:scale(1.2)}.seat-hero figcaption{font-size:9px;flex-direction:column;gap:5px}.seat-hero .view-turn-note{font-size:8px}.verbs{min-height:140px;margin-top:35px;gap:0;grid-template-columns:repeat(4,1fr)}.verbs span{font-size:7vw;padding:15px 6px;min-height:65px}.verbs span:nth-child(2){min-height:90px}.verbs span:nth-child(3){min-height:115px}.verbs span:nth-child(4){min-height:140px}body[data-story="3stp"] .section{padding-block:70px}body[data-story="3stp"] h2{font-size:46px}body[data-story="3stp"] .intro{gap:28px;margin-bottom:35px}body[data-story="3stp"] #context>figure{width:100%;border-left-width:7px}.scribble-grid{gap:30px}.scribble-grid figure:nth-child(2){margin-top:0;transform:none}.concept-steps{grid-template-columns:1fr;gap:0;min-height:0;margin:40px 0 50px}.concept-steps>div:nth-child(n){transform:none;min-height:0;padding:24px}.concept-steps>div:nth-child(1){width:78%}.concept-steps>div:nth-child(2){width:89%}.concept-steps>div:nth-child(3){width:100%}.concept-steps p{font-size:17px;max-width:100%;margin-top:15px}body[data-story="3stp"] .viewer{padding:13px;box-shadow:7px 7px 0 #123f3b}body[data-story="3stp"] .switches button{font-size:9px;padding:12px 14px;flex:1}body[data-story="3stp"] .technical-layout{grid-template-columns:1fr}body[data-story="3stp"] .technical-aside h2{font-size:44px}.seat-identity-source{margin:30px 0 35px}.branding-pair>figure:last-child{margin-top:0;transform:none}body[data-story="3stp"] .end{font-size:16vw;transform:none}}
:is(.reduce-motion,.experience-reduced) .seat-title-piece,:is(.reduce-motion,.experience-reduced) .verbs span,:is(.reduce-motion,.experience-reduced) .concept-steps>div,:is(.reduce-motion,.experience-reduced) .scribble-grid figure,:is(.reduce-motion,.experience-reduced) .branding-pair>figure,:is(.reduce-motion,.experience-reduced) body[data-story="3stp"] .end,:is(.reduce-motion,.experience-reduced) body[data-story="3stp"] #research:before,:is(.reduce-motion,.experience-reduced) body[data-story="3stp"] #context>figure img{transform:none!important}
@media(prefers-reduced-motion:reduce){html:not(.motion-user-on) .seat-title-piece,html:not(.motion-user-on) .verbs span,html:not(.motion-user-on) .concept-steps>div,html:not(.motion-user-on) .scribble-grid figure,html:not(.motion-user-on) .branding-pair>figure,html:not(.motion-user-on) body[data-story="3stp"] .end,html:not(.motion-user-on) body[data-story="3stp"] #research:before,html:not(.motion-user-on) body[data-story="3stp"] #context>figure img{transform:none!important}}
