/* =====================================================
   RESPONSIVE — Mobile-first
   375px → 768px → 1024px → 1440px → 1920px+
   ===================================================== */

/* === MOBILE (base, <768px) === */
@media (max-width: 767px) {
  :root {
    --container-pad: 20px;
  }

  /* Navbar */
  .navbar {
    padding: 16px 0;
  }

  .navbar__social {
    display: none;
  }

  .navbar__logo {
    position: static;
    transform: none;
  }

  /* Page hero */
  .page-hero {
    padding-top: 140px;
    padding-bottom: 80px;
  }

  /* Hero */
  .hero__content {
    flex-direction: column;
    gap: 32px;
    padding-top: 100px;
    padding-bottom: 160px;
  }

  .hero__agency-label {
    text-align: left;
  }

  .hero__right {
    align-self: auto;
    padding-left: 0;
  }

  /* Menu overlay */
  .menu-overlay__content {
    padding: 80px 24px;
  }

  /* Intro */
  .intro__img {
    display: none;
  }

  .intro__content {
    min-height: auto;
  }

  /* Service blocks */
  .service-block {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 40px 0;
  }

  .service-block__col3 {
    align-items: flex-start;
  }

  /* Stat grid */
  .stat-grid {
    grid-template-columns: 1fr;
  }

  /* Bento */
  .bento {
    grid-template-columns: 1fr;
  }

  .bento__card--wide {
    grid-column: span 1;
  }

  /* Engagement */
  .engagement__cards {
    grid-template-columns: 1fr;
  }

  /* FAQ */
  .faq__grid {
    grid-template-columns: 1fr;
  }

  .faq__photo {
    display: none;
  }

  /* Testimonials */
  .testimonials__layout {
    grid-template-columns: 1fr;
  }

  .testimonials__featured {
    display: none;
  }

  /* Journal */
  .journal__grid {
    grid-template-columns: 1fr;
  }

  /* CTA */
  .cta-band__btns {
    flex-direction: column;
    align-items: center;
  }

  .cta-band__logos {
    gap: 24px;
  }

  /* Burger touch target */
  .burger {
    min-height: 44px;
    min-width: 44px;
    justify-content: center;
  }

  /* Contact form */
  .contact-form-wrap {
    padding: 24px;
  }

  /* Case study next */
  .case-next__link {
    padding: 32px 20px;
  }

  /* Footer */
  .footer__top {
    flex-direction: column;
    gap: 24px;
    align-items: flex-start;
  }

  .footer__time {
    text-align: left;
  }

  .footer__tz {
    justify-content: flex-start;
  }

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

  .footer__social {
    gap: 16px;
  }

  .footer__bottom {
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
  }

  .footer__bottom .scroll-top {
    align-self: flex-end;
  }

  /* Scroll images */
  .scroll-img--tall { width: 180px; height: 260px; }
  .scroll-img--short { width: 180px; height: 200px; }

  /* Inner pages */
  .service-detail-block { grid-template-columns: 1fr; gap: 40px; }
  .service-detail-block__left { position: static; }
  .service-features { grid-template-columns: 1fr; }
  .process-steps { grid-template-columns: 1fr 1fr; }
  .process-step { border-left: none; padding-left: 0; border-top: 1px solid var(--border); padding-top: 24px; }
  .process-step:first-child { border-top: none; padding-top: 0; }
  .contact-grid { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .work-page__grid { grid-template-columns: 1fr; }
  .about-values__grid { grid-template-columns: 1fr; }
  .team-grid { grid-template-columns: 1fr; }
  .journal-page__grid { grid-template-columns: 1fr; }
  .case-overview__grid { grid-template-columns: 1fr 1fr; }
  .case-overview__item { border-left: none; border-top: 1px solid var(--border); padding: 24px 0; }
  .case-overview__item:first-child { border-top: none; padding-top: 0; }
  .case-hero__content { padding: 32px 20px; }
  .case-results__grid { grid-template-columns: 1fr; }
}

/* === TABLET (768px–1023px) === */
@media (min-width: 768px) and (max-width: 1023px) {
  :root {
    --container-pad: 40px;
  }

  /* Navbar social — show fewer items */
  .navbar__social a:nth-child(n+4) {
    display: none;
  }

  /* Hero */
  .hero__content {
    padding-top: 110px;
    padding-bottom: 180px;
  }

  /* Bento */
  .bento {
    grid-template-columns: repeat(2, 1fr);
  }

  .bento__card--wide {
    grid-column: span 2;
  }

  /* Engagement */
  .engagement__cards {
    grid-template-columns: 1fr 1fr;
  }

  /* Journal */
  .journal__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Testimonials */
  .testimonials__layout {
    grid-template-columns: 1fr 1.5fr;
  }

  /* Service block */
  .service-block {
    grid-template-columns: 1fr 1.2fr;
    gap: 24px;
  }

  .service-block__col3 {
    display: none;
  }

  /* Footer */
  .footer__mid {
    grid-template-columns: 1fr 1fr;
  }

  /* Inner pages */
  .service-detail-block { gap: 48px; }
  .process-steps { grid-template-columns: 1fr 1fr; }
  .about-values__grid { grid-template-columns: 1fr 1fr; }
  .team-grid { grid-template-columns: 1fr 1fr; }
  .work-page__grid { grid-template-columns: 1fr; }
  .case-overview__grid { grid-template-columns: repeat(2, 1fr); }
}

/* === DESKTOP (1024px+) === */
@media (min-width: 1024px) {
  :root {
    --container-pad: 40px;
  }

  /* Ensure stat grid 3 cols */
  .stat-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Make stat-card--sm slightly smaller */
  .stat-card--sm .stat-card__num {
    font-size: clamp(32px, 4vw, 56px);
  }
}

/* === LARGE DESKTOP (1440px+) === */
@media (min-width: 1440px) {
  :root {
    --container-pad: 60px;
  }

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

/* === EXTRA LARGE (1920px+) === */
@media (min-width: 1920px) {
  :root {
    --container-pad: 80px;
  }
}