/* Only the hero picture becomes a short, reversible construction story. */
.hero-journey{position:relative;isolation:isolate;overflow-anchor:none}
.hero-scroll .hero-journey{height:calc(var(--hero-stage-height,680px) + clamp(490px,86svh,860px))}
.hero-scroll .hero-journey>.hero{position:sticky;top:var(--hero-sticky-top,var(--header-height));background:white}
.hero-journey .hero{padding-top:clamp(28px,3.6vw,52px);padding-bottom:32px;column-gap:clamp(28px,4vw,60px)}
.hero-journey .hero-copy{padding-block:0}
.hero-journey .hero h1{font-size:clamp(38px,4.9vw,68px)}
.hero-journey .hero-actions{margin-top:24px;gap:10px}
.hero-transformation{align-self:center}
.hero-transform-frame{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background:var(--paper);border-radius:3px;isolation:isolate}
.hero-transformation .hero-transform-frame img,.hero-transform-layer,.hero-transform-video{position:absolute;inset:0;width:100%;height:100%;max-height:none;aspect-ratio:auto;object-fit:cover!important;object-position:center!important;transform:none!important;transition:none!important}
.hero-transform-layer{background-size:cover;background-position:center;opacity:0;pointer-events:none}
.hero-transform-lawn{z-index:1}.hero-transform-build{z-index:2}.hero-transform-finish{z-index:3}
.hero-transform-video{z-index:4;opacity:0;pointer-events:none}
.hero-transformation.has-video .hero-transform-video{opacity:1}
.hero-photo .hero-transform-caption{display:block;margin-top:14px}
.hero-transform-heading{display:flex;justify-content:space-between;align-items:baseline;gap:15px}
.hero-transform-heading strong{font-size:14px;line-height:1.45;font-weight:550;letter-spacing:-.02em;color:var(--ink)}
.hero-transform-heading>[data-transform-cue]{font-size:11px;white-space:nowrap}
.hero-transform-controls{display:flex;gap:18px;margin-top:9px}
.hero-transform-controls[hidden]{display:flex!important;visibility:hidden}
.hero-transform-controls button{flex:1;min-width:0;text-align:left;min-height:46px;font-size:12px;color:var(--muted);padding-block:5px}
.transform-track{display:block;height:2px;background:var(--line);overflow:hidden}
.transform-track i{display:block;height:100%;background:var(--accent);transform:scaleX(0);transform-origin:left}
.hero-transform-controls button>span:last-child{display:flex;gap:8px;margin-top:8px}
.hero-transform-controls b{font-weight:450;font-size:10px;font-variant-numeric:tabular-nums}
.hero-transform-controls button[aria-pressed=true]{color:var(--accent);font-weight:650}
.hero-transform-footnote{display:flex;align-items:center;gap:12px;justify-content:space-between;font-size:10px;line-height:1.5;margin-top:5px}
.hero-transform-footnote a{color:var(--ink);min-height:24px;display:inline-flex;align-items:center}
.hero-journey .hero-work-link{gap:12px}
@media(max-width:900px) and (min-width:641px){
 .hero-journey .hero{grid-template-columns:.82fr 1.18fr}
 .hero-journey .hero h1{font-size:clamp(30px,4.3vw,39px)}
 .hero-journey .hero-description{font-size:13px;line-height:1.6}
 .hero-transform-heading strong{font-size:12px}.hero-transform-heading>[data-transform-cue]{font-size:10px}
 .hero-transform-controls{gap:12px}.hero-transform-controls button{font-size:11px}
}
@media(max-width:640px){
 .hero-journey .hero{gap:12px;padding-top:24px;padding-bottom:25px}
 .hero-transformation{align-self:stretch}
 .hero-journey .hero h1{font-size:clamp(30px,8.7vw,42px)}
 .hero-journey .hero-actions{margin-top:0}
 .hero-transform-frame{aspect-ratio:16/9}
 .hero-photo .hero-transform-caption{margin-top:7px}
 .hero-transform-heading strong{display:none}
 .hero-transform-heading>[data-transform-cue]{font-size:11px}
 .hero-transform-controls{margin-top:3px;gap:12px}
 .hero-transform-controls button{font-size:11px;min-height:44px;padding-block:5px}
 .hero-transform-controls button>span:last-child{margin-top:5px;gap:5px}
 .hero-transform-controls b{font-size:9px}
 .hero-transform-footnote{font-size:10px;margin-top:0;line-height:1.4}
 .hero-journey .hero-description{margin-top:0}
}
@media(max-width:360px){
 .hero-journey .hero{gap:8px;padding-top:16px}
 .hero-transform-heading>[data-transform-cue]{font-size:10px}
 .hero-transform-footnote{font-size:9px}
 .hero-journey .hero-description{font-size:12px;line-height:1.5}
}
@media(max-height:560px) and (min-width:641px){
 .hero-journey .hero{grid-template-columns:.9fr 1.1fr;column-gap:24px;padding-block:16px}
 .hero-journey .hero h1{font-size:clamp(28px,3.7vw,38px)}
 .hero-journey .hero-eyebrow{font-size:8px;margin-bottom:10px}
 .hero-journey .hero-description{font-size:12px;line-height:1.45;margin-top:12px;max-width:36ch}
 .hero-journey .hero-actions{margin-top:12px;gap:3px}
 .hero-journey .hero-actions .button{min-height:44px;font-size:11px;padding:10px 14px}
 .hero-journey .hero-work-link{font-size:11px;min-height:26px}
 .hero-journey .hero-trust{font-size:9px;margin-top:8px}
 .hero-transform-frame{max-width:calc((100svh - var(--header-height) - 110px)*1.777778);margin-inline:auto}
 .hero-photo .hero-transform-caption{margin-top:7px}
 .hero-transform-heading{display:none}
 .hero-transform-controls{margin-top:0}
 .hero-transform-footnote{margin-top:0;font-size:9px}
}
@media(prefers-reduced-motion:reduce){.hero-scroll .hero-journey{height:auto}.hero-scroll .hero-journey>.hero{position:relative;top:auto}}