/* MHD logo geometry: 7.867 unit stroke, 9.739 unit inset, 52.825 unit arm.
   The open ends sit 17.607 / 78.31 = 22.5% along opposing edges.
   Use the logo's proportions with a fine editorial stroke, not its solid weight. */
.evidence-frame{--evidence-ink:#254b63;--evidence-stroke:1px;position:relative;isolation:isolate}
.evidence-linework{position:absolute;inset:-12px;width:calc(100% + 24px);height:calc(100% + 24px);overflow:visible;pointer-events:none;z-index:2;color:var(--evidence-ink)}
.evidence-linework path{stroke:currentColor;stroke-width:var(--evidence-stroke);vector-effect:non-scaling-stroke;stroke-linecap:square;stroke-linejoin:miter}
/* Hero: the gradient remains the field; the opposing corners supply structure. */
.hero .sketch-hero{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(40px,5vw,80px);align-items:center}
.hero .sketch-hero>div:first-child{width:100%;min-width:0}
.hero .hero-project{--evidence-ink:#c0ddeb;display:block;position:relative;top:auto;width:100%;padding:24px 16px 8px;margin:24px 0 0;border:0;border-radius:0;overflow:visible;background:none;box-shadow:none;align-self:center;justify-self:end;translate:none}
.hero .hero-project:hover{background:none;box-shadow:none;border:0;translate:none}
.hero .hero-project .hero-feature-media{height:auto;aspect-ratio:1.52;overflow:visible;border:0;border-radius:0;background:none;opacity:1}
.hero .hero-project .hero-feature-work>img.hero-feature-device{width:112%;max-width:none;height:auto;max-height:none;transform:none!important;filter:drop-shadow(0 18px 24px #06172940)}
.hero .hero-project .hero-feature-caption{position:relative;display:grid;grid-template-columns:1fr auto;gap:7px;padding:18px 0 12px;margin:0;border-top:1px solid #b9d9eb66}
.hero .hero-project .hero-feature-label{grid-column:1;font-size:9px;color:#c0ddeb}
.hero .hero-project .hero-feature-title{grid-column:1;font-size:15px;color:#eff7fc}
.hero .hero-project .hero-feature-arrow{display:block;grid-column:2;grid-row:1/3;width:22px;height:22px;margin:0;align-self:center;color:#c0ddeb}
.hero .hero-project .hero-feature-arrow svg{width:22px;height:22px}
.hero .hero-project .evidence-linework{inset:-12px -16px;width:calc(100% + 32px);height:calc(100% + 24px)}
.hero .hero-project .project-open{display:none}
/* Two equivalent page-width overviews, followed by readable evidence crops. */
.evidence-comparison{gap:48px;margin:40px 0 64px}
.evidence-view-label{margin:0 0 22px;color:var(--navy);font:500 13px/1.5 var(--mono);letter-spacing:.06em}
.evidence-comparison .case-image-link{height:auto!important;aspect-ratio:1 / 1.85;border:0;border-radius:0;overflow:hidden;background:#edf2f5}
.evidence-comparison .case-image-link img{width:100%;height:auto;max-width:100%;object-fit:initial;transform:none}
.evidence-comparison .case-figure figcaption{font-size:13px;line-height:1.6;padding-top:24px;display:block}
.evidence-comparison .case-figure figcaption>a{margin-top:12px}
.evidence-details{display:grid;gap:48px;margin:0 0 80px}
.evidence-detail{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(220px,1fr);gap:64px;align-items:center;margin:0}
.evidence-crop{aspect-ratio:var(--crop-ratio);min-width:0}
.evidence-crop-window{position:absolute;inset:0;overflow:hidden;background:#f4f4f0}
.evidence-crop-window img{display:block;width:100%;height:auto;max-width:none;transform:translateY(var(--crop-shift))}
.evidence-note{position:relative;display:flex;align-items:flex-start;gap:16px;color:var(--navy)}
.evidence-note:before{content:'';position:absolute;width:40px;height:20px;left:-52px;top:14px;border-top:var(--evidence-stroke,1px) solid #254b63;border-left:var(--evidence-stroke,1px) solid #254b63}
.evidence-number{font:500 11px/1.5 var(--mono);padding-top:4px;color:#365c77}
.evidence-note h3{font:500 clamp(17px,1.6vw,21px)/1.35 var(--mono);letter-spacing:-.035em;margin:0 0 12px}
.evidence-note p{font:400 15px/1.7 var(--sans);margin:0;color:#365c77}
@media(prefers-reduced-motion:no-preference){
 .hero .frame-draw{animation:evidence-frame-draw 1.2s cubic-bezier(.4,0,.2,1) .25s both}
 .evidence-detail.is-evidence-visible{animation:evidence-arrive .5s ease-out both}
}
@keyframes evidence-frame-draw{from{stroke-dasharray:1;stroke-dashoffset:1}to{stroke-dasharray:none;stroke-dashoffset:0}}
@keyframes evidence-arrive{from{opacity:.7;transform:translateY(6px)}to{opacity:1;transform:none}}
html[data-motion-paused] .evidence-frame *,html[data-motion-paused] .evidence-detail{animation:none!important;transition:none!important;stroke-dashoffset:0!important}
@media(max-width:1050px) and (min-width:701px){.hero .sketch-hero{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:36px}.hero .hero-project{padding:16px 8px 4px}.hero .hero-project .hero-feature-title{font-size:13px}}
@media(max-width:700px){
 .hero .sketch-hero{grid-template-columns:1fr;gap:36px}
 .hero .hero-project{display:none}
 .hero .hero-project .hero-feature-media{aspect-ratio:1.65}
 .hero .hero-project .hero-feature-title{font-size:14px}
 .evidence-comparison{grid-template-columns:1fr;gap:40px;margin:32px 0 48px}
 .evidence-comparison .case-image-link{aspect-ratio:1 / 1.65}
 .evidence-details{gap:36px;margin-bottom:56px}
 .evidence-detail{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:24px;align-items:center}
 .evidence-linework{inset:-7px;width:calc(100% + 14px);height:calc(100% + 14px)}
 .evidence-note{gap:7px}.evidence-number{font-size:9px;padding-top:2px}
 .evidence-note:before{width:15px;height:12px;left:-20px;top:9px}
 .evidence-note h3{font-size:13px;line-height:1.45;margin-bottom:8px}
 .evidence-note p{font-size:12px;line-height:1.6}
}
@media(prefers-reduced-motion:reduce){.evidence-frame *,.evidence-detail{animation:none!important;transition:none!important;stroke-dashoffset:0!important}}

#residential-before-after,#residential-evidence{scroll-margin-top:120px}