/* ═══════════════════════════════════════════
   BJF — Responsive Breakpoints
   ═══════════════════════════════════════════ */

/* ── Large screens: default (≥1120px) ── */
/* All base styles are for desktop. Overrides below. */

/* ── Medium (≤960px) ── */
@media (max-width: 960px) {

  /* Nav */
  .site-nav__links {
    display: none;
  }

  .nav-toggle {
    display: flex;
    order: 3;
  }

  .site-nav__actions {
    order: 2;
    margin-left: auto;
    margin-right: var(--space-3);
  }

  /* Hero */
  .hero__inner {
    grid-template-columns: 1fr;
    gap: var(--space-10);
  }

  /* Story */
  .story-grid {
    grid-template-columns: 1fr;
    gap: var(--space-10);
  }

  /* Stake / lifeline */
  .stake-grid {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }

  .stake-right {
    position: static;
  }

  /* The difference you can make */
  .you-grid {
    grid-template-columns: 1fr;
    gap: var(--space-10);
  }

  .donation-examples {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Impact */
  .impact-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Footer */
  .site-footer__grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-8);
  }

  .site-footer__brand {
    grid-column: 1 / -1;
  }
}

/* ── Small (≤720px) ── */
@media (max-width: 720px) {

  .container,
  .container--narrow {
    padding: 0 var(--space-5);
  }

  .section-padding {
    padding: var(--space-16) 0;
  }

  .section-padding--lg {
    padding: var(--space-20) 0;
  }

  /* Hero */
  .hero {
    padding: var(--space-16) 0;
  }

  .hero__inner {
    padding: 0 var(--space-5);
  }

  .hero__stats {
    gap: var(--space-6);
  }

  .stat-inline__value {
    font-size: var(--text-2xl);
  }

  /* Services */
  .services-grid {
    grid-template-columns: 1fr;
  }

  /* Quotes */
  .quotes-grid {
    grid-template-columns: 1fr;
  }

  /* Fix background-attachment: fixed on iOS Safari */
  .quote-card {
    background-attachment: scroll;
    background-size: cover;
  }

  /* Help */
  .help-grid {
    grid-template-columns: 1fr;
  }

  /* Image grid */
  .image-grid {
    grid-template-columns: 1fr 1fr;
  }

  /* Photo banner */
  .photo-banner {
    min-height: 360px;
  }

  .photo-banner__inner {
    padding: var(--space-10) var(--space-5);
  }

  .photo-banner__content {
    max-width: 100%;
  }

  /* Impact */
  .impact-strip {
    padding: var(--space-16) 0;
  }

  .impact-grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-3);
  }

  .impact-card__num {
    font-size: var(--text-3xl);
  }

  /* Nav */
  .site-nav__inner {
    padding: 0 var(--space-5);
  }

  /* Footer */
  .site-footer__grid {
    grid-template-columns: 1fr;
  }

  .site-footer__bottom {
    flex-direction: column;
    text-align: center;
  }

  /* Donate card */
  .donate-card {
    padding: var(--space-6);
  }

  /* CTA */
  .cta-section {
    padding: var(--space-16) 0;
  }

  .cta-section__inner {
    padding: 0 var(--space-5);
  }

  /* Urgency banner */
  .urgency-banner {
    font-size: var(--text-sm);
    padding: var(--space-2) var(--space-5);
    text-align: center;
  }
}

/* ── XSmall (≤480px) ── */
@media (max-width: 480px) {

  /* Headings */
  h1 { font-size: 1.85rem; }
  h2 { font-size: 1.5rem; }

  /* Hero stats: single column */
  .hero__stats {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }

  /* Image grid */
  .image-grid {
    grid-template-columns: 1fr;
  }

  /* Impact */
  .impact-grid {
    grid-template-columns: 1fr;
  }

  /* Amount grid */
  .amount-grid {
    grid-template-columns: repeat(4, 1fr);
  }

  /* Donation examples: single column on mobile */
  .donation-example__amount {
    font-size: var(--text-3xl);
  }

  /* Quotes */
  .quotes-grid {
    gap: var(--space-4);
  }

  /* Services */
  .services-grid {
    gap: var(--space-4);
  }

  /* You section header */
  .you-left .section-body {
    font-size: var(--text-base);
  }

  /* Photo banner tighter on mobile */
  .photo-banner {
    min-height: 300px;
  }

  /* Stake list text */
  .stake-list__item {
    font-size: var(--text-sm);
  }

  /* Frequency toggle */
  .frequency-btn {
    font-size: var(--text-xs);
    padding: 8px 0;
  }
}

/* ── Print ── */
@media print {
  .site-nav,
  .urgency-banner,
  .hero .donate-card,
  .cta-section,
  .site-footer {
    display: none;
  }

  .hero {
    background: none;
    color: var(--bjf-text);
    padding: var(--space-5) 0;
  }

  .hero__content h1,
  .hero__lead {
    color: var(--bjf-text);
  }

  .hero__inner {
    grid-template-columns: 1fr;
  }

  a[href]::after {
    content: " (" attr(href) ")";
    font-size: var(--text-xs);
    color: var(--bjf-text-muted);
  }
}