:root {
  --fnh-orange: #e65c33;
  --fnh-orange-hover: #f37348;
  --fnh-text-main: #ffffff;
  --fnh-bg-overlay-top: rgba(8, 24, 30, 0.90);     /* antes: rgba(4,32,75,0.95) */
  --fnh-bg-overlay-bottom: rgba(7, 22, 26, 0.94);  /* antes: rgba(4,32,75,0.95) */
}

.fnh-page {
  position: relative !important;

  /* OCUPAR SIEMPRE TODO EL ALTO DEL NAVEGADOR */
  min-height: 100vh !important;

  /* OCUPAR TODO EL ANCHO AUNQUE EL THEME TENGA UN CONTENEDOR ESTRECHO */
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;

  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  padding: 40px 16px 40px !important;
  overflow: hidden !important;
  color: var(--fnh-text-main) !important;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI" ,
    sans-serif !important;

  /* FONDO DIRECTO, SIN ::before / ::after */
  background:
    radial-gradient(circle at bottom, transparent, #00000070),
    linear-gradient(
      to bottom,
      var(--fnh-bg-overlay-top) 0%,
      rgba(8, 24, 30, 0.88) 35%,
      rgba(8, 24, 30, 0.88) 70%,
      var(--fnh-bg-overlay-bottom) 100%
    ),
    url("hermosa-vista-de-viaje-en-montenegro.jpg") center/cover no-repeat !important;
  background-attachment: fixed !important; /* opcional, efecto “parallax” suave */
}



/* CABECERA / LOGO */
.fnh-header {
  margin-bottom: 80px !important;
  text-align: center !important;
}

.fnh-logo {
  max-width: 260px !important;
  width: 60vw !important;
  height: auto !important;
}

/* CONTENEDOR DEL FORMULARIO (sin tarjeta azul, solo maquetación) */
.fnh-form-shell {
  width: 100% !important;
  max-width: 1100px !important;
}

.fnh-form-card {
  background: transparent !important;
  padding: 0 !important;
}

/* GRID PRINCIPAL */
.fnh-fields-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 40px 60px !important;
}

/* LABELS E INPUTS */
.fnh-field {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.fnh-field label {
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
  color: var(--fnh-text-main);
	margin-bottom: 25px !important;
}

/* MUY importante el !important para sobreescribir estilos del theme */
.fnh-form-card .fnh-input-pill {
  width: 100% !important;
  padding: 26px 30px !important;
  border-radius: 999px !important;
  border: none !important;
  outline: none !important;
  background: var(--fnh-orange) !important;
  color: #ffffff !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  box-shadow: 0 18px 35px rgba(0, 0, 0, 0.45) !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease,
    background 0.15s ease !important;
}

.fnh-form-card .fnh-input-pill::placeholder {
  color: rgba(255, 255, 255, 0.9) !important;
}

.fnh-form-card .fnh-input-pill:focus {
  transform: translateY(-2px);
  box-shadow: 0 24px 40px rgba(0, 0, 0, 0.55);
  background: var(--fnh-orange-hover) !important;
}

/* SECCIÓN CHECKBOXES */
.fnh-info-section {
  margin-top: 70px !important;
}

.fnh-info-title {
  font-size: 2rem !important;
  font-weight: 700 !important;
  margin-bottom: 24px !important;
	color: #fff !important;
}

/* Lista vertical de checks */
.fnh-checkbox-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

.fnh-checkbox-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 14px !important;
  font-size: 1rem !important;
  cursor: pointer !important;
  user-select: none !important;
  color: #fff !important;
}

.fnh-checkbox-item input {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.fnh-checkbox-item span{
	color: #fff !important;
	font-size: 1rem !important;
}

/* Cuadradito naranja */
.fnh-fake-checkbox {
  width: 22px !important;
  height: 22px !important;
  border-radius: 3px !important;
  border: none !important;
  background: transparent !important;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4) !important;
  background-color: var(--fnh-orange) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease,
    background 0.15s ease !important;
}

.fnh-fake-checkbox svg {
  width: 16px !important;
  height: 16px !important;
  opacity: 0 !important;
}

