/* =========================================================
   TV Atlas Pro — Responsive overrides (mobile-first base
   lives in style.css)
   ========================================================= */

/* ---- Tablet: >= 600px ---- */
@media (min-width: 600px) {
  .hero__actions {
    flex-direction: row;
    justify-content: center;
  }

  .hero__actions .btn {
    width: auto;
  }

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

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

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

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

  .footer__grid {
    grid-template-columns: 1.2fr 1fr 1fr;
  }

  .footer__bottom {
    flex-direction: row;
    justify-content: space-between;
    text-align: left;
  }

  .form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-5);
  }

  .product-hero__actions {
    flex-direction: row;
  }

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

  .featured-article {
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
  }

  .related-articles .article-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ---- Desktop: >= 1024px ---- */
@media (min-width: 1024px) {
  .navbar__links {
    position: static;
    flex-direction: row;
    background: transparent;
    opacity: 1;
    visibility: visible;
    transform: none;
    overflow: visible;
    padding-block: 0;
    gap: var(--space-2);
  }

  .navbar__links a {
    font-size: 0.85rem;
    padding: 0.4rem 0.7rem;
  }

  .navbar__cta {
    display: inline-flex;
  }

  .hamburger {
    display: none;
  }

  .hero__inner {
    max-width: 780px;
  }

  .hero__visual-grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .steps {
    grid-template-columns: repeat(4, 1fr);
  }

  .card-grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .pricing-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .pricing-card--featured {
    transform: scale(1.03);
  }

  .testimonials {
    grid-template-columns: repeat(3, 1fr);
  }

  .footer__grid {
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
  }

  .product-hero {
    grid-template-columns: 1.1fr 0.9fr;
  }

  .checkout-grid {
    grid-template-columns: 1.4fr 1fr;
  }

  .article-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .related-articles .article-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ---- Large desktop: >= 1280px ---- */
@media (min-width: 1280px) {
  .hero__lede {
    font-size: 1.15rem;
  }

  .navbar__links {
    gap: var(--space-4);
  }

  .navbar__links a {
    font-size: 0.92rem;
    padding: 0.45rem 0.9rem;
  }
}
