/* ================================================================
   YOURSAY THEME — responsive.css
   Tablet: 1024px | Mobile: 768px
   ================================================================ */

/* ── Tablet (≤1024px) ────────────────────────────────────────── */
@media (max-width: 1024px) {
  :root { --section-pad: 60px; }

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

  .about__inner {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }
  .about__image { order: -1; }
  .about__image img { height: 360px; }

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

  .footer__inner {
    grid-template-columns: 1fr 1fr;
  }
  .footer__col--brand {
    grid-column: 1 / -1;
  }
}

/* ── Mobile (≤768px) ─────────────────────────────────────────── */
@media (max-width: 768px) {
  :root { --section-pad: 50px; }

  /* Top bar */
  .top-bar { display: none; }

  /* Header */
  .header__inner { height: 80px; }
  .header__logo img { height: 120px; margin: -20px -10px; }

  .header__hamburger { display: flex; }

  .header__nav {
    position: fixed;
    inset: 0;
    top: 64px;
    background: var(--color-white);
    padding: 2rem 1.5rem;
    transform: translateX(100%);
    transition: transform 0.3s ease;
    overflow-y: auto;
    z-index: 999;
    box-shadow: var(--shadow-lg);
  }
  .header__nav.nav--open {
    transform: translateX(0);
  }

  .nav__list {
    flex-direction: column;
    align-items: stretch;
    gap: 0.25rem;
  }
  .nav__list li a {
    font-size: 1rem;
    padding: 0.875rem 1rem;
  }
  .nav__list li:last-child > a {
    margin-top: 0.75rem;
    text-align: center;
  }

  /* Hero */
  .hero {
    background-attachment: scroll; /* disable parallax on mobile */
    min-height: 100svh;
  }
  .hero__content { padding-top: 40px; }

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

  /* About counters */
  .about__counters { grid-template-columns: repeat(2, 1fr); }

  /* Why Us */
  .whyus__grid { grid-template-columns: 1fr; }

  /* CTA Banner */
  .cta-banner__inner {
    flex-direction: column;
    text-align: center;
  }

  /* Footer */
  .footer__inner {
    grid-template-columns: 1fr;
    gap: 2rem;
    padding-top: 2.5rem;
    padding-bottom: 2rem;
  }
  .footer__col--brand { grid-column: auto; }

  /* Section headers */
  .section__header { margin-bottom: 2rem; }
}

/* ── Small mobile (≤480px) ───────────────────────────────────── */
@media (max-width: 480px) {
  .hero__cta { flex-direction: column; }
  .hero__cta .btn { width: 100%; justify-content: center; }

  .about__counters { grid-template-columns: repeat(2, 1fr); gap: 0.75rem; }
  .counter-number { font-size: 1.6rem; }
}