/* Mobile touch navigation and project centering — July 24, 2026 */

/* Remove the delayed 300 ms tap behavior without disabling normal scrolling. */
a[href],
button {
  touch-action: manipulation;
}

@media (hover: none) and (pointer: coarse) {
  /* Touch devices can hold :hover after the first tap. Keep navigation cards
     visually stable so the first tap remains a navigation action. */
  .page-home .project-card__link:hover,
  .project-page .learn-more-card__link:hover {
    transform: none !important;
  }

  .page-home .project-card__link,
  .project-page .learn-more-card__link,
  .site-nav a,
  .project-nav a,
  .menu-panel a,
  .back-link,
  .profile-actions a,
  .contact-item a,
  .resume-download {
    -webkit-tap-highlight-color: transparent;
  }
}

/* Keep the full project-card surface as the one clickable target. */
.page-home .project-card,
.page-home .project-card__link,
.project-page .learn-more-card,
.project-page .learn-more-card__link {
  position: relative;
  pointer-events: auto !important;
}

.page-home .project-card__media,
.page-home .project-card__cover,
.page-home .project-card__content,
.page-home .project-card__title,
.page-home .project-card__meta {
  pointer-events: none !important;
}

@media (max-width: 600px) {
  /* Center every homepage project as an independent grid item. */
  .page-home .project-grid {
    justify-items: center !important;
    margin-right: auto !important;
    margin-left: auto !important;
  }

  .page-home .project-card,
  .page-home .project-card__link {
    justify-self: center !important;
    margin-right: auto !important;
    margin-left: auto !important;
  }

  .page-home .project-card__media,
  .page-home .project-card__content {
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Apply the same centering behavior to project recommendations. */
  .project-page .learn-more__grid {
    justify-items: center !important;
  }

  .project-page .learn-more-card,
  .project-page .learn-more-card__link {
    justify-self: center !important;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}