.scale-page{--paper:#f7f7f4;--scale-header:84px;background:var(--paper)}
.scale-page .site-header{background:rgba(247,247,244,.96);color:#0b0b0b;border-color:#d4d4cd;backdrop-filter:blur(12px)}
.scale-page .site-nav a:hover,.scale-page .site-nav [aria-current]{border-color:#111}
.scale-header-link{font-size:11px;font-weight:600;justify-self:end;white-space:nowrap}
.scale-overline{display:flex;justify-content:space-between;gap:20px;font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase}
.scale-intro{padding-top:134px;padding-bottom:30px}.scale-intro-grid{display:grid;grid-template-columns:1.2fr .8fr;align-items:end;gap:60px;padding-top:70px;padding-bottom:70px}
.scale-intro h1{font-size:clamp(66px,8.8vw,150px);line-height:.88;letter-spacing:-.065em;font-weight:600;margin:0}.scale-page em{font-style:normal;color:#777971}
.scale-intro-copy{max-width:360px;justify-self:end;padding-bottom:5px}.scale-intro-copy>p{font-size:clamp(22px,2.25vw,36px);line-height:1.25;letter-spacing:-.03em;margin-bottom:35px}.scale-intro-detail{font-size:15px;line-height:1.75;color:#5d5f57;margin-bottom:35px}
.scale-text-link{font-size:12px;font-weight:600;border-bottom:1px solid #111;padding:10px 0;display:inline-flex;gap:50px;align-items:center}.scale-text-link span{font-size:24px;line-height:1}.scale-text-link:hover span{transform:translate(3px,-3px)}
.scale-intro-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #cececa;padding-top:20px;font-size:11px;line-height:1.5;color:#62645b}
.scale-scroll{position:relative;background:#eeeee8;scroll-margin-top:84px}.scale-frame{padding:26px var(--pad) 22px;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative}
.scale-scroll.is-animated{height:480svh}.is-animated .scale-frame{height:calc(100svh - var(--scale-header));position:sticky;top:var(--scale-header)}
.scale-scene-heading{width:100%;max-width:calc(150svh - 420px);display:flex;justify-content:space-between;gap:20px;align-items:center;margin:0 auto 18px}.scale-scene-heading h2{font-size:19px;letter-spacing:-.02em;font-weight:500;line-height:1.2;margin:0}.scale-scene-heading>span{font-size:9px;letter-spacing:.1em;white-space:nowrap;color:#5b5e55}
.desk-viewport{width:100%;max-width:calc(150svh - 420px);aspect-ratio:1586/992;position:relative;overflow:hidden;background:#e6ddd0;isolation:isolate}
.desk-plane{position:absolute;inset:0;width:100%;height:100%}.desk-background{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}
.miniature{position:absolute;left:0;top:0;transform-origin:center;pointer-events:none;will-change:auto}.is-animated .miniature{will-change:transform}.miniature img{width:100%;height:auto;filter:drop-shadow(3px 5px 2px rgba(34,26,16,.26)) drop-shadow(6px 9px 7px rgba(48,32,15,.18))}
.module-left{width:24.4%;left:31.8%;top:55%;transform:none}.module-right{width:15.03%;left:56.5%;top:56.2%}.module-table{width:8.26%;left:71.5%;top:56.5%}
.scale-scene-credit{position:absolute;bottom:12px;left:16px;font-size:8px;color:#514c44;letter-spacing:.06em;text-transform:uppercase;pointer-events:none}
.scale-scene-caption{width:100%;max-width:calc(150svh - 420px);display:grid;grid-template-columns:1fr 1fr;gap:25px;align-items:end;padding-top:23px;padding-bottom:15px}.scale-phase{display:grid;grid-template-columns:50px 1fr;column-gap:14px}.scale-phase-number{font-size:9px;letter-spacing:.05em;padding-top:7px;color:#606257}.scale-phase h3{font-size:23px;font-weight:500;letter-spacing:-.025em;line-height:1.2;margin-bottom:8px}.scale-phase p{grid-column:2;font-size:12px;line-height:1.6;color:#5c5f54;margin-bottom:0;max-width:330px;min-height:39px}
.scale-stops{display:grid;grid-template-columns:repeat(5,1fr);gap:13px;align-self:end;padding-bottom:4px}.scale-stops button{appearance:none;background:none;border:0;border-top:1px solid #c2c3b8;color:#74766b;padding:10px 0 3px;font:inherit;text-align:left;font-size:10px;line-height:1.5;cursor:pointer}.scale-stops button span{display:block;font-size:9px;margin-bottom:4px}.scale-stops button[aria-pressed=true]{color:#0b0b0b;border-color:#0b0b0b}.scale-stops button:hover{color:#0b0b0b}.scale-stops button:focus-visible{outline:2px solid #111;outline-offset:5px}
.scale-progress{height:1px;background:#cbcec3;width:100%;max-width:calc(150svh - 420px);overflow:hidden}.scale-progress span{display:block;height:100%;width:100%;background:#111;transform-origin:left;transform:scaleX(.25)}
.scale-meaning{padding-top:110px;padding-bottom:90px}.scale-meaning-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;padding-top:60px;padding-bottom:70px}.scale-meaning h2,.scale-process h2{font-size:clamp(42px,5.7vw,90px);font-weight:500;line-height:1.02;letter-spacing:-.05em;margin:0}.scale-meaning-copy{max-width:520px;justify-self:end;padding-top:7px}.scale-meaning-copy p{font-size:17px;line-height:1.7;color:#52564b;margin-bottom:22px}
.scale-use-list{display:grid;grid-template-columns:repeat(3,1fr);gap:36px}.scale-use-list article{border-top:1px solid #a3a598;padding-top:18px}.scale-use-list article>span{font-size:10px;color:#65695b}.scale-use-list h3{font-size:28px;font-weight:500;letter-spacing:-.03em;margin:35px 0 18px}.scale-use-list p{font-size:14px;line-height:1.7;max-width:330px;color:#5c6252}
.scale-process{padding-top:60px;padding-bottom:90px;background:#e6e8de}.scale-process-heading{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:60px;padding:60px 0}.scale-process-heading>p{max-width:390px;font-size:17px;line-height:1.7;color:#545b47;margin:0;justify-self:end}.scale-process-list{display:grid;grid-template-columns:repeat(3,1fr);list-style:none;gap:36px;padding:0;margin:0}.scale-process-list li{padding:20px 0;border-top:1px solid #a6ac98}.scale-process-list span{font-size:10px;color:#606850}.scale-process-list h3{font-size:27px;letter-spacing:-.03em;font-weight:500;margin:30px 0 15px}.scale-process-list p{max-width:300px;font-size:14px;line-height:1.7;color:#575f49}.scale-disclosure{font-size:11px;line-height:1.75;color:#59624b;max-width:800px;border-top:1px solid #bcc2ae;padding-top:24px;margin:45px 0 0}
.scale-contact{background:#10120e;color:#f7f7f4;padding-top:60px;padding-bottom:90px}.scale-contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:end;padding-top:45px}.scale-contact h2{font-size:clamp(58px,8vw,128px);line-height:.98;font-weight:500;letter-spacing:-.06em;margin:0}.scale-contact em{color:#939888}.scale-contact-grid>div{max-width:460px;justify-self:end;padding-bottom:8px}.scale-contact-grid p{font-size:22px;line-height:1.55;color:#b7bbad;margin-bottom:40px}.scale-contact-email{display:flex;justify-content:space-between;gap:20px;font-size:clamp(20px,2.3vw,34px);letter-spacing:-.03em;border-bottom:1px solid #747d63;padding-bottom:15px}.scale-contact-details{display:block;font-size:12px;margin-top:24px;color:#b7bbad;width:fit-content}.scale-contact-details:hover{text-decoration:underline;text-underline-offset:5px}
@media(min-width:1700px){.scale-intro-grid,.scale-meaning-grid,.scale-use-list,.scale-process-heading,.scale-process-list,.scale-contact-grid{max-width:1550px;margin-left:auto;margin-right:auto}}
@media(max-width:1000px){.scale-intro-grid{gap:35px}.scale-intro h1{font-size:85px}.scale-meaning-grid{gap:40px}.scale-meaning-copy p{font-size:15px}.scale-scene-caption{grid-template-columns:1fr 1fr}.scale-phase h3{font-size:20px}.scale-phase{grid-template-columns:42px 1fr}.scale-stops{gap:9px}.scale-meaning h2,.scale-process h2{font-size:54px}}
@media(max-width:760px){.scale-page{--scale-header:72px}.scale-page .site-header{height:72px;grid-template-columns:auto 1fr;gap:15px}.scale-page .brand{width:105px}.scale-page .site-nav{justify-content:flex-end;gap:15px}.scale-page .site-nav a{font-size:9px;letter-spacing:.03em}.scale-header-link{display:none}.scale-intro{padding-top:108px;padding-bottom:25px}.scale-overline{font-size:9px;letter-spacing:.07em}.scale-overline>span:last-child{max-width:160px;text-align:right}.scale-intro-grid{display:block;padding:40px 0}.scale-intro h1{font-size:clamp(57px,12.7vw,92px);line-height:.92}.scale-intro-copy{margin-top:40px;max-width:350px}.scale-intro-copy>p{font-size:24px;margin-bottom:24px}.scale-intro-detail{font-size:14px;margin-bottom:24px}.scale-intro-bottom{font-size:10px}.scale-intro-bottom span{max-width:46%}.scale-intro-bottom span:last-child{text-align:right}.scale-scroll{scroll-margin-top:72px}.scale-scroll.is-animated{height:420svh}.scale-frame{padding:23px 0 20px}.scale-scene-heading{padding:0 20px;margin-bottom:18px}.scale-scene-heading h2{font-size:18px;max-width:190px}.scale-scene-heading>span{font-size:8px;max-width:90px;text-align:right;white-space:normal;line-height:1.6}.desk-viewport{aspect-ratio:1.08;max-width:100%;width:100%}.desk-plane{width:148%;height:auto;aspect-ratio:1586/992;left:-24%;top:50%;bottom:auto;transform:translateY(-50%)}.scale-scene-credit{font-size:7px;left:20px;bottom:10px;max-width:260px}.scale-scene-caption{display:block;padding:22px 20px 18px;max-width:100%}.scale-phase{grid-template-columns:42px 1fr}.scale-phase h3{font-size:24px;margin-bottom:8px}.scale-phase p{font-size:12px;min-height:39px;max-width:290px}.scale-stops{margin-top:23px;gap:14px}.scale-stops button{font-size:10px}.scale-progress{width:calc(100% - 40px);max-width:100%}.scale-meaning{padding-top:65px;padding-bottom:50px}.scale-page .section-index{font-size:9px;letter-spacing:.04em}.scale-page .section-index>span:last-child{max-width:170px;text-align:right}.scale-meaning-grid{display:block;padding:40px 0}.scale-meaning h2,.scale-process h2{font-size:clamp(42px,10.5vw,62px)}.scale-meaning-copy{margin-top:30px}.scale-meaning-copy p{font-size:15px}.scale-use-list{display:block}.scale-use-list article{display:grid;grid-template-columns:28px 1fr;gap:10px;padding:22px 0}.scale-use-list h3{font-size:26px;margin:0 0 8px}.scale-use-list p{grid-column:2;font-size:13px;margin:0}.scale-use-list article>span{padding-top:6px}.scale-process{padding-top:40px;padding-bottom:45px}.scale-process-heading{display:block;padding:40px 0}.scale-process-heading>p{font-size:15px;margin-top:30px;max-width:330px}.scale-process-list{display:block}.scale-process-list li{display:grid;grid-template-columns:28px 1fr;gap:10px;padding:22px 0}.scale-process-list h3{margin:0 0 8px;font-size:25px}.scale-process-list p{grid-column:2;margin:0;font-size:13px}.scale-process-list span{padding-top:6px}.scale-disclosure{margin-top:24px;font-size:10px}.scale-contact{padding-top:40px;padding-bottom:50px}.scale-contact-grid{display:block;padding-top:40px}.scale-contact h2{font-size:69px}.scale-contact-grid>div{margin-top:40px;max-width:100%}.scale-contact-grid p{font-size:19px;margin-bottom:30px}.scale-contact-email{font-size:27px}}
@media(max-width:360px){.scale-page .brand{width:85px}.scale-page .site-nav{gap:10px}.scale-page .site-nav a{font-size:8px}.scale-contact-email{font-size:23px}.scale-contact h2{font-size:58px}.scale-stops{gap:10px}}
@media(max-height:650px) and (min-width:761px){.desk-viewport,.scale-scene-caption,.scale-scene-heading,.scale-progress{max-width:920px}.scale-frame{height:auto!important;position:relative!important}.scale-scroll.is-animated{height:auto}}
@media(prefers-reduced-motion:reduce){.scale-scroll.is-animated{height:auto}.is-animated .scale-frame{height:auto;position:relative}.miniature{will-change:auto!important}}

/* Same pixels-per-metre for every native 3D render. */
.module-left{width:25.276%;}
.module-right{width:16.685%;}
.module-table{width:8.6975%;}
.module-wide{width:25.56%;}
.module-end{width:26.199%;}
.module-wide,.module-end{opacity:0;left:0;top:0}
.module-left{left:31.362%;top:54.22%}.module-right{left:56.6375%;top:55.4%}.module-table{left:73.32125%;top:55.8%}

/* Meshes replace the photographic overhead shot as the camera lowers. */
.scale-volume{position:absolute;inset:0;opacity:0;pointer-events:none;background:#fff;z-index:2}
.scale-volume-canvas{display:block;width:100%;height:100%}
.scale-volume-fallback{display:none;width:100%;height:100%;object-fit:contain;background:#fff}
.scale-volume[data-fallback=true] .scale-volume-canvas{display:none}
.scale-volume[data-fallback=true] .scale-volume-fallback{display:block}
.scale-volume-message{position:absolute;left:5%;top:5%;z-index:3;opacity:0;pointer-events:none;color:#171916;max-width:50%}
.scale-volume-message>span{font-size:8px;letter-spacing:.09em;display:block;margin-bottom:12px}
.scale-volume-message strong{font-size:clamp(22px,3vw,46px);font-weight:500;line-height:1.02;letter-spacing:-.04em;display:block}
.scale-scene-credit{z-index:4}
.module-left{left:31.362%;top:54.215%}
.module-right{left:55.954033%;top:55.415%}
.module-table{left:71.940867%;top:55.813%}
@media(max-width:760px){.scale-stops{gap:9px}.scale-stops button{font-size:9px}.scale-volume-message{max-width:80%;left:6%;top:7%}.scale-volume-message strong{font-size:28px}.scale-volume-message>span{font-size:7px}}

/* Photographic overhead fallback. The ready scene uses these same objects in 3D. */
.module-left{width:15.64485%}.module-right{width:10.32745%}.module-table{width:5.38348%}
.module-wide{width:15.82057%}.module-end{width:16.21608%}
.module-wide,.module-end{opacity:1}
.is-volume-ready .desk-plane{visibility:hidden}
.scale-volume-message{max-width:60%}

.module-left{left:24.177575%;top:54.08%}
.module-right{left:39.398775%;top:54.815%}
.module-table{left:49.29386%;top:55.065%}
.module-wide{left:24.089715%;top:77.166%}
.module-end{left:49.89196%;top:76.602%}

.desk-viewport{flex-shrink:0}

/* The table is the entire viewport surface, including at the low camera angle. */
.scale-scroll{background:#f7f7f4}
.scale-frame{padding-left:0;padding-right:0;justify-content:flex-start;padding-top:18px}
.scale-scene-heading,.scale-scene-caption,.scale-progress{width:calc(100% - 2 * var(--pad));max-width:1400px}
.desk-viewport{width:100%;max-width:none;aspect-ratio:auto;height:calc(100svh - var(--scale-header) - 230px);min-height:310px;background:#eae7df}
.desk-plane{inset:0;width:100%;height:100%;aspect-ratio:auto;transform:none}
.desk-background,.scale-volume-canvas{object-fit:cover;object-position:center;width:100%;height:100%}
.scale-volume{background:#eae7df}
.scale-scene-heading{margin-bottom:16px}
.scale-scene-caption{padding-top:20px;flex-shrink:0}
.scale-volume-message{top:6%;left:7%;max-width:45%}
.scale-volume-message strong{font-size:clamp(24px,3.2vw,48px)}
.scale-disclosure a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:760px){
 .desk-viewport{height:auto;aspect-ratio:1.08;min-height:0}
 .desk-background,.scale-volume-canvas{object-fit:cover;object-position:54% center}
 .scale-scene-heading,.scale-scene-caption{width:100%;padding-left:20px;padding-right:20px}
 .scale-volume-message{left:6%;top:7%;max-width:86%}
 .scale-volume-message strong{font-size:27px}
 .scale-progress{width:calc(100% - 40px)}
}
@media(max-height:650px) and (min-width:761px){.desk-viewport{height:auto;aspect-ratio:1.6;min-height:0}.scale-scene-heading,.scale-scene-caption,.scale-progress{max-width:1400px}}
@media(prefers-reduced-motion:reduce){.desk-viewport{height:auto;aspect-ratio:1.6;min-height:0}}
@media(min-width:761px) and (min-height:651px){
 .is-animated .scale-frame{padding:0}
 .is-animated .desk-viewport{height:100%;min-height:0}
 .is-animated .scale-scene-heading{position:absolute;top:24px;left:var(--pad);z-index:6;width:calc(100% - 2 * var(--pad));max-width:none;margin:0}
 .is-animated .scale-scene-caption{position:absolute;bottom:24px;left:var(--pad);z-index:6;width:calc(100% - 2 * var(--pad));max-width:1400px;padding-top:12px;padding-bottom:12px}
 .is-animated .scale-progress{position:absolute;bottom:18px;left:var(--pad);z-index:6}
 .is-animated .scale-volume-message{top:13%}
 .is-animated .scale-scene-credit{bottom:150px}
 .is-animated .desk-viewport::after{content:"";position:absolute;inset:auto 0 0;height:150px;background:linear-gradient(transparent,rgba(245,244,239,.93));z-index:4;pointer-events:none}
}
/* Scene titles have their own row; they cannot cross the hanger or tablet. */
@media(min-width:761px) and (min-height:651px){
 .is-animated .desk-viewport{position:absolute;inset:54px 0 0;height:calc(100% - 54px)}
 .is-animated .scale-scene-heading{top:17px}
}

/* A portrait phone retains the scroll scene when Safari expands its toolbars. */
@media(max-width:760px) and (min-height:480px){
 .is-animated .scale-frame{padding-bottom:18px;justify-content:flex-start;overflow:hidden}
 .is-animated .desk-viewport{flex:1;width:100%;height:auto;min-height:0;aspect-ratio:auto}
 .is-animated .scale-scene-caption{padding:16px 20px 12px}
 .is-animated .scale-phase h3{font-size:20px}.is-animated .scale-phase p{font-size:11px;line-height:1.5}
}
