/* Production-baseline repair: phone reflow and the corrected YouTube mark. */

/* A late desktop density pass restores a multi-column intro after the older
   phone rules. Restack it at the final cascade position and use the broadly
   supported max-width syntax for iOS and embedded mobile browsers. */
@media (max-width: 760px) {
  #main-content > .intro-grid.aj-intro-compact {
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100%;
    min-width: 0;
    overflow: visible;
  }

  #main-content > .intro-grid.aj-intro-compact > .section-kicker,
  #main-content > .intro-grid.aj-intro-compact > div {
    grid-column: 1;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  #main-content > .intro-grid.aj-intro-compact h2,
  #main-content > .intro-grid.aj-intro-compact > div p {
    width: 100%;
    max-width: 100%;
    overflow-wrap: break-word;
  }
}

/* Keep the footer's monochrome treatment while restoring the recognisable
   rounded YouTube screen and centred play triangle. */
#aj-temple-footer-r1 .ajtf-social-link[aria-label="YouTube"] svg[data-aj-youtube-icon="r1"] {
  overflow: visible;
}

#aj-temple-footer-r1 .ajtf-social-link[aria-label="YouTube"] .aj-youtube-screen {
  fill: currentColor;
}

#aj-temple-footer-r1 .ajtf-social-link[aria-label="YouTube"] .aj-youtube-play {
  fill: var(--ajtf-wine, #701b30);
}