/* IMPERAX — Landing de rescate WordPress
   Hereda el sistema de styles.css sin excepciones: Obsidiana, Nieve, Platino,
   Geist y el verde de WhatsApp como único acento. Aquí sólo vive lo propio de
   esta página: disponibilidad, tarjetas de síntoma, precios y formulario. */

/* ---------- Estado de disponibilidad ---------- */
.disponibilidad{display:inline-flex; align-items:center; gap:11px; margin-top:36px;
  padding:11px 20px; border-radius:100px; border:1px solid var(--linea-d);
  font-size:.9rem; color:#b4b4bb;}
.disponibilidad::before{content:""; width:8px; height:8px; border-radius:50%; background:#3a3a40; flex:none;}
.disponibilidad[data-estado="disponible"]::before{background:var(--wa); animation:latir 2s ease-in-out infinite;}
.disponibilidad[data-estado="proxima"]::before{background:var(--platino);}
.disponibilidad[data-estado="sin-cupos"]::before{background:#5a5a60;}
.disponibilidad b{color:var(--nieve); font-weight:500;}

/* ---------- Garantías del hero ---------- */
.garantias{list-style:none; display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:14px 26px; margin-top:44px; max-width:820px;}
.garantias li{display:flex; gap:12px; font-size:.98rem; color:#b4b4bb; line-height:1.55;}
.garantias li::before{content:""; width:7px; height:7px; margin-top:8px; border-radius:50%;
  background:var(--wa); flex:none;}

/* ---------- Qué podemos revisar ---------- */
.sintomas{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1px;
  margin-top:64px; background:var(--linea-d); border:1px solid var(--linea-d);}
.claro .sintomas{background:var(--linea-c); border-color:var(--linea-c);}
.sintoma{background:#000; padding:30px 26px;
  transition:background-color .4s var(--curva), color .4s var(--curva);}
.claro .sintoma{background:var(--nieve);}
.sintoma h3{font-size:1.08rem; letter-spacing:-.03em; margin-bottom:10px;}
.sintoma p{font-size:.94rem; color:#8b8b92; line-height:1.6;}
.claro .sintoma p{color:#55555c;}
.sintoma:hover{background:var(--nieve); color:#000;}
.sintoma:hover p{color:#3a3a40;}
.claro .sintoma:hover{background:#000; color:var(--nieve);}
.claro .sintoma:hover p{color:#b6b6bd;}

/* ---------- Precios del rescate ---------- */
.tarifas{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:22px; margin-top:68px;}
.tarifa{border:1px solid var(--linea-d); border-radius:24px; padding:38px 32px;
  display:flex; flex-direction:column;}
.claro .tarifa{border-color:var(--linea-c);}
.tarifa.principal{background:var(--velo-1); border-color:rgba(245,245,247,.34);}
.claro .tarifa.principal{background:rgba(0,0,0,.04); border-color:rgba(0,0,0,.34);}
.tarifa .etiqueta{font-size:.68rem; letter-spacing:.28em; text-transform:uppercase;
  color:var(--platino); font-weight:600; margin-bottom:18px;}
.tarifa h3{font-size:1.4rem; letter-spacing:-.035em; margin-bottom:16px;}
.tarifa .cifra{font-size:clamp(1.9rem,3.4vw,2.5rem); font-weight:600; letter-spacing:-.05em; line-height:1;}
.tarifa .alterna{margin-top:10px; font-size:1rem; color:var(--platino);}
.tarifa .aclara{margin-top:16px; font-size:.9rem; color:var(--platino); line-height:1.65;}
.tarifa ul{list-style:none; margin:26px 0 30px; display:flex; flex-direction:column; gap:12px;}
.tarifa li{display:flex; gap:11px; font-size:.94rem; line-height:1.5; color:#b4b4bb;}
.claro .tarifa li{color:#3a3a40;}
.tarifa li::before{content:"✓"; flex:none; font-size:.84rem; opacity:.75;}
.tarifa li.no::before{content:"—"; opacity:.5;}
.tarifa li.no{color:var(--platino);}
.tarifa .btn{margin-top:auto; width:100%;}

/* ---------- Formulario del incidente ---------- */
.incidente{max-width:760px; margin-top:64px;}
.campo-grupo{display:grid; gap:22px;}
@media(min-width:720px){ .campo-grupo.dos{grid-template-columns:1fr 1fr;} }
.campo-form{display:flex; flex-direction:column; gap:9px;}
.campo-form label{font-size:.86rem; letter-spacing:.02em; color:#b4b4bb;}
.campo-form .pista{font-size:.82rem; color:#5a5a60; line-height:1.5;}
.campo-form input,.campo-form textarea,.campo-form select{
  font-family:inherit; font-size:1rem; color:var(--nieve); background:var(--velo-1);
  border:1px solid var(--linea-d); border-radius:14px; padding:14px 16px; min-height:52px;
  transition:border-color .25s var(--curva);}
.campo-form textarea{resize:vertical; min-height:120px; line-height:1.55;}
.campo-form select{appearance:none; -webkit-appearance:none; cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,#86868B 50%),linear-gradient(135deg,#86868B 50%,transparent 50%);
  background-position:calc(100% - 20px) 55%, calc(100% - 14px) 55%;
  background-size:6px 6px, 6px 6px; background-repeat:no-repeat; padding-right:44px;}
.campo-form input::placeholder,.campo-form textarea::placeholder{color:#5a5a60;}
.campo-form input:focus,.campo-form textarea:focus,.campo-form select:focus{
  outline:none; border-color:rgba(245,245,247,.5);}
.campo-form[data-error="si"] input,.campo-form[data-error="si"] textarea,.campo-form[data-error="si"] select{
  border-color:var(--nieve);}
.campo-error{font-size:.85rem; color:var(--nieve); min-height:0;}
.campo-error:empty{display:none;}

.trampa{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;}

.consentimiento-form{display:flex; gap:14px; align-items:flex-start; margin-top:28px; cursor:pointer;}
.consentimiento-form input{appearance:none; -webkit-appearance:none; flex:none; width:24px; height:24px;
  margin-top:1px; border:1px solid rgba(245,245,247,.4); border-radius:7px; cursor:pointer; background:none;
  transition:background-color .25s var(--curva), border-color .25s var(--curva);}
.consentimiento-form input:checked{background:var(--nieve); border-color:var(--nieve);}
.consentimiento-form input:checked::after{content:"✓"; display:block; text-align:center; color:#000;
  font-size:.9rem; line-height:22px;}
.consentimiento-form input:focus-visible{outline:2px solid var(--nieve); outline-offset:3px;}
.consentimiento-form span{font-size:.94rem; color:#96969d; line-height:1.6;}
.consentimiento-form a{color:var(--nieve); text-decoration:underline;}

.aviso-seguridad{margin-top:30px; border-left:2px solid var(--platino); padding:16px 22px;}
.aviso-seguridad p{font-size:.92rem; color:var(--platino); line-height:1.65;}
.aviso-seguridad strong{color:var(--nieve); font-weight:500;}

.envio{display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:34px;}
.envio .btn[disabled]{opacity:.5; pointer-events:none;}
.estado-envio{font-size:.92rem; color:var(--platino); line-height:1.6;}
.estado-envio.error{color:var(--nieve);}

/* ---------- Confirmación ---------- */
.confirmacion{border:1px solid var(--wa); border-radius:24px; padding:40px 34px;
  background:rgba(37,211,102,.06); margin-top:64px;}
.confirmacion h3{font-size:1.5rem; letter-spacing:-.035em; margin-bottom:16px;}
.confirmacion p{font-size:1rem; color:#b4b4bb; line-height:1.7; margin-bottom:12px;}
.folio{display:inline-block; margin:18px 0 26px; padding:12px 22px; border-radius:12px;
  border:1px dashed rgba(245,245,247,.34); font-size:1.15rem; font-weight:600; letter-spacing:.12em;}
.confirmacion .acciones{display:flex; gap:14px; flex-wrap:wrap;}

@media(prefers-reduced-motion:reduce){
  .disponibilidad[data-estado="disponible"]::before{animation:none;}
}


/* ===============================================================
   SUPERFICIE TACTIL MINIMA — accesibilidad (WCAG 2.5.8)
   Corrige los elementos por debajo de 44 px detectados en la
   auditoría. Solo amplía el área sensible: no cambia tipografía,
   color ni posición visual de ningún componente.
   =============================================================== */

.nav .brand,
.pie .brand,
.foot-col a,
.pie-corto a,
.social-proof,
.idioma button,
.idioma a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

/* Los enlaces del pie ocupan una fila completa: basta con separarlos
   verticalmente para que cada zona sensible alcance el mínimo. */
.foot-col a {
  padding: 10px 0;
}

.pie-corto a {
  padding: 12px 0;
}

/* Iconos sociales: el icono conserva su tamaño, el área crece. */
.social a {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Casillas de verificación: la etiqueta completa es el objetivo táctil,
   pero la casilla en sí también debe poder pulsarse con comodidad. */
.check input[type="checkbox"],
.consentimiento-form input[type="checkbox"] {
  width: 24px;
  height: 24px;
}

/* Campos trampa antispam: invisibles y sin superficie táctil real. */
.trampa,
.trampa input,
.trampa label {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}

/* El pie usa .foot-bottom y .foot-top: sus enlaces tambien deben
   alcanzar la superficie tactil minima. */
.foot-bottom a,
.foot-top .brand,
footer .brand {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  padding: 10px 0;
}