/* ============================================
   Acqua Responsive Styles
   ============================================ */

/* === Tablet (max-width: 1024px) === */
@media (max-width: 1024px) {
  .header__nav {
    display: none;
  }

  .menu-toggle {
    display: flex;
  }

  /* Mobile Navigation Overlay */
  .mobile-nav {
    position: fixed;
    inset: 0;
    z-index: var(--z-overlay);
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-xl);
    opacity: 0;
    visibility: hidden;
    transition: all var(--transition-slow);
  }

  .mobile-nav.is-open {
    opacity: 1;
    visibility: visible;
  }

  .mobile-nav__link {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.4s ease;
  }

  .mobile-nav.is-open .mobile-nav__link {
    opacity: 1;
    transform: translateY(0);
  }

  .mobile-nav.is-open .mobile-nav__link:nth-child(1) { transition-delay: 0.1s; }
  .mobile-nav.is-open .mobile-nav__link:nth-child(2) { transition-delay: 0.15s; }
  .mobile-nav.is-open .mobile-nav__link:nth-child(3) { transition-delay: 0.2s; }
  .mobile-nav.is-open .mobile-nav__link:nth-child(4) { transition-delay: 0.25s; }
  .mobile-nav.is-open .mobile-nav__link:nth-child(5) { transition-delay: 0.3s; }
  .mobile-nav.is-open .mobile-nav__link:nth-child(6) { transition-delay: 0.35s; }

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

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

  .reasons__grid > *:last-child {
    grid-column: 1 / -1;
    max-width: 400px;
    margin-inline: auto;
  }

  .affinity__inner {
    grid-template-columns: 1fr;
    gap: var(--space-2xl);
  }

  .affinity__image-wrapper {
    position: relative;
    top: auto;
    max-width: 400px;
    margin-inline: auto;
  }

  .case-card {
    grid-template-columns: 1fr;
  }

  .case-card__side--before {
    border-right: none;
    border-bottom: 1px solid var(--color-border);
  }

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

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

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

/* === Mobile (max-width: 768px) === */
@media (max-width: 768px) {
  :root {
    --section-padding: clamp(3rem, 6vw, 5rem);
  }

  .container {
    padding-inline: var(--space-md);
  }

  .hero {
    min-height: 100svh;
  }

  .hero__title {
    font-size: clamp(1.75rem, 7vw, 2.5rem);
  }

  .hero__actions {
    flex-direction: column;
  }

  .hero__actions .btn {
    width: 100%;
    justify-content: center;
  }

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

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

  .reasons__grid > *:last-child {
    max-width: none;
  }

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

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

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

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

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

  .footer__bottom {
    flex-direction: column;
    gap: var(--space-md);
    text-align: center;
  }

  .final-cta__note {
    flex-direction: column;
    align-items: center;
    gap: var(--space-sm);
  }

  .form__radio-group,
  .form__checkbox-group {
    flex-direction: column;
  }

  .section__title {
    font-size: clamp(1.25rem, 5vw, 2rem);
  }
}

/* === Small Mobile (max-width: 480px) === */
@media (max-width: 480px) {
  .btn {
    padding: 0.875rem 1.5rem;
    font-size: var(--font-size-sm);
  }

  .btn--lg {
    padding: 1rem 2rem;
    font-size: var(--font-size-base);
  }

  .offer__remaining-count {
    font-size: 3rem;
  }
}
