/* Only the home page loads these rules. Dark/ochre branding stays unchanged. */
.hero-photo { background:var(--paper); }
.hero-photo img,.portfolio-cover img { object-fit:contain; object-position:50% 50%; }
/* Zooming a carefully framed image would reintroduce edge crops. */
.portfolio-card:hover img { transform:none; }
.portfolio-cover { background:var(--paper); }
/* Dark gradient keeps navigation readable without blurring the photographs. */
body>header { background:none; isolation:isolate; border-bottom:0; }
body>header::before {
 content:""; position:absolute; inset:0 0 -40px; z-index:-1; pointer-events:none;
 background:linear-gradient(to bottom,rgba(16,18,17,.88),rgba(16,18,17,.65) 65%,transparent);
}
@media(max-width:900px) {
 body>header { position:relative; background:var(--paper); }
 .hero { min-height:0; display:flex; flex-direction:column; align-items:stretch; }
 .hero-photo { order:-1; position:relative; inset:auto; z-index:0; height:calc(clamp(280px,66.667vw,600px) + 70px); }
 .hero-photo img { top:0; left:0; height:calc(100% - 70px); }
 .hero-photo::after { bottom:70px; background:linear-gradient(transparent 85%,#10121155); }
 .hero-photo figcaption { display:block; writing-mode:horizontal-tb; left:6%; right:auto; bottom:23px; font-size:11px; }
 .slide-controls { bottom:12px; right:6%; left:auto; gap:4px; }
 .slide-controls button,.slide-controls span { padding:8px 10px; }
 .hero-copy { padding:35px 6% 55px; margin:0; }
 .hero-copy>p:not(.eyebrow) { max-width:430px; }
 .portfolio-cover { aspect-ratio:3/2; }
}
@media(max-width:600px) {
 body>header { padding:16px 6%; flex-wrap:wrap; gap:12px; }
 body>header nav { flex-wrap:wrap; gap:12px; }
 body>header::before { bottom:-35px; }
 .hero-photo { height:calc(clamp(250px,75vw,450px) + 108px); }
 .hero-photo img { height:calc(100% - 108px); }
 .hero-photo::after { bottom:108px; }
 .hero-photo figcaption { left:7%; bottom:77px; }
 .slide-controls { left:7%; right:auto; bottom:16px; }
 .hero-copy { padding:20px 7% 50px; }
 .hero-copy .eyebrow { max-width:290px; }
}
@media(prefers-reduced-transparency:reduce) {
 body>header::before { background:linear-gradient(#101211,#101211e6 65%,transparent); }
}