/**
 * LuCamillo - Landing Page
 * Estilos customizados (Tailwind cobre utilitários)
 */

:root {
  --header-height: 64px;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: var(--header-height);
}

.font-serif {
  font-family: 'Playfair Display', serif;
}

.font-great-vibes,
.font-logo {
  font-family: 'Great Vibes', cursive;
}

.font-display {
  font-family: 'Manrope', sans-serif;
}

/* Header: altura fixa para compensação pixel perfect */
.site-header {
  min-height: var(--header-height);
  height: var(--header-height);
  box-sizing: border-box;
}

/* Hero: área principal compensa o header */
.main-content {
  min-height: calc(100vh - var(--header-height));
  box-sizing: border-box;
}

/* Menu mobile: overlay e painel */
.mobile-menu-overlay {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s, visibility 0.25s;
}

.mobile-menu-overlay.is-open {
  opacity: 1;
  visibility: visible;
}

.mobile-menu-panel {
  transform: translateX(100%);
  transition: transform 0.25s ease-out;
  top: var(--header-height) !important;
  height: calc(100vh - var(--header-height)) !important;
}

.mobile-menu-panel.is-open {
  transform: translateX(0);
}

/* Modal de serviço (leitura) */
.service-modal-overlay {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s, visibility 0.25s;
}

.service-modal-overlay.is-open {
  opacity: 1;
  visibility: visible;
}

.service-modal-panel {
  transform: scale(0.95);
  opacity: 0;
  transition: transform 0.25s ease-out, opacity 0.25s;
}

.service-modal-overlay.is-open .service-modal-panel {
  transform: scale(1);
  opacity: 1;
}

/* Modal Metodologia (timeline) */
.methodology-modal-overlay {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s, visibility 0.25s;
}

.methodology-modal-overlay.is-open {
  opacity: 1;
  visibility: visible;
}

.methodology-modal-panel {
  transform: scale(0.95);
  opacity: 0;
  transition: transform 0.25s ease-out, opacity 0.25s;
}

.methodology-modal-overlay.is-open .methodology-modal-panel {
  transform: scale(1);
  opacity: 1;
}
