/* Editorial About composition. Mobile rules and photography stay untouched. */
@media (min-width: 992px) {
  .about__primary {
    display: block;
    min-height: 0;
    padding-block: var(--section-edge-space, 64px);
  }

  .about__primary-grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    column-gap: var(--desktop-column-gap);
    row-gap: 24px;
    align-items: start;
    align-content: start;
  }

  .about__story {
    display: grid;
    grid-column: 1;
    grid-row: 1;
    gap: 16px;
  }

  .about__bio { max-width: 46ch; }
  .about__bio p + p { margin-top: 16px; }

  .about__credentials {
    grid-column: 1;
    grid-row: 2;
    align-self: end;
    min-width: 0;
  }

  .about-credential { padding: 20px; }
  .about-credential h3 { font-size: 1rem; font-weight: var(--weight-subheading); line-height: 1.4; }
  .about-credential ul { gap: 10px; font-size: .875rem; line-height: 1.6; }

  .about__portrait {
    grid-column: 2;
    grid-row: 1 / 3;
    align-self: stretch;
    height: 100%;
    max-height: none;
    min-height: 0;
    aspect-ratio: auto;
  }

  .about__gallery {
    display: grid;
    grid-column: 1 / -1;
    grid-row: 3;
    gap: 16px;
    align-content: start;
    min-height: 0;
  }

  .about__sports {
    --about-media-gap: 16px;
    flex-direction: row;
    min-width: 0;
    min-height: 0;
    overscroll-behavior: contain;
  }

  .about-sport {
    flex: 0 0 calc((100% - 2 * var(--about-media-gap)) / 3);
    height: auto;
    aspect-ratio: 1 / 1;
  }

  .about__sports .about-sport .about-media__image {
    object-position: center 42%;
    /* These static photos do not need the historical 3D compositing hint. */
    backface-visibility: visible;
  }

  /* The six editorial slots keep their own focal point, desktop only. */
  .about__sports .about-sport:nth-child(1) .about-media__image { object-position: center 18%; }
  .about__sports .about-sport:nth-child(3) .about-media__image { object-position: center 30%; }
  .about__sports .about-sport:nth-child(4) .about-media__image { object-position: center 10%; }
  .about__sports .about-sport:nth-child(5) .about-media__image {
    object-position: center 54%;
    transform: scale(1.03);
    transform-origin: center 55%;
  }
  .about__sports .about-sport:nth-child(6) .about-media__image { object-position: center 64%; }
  .about-sport figcaption { font-size: .8125rem; line-height: 1.4; padding: 38px 14px 14px; }

  .about__gallery-controls {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
  }

  .about__gallery-status { margin-right: auto; color: rgba(255, 253, 248, .8); font-size: .8125rem; font-variant-numeric: tabular-nums; line-height: 1.4; }

  .about__gallery-controls[hidden] { display: none; }

  .about__gallery-controls button {
    display: grid;
    width: 44px;
    height: 44px;
    padding: 10px;
    place-items: center;
    border: 0;
    border-radius: var(--desktop-control-radius);
    color: var(--color-brand-lime);
    background: rgba(193, 233, 104, .08);
    cursor: pointer;
    transition: background-color 180ms ease;
  }

  .about__gallery-controls button:disabled { opacity: .35; cursor: default; }
  .about__gallery-controls button:focus-visible { outline: 2px solid var(--color-brand-lime); outline-offset: 4px; }
  .about__gallery-controls svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
}

@media (min-width: 992px) and (hover: hover) {
  .about__gallery-controls button:not(:disabled):hover { background: rgba(193, 233, 104, .22); }
}

@media (min-width: 1280px) {
  .about__primary-grid {
    --about-gallery-height: clamp(476px, calc(36vw + 32px), 536px);
    grid-template-columns: minmax(0, 1.12fr) minmax(0, 1.16fr) minmax(0, .68fr);
    grid-template-rows: auto auto;
    column-gap: clamp(22px, 2.2vw, 32px);
    row-gap: 24px;
  }

  .about__gallery {
    grid-column: 3;
    grid-row: 1 / 3;
    gap: 12px;
  }

  .about__sports {
    flex-direction: column;
    height: var(--about-gallery-height);
    overflow-x: hidden;
    overflow-y: auto;
    scroll-snap-type: y mandatory;
    scroll-padding-inline: 0;
    scroll-padding-block: 1px;
  }

  .about-sport {
    flex: 0 0 auto;
    height: auto;
    aspect-ratio: 1 / 1;
  }

  .about__gallery-controls { justify-content: flex-end; }
}

@media (min-width: 992px) and (prefers-reduced-motion: reduce) {
  .about__gallery-controls button { transition: none; }
}