/* ============================================================
   RESPONSIVE.CSS — Breakpoint fine-tuning
   Tailwind handles the layout grid; this file only patches the
   hand-written components at tablet / mobile sizes.
   ============================================================ */

/* ---------- ≤ 1280px (small laptop) ---------- */
@media (max-width: 1280px) {
  .hero-nav-btn { display: none; }
}

/* ---------- ≤ 1024px (tablet landscape) ---------- */
@media (max-width: 1024px) {
  :root { --header-h: 68px; }
  .hero-swiper { min-height: 560px; height: 78vh; }
  .trust-item + .trust-item { border-left: 0; }
  .trust-item { border-bottom: 1px solid var(--c-border); }
  .trust-item:nth-last-child(-n+2) { border-bottom: 0; }
  .masonry { columns: 2 260px; }
}

/* ---------- ≤ 768px (tablet portrait / large phone) ---------- */
@media (max-width: 768px) {
  :root { --section-pad: 3.5rem; }
  .hero-swiper { min-height: 520px; height: 72vh; }
  .hero-sub { font-size: .92rem; }
  .scroll-indicator { display: none; }
  .hero-swiper .swiper-pagination { bottom: 18px !important; }

  .trust-strip { margin-top: -30px; }
  .trust-item { padding: 1rem 1.1rem; }

  .stat-number { font-size: 1.8rem; }

  .news-date-chip { width: 54px; height: 54px; border-radius: 13px; }
  .news-date-chip strong { font-size: 1rem; }

  .timeline::before { left: 15px; }
  .timeline-dot { width: 32px; height: 32px; font-size: .7rem; }
  .timeline-item { padding-left: 2.7rem; }

  #backToTop { right: 16px; bottom: 16px; width: 46px; height: 46px; }
  .lb-prev { left: 8px; } .lb-next { right: 8px; }
  .lb-prev, .lb-next { width: 40px; height: 40px; }
}

/* ---------- ≤ 480px (phone) ---------- */
@media (max-width: 480px) {
  .hero-swiper { min-height: 500px; height: 82vh; }
  .hero-title { font-size: 1.7rem; }
  .hero-kicker { font-size: .66rem; padding: .4rem .9rem; }

  .btn { padding: .72rem 1.4rem; font-size: .8rem; }

  .masonry { columns: 1; }
  .newsletter-input { padding-right: 1.6rem; }
  .newsletter-btn-abs { position: static !important; width: 100%; margin-top: .7rem; }

  .section-title { font-size: 1.55rem; }
  .badge-pill { font-size: .66rem; }

  .donate-amount { padding: .65rem 1.15rem; font-size: .88rem; }
  .cert-actions { flex-direction: column; align-items: center; }
}

/* ---------- Print: strip decoration ---------- */
@media print {
  #preloader, .topbar, #backToTop, #searchModal, #mobileMenu, #menuOverlay,
  .wave-divider, .float-shape, #heroParticles, .scroll-indicator { display: none !important; }
  #siteHeader { position: static; }
  body { background: #fff; color: #000; }
}