/* Sections follow their content; viewport dimensions only limit image size. */
:root{--header-room:100px;--composition-room:calc(100svh - var(--header-room))}
html{scroll-padding-top:calc(var(--header-room) + 16px)}
[data-mask-arrival] .title-line{display:block;overflow:hidden;padding-bottom:.14em;margin-bottom:-.14em}
[data-mask-arrival] .title-line-text{display:block}
/* Shared line masks retain the Studio reveal's distance, timing, and stagger. */
[data-type-lines] .type-line{display:block;clip-path:inset(0 -.04em -.16em -.04em)}
[data-type-lines] .type-line-text{display:block}
[data-type-lines] .type-line-text>.motion-label{display:inline}
.home-selected{padding-top:0;padding-bottom:40px;scroll-margin-top:0}
.home-selected .home-section-heading{flex-direction:row}
.home-selected .home-section-heading h2{font-size:26px;line-height:1.1;letter-spacing:-.025em}
.home-selected .home-section-heading h2 span:last-child{margin-left:0}
.home-selected .home-section-heading{position:static;min-height:0;margin:0 0 24px;padding:16px 0;background:var(--paper);align-items:center;border-bottom:1px solid var(--stone)}
.home-selected .home-project-grid{row-gap:40px;column-gap:32px}
.home-selected .home-project{padding:0;min-height:0;display:block}
.home-selected .home-project-image{aspect-ratio:3/2;height:auto;min-height:0}
.home-selected .home-project-image img{width:100%;height:100%;object-fit:contain}
.home-selected .home-project-caption{padding-block:14px;min-height:0}
.home-selected .home-collection-link{margin-top:28px}

/* A quiet choice of destinations after the work, before the inquiry. */
.home-practice.section{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:32px;padding-block:32px 48px}
.home-practice h2{font-size:26px;line-height:1.1;letter-spacing:-.025em;padding-top:24px}
.home-practice-links{min-width:0;border-top:1px solid var(--stone)}
.home-practice-link{display:grid;grid-template-columns:minmax(100px,.55fr) minmax(0,1.45fr) auto;gap:24px;align-items:baseline;padding:24px 4px;border-bottom:1px solid var(--stone)}
.home-practice-title{font-size:26px;line-height:1.15;letter-spacing:-.025em}
.home-practice-description{font-size:var(--meta);line-height:1.5;max-width:36ch}
.home-practice-link:focus-visible{outline:2px solid var(--green);outline-offset:4px}
@media(max-width:1000px){
 .home-practice.section{grid-template-columns:1fr;gap:24px}
 .home-practice h2{padding-top:0}
}
@media(max-width:700px){
 .home-practice.section{padding-block:24px 32px}
 .home-practice h2{font-size:22px}
 .home-practice-link{grid-template-columns:minmax(0,1fr) auto;gap:8px 20px;padding:20px 4px}
 .home-practice-title{font-size:22px}
 .home-practice-description{grid-column:1;grid-row:2}
 .home-practice-link>.motion-arrow{grid-column:2;grid-row:1}
}

/* Studio arrives as a complete title, point of view, and photograph. */
@media(min-width:901px){
 .studio-opening{min-height:var(--composition-room);padding-block:24px;grid-template-rows:auto auto 1fr;align-content:center;row-gap:20px}
 .studio-opening>.home-section-label{grid-column:1/6;margin:0}
 .studio-opening h1{grid-column:1/6;grid-row:2;font-size:clamp(64px,7.4vw,120px);margin:0}
 .studio-opening h1>span:last-child{margin-left:8%}
 .studio-opening-copy{grid-column:1/6;grid-row:3;align-self:start;max-width:34ch;padding-top:4px}
 .studio-opening-copy span:first-child{font-size:clamp(23px,2vw,30px);margin-bottom:16px}
 .studio-opening-copy span:last-child{font-size:16px;max-width:38ch}
 .studio-opening-image{grid-column:7/-1;grid-row:1/4;align-self:center}
 .studio-opening-image img{max-height:calc(var(--composition-room) - 110px);object-fit:contain}
 .studio-person-editorial{min-height:var(--composition-room);padding-block:32px;row-gap:24px;align-content:center}
 .studio-person-editorial figure img{max-height:calc(var(--composition-room) - 100px);object-fit:contain}
 .studio-person-editorial .studio-biography h2{font-size:clamp(44px,4.8vw,72px)}
 .studio-person-editorial .studio-biography-copy{margin-top:24px}
 .studio-person-editorial .studio-biography-copy p{font-size:16px}
}
.studio-material{padding-block:48px;min-height:var(--composition-room)}
.studio-material figure{margin-top:0}
.studio-material img{max-height:calc(var(--composition-room) - 120px);object-fit:contain}
.service-spread{min-height:var(--composition-room);padding-block:32px;align-content:center}
.service-spread img{max-height:calc(var(--composition-room) - 80px);object-fit:contain}
.services-support{min-height:var(--composition-room);padding-block:40px;display:flex;flex-direction:column;justify-content:center}
.services-invitation,.page-continuation{padding-block:64px}

