/* ==========================================================================
   CAPS4CANCER — Responsive
   Breakpoints: Desktop (default) → Laptop 1200 → Tablet 900 → Mobile 600
   ========================================================================== */

/* Laptop */
@media (max-width: 1200px) {
  .partner-grid { grid-template-columns: repeat(3, 1fr); }
  .footer__top { grid-template-columns: 1.2fr 1fr 1fr; }
  .footer__top .footer__col:nth-child(4) { display: none; }
}

/* Tablet */
@media (max-width: 900px) {
  .nav__links { gap: 30px; }
  .card-grid { grid-template-columns: 1fr; }
  .counters { grid-template-columns: repeat(3, 1fr); gap: 24px; }
  .two-col,
  .two-col--reverse { grid-template-columns: 1fr; }
  .two-col--reverse .two-col__media { order: 0; }
  .contact-grid { grid-template-columns: 1fr; }
  .product-grid { grid-template-columns: repeat(2, 1fr); }
  .stat-strip { grid-template-columns: repeat(2, 1fr); gap: 32px 24px; }
  .partner-grid { grid-template-columns: repeat(2, 1fr); }
  .footer__top { grid-template-columns: 1fr 1fr; gap: 40px; }
}

/* Mobile */
@media (max-width: 600px) {
  :root { --section-pad-x: 20px; }

  .nav__links {
    position: fixed;
    inset: 0;
    background: var(--c-white);
    flex-direction: column;
    justify-content: center;
    gap: 36px;
    transform: translateX(100%);
    transition: transform var(--dur-med) var(--ease-out);
    z-index: 1;
  }
  .nav__links a { color: var(--c-black) !important; font-size: 1.1rem; }
  .nav__links.is-open { transform: translateX(0); }
  .nav__cta { display: inline-flex; }

  .nav__toggle { display: flex; }
  .nav__toggle.is-open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
  .nav__toggle.is-open span:nth-child(2) { opacity: 0; }
  .nav__toggle.is-open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
  .nav__toggle.is-open { color: var(--c-black) !important; }

  .hero__title { font-size: clamp(2.25rem, 11vw, 3rem); }
  .hero__actions { flex-direction: column; width: 100%; }
  .hero__actions .btn { width: 100%; }

  .card-grid { grid-template-columns: 1fr; }
  .counters { grid-template-columns: 1fr; gap: 40px; }
  .stat-strip { grid-template-columns: 1fr 1fr; }
  .partner-grid { grid-template-columns: repeat(2, 1fr); }
  .product-grid { grid-template-columns: 1fr; }

  .footer__top { grid-template-columns: 1fr; gap: 36px; }
  .footer__bottom { flex-direction: column; align-items: flex-start; }

  .btn-row { flex-direction: column; width: 100%; }
  .btn-row .btn { width: 100%; }

  .page-hero { padding-top: 160px; }
}

/* Grid overflow guard — prevents any grid child (especially SVG/image content
   with an intrinsic size) from forcing its track wider than the container,
   which is what caused the mission/research/partners illustration overflow. */
.card-grid > .card,
.counters > *,
.stat-strip > *,
.product-grid > .product-card,
.contact-grid > *,
.partner-grid > .partner-logo,
.footer__top > .footer__col {
  min-width: 0;
}
html, body { max-width: 100%; overflow-x: hidden; }