.box-experience{--study-bg:#0e1e2c;--study-ink:#f2f2e9;--study-muted:#a7b6bf;--study-line:#52616b;--study-accent:#9dbfe2;--study-font:Manrope,Arial,sans-serif;position:relative;background:var(--study-bg);color:var(--study-ink);padding:80px 0;border:0;isolation:isolate}
.box-experience[data-box-experience=paper]{--study-bg:#efede3;--study-ink:#1744bc;--study-muted:#606d64;--study-line:#c3c9bd;--study-accent:#1744bc;--study-font:Newsreader,Georgia,serif}
.box-experience.box-scroll-enabled:not(.motion-reduced){height:220vh;min-height:1200px;padding:0}
.box-pin{width:min(calc(100% - 100px),1320px);margin:auto;display:grid;align-content:center;position:relative}
.box-scroll-enabled:not(.motion-reduced) .box-pin{position:sticky;top:calc(var(--header,88px) + 16px);height:calc(100svh - var(--header,88px) - 32px);min-height:560px}
.box-kicker{display:flex;justify-content:space-between;gap:25px;border-top:1px solid var(--study-line);padding-top:18px;font:10px/1.7 Manrope,Arial,sans-serif;letter-spacing:.12em;color:var(--study-muted)}
.box-kicker>span:first-child{color:var(--study-accent)}
.box-layout{display:grid;grid-template-columns:.85fr 1.65fr;gap:35px;align-items:center;padding:30px 0}
.box-copy{max-width:360px}.box-copy h2{font-family:var(--study-font);font-size:clamp(31px,3.1vw,45px);font-weight:450;line-height:1.09;letter-spacing:-.04em;color:var(--study-ink);margin:0 0 25px;text-wrap:balance}
.box-copy>p{font:14px/1.85 Manrope,Arial,sans-serif;color:var(--study-muted);margin:0 0 24px}.box-copy .box-link{display:inline-block;border-bottom:1px solid var(--study-accent);color:var(--study-accent);font:12px/1.8 Manrope,Arial,sans-serif;padding:5px 0;min-height:32px}.box-link span{margin-left:15px}
.box-visual{min-width:0;position:relative}.box-viewport{height:clamp(320px,52svh,620px);position:relative;isolation:isolate}
.box-grid{position:absolute;inset:7% 0;background-image:linear-gradient(var(--study-line) 1px,transparent 1px),linear-gradient(90deg,var(--study-line) 1px,transparent 1px);background-size:42px 42px;opacity:.12;mask-image:radial-gradient(ellipse,#0007,transparent 70%);pointer-events:none}
.box-canvas{position:absolute;inset:0;opacity:0;transition:opacity .4s ease;pointer-events:none}.box-canvas canvas{width:100%;height:100%;display:block}.box-ready .box-canvas{opacity:1}
.box-fallback,.box-source{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:20px;transition:opacity .35s ease;pointer-events:none}.box-fallback{opacity:1}.box-ready .box-fallback{opacity:0}.box-source{opacity:0}.shows-source .box-source{opacity:1}.shows-source .box-fallback,.shows-source .box-canvas{opacity:0}
.box-source-button{font:11px/1.6 Manrope,Arial,sans-serif;color:var(--study-accent);border:0;border-bottom:1px solid var(--study-line);background:none;cursor:pointer;padding:8px 0;min-height:36px}.box-source-button[hidden]{display:none}
.box-status-row{display:flex;justify-content:space-between;align-items:center;gap:18px;min-height:45px;font:11px/1.7 Manrope,Arial,sans-serif;color:var(--study-muted)}.box-status{color:var(--study-accent)}
.box-steps{display:none;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;position:relative;border-top:1px solid var(--study-line);padding-top:19px}.box-scroll-enabled .box-steps{display:grid;visibility:hidden}.box-ready .box-steps{display:grid;visibility:visible}.box-steps:before{content:'';position:absolute;top:-1px;left:0;width:calc(var(--fold-progress,1)*100%);height:2px;background:var(--study-accent);pointer-events:none}
.box-steps button{padding:8px 0;border:0;text-align:left;color:var(--study-muted);font:12px/1.7 Manrope,Arial,sans-serif;background:none;cursor:pointer;min-height:42px}.box-steps button span{font-size:9px;margin-right:13px}.box-steps button[aria-pressed=true]{color:var(--study-ink)}
.box-technical-note{font:9px/1.7 Manrope,Arial,sans-serif!important;color:var(--study-muted)!important;letter-spacing:.035em;margin:16px 0 0!important;display:flex;justify-content:space-between;gap:20px}.box-scroll-hint{display:none}.box-ready .box-scroll-hint{display:inline}
.box-experience a:focus-visible,.box-experience button:focus-visible{outline:2px solid var(--study-accent);outline-offset:5px}
.box-experience[data-box-experience=paper] .box-fallback{mix-blend-mode:darken}
@media(max-width:1000px){.box-pin{width:calc(100% - 64px)}.box-layout{grid-template-columns:.9fr 1.3fr;gap:20px}.box-copy h2{font-size:34px}.box-copy>p{font-size:13px}.box-viewport{height:420px}.box-status-row{flex-wrap:wrap;gap:0}}
@media(max-width:760px){.box-experience{padding:54px 0}.box-experience.box-scroll-enabled:not(.motion-reduced){height:215svh;min-height:1250px}.box-pin{width:calc(100% - 44px)}.box-scroll-enabled:not(.motion-reduced) .box-pin{height:calc(100svh - var(--header,74px) - 22px);min-height:570px;top:calc(var(--header,74px) + 8px)}.box-kicker{font-size:8px;gap:12px;padding-top:13px}.box-kicker>span:last-child{letter-spacing:.02em}.box-layout{grid-template-columns:1fr;gap:6px;padding:24px 0 15px}.box-copy{max-width:100%;display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}.box-copy h2{font-size:32px;margin:0}.box-copy>p{font-size:12px;line-height:1.8;margin:0}.box-copy .box-link{grid-column:1/-1;font-size:11px;width:fit-content;padding:2px 0;min-height:25px}.box-viewport{height:clamp(230px,36svh,345px)}.box-fallback,.box-source{padding:8px}.box-status-row{font-size:10px;flex-wrap:nowrap;gap:10px}.box-source-button{font-size:10px;max-width:155px;text-align:right}.box-steps{gap:12px;padding-top:12px}.box-steps button{font-size:10px;line-height:1.6;padding:3px 0}.box-steps button span{display:block;font-size:8px;margin-bottom:4px}.box-technical-note{font-size:8px!important;margin-top:10px!important;gap:15px}.box-grid{background-size:28px 28px}}
@media(max-width:360px){.box-pin{width:calc(100% - 36px)}.box-copy{grid-template-columns:1fr;gap:12px}.box-copy h2{font-size:30px}.box-copy h2 br{display:none}.box-copy>p{font-size:12px}.box-viewport{height:235px}.box-scroll-enabled:not(.motion-reduced) .box-pin{min-height:640px}.box-kicker>span:last-child{display:none}.box-status-row{align-items:start}.box-status{max-width:95px}}
@media(max-height:700px) and (min-width:761px){.box-scroll-enabled:not(.motion-reduced) .box-pin{min-height:470px}.box-viewport{height:285px}.box-copy h2{font-size:33px}.box-layout{padding-block:14px}.box-technical-note{margin-top:8px!important}}
@media(prefers-reduced-motion:reduce){.box-experience.box-ready{height:auto;min-height:0;padding:60px 0}.box-experience .box-pin{position:relative;height:auto;min-height:0;top:auto}.box-canvas,.box-steps,.box-scroll-hint{display:none!important}.box-fallback{opacity:1!important}.shows-source .box-fallback{opacity:0!important}.box-fallback,.box-source{transition:none}.box-viewport{height:350px}}
.motion-reduced .box-canvas,.motion-reduced .box-steps,.motion-reduced .box-scroll-hint{display:none!important}.motion-reduced .box-fallback{opacity:1}.motion-reduced.shows-source .box-fallback{opacity:0}
/* The folding study opens out into a three-structure collection. */
.box-experience.box-scroll-enabled:not(.motion-reduced){height:325svh;min-height:1800px}
.box-ready.box-interactive:not(.motion-reduced):not(.shows-source) .box-canvas{pointer-events:auto;touch-action:pan-y pinch-zoom}
.box-canvas[data-hover-box]{cursor:pointer}
.box-steps{grid-template-columns:repeat(4,minmax(0,1fr))}
.box-actions{display:flex;align-items:center;justify-content:flex-end;gap:20px}
.box-replay{border:0;background:none;color:var(--study-accent);font:11px/1.6 Manrope,Arial,sans-serif;padding:8px 0;min-height:36px;cursor:pointer;white-space:nowrap}.box-replay span{display:inline-block;margin-left:5px;font-size:16px}.box-replay[hidden]{display:none}.box-replay:disabled{visibility:hidden}
.box-range{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:6px}
.box-range button{min-width:0;color:var(--study-muted);border:0;border-top:1px solid var(--study-line);background:none;font:12px/1.5 Manrope,Arial,sans-serif;padding:13px 0 9px;text-align:center;cursor:pointer;min-height:60px}
.box-range button:disabled{cursor:default}.box-range button[aria-pressed=true]{color:var(--study-accent);border-top-color:var(--study-accent)}
.box-range small{display:block;font-size:8px;letter-spacing:.1em;margin-bottom:5px;color:var(--study-muted)}
.box-range img{width:100%;height:125px;object-fit:contain;margin-bottom:15px}
.box-ready:not(.motion-reduced) .box-range img{display:none}
.box-ready:not(.motion-reduced) .box-range{visibility:hidden;opacity:0;transition:opacity .25s ease}
.box-ready.range-visible:not(.motion-reduced) .box-range{visibility:visible;opacity:1}
@media(min-width:761px){
 .box-ready:not(.motion-reduced) .box-layout{display:block;position:relative}
 .box-ready:not(.motion-reduced) .box-copy{position:absolute;left:0;top:50%;width:30%;transform:translateY(calc(-50% - var(--copy-exit,0)*25px));opacity:calc(1 - var(--copy-exit,0));}
 .box-ready:not(.motion-reduced) .box-visual{margin-left:calc(35% * (1 - var(--gallery-progress,0)));width:calc(65% + 35% * var(--gallery-progress,0))}
 .box-ready.range-visible .box-copy{pointer-events:none}
}
@media(max-width:1000px){.box-actions{gap:12px}.box-status-row{flex-wrap:nowrap}.box-status{max-width:47%}.box-status-row{font-size:10px}.box-source-button,.box-replay{font-size:10px}.box-range{gap:12px}.box-range button{font-size:11px}}
@media(max-width:760px){
 .box-experience.box-scroll-enabled:not(.motion-reduced){height:330svh;min-height:1850px}
 .box-scroll-enabled:not(.motion-reduced) .box-pin{min-height:650px}
 .box-viewport{height:clamp(225px,31svh,285px)}
 .box-copy h2{font-size:30px}.box-copy>p{line-height:1.7}
 .box-layout{padding-block:19px 12px}.box-actions{gap:9px;flex-wrap:wrap;row-gap:0}.box-status{max-width:42%}
 .box-status-row{min-height:46px}.box-source-button{max-width:none;font-size:9px;min-height:30px}.box-replay{font-size:10px;min-height:30px}
 .box-range{gap:12px;margin-top:2px}.box-range button{font-size:10px;min-height:54px;padding:10px 0 8px}.box-range small{font-size:7px;letter-spacing:.05em;margin-bottom:4px}.box-range img{height:88px}
 .box-steps{gap:12px;padding-top:8px}.box-steps button{font-size:10px;min-height:48px}.box-steps button span{margin-bottom:2px}
}
@media(max-width:360px){.box-copy{gap:9px}.box-copy h2{font-size:27px}.box-copy>p{font-size:11px}.box-copy .box-link{font-size:10px;min-height:24px}.box-viewport{height:215px}.box-status-row{font-size:9px;min-height:58px}.box-status{max-width:40%}.box-source-button{max-width:145px}.box-steps{gap:8px}.box-steps button{font-size:9px}.box-range{gap:8px}.box-range button{font-size:10px;min-height:62px}.box-range small{letter-spacing:0;font-size:7px}.box-technical-note{font-size:7px!important;gap:10px}}
@media(max-height:720px) and (max-width:760px){.box-copy>p{display:none}.box-copy{display:block}.box-copy h2{font-size:27px;max-width:300px;margin-bottom:8px}.box-copy h2 br{display:none}.box-copy .box-link{font-size:10px}.box-viewport{height:200px}.box-scroll-enabled:not(.motion-reduced) .box-pin{min-height:530px}.box-layout{padding-block:12px 8px}.box-technical-note{margin-top:6px!important}}
@media(max-height:820px) and (min-width:761px){.box-viewport{height:285px}.box-layout{padding-block:16px}.box-scroll-enabled:not(.motion-reduced) .box-pin{min-height:565px}}
@media(prefers-reduced-motion:reduce){.box-range{visibility:visible!important;opacity:1!important;transition:none!important}.box-replay{display:none!important}.box-range img{display:block!important}}