/* About hero visual correction — intentionally scoped to the About page. */
body.about-clarified-page .about-brand-hero {
  padding-block: clamp(48px, 5vw, 72px);
}

body.about-clarified-page .about-brand-hero-grid {
  grid-template-columns: minmax(0, 1.04fr) minmax(420px, .96fr);
  gap: clamp(32px, 4vw, 52px);
}

body.about-clarified-page .about-brand-copy,
body.about-clarified-page .about-brand-photo {
  min-width: 0;
}

body.about-clarified-page .about-brand-photo {
  width: min(100%, 720px);
  max-height: 480px;
  aspect-ratio: 3 / 2;
  align-self: center;
  justify-self: end;
  background: #0b292f;
}

body.about-clarified-page .about-brand-photo img {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
  object-position: center;
}

@media (max-width: 980px) {
  body.about-clarified-page .about-brand-hero-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 36px;
  }

  body.about-clarified-page .about-brand-photo {
    width: min(100%, 720px);
    justify-self: start;
  }
}

@media (max-width: 720px) {
  body.about-clarified-page .about-brand-hero {
    padding-block: 36px 42px;
  }

  body.about-clarified-page .about-brand-hero-grid {
    gap: 28px;
  }

  body.about-clarified-page .about-brand-photo {
    width: 100%;
    height: clamp(260px, 72vw, 340px);
    max-height: 340px;
    aspect-ratio: auto;
    border-radius: 18px;
  }

  body.about-clarified-page .about-brand-photo img {
    object-fit: contain;
  }
}