/* Compact contact: full form at ordinary desktop sizes; natural flow on phones. */
.contact-heading{padding-block:20px 24px;align-items:start}
.contact-heading h1{font-size:clamp(38px,4.2vw,62px);max-width:none;line-height:1.06}
.contact-heading>div>p{font-size:18px;margin-top:12px}
.contact-layout{padding-bottom:32px}
.contact-layout form,.contact-details{padding-top:16px}
.contact-layout form label{margin-bottom:16px}
.contact-layout .inquiry-heading{margin-bottom:16px}
.contact-layout input{margin-top:4px;padding-block:7px 9px;min-height:40px}
.contact-layout textarea{margin-top:6px;min-height:96px;height:96px}
.contact-layout .field-help{margin-top:-8px;margin-bottom:16px;font-size:13px}
.contact-layout .form-note{font-size:13px;max-width:40ch}
.contact-layout input,.contact-layout textarea{border-color:color-mix(in srgb,var(--ink) 50%,var(--paper))}
.contact-layout input:focus,.contact-layout textarea:focus{border-color:var(--green)}
.contact-layout .submit{min-height:48px;padding:12px 20px;border:1px solid var(--green);background:var(--green);color:var(--paper);justify-content:center}
.contact-layout .submit:enabled:focus-visible{outline:2px solid var(--green);outline-offset:4px}
.contact-details dl{margin-top:20px}
.contact-details dl>div{margin-bottom:18px}
.contact-first-conversation{margin-top:24px}
.contact-first-conversation h3{font-size:22px;margin-bottom:12px}