/* estado checked: mantiene el fondo y muestra el tick */
.fnh-checkbox-item input:checked + .fnh-fake-checkbox {
  transform: translateY(-1px) !important;
  box-shadow: 0 14px 26px rgba(0, 0, 0, 0.55) !important;
}

.fnh-checkbox-item input:checked + .fnh-fake-checkbox svg {
  opacity: 1 !important;
}

/* BOTÓN ENVIAR */
.fnh-actions {
  margin-top: 80px !important;
  text-align: center !important;
}

.fnh-btn-submit {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 210px !important;
  padding: 16px 48px !important;
  border-radius: 999px !important;
  border: none !important;
  background: var(--fnh-orange) !important;
  color: #ffffff !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  cursor: pointer !important;
  box-shadow: 0 22px 36px rgba(0, 0, 0, 0.6) !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease,
    background 0.15s ease, opacity 0.15s ease !important;
}

.fnh-btn-submit:hover {
  background: var(--fnh-orange-hover) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 26px 44px rgba(0, 0, 0, 0.7) !important;
}

.fnh-btn-submit:active {
  transform: translateY(0) !important;
  box-shadow: 0 18px 28px rgba(0, 0, 0, 0.6) !important;
}

/* Loader dentro del botón */
.fnh-btn-loader {
  display: none !important;
  margin-left: 10px !important;
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  border: 2px solid rgba(255, 255, 255, 0.4) !important;
  border-top-color: #ffffff !important;
  animation: fnh-spin 0.6s linear infinite !important;
}

.fnh-btn-submit.is-loading {
  opacity: 0.9 !important;
  cursor: wait !important;
}

.fnh-btn-submit.is-loading .fnh-btn-loader {
  display: inline-block !important;
}

.fnh-btn-submit.is-loading .fnh-btn-label {
  opacity: 0.8 !important;
}

/* Animación loader */
@keyframes fnh-spin {
  from {
    transform: rotate(0) !important;
  }
  to {
    transform: rotate(360deg) !important;
  }
}

/* MENSAJE DE ESTADO */
.fnh-form-status {
  margin-top: 14px !important;
  font-size: 0.95rem !important;
  min-height: 1.2em !important;
}

.fnh-form-status--ok {
  color: #9ff2b8 !important;
}

.fnh-form-status--error {
  color: #ffd3d3 !important;
}

/* RESPONSIVE */
@media (max-width: 960px) {
  .fnh-header {
    margin-bottom: 50px !important;
  }

  .fnh-fields-grid {
    gap: 30px 30px !important;
  }
}

@media (max-width: 768px) {
  .fnh-page {
    padding-top: 28px !important;
  }

  .fnh-header {
    margin-bottom: 40px !important;
  }

  .fnh-fields-grid {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }

  .fnh-info-section {
    margin-top: 40px !important;
  }

  .fnh-info-title {
    font-size: 1.6rem !important;
  }

  .fnh-actions {
    margin-top: 50px !important;
  }
}
/* ESTADOS DE ERROR EN CAMPOS */
.fnh-field--error .fnh-input-pill {
  border: 2px solid #ffd3d3 !important;
  box-shadow: 0 0 0 1px rgba(255, 211, 211, 0.3) !important;
}

.fnh-field-error,
#fnh-info-error {
  margin: 4px 0 0 !important;
  font-size: 0.8rem !important;
  line-height: 1.3 !important;
  color: #ffd3d3 !important;
  min-height: 1em !important;
}

.fnh-info-section--error .fnh-info-title {
  color: #ffd3d3 !important;
}

/* Quitar padding y fondo de Enfold en la página del formulario */
body.page-id-26296 main.template-page.content.av-content-full.alpha.units {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  background: transparent !important;
}

/* Por si Enfold aplica algo adicional al wrapper interno */
body.page-id-26296 .post-entry-26296 .entry-content-wrapper {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  background: transparent !important;
}

/* Fondo general oscuro para que ningún hueco se vea blanco */
body.page-id-26296,
body.page-id-26296 #main,
body.page-id-26296 .container.av-section-cont-open {
  background: transparent !important;
}
