/* Responsive adaptations for Love For St. Louis. Loaded after styles.css. */
.footer-address-separator { display: none; }
@media (max-width: 740px) {
  .brand { flex-direction: column; flex-wrap: nowrap; align-self: center; max-width: 100%; margin-left: 0; }
  .header-inner { padding-bottom: 0.5rem; }
  .header-inner > .button { width: 75%; align-self: center; margin-right: 0; }
  .site-header { top: var(--mobile-header-top, 0px); }
  .site-header.is-compact .brand, .site-header.is-compact .menu-toggle, .site-header.is-compact .main-nav { visibility: hidden; pointer-events: none; }
  .home-page .hero-grid { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .home-page .hero-grid > .hero-image { grid-row: 1; min-height: 0; }
  .home-page .hero-copy { grid-row: 2; }
  .home-page .service-grid { grid-template-columns: minmax(0, 1fr); }
  .home-page .volunteer-home-section .mission-grid { grid-template-columns: minmax(0, 1fr); text-align: center; }
  .home-page .volunteer-home-section .mission-image img { margin-inline: auto; }
  .home-page .volunteer-home-section .mission-copy, .home-page .clinician-home-copy { text-align: center; }
  .leadership-section .leader-image { width: min(100%, 18rem); margin-inline: auto; }
  .leadership-section .leader-image img { height: auto; object-fit: contain; }
}
@media (min-width: 741px) and (max-width: 1180px) {
  .header-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 1rem;
    padding: 1.5rem 1.5rem;
  }

  .header-inner .brand {
    min-width: 0;
    margin-left: 0;
    gap: 0.75rem;
  }

  .header-inner .brand-logo {
    width: 5.5rem;
    height: 5.5rem;
    flex-shrink: 0;
  }

  .header-inner .brand-text-group {
    min-width: 0;
    align-items: center;
    text-align: center;
  }

  .header-inner .brand-text {
    font-size: clamp(1.452rem, 2.42vw, 1.815rem);
    line-height: 1.2;
    white-space: normal;
  }

  .header-inner .brand-subtext {
    font-size: 0.88rem;
    text-align: center;
  }

  .header-inner .menu-toggle {
    display: block;
    min-width: 44px;
    min-height: 44px;
    color: var(--text);
  }

  .header-inner > .button {
    width: auto;
    margin: 0;
    white-space: nowrap;
  }

  .header-inner .main-nav {
    display: none;
    position: absolute;
    top: calc(100% + 0.5rem);
    right: 1.5rem;
    width: min(20rem, calc(100vw - 3rem));
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.75rem;
    background: #ffffff;
    border: 1px solid var(--border);
    border-radius: 1rem;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  }

  .header-inner .main-nav.active {
    display: flex;
  }

  .header-inner .main-nav a {
    padding: 0.65rem 0.75rem;
  }
}

@media (min-width: 961px) and (max-width: 1180px) {
  .home-page .support-layout {
    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr);
    gap: 1.5rem;
  }

  .home-page .support-copy h2 {
    font-size: 2rem;
    line-height: 1.2;
  }

  .home-page .support-copy .support-highlight {
    font-size: 1.3rem;
    line-height: 1.5;
  }

  .home-page .support-image img {
    height: 360px;
  }

  .home-page .hero-visual {
    padding-top: 0;
  }

  .home-page .hero-image {
    min-height: 0;
  }

  .home-page .hero-image img {
    width: 100%;
    height: auto;
  }

  .home-page .hero-visual .hero-trust {
    margin-top: 0.85rem;
    font-size: 1.15rem;
    line-height: 1.4;
  }

  .header-inner {
    padding-block: 1.725rem;
    gap: 1.15rem;
  }

  .header-inner .brand-logo {
    width: 6.325rem;
    height: 6.325rem;
  }

  .header-inner .brand-text {
    font-size: clamp(1.6698rem, 2.783vw, 2.08725rem);
  }

  .header-inner .brand-subtext {
    font-size: 1.1638rem;
  }

  .header-inner .menu-toggle {
    font-size: 2.07rem;
  }

  .header-inner > .button {
    font-size: 1.15rem;
    padding: 0.69rem 1.15rem;
  }
}