/* The introduction remains in reading flow; only the working study pins. */
.approach-process.section{padding-block:0 28px}
#ydc-process-graphics,#yg-scroll{overflow-anchor:none}
#ydc-process-graphics.scroll-mode #yg-scroll{margin-top:8px}
#ydc-process-graphics #yg-scroll{display:block}
#ydc-process-graphics:not(.scroll-mode) #yg-scroll-panel{position:static;padding-block:24px}
#ydc-process-graphics:not(.scroll-mode) :is(#yg-scroll-content,#yg-scroll-progress,.process-scroll-instruction){display:none}
.process-page-heading{display:grid;grid-template-columns:1fr 1fr;gap:12px 40px;padding:16px 0 20px;border-bottom:1px solid var(--stone)}
.process-page-heading>.home-section-label{grid-column:1/-1;padding:0}
.process-page-heading h1{font-size:clamp(32px,3.5vw,52px);line-height:1.03}
.process-page-heading>div{max-width:40ch;justify-self:end;align-self:end;font-size:16px}
.process-page-heading a{display:inline-flex;gap:20px;margin-top:12px;font-size:var(--meta);text-decoration:underline;text-underline-offset:5px}
.process-scroll-instruction{font-size:12px;color:var(--green);margin:10px 0 8px}
#yg-scroll-panel{padding:0 0 8px}
#ydc-process-graphics.process-pending>:is(.phase,.learn,hr){display:none}
#ydc-process-graphics.process-pending #yg-scroll-content{display:grid;min-height:340px;visibility:hidden}
#ydc-process-graphics.process-pending #yg-scroll-progress{visibility:hidden}
.process-playback{display:flex;align-items:center;gap:18px;min-height:52px;color:var(--green);font-size:12px}
.process-scroll-cue{display:inline-flex;align-items:center;gap:10px}
.scroll-cue-track{display:block;position:relative;width:14px;height:24px;border-block:1px solid var(--stone)}
.scroll-cue-track span{position:absolute;left:6px;top:4px;width:2px;height:7px;background:currentColor}
.process-choice-or{color:var(--muted-foreground)}
#yg-play{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 8px 0 0;border:0;background:none;color:inherit;font:inherit;cursor:pointer}
.process-play-icon{position:relative;display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--green);border-radius:50%}
.process-play-icon::before{content:'';width:0;height:0;border-block:4px solid transparent;border-left:6px solid currentColor;margin-left:2px}
.process-play-icon::after{content:'';position:absolute;inset:-1px;border:1px solid currentColor;border-radius:50%;opacity:0}
[data-playing=true] .process-play-icon::before{width:6px;height:8px;border:0;border-inline:2px solid currentColor;margin-left:0}
#yg-play:hover{text-decoration:underline;text-underline-offset:4px}
#yg-play:focus-visible{outline:2px solid var(--green);outline-offset:4px}
#yg-section-view{min-height:44px;padding:0;border:0;background:none;color:var(--green);font:inherit;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
#yg-section-view[hidden]{display:none}
#yg-section-view:focus-visible{outline:2px solid var(--green);outline-offset:4px}
.process-completion-controls{display:flex;align-items:center;justify-content:center;gap:36px;min-height:44px}
.process-completion-controls[hidden]{display:none}
.process-completion-controls a{display:inline-flex;align-items:center;gap:12px;min-height:44px}
.process-completion-controls a:hover{text-decoration:underline;text-underline-offset:4px}
.process-completion-controls a:focus-visible{outline:2px solid var(--green);outline-offset:4px}
#ydc-process-graphics.process-complete #yg-scroll-fragment{visibility:hidden}
#ydc-process-graphics.process-complete #yg-scroll-description{transform:translateY(calc(-1 * var(--completion-copy-lift,0px)))}
.process-complete .process-playback :is(.process-scroll-cue,.process-choice-or){display:none}
#ydc-process-graphics:not(.scroll-mode) .process-playback{display:none}
@media(prefers-reduced-motion:no-preference){
 .process-ready .scroll-cue-track span{animation:process-scroll-cue 1.6s ease-in-out .3s 2 both}
 .process-ready .process-play-icon::after{animation:process-play-ripple 1.8s ease-out .6s 1 both}
}
@keyframes process-scroll-cue{0%,100%{transform:translateY(0);opacity:.6}60%{transform:translateY(8px);opacity:1}}
@keyframes process-play-ripple{0%{transform:scale(1);opacity:.65}100%{transform:scale(1.9);opacity:0}}
/* One control rail; the drawing and chapter title carry the visual emphasis. */
#ydc-process-graphics{--ydc-ink:color-mix(in srgb,var(--ink) 92%,var(--paper));--ydc-faint:color-mix(in srgb,var(--ink) 38%,var(--paper))}
.process-playback .process-moment-controls{margin-left:auto;gap:20px}
.process-playback .process-moment-controls button{font-size:12px;color:var(--ink)}
.process-playback .process-moment-controls button:disabled{opacity:.3}
.process-scroll-cue span{margin-left:0}
#ydc-process-graphics .process-position{min-height:22px}
#ydc-process-graphics #yg-scroll-copy h2{font-size:clamp(30px,3vw,44px)}
#ydc-process-graphics #yg-scroll-content{grid-template-columns:minmax(0,.8fr) minmax(0,2fr)}
#yg-scroll-visual path{vector-effect:non-scaling-stroke}
@media(max-width:700px){
 #ydc-process-graphics #yg-scroll-content{grid-template-columns:1fr}
 #ydc-process-graphics #yg-scroll-copy h2{font-size:28px}
 .process-playback{gap:12px}
 .process-playback .process-moment-controls{gap:14px}
 .process-playback .process-moment-controls button{min-width:44px;min-height:44px}
}
#ydc-process-graphics.process-compact #yg-scroll-copy .fragment,#ydc-process-graphics.process-compact #yg-caption-primary{display:none}
.process-mobile-introduction:empty{display:none}
.process-mobile-introduction{padding-bottom:16px}
@media(max-width:700px){
 .process-mobile-introduction{padding-bottom:16px}
 #ydc-process-graphics:not(.scroll-mode) .process-mobile-introduction .process-scroll-instruction{display:none}
 #ydc-process-graphics.scroll-mode #yg-scroll-progress li button{min-height:44px}
}
#yg-scroll-content{grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:40px}
#yg-scroll-copy{min-height:0}
#yg-scroll-copy h2{font-size:clamp(32px,3.6vw,54px);margin:8px 0 12px}
#ydc-process-graphics #yg-scroll-copy .fragment{font-size:17px;margin-bottom:10px}
#ydc-process-graphics #yg-scroll-copy .explanation{font-size:16px;line-height:1.45}
#yg-scroll-caption{min-height:44px;font-size:13px;line-height:1.4}
#yg-scroll-progress{margin-top:12px;gap:16px}
.process-context{border-block:1px solid var(--stone);padding:18px 0;font-size:16px}
.process-context summary{cursor:pointer;font-size:var(--meta);min-height:28px}
.process-context p{max-width:72ch;margin-top:16px}
.approach-principles.section{padding-block:40px 48px}
.principles-heading{grid-template-columns:1fr;gap:16px;margin-bottom:32px}
.approach-principles #principles-title{font-size:32px}
.principles-spread{display:block}
.approach-principles ul{grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}
.approach-principles h3{font-size:21px;color:var(--ink)}
.approach-principles li p{font-size:15px}

