/* A fixed homepage frame fills with landscape photos; full views retain the complete image. */
.photo-frame #frame-open{height:auto;aspect-ratio:4 / 3;background:transparent;min-height:0}
.photo-frame #frame-open img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}

/* Andrew and School89 have room for a wider photograph beside the introduction. */
body[data-photo-site] .photo-hero{height:auto;min-height:max(620px,calc(100svh - 88px));grid-template-columns:minmax(320px,1fr) minmax(440px,min(58vw,860px));gap:clamp(24px,4vw,64px);padding:40px clamp(24px,4vw,64px)}
@media(max-width:1000px){
 body[data-photo-site] .photo-hero{grid-template-columns:minmax(0,1fr);gap:28px;padding:32px 24px 40px}
 body[data-photo-site] .photo-frame{max-width:860px;justify-self:center}
}
@media(max-width:680px){
 body[data-photo-site] .photo-hero{padding-inline:16px}
 body[data-photo-site] .photo-frame{padding:14px}
}
/* Elisheva retains two quiet cards, with a modest increase to both. */
body .hero-frames{width:332px}
body .hero-frames .memory-frame{min-height:260px}
@media(min-width:1550px){body .hero-frames{width:420px}body .hero-frames .memory-frame{min-height:285px}}
@media(max-width:1000px){body .hero-frames{width:300px}body .hero-frames .memory-frame{min-height:235px}}
@media(max-height:850px) and (min-width:681px){body .hero-frames .memory-frame{min-height:220px}}
@media(max-height:650px) and (min-width:681px){body .hero-frames{width:300px}body .hero-frames .memory-frame{min-height:185px}}
@media(max-width:680px){body .hero-frames{width:auto;inset-inline:12px}body .hero-frames .memory-frame{min-height:0}}

/* Keep both memorial cards and the lower controls visible on short landscape screens. */
@media(min-width:681px){body[data-page="home"] .hero{min-height:820px}}
@media(min-width:1550px){body[data-page="home"] .hero{min-height:900px}}
@media(max-height:650px) and (min-width:681px){body[data-page="home"] .hero{min-height:700px}}
