/* Desktop: let body containers fill the screen width (added 2026-08-10) */
@media (min-width: 1025px) {
  main,
  .wrap,
  .rcn-wrap,
  .search-wrap,
  .sws-page-search,
  .chips,
  .hero,
  .map-section,
  .highlights-section,
  .sponsors-section,
  .feature,
  .alert,
  .howto,
  .foot-note,
  .swp-faq {
    max-width: none !important;
  }
}

/* FAQ slider: show 2 cards at once with a peek of the 3rd, desktop (added 2026-08-10) */
@media (min-width: 1025px) {
  .swp-faq .faq-slider .faq-slider__viewport {
    margin-left: 0;
    margin-right: 0;
  }
  .swp-faq .faq-slider .faq-slider__track {
    gap: 16px;
  }
  .swp-faq .faq-slider .faq-slider__slide {
    flex: 0 0 calc((100% - 32px) / 2.3);
    scroll-snap-align: start;
  }
  .swp-faq .faq-slider .faq-slider__nav {
    top: 50%;
    transform: translateY(-50%);
  }
  .swp-faq .faq-slider .faq-slider__nav:hover {
    transform: translateY(-50%) translate(1px, 1px);
  }
}

/* FAQ slider: keep the focus on the selected card, desktop (added 2026-08-10) */
@media (min-width: 1025px) {
  .swp-faq .faq-slider--focus .faq-slider__slide {
    filter: grayscale(0.7) contrast(0.9);
    opacity: 0.45;
    transition: opacity 0.35s ease, filter 0.35s ease;
  }
  .swp-faq .faq-slider--focus .faq-slider__slide.is-active {
    filter: none;
    opacity: 1;
  }
}
@media (prefers-reduced-motion: reduce) {
  .swp-faq .faq-slider--focus .faq-slider__slide {
    transition: none;
  }
}

/* ===============================================================
   Body copy: Times New Roman + link colour (added 2026-08-10)
   1) Paragraph text on every page renders in Times New Roman.
   2) Hyperlinks inside body text use the same colour as the text
      around them. Buttons, CTAs, image cards and "Read more"
      controls keep their own styling.
   =============================================================== */

/* 1. Paragraph text in Times New Roman */
p,
p a,
p span,
p strong,
p b,
p em,
p i,
p u,
p s,
p small,
p sub,
p sup,
p mark,
p abbr,
p cite,
p q,
p time,
p label {
  font-family: "Times New Roman", Times, serif !important;
}

/* Interface labels (card labels, "Read more" toggles) keep the site UI font */
p .swp-readmore-btn,
p .swp-readmore-btn *,
p .swp-mosaic-item,
p .swp-mosaic-item * {
  font-family: Roboto, sans-serif !important;
}

/* 2. Body-text links match the surrounding text colour */
p a:not([class*="btn"]):not([class*="button"]):not([class*="cta"]):not([class*="readmore"]):not([class*="read-more"]):not([class*="more-link"]):not([class*="mosaic"]):not(.skip-link),
blockquote a:not([class*="btn"]):not([class*="button"]):not([class*="cta"]):not([class*="readmore"]):not([class*="read-more"]):not([class*="more-link"]):not([class*="mosaic"]):not(.skip-link),
dd a:not([class*="btn"]):not([class*="button"]):not([class*="cta"]):not([class*="readmore"]):not([class*="read-more"]):not([class*="more-link"]):not([class*="mosaic"]):not(.skip-link),
dt a:not([class*="btn"]):not([class*="button"]):not([class*="cta"]):not([class*="readmore"]):not([class*="read-more"]):not([class*="more-link"]):not([class*="mosaic"]):not(.skip-link),
td a:not([class*="btn"]):not([class*="button"]):not([class*="cta"]):not([class*="readmore"]):not([class*="read-more"]):not([class*="more-link"]):not([class*="mosaic"]):not(.skip-link),
th a:not([class*="btn"]):not([class*="button"]):not([class*="cta"]):not([class*="readmore"]):not([class*="read-more"]):not([class*="more-link"]):not([class*="mosaic"]):not(.skip-link),
figcaption a:not([class*="btn"]):not([class*="button"]):not([class*="cta"]):not([class*="readmore"]):not([class*="read-more"]):not([class*="more-link"]):not([class*="mosaic"]):not(.skip-link) {
  color: inherit !important;
}


/* Fix author/story photo cropping: hold the intended 3:4 portrait ratio at any screen width (added 2026-09-03) */
#story-article-content .wp-block-cover {
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 3 / 4 !important;
}


/* Header video: taller on desktop, title artwork unchanged (updated 2026-09-04) */
@media (min-width: 1025px) {
  /* 1. grow the video area */
  div[style*="height:60vh"],
  div[style*="height: 60vh"] {
    height: 72vh !important;
    max-height: 780px !important;
    min-height: 420px !important;
  }
  /* 2. hold the SVG title at its original box so the lettering does not scale up */
  div[style*="height:60vh"] svg,
  div[style*="height: 60vh"] svg {
    height: 60vh !important;
    max-height: 640px !important;
    min-height: 360px !important;
    top: 50% !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    overflow: visible !important; /* lets the dark scrim still cover the full video */
  }
}



/* Overview box: no rainbow strip under the header video, homepage only (added 2026-09-04) */
body.home #overview > .swp-box::before {
  display: none !important;
}


/* Overview section: refined tiles, lede and buttons (added 2026-09-04)
   Replaces the 2026-08-11 lede rules, which keyed off p:nth-of-type(2).
   The logo paragraph above the tiles is gone, so the mission paragraph is
   now the only direct <p> child of the Overview box. */

/* Mission lede: readable size and weight, darker ink, comfortable measure */
#overview .swp-box > p,
#overview .swp-box > p strong {
  font-family: 'Chivo', Arial, Helvetica, sans-serif !important;
  font-size: 20px !important;
  line-height: 1.55 !important;
  font-weight: 400 !important;
  color: #2b2b2b !important;
}
#overview .swp-box > p {
  max-width: 68ch;
  margin: 30px 0 0;
}
#overview .swp-box > p a {
  color: #7a2e9e !important;
  font-weight: 600 !important;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
@media (max-width: 767px) {
  #overview .swp-box > p,
  #overview .swp-box > p strong {
    font-size: 17px !important;
  }
}

/* Tiles: hairline edge and a soft lift instead of the 3px black outline */
#overview .swp-mosaic-item {
  border: 1px solid rgba(18, 18, 18, 0.10) !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 2px rgba(18, 18, 18, 0.05), 0 10px 28px rgba(18, 18, 18, 0.10);
}
#overview .swp-mosaic-item:hover {
  box-shadow: 0 2px 6px rgba(18, 18, 18, 0.07), 0 18px 44px rgba(18, 18, 18, 0.16);
}

/* Buttons: sized to their label instead of stretching across the row */
body.home .swp-cta-row {
  gap: 12px;
  margin-top: 30px;
}
body.home .swp-cta-btn {
  flex: 0 0 auto;
  padding: 14px 28px;
  border-width: 1px;
}
body.home .swp-cta-btn--outline {
  border-color: rgba(18, 18, 18, 0.25);
}
body.home .swp-cta-btn--outline:hover {
  border-color: #121212;
}
@media (max-width: 600px) {
  body.home .swp-cta-btn {
    flex: 1 1 100%;
  }
}