/* A paused camera tour, with scroll-led editorial motion throughout the page. */
:root{--scene-paper:#edf4f7;--scene-line:#c1d4dc;--header-height:89px}
html{scroll-padding-top:calc(var(--header-height) + 16px)}
html.lenis.lenis-smooth{scroll-behavior:auto!important}
section[id]{scroll-margin-top:0}
.hero h1 .hero-line{display:block;overflow:hidden;color:var(--ink);padding-bottom:.06em;margin-bottom:-.06em}
.hero h1 .hero-line>span{display:block;color:inherit}
.hero h1 .hero-line--accent{color:var(--accent)}
.hero-photo>button{border-radius:2px}
.hero-photo picture,.project-open picture{display:block}
.motion-ready .hero-photo img,.motion-ready .project-open img{transition:none}
.motion-line{display:block;overflow:hidden;padding-bottom:.09em;margin-bottom:-.09em}
.motion-line__text{display:block;transform-origin:left bottom}
@media(prefers-reduced-motion:no-preference){
 .hero-line>span{animation:line-arrive .85s var(--ease) both}
 .hero-line--accent>span{animation-delay:.12s}
 @keyframes line-arrive{from{transform:translateY(106%)}to{transform:translateY(0)}}
}
.backyard-story{background:var(--scene-paper);margin-top:70px;position:relative;isolation:isolate;overflow-anchor:none}
.story-stage{position:relative;padding:28px var(--gutter);max-width:1800px;margin:auto}
.story-topline{display:flex;align-items:center;justify-content:space-between;gap:24px;position:relative;z-index:3}
.story-topline>.eyebrow{font-size:10px;letter-spacing:.12em}
.story-skip{display:inline-flex;align-items:center;gap:20px;font-size:11px;font-weight:550;min-height:44px;white-space:nowrap}
.story-skip>span{font-size:21px;font-weight:400}
.story-visual{height:470px;position:relative;min-width:0;margin:25px 0 40px;display:flex;flex-direction:column;justify-content:center}
.story-photo-window{position:relative;flex:none;width:100%;aspect-ratio:1918/1080;max-height:calc(100% - 25px);overflow:hidden;background:var(--scene-paper);border-radius:3px}
.story-photo{position:absolute;inset:0;display:block;transform-origin:50% 65%}
.story-photo img,.story-video{width:100%;height:100%;object-fit:contain;object-position:center}
.story-video{position:absolute;inset:0;opacity:0;pointer-events:none}
.has-video .story-video{opacity:1}
.has-video .story-photo--progressive{opacity:0}
.scene-annotation{display:flex;justify-content:space-between;gap:10px;margin-top:8px;font-size:10px;line-height:1.5;color:var(--muted)}
.scene-cue{white-space:nowrap}
.backyard-story:not(.is-enhanced) .scene-cue,.is-still .scene-cue{display:none}
.backyard-story:not(.is-enhanced) .story-visual,.is-still .story-visual{height:auto}
.story-copy{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:35px;position:relative;z-index:2}
.story-chapter-number{font-size:11px;letter-spacing:.12em;display:block;font-variant-numeric:tabular-nums;color:var(--muted);margin-bottom:22px}
.story-chapter h2{font-size:clamp(32px,4.1vw,64px);line-height:1.035;letter-spacing:-.058em;font-weight:550}
.story-chapter h2 em{font-style:normal;color:var(--accent)}
.story-chapter p{font-size:14px;line-height:1.8;color:var(--muted);margin-top:25px;max-width:305px}
.story-chapter .text-link{font-size:12px;gap:22px;margin-top:15px}
.story-bottom{position:relative;z-index:3;margin-top:30px}
.story-controls{display:flex;align-items:center;gap:40px}
.story-chapters{display:flex;gap:24px;max-width:520px;flex:1}
.story-chapters button{flex:1;min-height:49px;text-align:left;color:var(--muted);font-size:10px;font-variant-numeric:tabular-nums;white-space:nowrap}
.story-chapters button>span:last-child{display:flex;gap:8px;margin-top:10px}
.story-chapters b{font-weight:500}
.story-track{display:block;height:2px;overflow:hidden;background:var(--scene-line)}
.story-track>i{display:block;height:100%;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left}
.story-chapters button[aria-current="step"]{color:var(--ink)}
.story-motion{font-size:11px;min-height:44px;margin-left:auto;white-space:nowrap;text-decoration:underline;text-underline-offset:5px}
.story-motion[aria-pressed="true"]{color:var(--accent)}
.story-disclosure{font-size:11px;color:var(--muted);line-height:1.5;margin-top:10px}
.backyard-story.is-enhanced:not(.is-still){height:250svh}
.is-enhanced:not(.is-still) .story-stage{position:sticky;top:var(--header-height);height:calc(100svh - var(--header-height));min-height:460px;max-height:960px;overflow:hidden}
.is-enhanced:not(.is-still) .story-visual{position:absolute;inset:90px var(--gutter) 112px 41%;height:auto;margin:0}
.is-enhanced:not(.is-still) .story-copy{position:absolute;left:var(--gutter);width:33%;top:30%;bottom:145px;display:block;pointer-events:none}
.is-enhanced:not(.is-still) .story-chapter{position:absolute;inset:0 auto auto 0;width:100%;visibility:hidden;opacity:0;transform:translateY(28px);transition:opacity .35s var(--ease),transform .6s var(--ease),visibility .35s}
.is-enhanced:not(.is-still) .story-chapter.is-current{visibility:visible;opacity:1;transform:translateY(0);pointer-events:auto}
.is-enhanced:not(.is-still) .story-bottom{position:absolute;bottom:22px;left:var(--gutter);right:var(--gutter);margin:0}
.is-still .story-chapter h2{font-size:clamp(30px,3vw,44px)}
.is-still .story-chapters{display:none}
.is-still .story-motion{margin-left:0}
.work-section{padding-top:110px}
.work-section .section-heading{align-items:flex-end}
.work-section .section-heading h2{font-size:clamp(36px,4.5vw,66px);letter-spacing:-.055em;line-height:1.03}
.work-title-accent{color:var(--accent)}
.work-section .section-heading>p{max-width:245px;font-size:13px}
.project-open{border-radius:2px}
.project-open img{transition:transform .8s var(--ease)}
.project:nth-child(even){padding-top:95px}
.project-grid{gap:60px 44px}
.project:first-child{grid-column:1/-1;width:100%;max-width:min(1000px,var(--feature-width,1000px));margin-left:auto}
.project:first-child .project-caption h3{font-size:26px}
.services-intro h2,.contact-copy h2{letter-spacing:-.055em}
@media(min-width:1550px){.story-chapter h2{font-size:68px}}
@media(max-width:1100px){.story-chapter h2{font-size:44px}.story-chapter p{font-size:13px;max-width:250px}.is-enhanced:not(.is-still) .story-copy{width:35%;top:28%}.project-grid{gap:45px 25px}.project:nth-child(even){padding-top:65px}}
@media(max-width:850px){
 :root{--header-height:75px}
 .story-stage{padding-top:20px}.story-topline>.eyebrow{font-size:8px;max-width:200px}
 .story-chapter h2{font-size:38px}.story-skip{gap:10px;font-size:10px}
 .is-enhanced:not(.is-still) .story-visual{inset:80px 24px 108px 43%}
 .is-enhanced:not(.is-still) .story-copy{width:36%;top:28%}
 .story-chapter p{max-width:235px}.story-copy{gap:20px}.story-chapters{max-width:400px}
 .work-section .section-heading>p{max-width:200px}
}
@media(max-width:640px){
 :root{--header-height:64px}
 .backyard-story{margin-top:30px}.backyard-story.is-enhanced:not(.is-still){height:240svh}
 .story-stage{padding:12px 20px 24px}.story-topline{gap:12px}
 .story-topline>.eyebrow{font-size:7px;max-width:145px;letter-spacing:.08em;line-height:1.6}
 .story-skip{font-size:9px;gap:5px;min-height:40px}.story-skip>span{font-size:17px}
 .is-enhanced:not(.is-still) .story-stage{min-height:470px;max-height:880px}
 .is-enhanced:not(.is-still) .story-visual{inset:58px 20px auto;height:calc(100% - 355px)}
 .story-photo-window{max-height:calc(100% - 19px)}
 .scene-annotation{font-size:10px}
 .is-enhanced:not(.is-still) .story-copy{top:auto;bottom:110px;left:20px;right:20px;width:auto;height:175px}
 .story-chapter-number{font-size:8px;letter-spacing:.1em;margin-bottom:9px}
 .story-chapter h2{font-size:38px;line-height:1.02}
 .story-chapter p{font-size:12px;line-height:1.6;margin-top:12px;max-width:100%}
 .story-chapter .text-link{font-size:11px;margin-top:4px;min-height:32px}
 .is-enhanced:not(.is-still) .story-bottom{left:20px;right:20px;bottom:15px}
 .story-controls{gap:18px;align-items:flex-end}.story-chapters{gap:12px;max-width:none}
 .story-chapters button{font-size:10px;min-height:44px}.story-chapters button>span:last-child{gap:5px;margin-top:8px}
 .story-motion{font-size:11px;min-height:44px}.story-disclosure{font-size:10px;margin-top:6px}
 .story-copy{display:block}.story-chapter{margin-bottom:25px}.is-enhanced:not(.is-still) .story-chapter{margin:0}
 .story-visual{height:380px;margin:15px 0 25px}.is-still .story-chapter h2{font-size:34px}.is-still .story-chapter p{max-width:100%}
 .work-section{padding-top:65px}.work-section .section-heading h2{font-size:36px}.work-section .section-heading>p{max-width:100%;font-size:13px}
 .project:nth-child(even){padding-top:0}.project:first-child .project-caption h3{font-size:18px}
}
@media(max-width:360px){
 .story-chapters b{display:none}.story-chapters button>span:last-child{font-size:10px}
 .is-enhanced:not(.is-still) .story-copy{bottom:102px;height:170px}
 .is-enhanced:not(.is-still) .story-visual{height:calc(100% - 335px)}
 .story-chapter h2{font-size:33px}.story-chapter p{font-size:11px}.story-chapter .text-link{font-size:10px}
 .story-skip{font-size:8px}.story-topline>.eyebrow{max-width:125px}.work-section .section-heading h2{font-size:32px}
}
@media(max-height:700px) and (min-width:641px){
 .is-enhanced:not(.is-still) .story-stage{min-height:430px;padding-top:10px}
 .is-enhanced:not(.is-still) .story-copy{top:24%}.story-chapter h2{font-size:40px}
 .story-chapter-number{margin-bottom:12px}.story-chapter p{font-size:12px;margin-top:17px}
 .is-enhanced:not(.is-still) .story-bottom{bottom:15px}
 .is-enhanced:not(.is-still) .story-visual{top:65px;bottom:95px}
}
@media(max-height:480px) and (min-width:641px){
 .is-enhanced:not(.is-still) .story-stage{min-height:0;padding-top:0}
 .is-enhanced:not(.is-still) .story-copy{top:19%;width:38%}.story-chapter-number{display:none}
 .story-chapter h2{font-size:28px}.story-chapter p{font-size:10px;line-height:1.5;margin-top:10px;max-width:280px}
 .story-chapter .text-link{font-size:10px;min-height:27px;margin-top:2px}
 .is-enhanced:not(.is-still) .story-visual{inset:48px 24px 75px 47%}
 .story-topline>.eyebrow{font-size:7px}.story-disclosure{font-size:8px;margin-top:0}
 .story-chapters button,.story-motion{min-height:36px}.scene-annotation{display:none}
 .story-photo-window{max-height:100%}.is-enhanced:not(.is-still) .story-bottom{bottom:8px}
}
@media(prefers-reduced-motion:reduce){
 .hero-line>span{animation:none}.story-chapter{transition:none!important}
 .motion-line__text{opacity:1!important;transform:none!important}
}