@media (min-width: 741px) and (max-width: 1180px) {
  .home-page .service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-page .clinician-home-copy {
    margin-inline: auto;
    text-align: center;
  }

  .home-page .volunteer-home-section .mission-grid {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 2rem;
    text-align: center;
  }

  .home-page .volunteer-home-section .mission-image {
    width: min(100%, 32rem);
    grid-row: 3;
  }

  .home-page .volunteer-home-section .mission-image img {
    width: 100%;
    height: auto;
    margin-inline: auto;
  }

  .home-page .volunteer-home-section .mission-copy {
    display: contents;
    text-align: center;
  }

  .home-page .volunteer-home-section .mission-copy > * {
    max-width: 40rem;
    margin: 0;
  }

  .home-page .volunteer-home-section .eyebrow {
    grid-row: 1;
  }

  .home-page .volunteer-home-section .mission-copy h2 {
    grid-row: 2;
  }
}

@media (min-width: 741px) and (max-width: 1180px) {
  .volunteer-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
  }

  .volunteer-images {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto;
    gap: 1.25rem;
    height: auto;
  }

  .volunteer-images img {
    height: clamp(220px, 30vw, 320px);
    object-position: center top;
  }

  .volunteer-card {
    min-width: 0;
    width: 100%;
    padding: 2rem;
  }
}

@media (min-width: 741px) and (max-width: 1180px) {
  .leadership-section .board-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .leadership-section .leader-card {
    grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr);
    gap: 1.5rem;
    align-items: start;
  }

  .leadership-section .leader-image {
    width: 100%;
    max-width: 18rem;
    margin: 0;
  }

  .leadership-section .leader-content {
    min-width: 0;
  }

  .featured-leader-card .leader-image .read-more-btn {
    width: 100%;
    text-align: center;
  }

  .leadership-section .leader-image img {
    width: 100%;
    height: auto;
    object-fit: contain;
  }
}

@media (min-width: 961px) and (max-width: 1180px) {
  .leadership-section .board-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }

  .leadership-section .board-member-card {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
  }

  .leadership-section .board-member-card .leader-image {
    width: min(100%, 14rem);
    margin-inline: auto;
  }

  .leadership-section .board-member-card .leader-image img {
    height: auto;
    aspect-ratio: 3 / 4;
    object-fit: cover;
    object-position: center top;
    background: #eef3f7;
  }

  .leadership-section .board-member-card .leader-content {
    text-align: center;
  }
}

@media (min-width: 741px) and (max-width: 1180px) {
  .footer-main {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem;
  }

  .footer-brand-block {
    grid-column: 1 / -1;
    text-align: center;
  }

  .footer-brand-block .footer-mission {
    max-width: 36rem;
    margin-inline: auto;
  }

  .footer-actions {
    justify-content: center;
  }

  .footer-main > .footer-links-block {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0.65rem 0;
    width: 100%;
    text-align: center;
  }

  .footer-links-block .footer-title {
    flex-basis: 100%;
    margin: 0 0 0.25rem;
  }

  .footer-links-block a {
    flex: 1 1 auto;
    margin: 0;
    padding-inline: 1.25rem;
  }

  .footer-links-block a + a {
    border-left: 1px solid rgba(255, 255, 255, 0.4);
  }

  .footer-contact-block {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem 0;
    align-items: baseline;
    width: 100%;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    text-align: center;
  }

  .footer-contact-block .footer-title {
    flex-basis: 100%;
    margin: 0;
  }

  .footer-contact-block .footer-contact-line {
    display: inline-flex;
    gap: 0.5rem;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    padding-inline: 0.8rem;
    font-size: 0.95rem;
    text-align: left;
  }

  .footer-contact-line + .footer-contact-line {
    border-left: 1px solid rgba(255, 255, 255, 0.4);
  }

  .footer-contact-block .footer-address {
    flex-basis: 100%;
    justify-content: center;
    border-left: 0;
    text-align: center;
  }

  .footer-address br {
    display: none;
  }

  .footer-address-separator {
    display: inline;
  }

  .footer-contact-block .footer-social {
    flex-basis: 100%;
    justify-content: center;
    margin-top: 0;
  }

  .footer-bottom {
    grid-template-columns: 1fr;
    grid-template-areas:
      "copyright"
      "legal"
      "disclaimer";
    text-align: center;
    row-gap: 0.75rem;
  }

  .footer-legal-links {
    justify-content: center;
  }

  .footer-disclaimer {
    justify-self: center;
    text-align: center;
  }
}
/* Adapt the shared rules to this site's original hero and legal markup. */
@media (min-width: 741px) and (max-width: 1180px) {
  .footer-bottom { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; }
  .footer-legal { text-align: center; }
  .footer-legal p { margin: 0 0 0.75rem; }
  .footer-bottom .footer-disclaimer { margin: 0; }
  .home-page .hero-image { min-height: 0; }
  .home-page .hero-image img { width: 100%; height: auto; }
  .home-page .hero-trust { font-size: 1rem; }
  .header-inner .main-nav { left: auto; }
}
