/* Atlantic Road Seaside Housing — photo gallery page
   Loads after css/main.css AND css/unit.css (reused for .gallery-grid
   layout, .hero-shade and the lightbox opened by js/unit.js).
   Transparent header over the video hero; main.js adds .scrolled. */
.btn:focus-visible,a:focus-visible,button:focus-visible{outline:2px solid var(--brass);outline-offset:3px}

/* Video hero */
.gallery-hero{position:relative;height:82svh;min-height:540px;display:flex;align-items:flex-end;color:var(--linen);background:var(--fjord);overflow:hidden}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gallery-hero .hero-shade{background:linear-gradient(180deg, rgba(19,43,58,.45) 0%, rgba(19,43,58,.05) 42%, rgba(19,43,58,.72) 100%)}
.gallery-hero-content{position:relative;z-index:2;width:100%;padding-bottom:5rem}
.gallery-hero .eyebrow{color:var(--brass)} /* dark bg — brass over brass-ink */
.gallery-hero h1{font-size:clamp(2.6rem,5.8vw,4.8rem);max-width:20ch}
/* --bp-short (max-height:700px) — landscape phones */
@media (max-height:700px){
  .gallery-hero{min-height:0}
  .gallery-hero-content{padding-bottom:3rem}
}

/* Intro band */
.gallery-intro{padding:clamp(3.5rem,7vw,5.5rem) 0 0;background:var(--mist)}
.gallery-intro p{max-width:60ch;font-size:1.1rem;color:var(--slate)}
.gallery-toc{display:flex;flex-wrap:wrap;gap:1rem 1.8rem;margin-top:2rem;padding-bottom:.4rem;border-bottom:1px solid rgba(19,43,58,.12)}
.gallery-toc a{font-family:var(--accent);font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:var(--slate);padding-bottom:.9rem;transition:color .3s}
.gallery-toc a:hover{color:var(--brass-ink)}

/* Gallery sections */
.gallery-section{padding:clamp(3.5rem,7vw,5.5rem) 0 0;background:var(--mist)}
.gallery-section:last-of-type{padding-bottom:clamp(4rem,8vw,7rem)}
.gallery-head{display:flex;align-items:baseline;justify-content:space-between;gap:2rem;flex-wrap:wrap;margin-bottom:1.8rem}
.gallery-head h2{font-size:clamp(1.7rem,3.2vw,2.4rem)}
.gallery-head .eyebrow{display:block;margin-bottom:.5rem}
.gallery-head .section-link{font-family:var(--accent);font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:var(--brass-ink);white-space:nowrap;transition:color .3s}
.gallery-head .section-link:hover{color:var(--petrol)}