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

/* === BR DESKTOP ONLY: nasconde i <br class="br-d"> su mobile === */
br.br-d { display: none; }
@media (min-width: 768px) {
  br.br-d { display: block; }
}

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

  .intro {
    padding: 40px 0 48px;
  }

  .intro__video {
    margin-top: 24px;
  }

  .scroll-images {
    padding-bottom: 48px;
  }

  .project-card {
    height: 55vh;
    min-height: 360px;
  }

  /* AI Models Campaigns: titolo sotto la foto su mobile */
  .project-card:has(.project-card__bg--strip) {
    height: auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
  }

  .project-card:has(.project-card__bg--strip) .project-card__bg {
    position: relative;
    height: 300px;
    flex-shrink: 0;
  }

  .project-card:has(.project-card__bg--strip) .project-card__overlay {
    display: none;
  }

  .project-card:has(.project-card__bg--strip) .project-card__info {
    position: static;
    background: var(--bg-primary);
    padding: 24px var(--container-pad);
  }

  .project-card:has(.project-card__bg--strip) .project-card__line {
    background: var(--border-light);
  }

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

  .navbar__social {
    display: none;
  }

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

  /* Page hero */
  .page-hero {
    padding-top: 110px;
    padding-bottom: 48px;
  }

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

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

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

  /* AI Video showcase */
  .ai-video__showcase {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .ai-video__info p {
    max-width: 100%;
  }

  /* Consult CTA */
  .consult-cta__images {
    gap: 8px;
    margin-bottom: 36px;
  }

  .consult-cta__images img {
    aspect-ratio: 1/1;
  }

  /* 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: 20px; padding: 48px 0; }
  .service-detail-block__left { position: static; }
  .service-detail-block__left h2 { font-size: clamp(26px, 7vw, 36px); }
  .service-detail-block__right p { font-size: 16px; margin-bottom: 24px; }
  .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: 80px;
  }

  /* 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;
  }
}