/* Shared, quiet responses. Native links continue to own navigation. */
:where(a,button,select,input){-webkit-tap-highlight-color:transparent;touch-action:manipulation}
:where(a,button) svg{transition:transform 240ms cubic-bezier(.22,1,.36,1)}
:where(a,button):active svg{transform:translate(1px,-1px)}
:where(a,button,select,input):focus-visible{outline:2px solid currentColor;outline-offset:5px}
.project-picture:focus-visible{outline-offset:7px}.project-caption h3 a{display:inline-flex;align-items:center;min-height:44px}
@media(hover:hover) and (pointer:fine){
 :where(.opening-explore,.all-works,.package-cta,.contact-email,.contact-arrow,.brief-email,.project-caption>a,.case-next a,.case-header nav a):hover svg{transform:translate(3px,-3px)}
 .project-picture:hover img{transform:scale(1.015)}
 .intro-menu-toggle:hover,.contact-arrow:hover{background:#dbe7eb18}
}
.menu{overflow-y:auto;overscroll-behavior:contain;justify-content:flex-start}.menu>a{flex-shrink:0}.menu>a:first-child{margin-top:auto}.menu>a:last-child{margin-bottom:auto}
.project-brief{margin-top:clamp(48px,6vw,110px);padding-top:32px;border-top:1px solid var(--rule,#c3ced240)}
.project-brief h3{font-size:clamp(28px,2.6vw,46px);font-weight:200;letter-spacing:-.025em;margin:0 0 34px}
.brief-fields{display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px}
.brief-fields label{display:flex;flex-direction:column;gap:12px;font-size:14px;color:var(--muted)}
.brief-fields label span{font-size:12px;display:contents}
.brief-fields select,.brief-fields input{font:inherit;font-size:16px;line-height:1.5;color:var(--ink);color-scheme:dark;background:#152a3455;border:1px solid #d4dde152;border-radius:0;width:100%;min-width:0;height:54px;padding:12px 14px}
.brief-fields option{background:#203641;color:#f0f1ed}.brief-fields input::-webkit-date-and-time-value{text-align:left}
.brief-action{display:flex;align-items:center;gap:36px;margin-top:30px}.brief-email{display:inline-flex;align-items:center;gap:28px;min-height:52px;padding:12px 0;font-size:16px;border-bottom:1px solid #d4dde180;white-space:nowrap}.brief-action p{font-size:13px;line-height:1.6;color:var(--muted);max-width:350px}
/* Existing source images, with explicitly labelled crops rather than invented work. */
.case-detail-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:6vw;margin:0 8vw 110px;align-items:start}
.case-detail-grid .case-detail{margin:0;min-width:0}.case-detail-grid .case-detail:nth-child(even){padding-top:120px}
.case-detail-grid .detail-window{overflow:hidden;aspect-ratio:4/3;background:var(--panel)}
.case-detail-grid .case-detail:nth-child(even) .detail-window{aspect-ratio:4/5}
.case-detail-grid .detail-window img{display:block;width:100%;height:100%;min-height:0;object-fit:cover;object-position:var(--crop,50% 50%);transform:scale(var(--detail-scale,1));transform-origin:var(--crop,50% 50%)}
.case-detail-grid figcaption{font-size:13px;line-height:1.6;margin-top:16px}.case-production{border-top:1px solid var(--line);padding-top:22px!important;color:var(--ink)!important}
.case-page .case-hero{margin:18px 4vw 0;height:min(64vw,760px);min-height:420px}.case-page .case-hero-copy{left:4vw;right:4vw}
.case-header nav a{display:inline-flex;align-items:center;gap:10px;min-height:44px}.case-footer a{min-height:44px;display:flex;align-items:center}
@media(max-width:700px){
 .project-brief{margin-top:48px;padding-top:28px}.project-brief h3{font-size:29px;margin-bottom:26px}.brief-fields{grid-template-columns:1fr;gap:23px}.brief-fields label{gap:9px}.brief-fields select,.brief-fields input{height:54px}.brief-action{display:block;margin-top:22px}.brief-action p{margin-top:16px;max-width:340px}.brief-email{white-space:normal;gap:20px}
 .case-detail-grid{display:block;margin:0 7vw 70px}.case-detail-grid .case-detail{width:100%;margin-bottom:42px}.case-detail-grid .case-detail:nth-child(even){width:78%;margin-left:auto;padding-top:0}.case-page .case-hero{margin:12px 5vw 0;height:68svh;min-height:380px;max-height:650px}.case-page .case-hero-copy{left:6vw;right:6vw}.case-header{height:auto;min-height:88px;gap:16px;flex-wrap:wrap}.case-header nav{gap:16px}.case-header .brand img{max-width:150px}.case-copy{margin:70px 7vw}.case-copy h2{font-size:31px}.case-copy p{font-size:15px}.case-meta{margin-bottom:40px}.case-heading{font-size:clamp(55px,14vw,95px)}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}.project-picture:hover img{transform:none}}
/* Animate only masked environmental patches; the architecture is never transformed. */
.approved-scroll .opening-image{animation:none!important;transform:none!important}
.hero-atmosphere{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden}
.atmosphere-clouds{animation:anthe-cloud-drift 12s linear infinite alternate;animation-delay:-4s;animation-play-state:paused}
.atmosphere-leaves{transform-origin:865px 766px;animation:anthe-leaf-sway 3.6s ease-in-out infinite;animation-delay:-1.4s;animation-play-state:paused}
.atmosphere-grass{transform-origin:706px 915px;animation:anthe-grass-sway 2.8s ease-in-out infinite;animation-delay:-.7s;animation-play-state:paused}
.atmosphere-running .atmosphere-clouds,.atmosphere-running .atmosphere-leaves,.atmosphere-running .atmosphere-grass{animation-play-state:running}
.atmosphere-toggle{position:absolute;right:4.7%;bottom:19%;width:44px;height:44px;display:grid;place-items:center;border:1px solid #edf1eb66;background:#17283138;color:#f0f1ed;border-radius:50%;padding:10px}
.atmosphere-toggle[hidden]{display:none}.atmosphere-toggle svg{width:20px;height:20px}.atmosphere-play{display:none}.atmosphere-toggle[aria-pressed="true"] .atmosphere-play{display:block}.atmosphere-toggle[aria-pressed="true"] .atmosphere-pause{display:none}
@keyframes anthe-cloud-drift{from{transform:translate(0,0)}to{transform:translate(80px,-3px)}}
@keyframes anthe-leaf-sway{0%,100%{transform:skewX(-3deg) translateX(-1px)}45%{transform:skewX(3deg) translateX(1px)}72%{transform:skewX(.4deg)}}
@keyframes anthe-grass-sway{0%,100%{transform:skewX(-4deg)}50%{transform:skewX(4deg)}}
@media(max-width:700px){
 /* Match the photograph's 74% crop exactly. The SVG retains source-pixel geometry. */
 .hero-atmosphere{left:74%;right:auto;width:calc(clamp(590px,94svh,850px) * 1.5987903226);transform:translateX(-74%)}
 .atmosphere-toggle{right:6%;bottom:auto;top:60.5%;width:44px;height:44px}
}
@media(prefers-reduced-motion:reduce){.hero-atmosphere,.atmosphere-toggle{display:none!important}}