/* Shared photographic heroes. Artwork stays aligned with the centered site. */
.photo-hero {
  --hero-bg: #020912;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--hero-bg);
  border-bottom: 1px solid var(--line);
}
.photo-hero__media { position: absolute; inset: 0; z-index: -2; pointer-events: none; }
.photo-hero__media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: right center; }
.photo-hero::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(90deg, rgba(2,9,18,.84), rgba(2,9,18,.7) 36%, rgba(2,9,18,.5) 52%, transparent 76%);
}
.photo-hero > .container { display: flex; flex-direction: column; min-height: clamp(40rem,50vw,80rem); }
.photo-hero .breadcrumbs { flex: 0 0 auto; padding-top: 1.5rem; color: #d8e3ef; }
.photo-hero .breadcrumbs a { color: #d8e3ef; }
.photo-hero__grid { display: flex; flex: 1; align-items: center; min-height: 0; padding-block: 3rem 5rem; }
.photo-hero__copy { width: 50%; min-width: 0; }
.photo-hero .eyebrow { margin-bottom: 0; color: #8bd7ff; font-size: .75rem; letter-spacing: .16em; }
.photo-hero h1 {
  max-width: none; margin: 1.5rem 0; color: #fff;
  font-size: clamp(2.75rem,1.25rem + 2.8vw,3.75rem);
  line-height: 1.08; letter-spacing: -.045em;
}
.photo-hero__accent { display: block; color: #38baff; }
.photo-hero__processor { display: block; margin-bottom: 1rem; color: #fff; font-size: 1.125rem; font-weight: 750; }
.photo-hero p { max-width: 48ch; color: #d8e3ef; font-size: clamp(1rem,.8rem + .3vw,1.125rem); line-height: 1.7; }
.photo-hero .hero__trust { gap: 1rem; color: #d8e3ef; font-size: .8rem; }
.photo-hero__actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.photo-hero .button { min-height: 3.25rem; }
.photo-hero .button--ghost { background: rgba(2,9,18,.75); border-color: #69839a; }
.photo-hero--compact > .container { min-height: 27rem; }
.photo-hero--compact .photo-hero__grid { padding-block: 3.5rem; }
.photo-hero--compact h1 { font-size: clamp(2.5rem,3.5vw,3.4rem); }
.photo-hero--compact .photo-hero__media { opacity: .6; }
.photo-hero--article .photo-hero__copy { width: 62%; }
.photo-hero--article .photo-hero__media { opacity: .4; }
.photo-hero .article-back { display: block; margin-bottom: 1.5rem; }
.photo-hero .article-meta { margin-bottom: 0; }

@media (min-width:100rem) {
  .photo-hero > .container { min-height: 48rem; }
  .photo-hero__media,.photo-hero::before { width: min(100%,120rem); margin-inline: auto; }
  .photo-hero__media {
    mask-image: linear-gradient(90deg,transparent,#000 10%,#000 88%,transparent);
    -webkit-mask-image: linear-gradient(90deg,transparent,#000 10%,#000 88%,transparent);
  }
  .photo-hero__media img { object-position: center 60%; }
  .photo-hero--compact > .container { min-height: 27rem; }
}
@media (max-width:62rem) {
  .photo-hero { display: flex; flex-direction: column; }
  .photo-hero > .container { min-height: 0; }
  .photo-hero__grid { padding-block: 1.5rem 2rem; }
  .photo-hero .breadcrumbs { margin-bottom: 0; }
  .photo-hero .eyebrow { letter-spacing: .07em; }
  .photo-hero__copy,.photo-hero--article .photo-hero__copy { width: 100%; max-width: 40rem; }
  .photo-hero__media { position: relative; inset: auto; order: 2; z-index: 0; height: auto; max-height: 29rem; aspect-ratio: 862 / 800; }
  .photo-hero__media img { object-fit: contain; object-position: right center; }
  .photo-hero::before { display: none; }
  .photo-hero h1 { font-size: clamp(2.25rem,1.2rem + 4.5vw,3.5rem); margin-block: 1rem; }
  .photo-hero__actions { margin-top: 1.5rem; }
  .photo-hero__actions .button { flex: 1 1 9rem; width: auto; padding-inline: 1rem; }
  .photo-hero .hero__trust { display: flex; flex-wrap: wrap; margin-top: 1.5rem; gap: .75rem 1rem; }
  .photo-hero--home .photo-hero__grid { padding-top: 2.5rem; }
  .photo-hero--compact .photo-hero__grid { padding-block: 2.5rem; }
  .photo-hero--compact h1 { font-size: clamp(2rem,1.25rem + 3vw,3rem); }
  .photo-hero--compact .photo-hero__media { height: 13rem; aspect-ratio: auto; max-height: none; opacity: .8; }
  .photo-hero--compact .photo-hero__media img { object-fit: cover; object-position: right 55%; }
}
@media (max-width:40rem) {
  .photo-hero__media { width: 100%; height: auto; max-height: none; aspect-ratio: auto; flex: 0 0 auto; margin-top: 0; }
  .photo-hero__media img { width: 100%; height: auto; aspect-ratio: 862 / 800; object-fit: contain; }
  .photo-hero--compact .photo-hero__media { height: 10rem; }
  .photo-hero--compact .photo-hero__media img { height: 100%; aspect-ratio: auto; }
  .photo-hero__actions .button { flex-basis: 11rem; }
  .photo-hero--article h1 { overflow-wrap: anywhere; }
}