/* ============================================================
   WICA — Estilos complementarios
   El diseño principal ahora vive en "tailwind.css" (archivo
   estático ya compilado, cargado antes que este). Este archivo
   solo cubre comportamiento adicional que Tailwind no incluye:
   1) scroll suave
   2) estado visual del navbar al hacer scroll
   3) apertura del menú móvil
   4) bloque de éxito del formulario
   ============================================================ */

html {
  scroll-behavior: smooth;
}

body {
  overflow-x: hidden;
}

/* Deja espacio suficiente para las cuatro líneas del título en móvil. */
.mobile-hero-photo {
  height: 32rem;
}

/* Header: transición suave entre estado transparente y con fondo */
#navbar {
  will-change: background-color, border-color;
}
#navbar.is-scrolled {
  background-color: rgba(247, 250, 251, 0.85);
  backdrop-filter: blur(8px);
  border-bottom-color: #D8DEE1;
}
#navbar.is-scrolled #navbar-brand,
#navbar.is-scrolled .navbar-link {
  color: #1E2A3D;
}
#navbar.is-scrolled #navbar-brand:hover {
  color: #1E2A3D;
}
#navbar.is-scrolled .navbar-link:hover {
  color: #1E3A5F;
}
#navbar.is-scrolled #menu-toggle {
  color: #1E2A3D;
}

/* Menú móvil */
#mobile-menu.is-open {
  display: block;
}

/* Bloque de éxito del formulario */
#form-success.is-visible {
  display: flex;
}

/* Bloque de error del formulario (faltan campos obligatorios) */
.form-error-box {
  border: 1px solid rgba(185, 28, 28, 0.3);
  background-color: rgba(185, 28, 28, 0.08);
  color: #B91C1C;
}