/* ==================================================================
   GBX MARKETING — responsive.css
   Media queries para Notebook, Tablet e Celular.
   Estratégia: desktop-first, ajustando para telas menores.
   ================================================================== */

/* ------------------------------------------------------------------
   NOTEBOOK / TELAS MÉDIAS (até 1180px)
   ------------------------------------------------------------------ */
@media (max-width: 1180px) {
  .container { padding: 0 20px; }
  section { padding: 100px 0; }

  .hero__inner { gap: 24px; }
  .radar { width: 340px; height: 340px; }
  .radar__core { inset: 122px; }

  .about__grid { gap: 48px; }

  .services__grid { grid-template-columns: repeat(2, 1fr); }
  .service-card--featured { grid-column: span 2; }

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

  .footer__inner { grid-template-columns: 1fr 1fr; row-gap: 40px; }
}

/* ------------------------------------------------------------------
   TABLET (até 900px)
   Menu mobile assume aqui; grids passam a 1 ou 2 colunas
   ------------------------------------------------------------------ */
@media (max-width: 900px) {
  section { padding: 84px 0; }

  /* Header: esconde nav desktop, mostra hambúrguer */
  .nav { display: none; }
  .header__cta { display: none; }
  .nav-toggle { display: flex; }

  /* Hero em coluna única, visual do radar abaixo do texto */
  .hero { padding-top: 150px; }
  .hero__inner { grid-template-columns: 1fr; text-align: center; }
  .hero__subtitle { margin-left: auto; margin-right: auto; }
  .hero__actions { justify-content: center; }
  .hero__stats { grid-template-columns: repeat(2, 1fr); justify-content: center; gap: 26px 20px; }
  .hero__visual { order: -1; margin-bottom: 20px; }
  .radar { width: 300px; height: 300px; }
  .radar__core { inset: 108px; }
  .radar__tag { font-size: 0.62rem; padding: 5px 10px; }

  .about__grid { grid-template-columns: 1fr; }
  .about__pillars { grid-template-columns: 1fr; }
  .about__frame { max-width: 420px; margin: 0 auto; }

  .services__grid { grid-template-columns: 1fr; }
  .service-card--featured {
    grid-column: span 1;
    grid-template-columns: 1fr;
    text-align: center;
    justify-items: center;
  }
  .service-card--featured .service-card__icon,
  .service-card--featured .service-card__title,
  .service-card--featured .service-card__desc,
  .service-card--featured .service-card__benefits,
  .service-card--featured .btn--white {
    grid-column: 1;
    grid-row: auto;
  }
  .service-card--featured .service-card__benefits { text-align: left; }

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

  .cta-section__grid { grid-template-columns: 1fr; }
  .cta-form__row { grid-template-columns: 1fr; }

  .footer__inner { grid-template-columns: 1fr 1fr; }
  .footer__brand { grid-column: span 2; }
}

/* ------------------------------------------------------------------
   CELULAR (até 600px)
   ------------------------------------------------------------------ */
@media (max-width: 600px) {
  .container { padding: 0 18px; }
  section { padding: 68px 0; }

  h1.hero__title { font-size: 2rem; }
  .section-title { font-size: 1.7rem; }

  .hero { padding-top: 130px; }
  .hero__actions { flex-direction: column; align-items: stretch; }
  .hero__actions .btn { width: 100%; }
  .hero__stats { grid-template-columns: repeat(2, 1fr); gap: 20px 14px; }
  .hero__stat-label { max-width: none; }
  .radar { width: 240px; height: 240px; }
  .radar__ring--3 { display: none; }
  .radar__core { inset: 84px; }
  .radar__tag { display: none; } /* espaço reduzido: tags somem, radar continua visível */

  .marquee { margin-top: 60px; }

  .service-card--featured .service-card__seal { position: static; margin-bottom: 16px; }

  .portfolio__grid { grid-template-columns: 1fr; }
  .portfolio__filters { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px; -webkit-overflow-scrolling: touch; }
  .portfolio__filters::-webkit-scrollbar { display: none; }

  .cta-form { padding: 24px; }

  .footer__inner { grid-template-columns: 1fr; text-align: left; }
  .footer__brand { grid-column: span 1; }
  .footer__bottom-inner { flex-direction: column; text-align: center; }

  .whatsapp-float, .back-to-top { width: 50px; height: 50px; font-size: 1.4rem; bottom: 18px; }
  .whatsapp-float { left: 18px; }
  .back-to-top { right: 18px; }

  /* Cursor customizado só faz sentido com mouse — ocultado via JS em touch,
     mas garantimos aqui que não atrapalhe em telas pequenas */
  .cursor-dot, .cursor-ring { display: none; }
}

/* ------------------------------------------------------------------
   TELAS MUITO PEQUENAS (até 380px)
   ------------------------------------------------------------------ */
@media (max-width: 380px) {
  .hero__stats { grid-template-columns: 1fr 1fr; }
  .radar { width: 200px; height: 200px; }
  .radar__core { inset: 68px; }
}
