/* =====================================================================
   Voice of India — Responsive Breakpoints
   ===================================================================== */

@media (min-width: 1441px) {
  :root {
    --container-max: 1320px;
  }
  body { font-size: 17px; }
}

@media (max-width: 1024px) {
  .hero-inner {
    grid-template-columns: 1fr;
    gap: 3.5rem;
    text-align: center;
  }

  .hero-lead,
  .hero-subtext {
    margin-inline: auto;
    max-width: 600px;
  }

  .hero-actions {
    justify-content: center;
  }

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

  .about-inner {
    grid-template-columns: 1fr;
    gap: 3.5rem;
    text-align: center;
  }

  .about-pillar-list {
    max-width: 580px;
    margin: 0 auto;
    text-align: left;
  }

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

  .module-row,
  .module-row--reverse {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .module-row--reverse .module-row__text {
    order: 1;
  }

  .module-row--reverse .module-row__visual {
    order: 2;
  }

  .module-features-list {
    text-align: left;
    max-width: 500px;
    margin: 0 auto;
  }

  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 32px;
  }

  .footer-col--download {
    grid-column: 1 / -1;
  }
}

@media (max-width: 768px) {
  :root {
    --header-height: 72px;
  }

  .brand-logo__img {
    height: 40px;
  }

  .why-grid,
  .steps-timeline {
    grid-template-columns: 1fr;
  }

  .layered-mockup {
    min-height: 420px;
  }

  .phone-frame--main { width: 210px; }
  .phone-frame--side { width: 170px; }
  .phone-frame--left { left: -10px; }
  .phone-frame--right { right: -10px; }

  .benefits-table th,
  .benefits-table td {
    padding: 12px 14px;
    font-size: 0.88rem;
  }

  .footer-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

@media (max-width: 414px) {
  :root {
    --header-height: 66px;
  }

  .brand-logo__img {
    height: 36px;
  }

  .btn-store-badge {
    padding: 6px 12px;
    font-size: 0.78rem;
  }

  .btn-store-badge i {
    font-size: 1rem;
  }

  .hero-title {
    font-size: 2.1rem;
  }

  .hero-actions {
    flex-direction: column;
    width: 100%;
  }

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

  .download-cta-buttons {
    flex-direction: column;
  }

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

  .phone-frame--gallery {
    width: 200px;
  }
}

@media (max-width: 390px) {
  .header-actions {
    gap: 6px;
  }

  .btn-store-badge__sub {
    display: none;
  }

  .phone-frame--side {
    display: none;
  }

  .phone-frame--main {
    width: 230px;
  }
}

@media (max-width: 320px) {
  .btn-store-badge {
    padding: 6px 10px;
  }

  .hero-title {
    font-size: 1.85rem;
  }

  .phone-frame--main,
  .phone-frame--standalone {
    width: 190px;
  }
}
@media (max-width: 768px) {
  .footer-badges {
    width: 100%;
    max-width: 220px;
  }

  .footer-badge-link {
    width: 220px;
    min-height: 50px;
  }
}

@media (max-width: 414px) {
  .footer-badges {
    max-width: 200px;
  }

  .footer-badge-link {
    width: 200px;
    min-height: 48px;
    padding: 6px 10px;
  }

  .footer-badge-link i {
    font-size: 1.15rem;
  }

  .footer-badge-link strong {
    font-size: 0.78rem;
  }
}
@media (max-width: 768px) {
  .footer-brand__img {
    height: 58px;
    margin-left: -22px;
  }
}

@media (max-width: 414px) {
  .footer-brand__img {
    height: 54px;
    margin-left: -20px;
  }
}