/* Page-specific hero framing. */
.about-hero > img { object-position: center 42%; }
.email { display: inline-flex; align-items: center; gap: .45em; max-width: 100%; font-size: clamp(13px, 1.65vw, 22px); white-space: nowrap; }
.prints-hero .page-hero-content { margin-left: auto; margin-right: 8vw; text-align: right; }
.prints-hero .page-hero-shade { background: linear-gradient(270deg, rgba(5,10,8,.84) 0%, rgba(5,10,8,.4) 48%, rgba(5,10,8,.1) 100%), linear-gradient(0deg, rgba(5,10,8,.65) 0%, transparent 62%); }
@media (max-width: 720px) { .about-hero > img { object-position: center 34%; } .prints-hero .page-hero-content { margin: 0 6vw 5.5rem; text-align: left; } }

/* Supplied hero files are composed with their subjects on the left and copy
   space on the right.  On narrow screens, bring the subject into the crop and
   keep copy in the higher-contrast lower-left area. */
.hero-content { left: auto; right: 8vw; width: min(42vw, 680px); text-align: right; }
.hero-shade { background: linear-gradient(270deg, rgba(5,10,8,.84) 0%, rgba(5,10,8,.42) 48%, rgba(5,10,8,.08) 100%), linear-gradient(0deg, rgba(5,10,8,.46), transparent 48%); }
.page-hero .page-hero-content { width: min(42vw, 840px); margin: 0 8vw clamp(3.5rem, 8vw, 8rem) auto; text-align: right; }
.page-hero .page-hero-content p:not(.eyebrow) { margin-left: auto; }
.page-hero-shade { background: linear-gradient(270deg, rgba(5,10,8,.84) 0%, rgba(5,10,8,.42) 48%, rgba(5,10,8,.08) 100%), linear-gradient(0deg, rgba(5,10,8,.65) 0%, transparent 62%); }
.hero > img { object-position: 35% center; }
.about-hero > img { object-position: 24% center; }
.gallery-hero > img { object-position: 31% center; }
.prints-hero > img { object-position: 42% center; }
.contact-hero > img { object-position: 34% center; }
.mobile-hero-photo { display: none; }
.social-links { margin-top: 2rem; }
.social-links p { margin: 0 0 .7rem !important; }
.social-links a { display: inline-flex; align-items: center; gap: .45rem; margin-right: .65rem; border: 1px solid rgba(238,241,232,.52); border-radius: 999px; padding: .55rem .8rem; color: var(--ink); font: 500 11px var(--mono); letter-spacing: .05em; text-transform: uppercase; transition: background .2s, color .2s; }
.social-links a:hover { background: var(--ink); color: var(--paper); }
.page-feature-photo { width: min(41vw, 490px); margin: clamp(3rem, 7vw, 6rem) auto 0; }
.page-feature-photo img { width: 100%; height: auto; border: 1px solid var(--line); box-shadow: 0 20px 60px rgba(0,0,0,.22); }

/* All supplied desktop banners are 2:1.  Match the container to that ratio
   so the entire image is shown rather than using a fixed-height crop. */
@media (min-width: 721px) {
  .hero,
  .page-hero {
    height: auto;
    min-height: 0;
    aspect-ratio: 2 / 1;
  }

  .hero > img,
  .page-hero > img {
    object-fit: contain;
  }
}

@media (max-width: 720px) {
  /* Portrait screens do not have enough width to show a 2:1 banner without
     an aggressive crop.  Use a consistent, text-first hero instead. */
  .hero,
  .page-hero {
    height: auto;
    min-height: 340px;
    aspect-ratio: auto;
    background: radial-gradient(circle at 85% 12%, rgba(125,154,110,.24), transparent 34%), #0f1714;
  }
  .hero > img,
  .page-hero > img,
  .aurora {
    display: none;
  }
  .mobile-hero-photo {
    display: block;
    width: 100%;
    height: auto;
    margin: 1.25rem 0;
    border: 0;
    box-shadow: none;
  }
  .hero { min-height: 0; padding: 2rem 0 2.5rem; }
  .hero-content { position: relative; left: auto; right: auto; bottom: auto; width: 100%; text-align: left; }
  .hero-content > :not(.mobile-hero-photo) { margin-left: 6vw; margin-right: 6vw; }
  .hero-caption { display: none; }
  .hero-shade,
  .page-hero-shade { background: linear-gradient(145deg, rgba(5,10,8,.04), rgba(5,10,8,.6)); }
  .page-hero .page-hero-content { width: auto; margin: 0 6vw 2.75rem; text-align: left; }
  .page-hero .page-hero-content h1 { font-size: clamp(2.6rem, 12vw, 3.7rem); }
  .page-hero .page-hero-content p:not(.eyebrow) { margin-left: 0; }
  .gallery-hero,
  .prints-hero,
  .contact-hero { min-height: 255px; }
  .prints-hero .page-hero-content,
  .contact-hero .page-hero-content { margin-bottom: 2rem; }
  .about-hero { min-height: 0; padding-top: 2rem; }
  .about-hero .page-hero-content { width: 100%; margin: 0; }
  .about-hero .page-hero-content > :not(.mobile-hero-photo) { margin-left: 6vw; margin-right: 6vw; }
  .about-hero .page-hero-content h1 em { display: inline-block; font-size: .66em; white-space: nowrap; }
  .page-feature-photo { width: 100%; margin: 0; }
  .page-feature-photo img { border: 0; box-shadow: none; }
  .hero > img { object-position: 29% center; }
  .about-hero > img { object-position: 24% center; }
  .gallery-hero > img { object-position: 28% center; }
  .prints-hero > img { object-position: 42% center; }
  .contact-hero > img { object-position: 31% center; }
}