.interior-motion,.interior-poster{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;filter:none}
.interior-motion:not(.ready){visibility:hidden}
.interior-motion.ready + .interior-poster{visibility:hidden}
.static-journey .interior-motion,.static-journey .interior-poster{display:none}
@media(prefers-reduced-motion:reduce){.static-journey .contact{height:auto!important}.static-journey .contact .contact-pin{position:relative;top:auto}}
/* Fixed copy columns and a clipped thumbnail viewport, driven by vertical progress. */
#casa.is-minimized .byat-window{height:clamp(96px,10svh,120px)}
#casa.is-minimized .interior-panel{padding:12px 64px 12px 20px}
#casa.is-minimized .interior-mini{grid-template-columns:clamp(145px,12vw,190px) minmax(160px,1fr) minmax(280px,1.4fr);gap:clamp(16px,2vw,28px)}
.interior-mini-title{font-size:clamp(16px,1.4vw,21px);line-height:1.2}
.interior-mini-body{font-size:clamp(14px,1vw,16px);line-height:1.45}
.interior-mini-thumbs{justify-content:flex-start;overflow:hidden;scrollbar-width:none;padding:3px;gap:10px;min-width:0;isolation:isolate}
.interior-mini-thumbs::-webkit-scrollbar{display:none}
.interior-mini-thumbs button{flex:none;height:100%;max-height:100%;width:auto;min-width:0}
.interior-mini-title,.interior-mini-body{min-width:0}
.byat-panel .byat-copy{justify-content:safe center;overscroll-behavior-y:contain;scrollbar-width:thin}
.byat-panel .byat-copy>*{flex-shrink:0}
.byat-panel .byat-copy h2,.butera-track .byat-copy h3{font-size:var(--ds-heading-size-base-9);line-height:var(--ds-heading-line-base-5);}
.byat-panel .byat-copy p{font-size:var(--ds-body-size-base-5);line-height:var(--ds-body-line-base-3);}
.byat-panel .byat-copy .render-kicker{font-size:var(--ds-caption-size-base-1);line-height:var(--ds-caption-line-base-1);letter-spacing:var(--ds-caption-tracking-base-1);}
.photo-gallery{min-width:0;min-height:0}
.photo-stage .photo-slide{object-fit:contain}
.exterior-panel .photo-stage .photo-slide{object-fit:contain}
.contact-copy,.contact-path,.contact-paths,.contact footer>*{min-width:0;max-width:100%;overflow-wrap:anywhere}
.contact .contact-paths{grid-template-columns:repeat(2,minmax(0,1fr))}
.contact{height:calc(var(--contact-content-height,100svh) + 90svh)!important}
.contact .contact-pin{height:auto;min-height:100svh;flex-wrap:nowrap;top:min(0px,calc(100svh - var(--contact-content-height,100svh)))}
.approach-copy h2{font-size:var(--ds-heading-size-base-10);}
.approach-copy .body-copy{font-size:var(--ds-body-size-base-6);line-height:var(--ds-body-line-base-2);}
@media(min-width:1800px){
 .byat-panel .byat-copy{max-width:620px}
 .exterior-track .byat-panel,.byat-track .byat-panel,.butera-track .byat-panel{grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:var(--ds-box-spacing-desktop-1);}
 .photo-gallery{width:100%;max-width:1250px;justify-self:center}
}
@media(max-width:1100px){
 :root{--page-margin:clamp(20px,4vw,44px)}
 .site-header .header-timeline a,.site-header .header-timeline a:nth-child(n){font-size:12px}
 .site-header .timeline-label{overflow-wrap:normal;line-height:1.2}
 #casa.is-minimized .interior-mini{grid-template-columns:155px minmax(0,1fr);gap:18px}
 .interior-mini-body{display:none}
 .byat-panel .byat-copy{gap:var(--ds-box-spacing-responsive-8);}
 .byat-panel .byat-copy h2,.butera-track .byat-copy h3{font-size:var(--ds-heading-size-responsive-6);}
 .byat-panel .byat-copy p{font-size:var(--ds-body-size-responsive-5);line-height:var(--ds-body-line-responsive-2);}
 .approach-pin{gap:32px}
}
@media(max-width:700px),(max-width:1100px) and (max-aspect-ratio:1/1){
 :root{--panel-bottom:64px}
 .exterior-track .byat-panel,.byat-track .byat-panel,.butera-track .byat-panel{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,auto) minmax(0,1fr);gap:var(--ds-box-spacing-mobile-12);padding:var(--ds-box-spacing-mobile-13);}
 .byat-panel .byat-copy{grid-column:1;grid-row:1;align-self:start;justify-content:flex-start;max-height:min(42svh,360px);overflow:auto;gap:var(--ds-box-spacing-mobile-14);}
 .byat-panel .byat-copy h2,.butera-track .byat-copy h3{font-size:var(--ds-heading-size-mobile-11);}
 .byat-panel .byat-copy p{font-size:var(--ds-body-size-mobile-5);line-height:var(--ds-body-line-mobile-4);margin:0}
 .byat-panel .photo-gallery,.byat-panel .letter-preview{grid-column:1;grid-row:2;align-self:stretch;min-height:0;gap:var(--ds-box-spacing-mobile-15);justify-content:center}
 .byat-panel .photo-stage{height:calc(100% - 36px);max-height:calc(100% - 36px);aspect-ratio:auto;width:100%}
 .byat-panel .photo-slide{object-fit:contain}
 .byat-panel .letter-preview img{object-fit:contain;max-height:100%}
 .approach-pin{display:flex;flex-direction:column;height:auto;gap:28px;padding-bottom:60px}
 .approach-image{width:100%;height:auto;aspect-ratio:4/3;max-height:50svh;min-height:0}
 .approach-copy{width:100%}
 .approach-copy h2{font-size:var(--ds-heading-size-mobile-12);}
 .approach-copy .body-copy{font-size:var(--ds-body-size-mobile-5);line-height:var(--ds-body-line-mobile-5);}
}
@media(max-width:600px){
 :root{--page-margin:16px;--panel-top:148px;--panel-bottom:64px}
 .site-header,.site-header.solid,.site-header.light,.site-header.solid.light{top:10px;min-height:0;padding:8px 12px;border-radius:calc(var(--brand-radius) * 0.8333333333333334)}
 .site-header .header-timeline{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px 6px}
 .site-header .header-timeline a,.site-header .header-timeline a:nth-child(n){display:flex;align-items:center;justify-content:center;min-height:36px;padding:4px 2px;font-size:12px;line-height:1.15;border-radius:7px}
 .site-header .timeline-label{min-height:0;max-width:100%;white-space:normal;letter-spacing:0}
 .site-header .timeline-home .brand-logo{width:26px;height:26px}
 .site-header .timeline-dot,.site-header .timeline-line{display:none}
 .site-header [aria-current=location]{background:color-mix(in srgb, var(--brand-white) 14.118%, transparent);color:var(--brand-white)}
 .timeline-projects{grid-column:auto;grid-row:auto}
 .projects-menu{right:50%;top:100%;width:260px;transform:translate(50%,4px)}
 .timeline-projects.menu-open .projects-menu{transform:translateX(50%)}
 .site-header .header-timeline .projects-menu a{min-height:44px;justify-content:flex-start;font-size:14px}
 .journey-hero .journey-pin{padding:var(--panel-top) var(--page-margin) 64px;align-items:center}
 .hero-glass{display:grid;grid-template-columns:minmax(0,1fr) clamp(88px,26vw,112px);gap:var(--ds-box-spacing-mobile-16);padding:var(--ds-box-spacing-mobile-17);scale:none;border-radius:calc(var(--brand-radius) * 0.9166666666666666);width:100%;max-width:100%}
 .hero-copy{display:contents}
 .hero-glass h1{grid-column:1;grid-row:1;font-size:var(--ds-display-size-mobile-5);line-height:var(--ds-display-line-mobile-2);letter-spacing:var(--ds-display-tracking-mobile-1);align-self:center}
 .hero-profile{grid-column:2;grid-row:1;width:100%;height:auto;max-width:100%;order:0}
 .hero-intro{grid-column:1/-1;grid-row:2;margin:0;font-size:var(--ds-body-size-mobile-6);line-height:var(--ds-body-line-mobile-6);max-width:none}
 .exterior-track .byat-panel,.byat-track .byat-panel,.butera-track .byat-panel{padding:var(--ds-box-spacing-mobile-7);gap:var(--ds-box-spacing-mobile-6);border-radius:calc(var(--brand-radius) * 0.9166666666666666)}
 .byat-panel .byat-copy h2,.butera-track .byat-copy h3{font-size:var(--ds-heading-size-mobile-13);}
 .byat-panel .byat-copy p{font-size:var(--ds-body-size-mobile-7);line-height:var(--ds-body-line-mobile-6);}
 .byat-panel .byat-copy .render-kicker{font-size:var(--ds-caption-size-mobile-4);}
 #casa.is-minimized .byat-window{height:84px}
 #casa.is-minimized .interior-panel{padding:10px 46px 10px 12px;border-radius:18px}
 #casa.is-minimized .interior-mini{grid-template-columns:110px minmax(0,1fr);gap:10px}
 .interior-mini-title{font-size:14px;line-height:1.22}
 .interior-mini-thumbs{gap:8px}
 .interior-mini-thumbs button{height:100%;max-height:100%}
 .interior-minimize{width:30px;height:30px;right:8px}
 .project-intro,.project-outro{padding:22px;overflow:auto;overscroll-behavior:contain}
 #citta .project-intro h3{font-size:28px}
 #citta .project-intro>p{font-size:14px;line-height:1.5}
 #citta .copy-capacity{display:none}
 .furniture-lead{padding:var(--ds-box-spacing-mobile-18);gap:var(--ds-box-spacing-mobile-19);overflow:auto}
 .furniture-lead h2{font-size:var(--ds-heading-size-mobile-14);}
 .furniture-lead p{font-size:var(--ds-body-size-mobile-6);line-height:var(--ds-body-line-mobile-6);}
 .project-card-label{font-size:18px}
 .contact .contact-pin{padding-top:var(--panel-top);gap:20px}
 .contact-copy h2{font-size:clamp(30px,8vw,42px)}
 .contact .contact-paths{grid-template-columns:minmax(0,1fr);gap:var(--ds-box-spacing-mobile-6);}
 .contact-paths h3{font-size:var(--ds-heading-size-mobile-5);}
 .contact-paths p{font-size:var(--ds-body-size-mobile-7);}
 .contact footer{grid-template-columns:1fr;gap:14px;overflow-wrap:anywhere;font-size:13px}
 .contact footer a:last-child{justify-self:start}
 .project-dialog{width:calc(100vw - 24px);height:86dvh;padding:62px 12px 82px}
 .dialog-thumbs{scrollbar-width:none}
 .dialog-thumbs::-webkit-scrollbar{display:none}
 #skip-animation{bottom:56px;right:var(--page-margin);font-size:13px}
 #devmode{max-width:calc(100vw - 24px);width:auto;right:12px;bottom:8px}
 #devmode:not([open]) summary{font-size:10px;padding:7px 10px}
 #devmode:not([open]) summary span{display:none}
}
@media(max-height:700px) and (min-width:601px){
 :root{--panel-top:108px;--panel-bottom:40px}
 .site-header,.site-header.solid,.site-header.light,.site-header.solid.light{top:10px;min-height:70px;padding:8px 14px}
 .site-header .header-timeline a,.site-header .header-timeline a:nth-child(n){min-height:50px;font-size:11px}
 .byat-panel .byat-copy{gap:var(--ds-box-spacing-desktop-2);justify-content:flex-start}
 .byat-panel .byat-copy h2,.butera-track .byat-copy h3{font-size:var(--ds-heading-size-desktop-1);}
 .byat-panel .byat-copy p{font-size:var(--ds-body-size-desktop-1);line-height:var(--ds-body-line-desktop-1);}
 .hero-glass h1{font-size:var(--ds-display-size-desktop-1);}
 .hero-intro{font-size:var(--ds-body-size-desktop-2);line-height:var(--ds-body-line-desktop-1);}
 .hero-profile{width:clamp(120px,24vh,210px)}
 #skip-animation{bottom:58px}
}
@media(max-width:600px) and (max-height:740px){
 .hero-glass{padding:var(--ds-box-spacing-mobile-20);gap:var(--ds-box-spacing-mobile-21);}
 .hero-intro{font-size:var(--ds-body-size-mobile-8);}
 .byat-panel .byat-copy{max-height:36svh}
}
