/* Media frames follow original proportions; no photo or video cropping. */
html{-webkit-text-size-adjust:100%}
img,video,svg{max-width:100%}
.hero-photo img,.couple img,.workshop img,.craft-detail img,.object img,.studio-intro img,.tile img,.split-photo img,.hero-art img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
.hero-photo,.couple,.workshop,.studio-intro figure{padding:8px}
.object img,.craft-detail img{padding:6px}
.film{align-self:start}
.film video{height:auto;aspect-ratio:var(--media-ratio,auto);object-fit:contain}
.team-track{align-items:flex-start}
.team-portrait{height:auto;background:transparent;display:block}
.team-portrait img{width:100%!important;height:auto!important;aspect-ratio:auto;object-fit:contain!important}
.team-caption{padding:18px 16px}
.simple-studio,.preview-column,.controls,.studio-card,.grid2>*{min-width:0}
#design{min-width:0;max-width:none}
.diagram-scroll{overscroll-behavior-x:contain}
.site-header nav a{justify-content:center;text-align:center}
.site-footer a,.closing a{overflow-wrap:anywhere;max-width:100%}
@media screen and (max-width:1024px){
 .chapter{padding:64px 0}.chapter-head,.story-head{gap:30px}
 .hero{gap:32px;padding-top:40px;padding-bottom:40px}
 .craft-detail{gap:32px;margin-top:40px}
 .studio-intro{padding:64px 0}.studio-intro>.shell{gap:32px;grid-template-columns:minmax(0,1fr) minmax(0,.8fr)}
 .simple-studio{grid-template-columns:1fr;max-width:800px}
 .preview-heading{flex-wrap:wrap}
 .team-portrait{height:auto}
}
@media screen and (max-width:700px){
 .shell{width:calc(100% - 32px)}
 .site-header{padding:14px 16px 8px}
 .site-header nav{gap:0 14px}.site-header nav a{font-size:11px;letter-spacing:0}
 .hero{grid-template-columns:1fr;gap:24px;padding-top:28px;padding-bottom:28px}
 .hero h1{font-size:clamp(40px,10vw,64px)}
 .hero-copy p{margin-top:18px}.hero-copy .kicker{margin-bottom:16px}
 .hero-footnote{margin-top:18px}.hero-photo{width:100%;max-width:360px;justify-self:center}
 .hero-photo figcaption{padding:12px 4px 4px}
 .chapter{padding:44px 0}.chapter-head,.story-head{grid-template-columns:1fr;gap:18px}
 .chapter-head{margin-bottom:24px}.couple,.workshop{margin-top:24px}
 .manifesto{padding:42px 16px}.manifesto h2{font-size:clamp(28px,7.5vw,38px)}
 .craft-detail{grid-template-columns:1fr;gap:22px;margin-top:28px}
 .craft-detail img{max-width:none}.craft-detail h3{margin:12px 0 18px}
 .films{grid-template-columns:1fr;max-width:380px;gap:24px}
 .films>.film:last-child:nth-child(odd){grid-column:auto;width:100%;justify-self:stretch}
 .film>div{padding:18px 10px 10px}.film h3{margin:12px 0 16px}
 .world .chapter-head{padding-top:44px}.world{padding-top:0}
 .objects{grid-template-columns:1fr;max-width:360px;gap:28px}
 .team-card{flex-basis:82%}.team-track{gap:14px}.team-heading{gap:12px}
 .team-portrait{height:auto}.team-section{margin-bottom:30px}
 .studio-intro{padding:44px 0}.studio-intro>.shell{grid-template-columns:1fr;gap:24px}
 .studio-intro figure{width:100%;max-width:360px}
 .closing{padding:44px 16px}.beliefs{padding:36px 0}
 .story-slider-controls{gap:12px;padding-bottom:18px}
 .story-tab{min-width:0;font-size:9px;letter-spacing:0;line-height:1.5}
 .story-tab span{display:block;margin:0 0 3px}
 .site-footer .shell{width:calc(100% - 32px)}
 .studio-title{padding:0 16px;margin-top:24px}.simple-studio{padding:0 12px;gap:12px}
 .studio-card{padding:14px}.view-tabs{flex-wrap:wrap}
}
@media screen and (max-width:380px){
 .two{grid-template-columns:1fr}.bead-board{grid-template-columns:repeat(4,minmax(0,1fr))}
 .hero-photo figcaption span{font-size:22px}.team-toolbar{gap:10px}
 .team-arrows button{width:44px;height:44px}
}
@media screen and (orientation:landscape) and (max-height:600px) and (min-width:701px){
 .hero{gap:28px;padding-top:28px;padding-bottom:28px}
 .hero h1{font-size:clamp(38px,5.5vw,62px)}
 .hero-photo{max-width:300px}.hero-copy p{margin-top:16px}
 .chapter{padding:44px 0}
 dialog{max-height:calc(100dvh - 16px)}
}