/* ==========================================================================
   Diogo Feitosa — Portfólio
   Media queries e adaptações para touch
   ========================================================================== */

/* ---------- Touch devices: sem cursor custom, sem efeitos de hover ----------
   Usamos a media query (pointer: coarse) como fonte da verdade — é síncrona
   e não depende do timing da detecção via JS (classe .is-touch no body). */
@media (pointer: coarse) {
  .cursor, .cursor--ring { display: none !important; }

  .work-card__info {
    transform: translateY(0);
    opacity: 1;
  }
  .work-card:hover,
  .identity-card:hover,
  .work-card:hover .work-card__media img,
  .identity-card:hover .identity-card__media img {
    transform: none;
  }
}

body.is-touch .cursor,
body.is-touch .cursor--ring {
  display: none;
}
body.is-touch .work-card__info {
  transform: translateY(0);
  opacity: 1;
}

/* ---------- Tablet ---------- */
@media (max-width: 960px) {
  .identity-grid { grid-template-columns: repeat(2, 1fr); }
  .work-grid { grid-template-columns: repeat(2, 1fr); gap: 18px; }
  .section { padding: 84px 0; }
}

/* ---------- Mobile: composição própria, não apenas redução ---------- */
@media (max-width: 640px) {
  .container { padding: 0 20px; }

  .hero {
    min-height: 92svh;
    padding: 96px 20px 90px;
    gap: 18px;
  }
  .hero__photo { width: 104px; height: 104px; }
  .hero__name { font-size: clamp(38px, 12vw, 52px); }
  .hero__loop { font-size: 15px; }

  .section { padding: 80px 0; }
  .section-head { margin-bottom: 36px; }
  .section-head__desc { max-width: none; }

  .work-grid { grid-template-columns: 1fr; gap: 18px; }
  .work-card__media { aspect-ratio: 4 / 3; }

  .identity-grid { grid-template-columns: 1fr; gap: 16px; }
  .identity-card__media { aspect-ratio: 4 / 3; }

  .behance-cta__title { line-height: 1.25; }

  .cta-whatsapp { padding: 16px 26px; font-size: 14.5px; }
  .cta-whatsapp--lg { padding: 18px 28px; font-size: 15px; }

  .contact__title { font-size: clamp(34px, 11vw, 46px); }
}