@media(max-width:900px){
 .studio-opening-image{scroll-margin-top:var(--header-room);padding-block:20px}
 .studio-opening-image img{max-height:calc(var(--composition-room) - 100px);object-fit:contain}
 .studio-person-editorial figure img{max-height:calc(var(--composition-room) - 120px);object-fit:contain}
}
@media(max-width:700px){
 .home-selected .home-section-heading{gap:12px}
 .home-selected .home-section-heading h2{font-size:22px}
 .home-selected .home-section-heading .text-link{font-size:12px;gap:8px}
 .home-selected .home-project-image{aspect-ratio:auto;height:auto;min-height:0}
 .home-selected .home-project-image img{height:auto;max-height:none;object-fit:contain}
 .home-selected .home-project-grid{gap:28px}
 .studio-opening{padding-top:24px}
 .studio-person-editorial{padding-block:28px;gap:24px}
 .studio-person-editorial figure{width:100%}
 .studio-person-editorial figure,.studio-biography{scroll-margin-top:var(--header-room)}
 .studio-material{padding-block:32px;min-height:0}
 .service-spread{gap:16px;padding-block:24px;min-height:var(--composition-room)}
 .service-spread figure img{max-height:calc(var(--composition-room) - 260px);min-height:100px}
 .service-spread>p{font-size:16px;line-height:1.5}
 .services-support{padding-block:32px}
 .services-invitation,.page-continuation{padding-block:40px}
 .contact-heading{gap:10px;padding-block:16px 20px}
 .contact-heading h1{font-size:38px;max-width:15ch}
 .contact-heading>div>p{font-size:16px;margin-top:12px}
 .contact-layout{gap:28px;padding-bottom:32px}
 .contact-layout .form-row{grid-template-columns:1fr;gap:0}
 .contact-layout form label{font-size:13px}
 .contact-layout input,.contact-layout textarea{font-size:16px}
 .contact-layout .inquiry-heading h2{font-size:22px}
 .contact-layout .inquiry-footer{gap:16px}
 .contact-layout .form-note{max-width:28ch;font-size:12px}
 .contact-layout .submit{gap:10px;width:100%}
 .process-page-heading{grid-template-columns:1fr;gap:8px;padding:8px 0 12px}
 .process-page-heading h1{font-size:30px}
 .process-page-heading>div{display:flex;align-items:baseline;justify-content:space-between;justify-self:stretch;max-width:none}
 .process-page-heading>div>p{display:none}
 .process-page-heading a{margin-top:2px;font-size:12px;gap:12px}
 .process-scroll-instruction{margin:8px 0 4px;font-size:11px}
 #yg-scroll-content{grid-template-columns:1fr;gap:8px}
 #yg-scroll-copy h2{font-size:28px;margin:4px 0 8px}
 #ydc-process-graphics #yg-scroll-copy .fragment{font-size:15px;margin-bottom:6px}
 #ydc-process-graphics #yg-scroll-copy .explanation{font-size:14px;line-height:1.4}
 .process-position{min-height:32px;max-width:none}
 .process-moment-controls button{min-height:36px;padding-block:4px}
 #yg-scroll-progress{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 16px;margin-top:4px}
 #yg-scroll-progress li button{min-height:36px;padding:8px 0 4px}
 #yg-scroll-caption{font-size:12px;min-height:44px}
 .approach-principles ul{grid-template-columns:1fr 1fr;gap:24px}
 .approach-principles h3{font-size:19px}
 .approach-principles li p{font-size:14px}
}
@media(max-width:360px){.contact-layout .form-row{grid-template-columns:1fr}.approach-principles ul{grid-template-columns:1fr}}

/* Work: frame each cover with its identity within a typical desktop opening. */
@media(min-width:701px){
 .work-heading{padding-block:12px}
 .work-heading h1{font-size:clamp(64px,6vw,88px)}
 .portfolio:has(.portfolio-rail) .portfolio-tools{padding-block:0;margin-bottom:16px}
 .portfolio-rail:not(.is-index) .portfolio-caption{padding-top:16px}
}

/* Reserve the status line so a successful availability check does not move fields. */
.contact-layout .delivery-note{min-height:20px;margin:0 0 12px;padding:0;border:0;font-size:13px;line-height:20px}
.contact-layout .delivery-note[hidden]{display:block!important;visibility:hidden}