/* ==========================================================================
   CONSULTA — componente compartido de las páginas de /preguntas (15/10/2026).
   [stated] Damián: "la finalidad de todo esto es que la gente deje una
   consulta" y "que siempre esté ... un cartel en todos lados donde diga
   explícitamente que la información ... es aproximada".
   · .aviso-top: franja fija debajo del menú, visible siempre al bajar.
   · #consulta: sección con el formulario (lo arma consulta.js).
   Usa los tokens de base.css; los valores después de la coma son el respaldo
   para páginas que no lo cargan (el índice de preguntas).
   ========================================================================== */

/* Franja de aviso (va adentro del <header>, así queda fija con el menú) */
.aviso-top{background:#fff8e6;border-top:1px solid #f2d27a;border-bottom:1px solid #f2d27a}
.aviso-top .in{display:flex;align-items:center;justify-content:space-between;gap:10px 18px;padding-block:8px}
.aviso-top p{margin:0;font-size:14px;line-height:1.4;color:#5c4300}
.aviso-top p b{color:#3d2c00}
.aviso-top .tic{width:18px;height:18px;color:#c98a00;vertical-align:-4px;margin-right:6px}
.aviso-top a{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;padding:7px 14px;font-size:14px;font-weight:800;color:#2b2000;text-decoration:none;border-radius:2px;background:linear-gradient(180deg,#ffd666 0%,#ffbf2e 60%,#f2a900 100%);border:1px solid #b88a00;box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 2px 0 #b88a00;white-space:nowrap}
.aviso-top a::after{content:"→"}
.aviso-top a:hover{filter:brightness(1.05)}
@media(max-width:640px){
  .aviso-top .in{padding-block:6px;gap:8px}
  .aviso-top p{font-size:12.5px}
  .aviso-top p .largo{display:none}
  .aviso-top a{padding:6px 10px;font-size:13px}
}

/* Recomendación al final de cada sección: "si querés el detalle, dejá tu consulta" */
.sec-cta{margin-top:26px;display:flex;flex-wrap:wrap;gap:14px 20px;align-items:center;justify-content:space-between;background:#fff;border:1px solid var(--borde-card,#c3d1e3);border-left:4px solid #f2b705;border-radius:4px;box-shadow:0 1px 2px rgba(19,43,69,.05),0 10px 22px -16px rgba(19,43,69,.4);padding:16px 20px}
.sec-cta p{margin:0;font-size:15.5px;color:#3a4a5e;max-width:66ch}
.sec-cta p b{color:var(--ink,#14233a)}
.sec-azul .sec-cta{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.22);border-left-color:#ffc93c;box-shadow:none}
.sec-azul .sec-cta p{color:#ebe4f4}
.sec-azul .sec-cta p b{color:#fff}

/* Sección de consulta: texto persuasivo en azul lleno + formulario en tarjeta blanca */
.consulta-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:28px;align-items:stretch}
.consulta-tx{background:linear-gradient(140deg,var(--azul-noche,#341a58) 0%,var(--azul,#4b2380) 100%);color:#fff;border-radius:4px;padding:30px;display:grid;gap:14px;align-content:start;box-shadow:0 24px 48px -24px rgba(75,35,128,.7)}
.consulta-tx .eyebrow{color:var(--verde-claro,#b6aacb)}
.consulta-tx h2{color:#fff;margin:0}
.consulta-tx p{color:#ebe4f4;font-size:16px}
.consulta-pts{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:10px}
.consulta-pts li{display:flex;gap:10px;align-items:flex-start;font-weight:600}
.consulta-pts li::before{content:"✓";color:var(--acento-osc,#c4b9d7);font-weight:900}
.consulta-nota{margin-top:6px;border-left:3px solid #ffc93c;padding-left:14px;font-size:14px;color:#dfd6eb}

.cf{background:#fff;border:1px solid var(--borde-card,#c3d1e3);border-top:4px solid var(--verde,#8a6cc0);border-radius:4px;box-shadow:0 2px 4px rgba(19,43,69,.06),0 22px 44px -24px rgba(19,43,69,.5);padding:26px;display:grid;gap:14px;align-content:start;color:var(--ink,#14233a)}
/* Bloque de botones (15/10/2026). [stated] Damián: "que cada botón redirija directamente al formulario
   correspondiente ... no que pongas directamente un formulario". Ya no hay formulario embebido: cada
   botón lleva al formulario de la landing (cotizar, asesor, planes, asociarme). */
.cf-links .btn{width:100%}
.cf-links .btn-big{justify-content:space-between}
.cf-form{display:grid;gap:14px}
.cf button{font-family:inherit}
.cf h3{margin:0;font-size:22px;font-weight:900;color:var(--azul,#4b2380);line-height:1.2}
.cf-sub{font-size:14.5px;color:var(--muted,#5a6b80);margin:-6px 0 0}
.cf-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px}
.cf-f{display:grid;gap:5px;min-width:0}
.cf-f.full{grid-column:1/-1}
.cf-f label,.cf-f .lbl{font-size:13px;font-weight:700}
.cf-f input,.cf-f select,.cf-f textarea{font:inherit;font-size:16px;color:var(--ink,#14233a);background:#fff;border:1px solid #bcb1ca;border-radius:2px;padding:10px 12px;width:100%;min-width:0}
.cf-f textarea{min-height:76px;resize:vertical}
.cf-f input:focus,.cf-f select:focus,.cf-f textarea:focus{outline:2px solid var(--verde-claro,#b6aacb);outline-offset:1px;border-color:var(--verde,#8a6cc0)}
.cf-f.falta input,.cf-f.falta select,.cf-f.falta textarea,.cf-f.falta .seg{border-color:#c0392b;background:#fff6f5}
.cf .seg{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--ink,#14233a);border-radius:2px;max-width:220px}
.cf .seg button{border:0;background:#fff;font:inherit;font-weight:700;font-size:14px;padding:9px 0;cursor:pointer;color:var(--ink,#14233a)}
.cf .seg button[aria-pressed="true"]{background:var(--ink,#14233a);color:#fff}
.cf-socio{display:none;background:#eef3f9;border-left:3px solid var(--azul,#4b2380);padding:12px 14px;font-size:14px;color:#3a4a5e}
.cf-socio.on{display:block}
.cf-socio a{color:var(--azul,#4b2380);font-weight:800}
.cf-consent{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--muted,#5a6b80)}
.cf-consent input{margin-top:3px;width:18px;height:18px;flex:0 0 auto}
.cf-consent a{color:var(--azul,#4b2380)}
.cf-consent.falta{color:#c0392b}
.cf-err{display:none;background:#fff6f5;border-left:3px solid #c0392b;color:#8a2a1f;padding:10px 12px;font-size:14px}
.cf-err.on{display:block}
.cf-send{width:100%;justify-content:space-between}
.cf-pie{font-size:12.5px;color:var(--muted,#5a6b80);text-align:center}
.cf-conf,.cf-ok{display:none;text-align:center;gap:12px;justify-items:center}
.cf-conf.on,.cf-ok.on{display:grid}
.cf-conf strong{font-size:28px;font-weight:900;color:var(--azul,#4b2380);letter-spacing:.02em}
.cf-conf .botones{display:grid;gap:8px;width:100%;max-width:320px}
.cf-ok .ico{width:56px;height:56px;border-radius:50%;background:#f3f1f6;color:var(--verde,#8a6cc0);display:grid;place-items:center;font-size:28px;font-weight:900}
.cf-ok h3{color:var(--verde,#8a6cc0)}
.cf-ok p{color:#3a4a5e;max-width:44ch}
.cf.paso-conf .cf-form,.cf.paso-ok .cf-form{display:none}

@media(max-width:960px){.consulta-grid{grid-template-columns:1fr}}
@media(max-width:640px){
  .cf{padding:20px 16px}
  .cf-grid{grid-template-columns:1fr}
  .consulta-tx{padding:24px 20px}
}
