/* ============================================================================
   Formulario de consulta — auditoria elite 2026-09 (paquete B09)

   El sitio tenia 0 <form> en 29 paginas: la unica via de contacto era salir a
   WhatsApp o marcar un telefono. Quien no quiere hablar todavia no tenia por
   donde entrar.

   La tarjeta es BLANCA y vive dentro de una seccion OSCURA (.cta / .cta-final).
   Ese es justo el caso que rompe el resto del sitio: --gold e --muted estan
   redefinidos por el contexto oscuro, y heredados aqui dan 3:1 sobre blanco.
   Se restauran en la propia tarjeta (mismo criterio que .rev-card).
   ========================================================================== */
.fc-card{
  --gold:#7B612B; --muted:#6D6357;
  background:#fff; border-radius:12px; padding:34px 32px 30px;
  max-width:620px; margin:44px auto 0; text-align:left;
  box-shadow:0 18px 50px rgba(0,0,0,.22);
}
.fc-card h3{
  font-family:'Playfair Display',Georgia,serif; font-weight:600;
  font-size:23px; line-height:1.25; color:var(--ink,#0E0B09); margin:0 0 6px;
}
.fc-card .fc-sub{font-size:14px; color:var(--muted); margin:0 0 22px; line-height:1.55}

.fc-row{display:grid; grid-template-columns:1fr 1fr; gap:14px}
@media(max-width:620px){.fc-row{grid-template-columns:1fr}}

.fc-f{margin-top:14px}
.fc-f label{
  display:block; font-size:13px; font-weight:600;
  color:var(--text,#2A211B); margin:0 0 6px;
}
.fc-f .req{color:var(--ox,#7A2E2A); margin-left:2px}
.fc-f input,.fc-f select,.fc-f textarea{
  width:100%; padding:13px 14px; border:1px solid var(--line,#e4d9c7);
  border-radius:6px; font-family:inherit; font-size:15px; color:var(--text,#2A211B);
  background:var(--cream,#FBF7F0); min-height:46px;
}
.fc-f select{appearance:none; background-image:linear-gradient(45deg,transparent 50%,#6D6357 50%),linear-gradient(135deg,#6D6357 50%,transparent 50%); background-position:calc(100% - 19px) 21px,calc(100% - 14px) 21px; background-size:5px 5px,5px 5px; background-repeat:no-repeat; padding-right:38px}
.fc-f input:focus,.fc-f select:focus,.fc-f textarea:focus{border-color:var(--gold); outline:2px solid var(--gold); outline-offset:1px}
/* el navegador marca el campo invalido solo despues de intentar enviar */
.fc-f input[aria-invalid="true"],.fc-f select[aria-invalid="true"]{border-color:var(--ox,#7A2E2A); background:#fdf6f5}
.fc-card .fc-err{display:block; font-size:12.5px; color:var(--ox,#7A2E2A); margin-top:5px; font-weight:600}
.fc-card .fc-err:empty{margin:0}

/* preferencia de contacto: objetivo tactil completo, no solo el circulito */
.fc-pref{display:flex; gap:9px; flex-wrap:wrap; margin-top:7px}
.fc-pref label{
  display:inline-flex; align-items:center; gap:7px; margin:0;
  min-height:44px; padding:0 15px; border:1px solid var(--line,#e4d9c7);
  border-radius:999px; font-weight:500; cursor:pointer; background:var(--cream,#FBF7F0);
}
.fc-pref input{width:auto; min-height:0; accent-color:var(--gold)}
.fc-pref label:has(input:checked){border-color:var(--gold); background:#fff8ec}

.fc-consent{display:flex; gap:10px; align-items:flex-start; margin-top:20px}
/* 24x24 es el minimo de WCAG 2.5.8 para un objetivo tactil aislado */
.fc-consent input{width:auto; min-width:24px; min-height:24px; margin-top:0; accent-color:var(--gold)}
.fc-consent label{font-size:12.8px; font-weight:400; color:var(--muted); line-height:1.5; margin:0}
.fc-consent a{color:var(--gold); text-decoration:underline}

/* El oro de marca (#B08A3E) con texto blanco da 3.21:1 — reprueba AA. Es el
   mismo defecto que arrastran los demas botones del sitio y que se resuelve
   aparte; este boton nace nuevo, asi que nace pasando: #8c6f33 = 4.73:1 y ya
   es un color del sistema (es el hover de .mm-cta). */
.fc-card .fc-send{
  width:100%; margin-top:20px; min-height:52px; border:0; border-radius:8px;
  background:#8c6f33; color:#fff; cursor:pointer;
  font-family:inherit; font-size:15px; font-weight:700; letter-spacing:.3px;
}
.fc-card .fc-send:hover{background:#7B612B}
.fc-card .fc-send:disabled{opacity:.6; cursor:progress}

/* OJO: la tarjeta vive dentro de .cta / .cta-final, y esas secciones traen
   `.cta p{color:#D8CBB6}` — especificidad 0-1-1, le gana a `.fc-nota` 0-1-0.
   Sin el prefijo .fc-card, el aviso y el estado salen color crema sobre
   blanco: 1.6:1, ilegible. Todo lo que sea <p> va prefijado. */
.fc-card .fc-nota{font-size:12px; color:var(--muted); line-height:1.5; margin:16px 0 0; text-align:center}

/* respuesta del envio — se anuncia con aria-live, no solo con color */
.fc-card .fc-estado{margin-top:16px; font-size:14px; line-height:1.5; text-align:center; font-weight:600; color:var(--text,#2A211B)}
.fc-card .fc-estado:empty{margin:0}
.fc-card .fc-estado[data-tipo="ok"]{color:#1f6b3f}
.fc-card .fc-estado[data-tipo="error"]{color:var(--ox,#7A2E2A)}

/* trampa para bots: invisible para la vista y para el lector de pantalla,
   pero rellenable por un script automatico */
.fc-hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
