/* Responsive retrofit. Preserve Field's visual design and interaction model. */
html{scroll-padding-top:var(--nav-h)}section[id]{scroll-margin-top:var(--nav-h)}
.hero-copy,.about-copy,.category-heading,.category-list,.contact-copy,.maker-facts,.detail-section>div,.founder-detail>div,.section-heading>div{min-width:0}
input,select,textarea{max-width:100%;min-width:0}h1,h2,h3,.maker-link>span:first-child,.dealer-row h3{overflow-wrap:break-word}.detail-intro .display{max-width:min(100%,17ch)}.maker-facts dd{overflow-wrap:anywhere}.prose a{overflow-wrap:anywhere}
@media(max-width:1023px){
 .nav{grid-template-columns:auto 1fr}.nav__right{grid-column:2}.nav__menu,.sound-toggle,.menu-close{min-height:44px}.sound-toggle{padding:0 4px}
 .section-heading{align-items:start;gap:35px}.section-heading>.lead,.section-heading>div{flex:1}.section-heading>.h2{flex:1}
 .scroll-scenes .project-stops{overflow-x:auto;scrollbar-width:none;max-width:100%;gap:6px;padding:7px 0;justify-content:flex-start}.project-stops::-webkit-scrollbar{display:none}.scroll-scenes .project-stop{flex:0 0 44px;width:44px;height:44px;min-height:44px}
 .scroll-scenes .theatre-bottom{gap:25px}.project-scene-note{min-width:0}.scroll-scenes .project-stops{flex-shrink:1}
 .scroll-scenes .brand-controls .round-btn,.brand-controls .round-btn{height:44px;width:44px}.scroll-scenes .brand-controls{bottom:15px}
 .arc-pill{min-height:44px}.brand-explore,.scroll-scenes .brand-explore{min-height:44px}
 .detail-section,.maker-detail,.category-detail,.founder-detail{gap:5vw}.detail-notes article{gap:15px}.maker-facts dl>div{grid-template-columns:85px 1fr;gap:12px}
 .dealer-row{align-items:start}.dealer-row>span{flex-shrink:0}
}
@media(min-width:768px) and (max-width:1023px){
 .hero-copy{width:60%}.hero h1{font-size:clamp(44px,5.6vw,58px)}
 .category-layout,.contact{gap:5vw}.stats{gap:22px}.stats span{font-size:11px}
 .scroll-scenes .project-scene{width:72vw}.scroll-scenes .project-scene-copy{left:25px;right:25px}.scroll-scenes .project-scene-copy h3{font-size:clamp(34px,5vw,48px)}
 .scroll-scenes .theatre-bottom{align-items:start}.scroll-scenes .project-scene-note{max-width:36ch;flex:1}.scroll-scenes .project-stops{max-width:46%;flex:1}
 .partner-principles{gap:25px}.partner-principles h3{font-size:25px}
}
@media(max-width:767px){
 :root{--gutter:clamp(16px,5.33vw,24px)}
 .nav{padding-inline:var(--gutter)}.nav__right{gap:12px}.nav__brand{font-size:21px}
 form input,form select,form textarea{font-size:16px}form input::placeholder,form textarea::placeholder{font-size:14px}
 .maker-link{grid-template-columns:minmax(0,1fr) auto 16px;gap:10px}.maker-link small{max-width:85px;text-align:right}
 .category-heading h2{max-width:calc(100% - 95px)}.category-image{width:85px}.category-heading>.lead{max-width:29ch}
 .section-heading{display:block}.scroll-scenes .theatre-bottom{display:block}.scroll-scenes .project-stops{max-width:100%;width:100%;margin-top:3px}.scroll-scenes .project-scene-note{margin-bottom:8px}
 .scroll-scenes .brand-controls{gap:10px}.scroll-scenes .arc-hint{bottom:32px;max-width:calc(100% - 195px);font-size:8px;white-space:normal;text-align:right;line-height:1.5}
 .scroll-scenes .brand-meta{font-size:11px}.scroll-scenes .brand-description{font-size:12px}.scroll-scenes .brand-copy{max-width:100%}
 dialog{padding-top:80px;padding-bottom:25px;overflow-y:auto}dialog nav a{padding:12px 0;min-height:48px}dialog>p{margin-top:20px}
 .detail-intro{padding-top:95px}.detail-intro h1{font-size:clamp(36px,10.6vw,60px)}.detail-cta .h2{overflow-wrap:normal}
 .site-footer{column-gap:14px}.site-footer>*{min-width:0}.site-footer>a,.site-footer>button{min-height:34px;display:flex;align-items:center}.site-footer .back-top{justify-content:flex-end}
}
@media(max-width:359px){
 .nav__brand{font-size:19px}.nav__right{gap:8px}.sound-toggle{font-size:11px}.nav__menu{font-size:11px}
 .hero h1{font-size:40px}.hero .text-link{font-size:12px;gap:15px}.hero .kicker{font-size:10px}
 .scroll-scenes .brands-intro h2{font-size:30px}.scroll-scenes .brand-controls{left:16px}.scroll-scenes .arc-hint{right:16px;max-width:120px}
 .category-list>a{grid-template-columns:20px minmax(0,1fr) 16px;gap:12px}.category-list h3{font-size:25px}.stats strong{font-size:33px}
}
/* Short screens need document flow, not a clipped sticky presentation. */
.short-viewport .orb-journey{display:none}.short-viewport .brands-section{height:auto!important}.short-viewport .brands-stage{position:relative;top:auto;height:800px;--arc-top:210px}.short-viewport .brand-card{top:275px}.short-viewport .brands-intro h2{font-size:36px}.short-viewport .brand-controls{bottom:22px}.short-viewport .project-run{height:auto!important}.short-viewport .project-theatre{display:none}.short-viewport .projects-fallback{display:block}.short-viewport .hero{min-height:650px}.short-viewport .hero-copy{padding-bottom:50px}.short-viewport .project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.short-viewport .projects-fallback .project-card:first-child{grid-column:1/-1}.short-viewport .project-card h3{font-size:25px}
@media(max-width:599px){.short-viewport .project-grid{grid-template-columns:1fr}.short-viewport .brands-stage{height:760px}}
@media(prefers-reduced-motion:reduce){.project-stop,.brand-controls button{transition:none!important}}
.scroll-scenes .project-theatre{grid-template-columns:minmax(0,1fr)}.theatre-top,.theatre-bottom,.theatre-progress,.project-stops,.project-aperture{min-width:0}.scroll-scenes .theatre-bottom{max-width:100%;box-sizing:border-box}.scroll-scenes .project-stops{box-sizing:border-box}
/* Clip the perspective artwork without creating an internally scrollable stage. */
.scroll-scenes .project-theatre{overflow:clip}
@media(min-width:768px) and (max-width:1023px){.scroll-scenes .hero-orb{bottom:-23%}form input,form select,form textarea{font-size:16px}}
/* A quiet, tactile menu overlay in the same Field palette. */
html.menu-is-open,html.menu-is-open body{overflow:hidden}
#mobile-menu{padding:28px clamp(24px,6vw,60px) 30px;isolation:isolate;overscroll-behavior:contain;background:#e9ecea}
#mobile-menu::backdrop{background:rgba(35,39,42,.22)}
.menu-masthead{display:flex;align-items:center;justify-content:space-between;gap:25px;position:relative;z-index:2;margin-bottom:clamp(32px,7vh,75px)}
.menu-wordmark{font:300 23px/1 var(--f-display);letter-spacing:-.02em}
#mobile-menu .menu-close{position:static;display:flex;align-items:center;gap:12px;font-size:11px;min-height:44px;padding:0 0 0 12px}
.menu-close>span{display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;width:34px;height:34px;font:300 22px/1 var(--f-body)}
#mobile-menu .menu-eyebrow{margin:0 0 22px;color:var(--text-2);font-size:10px;letter-spacing:.14em}
#mobile-menu nav{position:relative;z-index:2}
#mobile-menu nav a{display:grid;grid-template-columns:22px minmax(0,1fr) 24px;align-items:center;gap:16px;padding:17px 0;min-height:64px;border-bottom:1px solid var(--line);transition:color .25s}
#mobile-menu nav a small{font:400 10px/1 var(--f-body);color:var(--text-2);align-self:center}
#mobile-menu nav a .menu-link-name{font:300 clamp(28px,5.1vw,42px)/1.1 var(--f-display);letter-spacing:-.02em}
#mobile-menu nav a .menu-arrow{font:300 19px/1 var(--f-body);color:var(--text-2);transition:transform .3s}
#mobile-menu nav a:hover{color:var(--lake)}#mobile-menu nav a:hover .menu-arrow{transform:translate(3px,-3px)}
.menu-footer{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-top:clamp(28px,6vh,60px);color:var(--text-2)}
.menu-footer p{font:300 20px/1.25 var(--f-display)}.menu-footer>span{font-size:10px;white-space:nowrap}
.menu-orb{position:absolute;z-index:-1;right:-100px;top:-95px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle at 38% 35%,#edece3 0%,#acbfba 32%,#7491b3 65%,#456487 100%);opacity:.14;pointer-events:none;filter:blur(2px)}
@media(max-width:359px){#mobile-menu{padding-inline:20px}.menu-wordmark{font-size:21px}#mobile-menu nav a{gap:12px;grid-template-columns:18px minmax(0,1fr) 20px}#mobile-menu nav a .menu-link-name{font-size:27px}.menu-footer p{font-size:18px}}
@media(max-height:700px){#mobile-menu{padding-top:16px;padding-bottom:24px}.menu-masthead{margin-bottom:22px}#mobile-menu .menu-eyebrow{margin-bottom:12px}#mobile-menu nav a{padding:13px 0;min-height:53px}#mobile-menu nav a .menu-link-name{font-size:29px}.menu-footer{margin-top:24px}}