/* Portfolio 1.6.191 — ajustes exclusivos para navegação e interação mobile.
   Esta folha é carregada depois dos estilos existentes. Todas as regras ficam
   restritas a breakpoints mobile/tablet ou a dispositivos com ponteiro touch;
   nenhum seletor altera o layout desktop convencional. */

/* Tablet em orientação vertical: preservar cards legíveis sem usar uma única
   coluna excessivamente larga. A grade original de desktop permanece intacta. */
@media (min-width: 601px) and (max-width: 800px) {
  body:not(.case-page) #projetos .project-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Aumenta a área interativa do menu mobile sem alterar o desenho das três linhas. */
@media (max-width: 800px) {
  .site-header .burger {
    display: flex;
    width: 44px;
    height: 44px;
    padding: 0;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
  }

  .site-header .burger span {
    margin: 0;
  }
}

/* Em telas touch não há hover. Mantém visível o indicador de ampliação para
   deixar claro que as imagens das galerias podem ser abertas em lightbox. */
@media (max-width: 1100px) and (hover: none) and (pointer: coarse) {
  .gallery-item::after,
  .case-page .case-mosaic .case-image-trigger::after {
    opacity: .92;
    transform: none;
  }

  .lightbox-close,
  .case-lightbox-close {
    width: 44px;
    height: 44px;
  }

  /* Reserva espaço para o alvo de toque ampliado sem cobrir a imagem. */
  .case-image-lightbox {
    padding-top: 58px;
  }
}

/* Os controles laterais já têm 46 px. No celular, o botão de fechar da galeria
   principal passa a 44 px para ficar consistente com o diálogo das páginas. */
@media (max-width: 600px) {
  .gallery-lightbox .lightbox-close {
    width: 44px;
    height: 44px;
  }
}

/* Em telefones touch, compensa o cabeçalho de 58 px do lightbox para preservar
   a área útil da imagem dentro da altura disponível. */
@media (max-width: 600px) and (hover: none) and (pointer: coarse) {
  .case-image-lightbox {
    padding-top: 58px;
  }

  .case-image-lightbox .case-lightbox-image {
    max-height: calc(82vh - 86px);
  }
}