/* ==========================================================================
   Responsivo — tablets e celulares
   ========================================================================== */

@media (max-width: 1024px) {
  .grid--services { grid-template-columns: repeat(2, 1fr); }
  .grid--values   { grid-template-columns: repeat(2, 1fr); }
  .split { grid-template-columns: 1fr; gap: 2.5rem; }
  .footer__grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 768px) {
  .section { padding-block: 3.5rem; }

  /* Menu mobile */
  .nav__toggle { display: inline-flex; }
  .nav {
    position: absolute;
    top: var(--header-h);
    left: 0;
    right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    background: var(--c-dark);
    box-shadow: var(--shadow-lg);
    padding: .5rem 1.5rem 1.5rem;
    display: none;
  }
  .nav.is-open { display: flex; }
  .nav__list { flex-direction: column; align-items: stretch; gap: 0; }
  .nav__link { display: block; padding: .85rem .9rem; border-bottom: 1px solid rgba(255, 255, 255, .08); }
  .nav__link:hover { color: #fff; background: rgba(255, 255, 255, .06); }
  .nav__link:hover::after { display: none; }
  .nav__link.is-active { color: #fff; background: rgba(255, 255, 255, .12); }
  .nav__link.is-active::after { display: none; }
  .nav__cta { margin-top: 1rem; }

  .hero { min-height: 88vh; }

  .grid--services { grid-template-columns: 1fr; }
  .grid--values   { grid-template-columns: 1fr; }

  .form { padding: 1.5rem; }
  .form__row { grid-template-columns: 1fr; }

  .vaga-hero { flex-direction: column; align-items: flex-start; gap: 1.5rem; }
  .vaga-hero__cta { width: 100%; }

  .apply__grid { grid-template-columns: 1fr; gap: 1.5rem; }
  .apply__side { position: static; }
  .apply__steps { display: flex; flex-wrap: wrap; gap: .6rem 1.25rem; margin-top: 1.5rem; }
  .apply__step-num { width: 30px; height: 30px; font-size: .82rem; }
  .apply__step-label { font-size: .85rem; }

  .footer__grid { grid-template-columns: 1fr; gap: 2rem; }
  .footer__col--nav { display: none; }
}

@media (max-width: 480px) {
  .hero__actions .btn { width: 100%; }
  .stats { grid-template-columns: 1fr 1fr; }
}
