/**
 * TrueHub - Estilos customizados
 * Complementa o Tailwind CSS com classes específicas do projeto.
 */

/* Gradiente da secção hero */
.hero-gradient {
  background: linear-gradient(180deg, #3851a3 0%, #1e3a8a 20%, #1e40af 60%, #3b82f6 100%);
}

/* Sombra para mockups de app */
.app-mockup-shadow {
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
}

/* Cartão com efeito glass */
.glass-card {
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.2);
}

/* Ícones Material Symbols */
.material-symbols-outlined {
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
}

/* Safe area para dispositivos com notch (iPhone X+, etc.) */
.safe-area-pb {
  padding-bottom: max(1rem, env(safe-area-inset-bottom));
}

/* Botões flutuantes acima da área segura (notch/home indicator) */
.whatsapp-fab {
  right: max(1rem, calc(1.5rem + env(safe-area-inset-right)));
  bottom: calc(5rem + env(safe-area-inset-bottom));
}
@media (min-width: 640px) {
  .whatsapp-fab {
    bottom: calc(6rem + env(safe-area-inset-bottom));
  }
}
.back-to-top-fab {
  right: max(1rem, calc(1.5rem + env(safe-area-inset-right)));
  bottom: calc(1.5rem + env(safe-area-inset-bottom));
}

/* Ajustes de toque em mobile */
@media (hover: none) and (pointer: coarse) {
  a, button {
    -webkit-tap-highlight-color: transparent;
  }
}