/* ════════════════════════════════════════════════════════════
   asesoria.css — Test de asesoría gratuita (botón flotante + modal)
   Cargado globalmente desde _header.php. Prefijo .asr-
   ════════════════════════════════════════════════════════════ */
:root{
  --asr-green:#649733; --asr-green-d:#4f7a28; --asr-cream:#f7f8f3;
  --asr-line:#e6e8e0; --asr-ink:#1d2410; --asr-gris:#6b7280; --asr-acc:#bfff7a;
}

/* ── Punto pulsante — standalone (nav, página /asesoria) ── */
.asr-dot{
  display:inline-block;width:9px;height:9px;border-radius:50%;
  background:var(--asr-acc);flex-shrink:0;
  animation:asr-ring 2.6s infinite;
}
@media (prefers-reduced-motion:reduce){ .asr-dot{animation:none} }

/* ── Botón flotante (FAB) ── */
.asr-fab{
  position:fixed;
  bottom:calc(1.5rem + env(safe-area-inset-bottom,0px));
  right:1.5rem;
  z-index:204;
  display:inline-flex;align-items:center;gap:9px;
  background:var(--asr-green);color:#fff;border:none;cursor:pointer;
  padding:13px 19px;border-radius:40px;
  font-size:.95rem;font-weight:700;font-family:inherit;line-height:1;
  box-shadow:0 8px 22px rgba(79,122,40,.38);
  animation:asr-bob 2.6s ease-in-out infinite;
}
.asr-fab:hover{background:var(--asr-green-d)}
.asr-fab .asr-dot{
  width:9px;height:9px;border-radius:50%;background:var(--asr-acc);
  animation:asr-ring 2.6s infinite;flex-shrink:0;
}
.asr-fab svg{display:block}
@keyframes asr-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes asr-ring{0%{box-shadow:0 0 0 0 rgba(191,255,122,.6)}70%{box-shadow:0 0 0 11px rgba(191,255,122,0)}100%{box-shadow:0 0 0 0 rgba(191,255,122,0)}}
@media (prefers-reduced-motion:reduce){
  .asr-fab,.asr-fab .asr-dot{animation:none}
}
/* Subir el flotante de favoritos para que no choque con el de asesoría */
.fav-float{ bottom:calc(1.5rem + 62px + env(safe-area-inset-bottom,0px)) !important; }

@media (max-width:480px){
  .asr-fab{padding:12px 16px;font-size:.86rem;right:1rem;bottom:calc(1rem + env(safe-area-inset-bottom,0px))}
  .fav-float{ bottom:calc(1rem + 58px + env(safe-area-inset-bottom,0px)) !important; }
}
/* El solape con el banner de cookies se resuelve dinámicamente en js/asesoria.js
   (adjustFab): solo sube el FAB cuando de verdad se pisarían; si no, ambos abajo. */

/* ── Overlay + modal ── */
.asr-overlay{
  position:fixed;inset:0;z-index:1000;
  background:rgba(20,28,10,.5);
  display:flex;align-items:center;justify-content:center;
  padding:16px;overflow-y:auto;
  opacity:0;transition:opacity .2s ease;
}
.asr-overlay.asr-show{opacity:1}
.asr-overlay[hidden]{display:none}
body.asr-lock{overflow:hidden}

.asr-modal{
  background:#fff;width:100%;max-width:430px;border-radius:18px;overflow:hidden;
  box-shadow:0 24px 64px rgba(0,0,0,.32);
  transform:translateY(10px);transition:transform .2s ease;
  font-family:inherit;color:var(--asr-ink);
  display:flex;flex-direction:column;
  max-height:calc(100vh - 32px);
  max-height:calc(100dvh - 32px);
}
.asr-overlay.asr-show .asr-modal{transform:translateY(0)}

.asr-head{
  position:relative;background:var(--asr-green);color:#fff;padding:20px 22px;
  flex:0 0 auto;
}
.asr-tag{
  display:inline-block;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;
  background:rgba(255,255,255,.22);padding:5px 11px;border-radius:20px;margin-bottom:11px;font-weight:600;
}
.asr-hook{font-size:1.28rem;line-height:1.3;font-weight:800;margin:0}
.asr-hook u{text-decoration-color:var(--asr-acc);text-underline-offset:3px}
.asr-close{
  position:absolute;top:14px;right:14px;width:30px;height:30px;border-radius:50%;
  border:none;background:rgba(255,255,255,.2);color:#fff;font-size:18px;line-height:1;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
}
.asr-close:hover{background:rgba(255,255,255,.35)}

.asr-body{padding:20px 22px 22px;flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch}

.asr-progress{display:flex;gap:6px;margin-bottom:16px}
.asr-progress span{height:5px;border-radius:4px;flex:1;background:var(--asr-line);transition:background .2s}
.asr-progress span.on{background:var(--asr-green)}

.asr-qnum{font-size:.74rem;color:var(--asr-gris);letter-spacing:.04em;margin-bottom:6px}
.asr-q{font-size:1.05rem;font-weight:700;line-height:1.4;margin:0 0 15px}

.asr-opts{display:flex;gap:8px;flex-wrap:wrap}
.asr-opt{
  flex:1;min-width:84px;padding:11px 6px;border:1.5px solid var(--asr-line);background:#fff;
  border-radius:12px;font-size:.86rem;font-weight:600;color:var(--asr-ink);cursor:pointer;
  font-family:inherit;transition:border-color .15s,background .15s,color .15s;
}
.asr-opt:hover{border-color:var(--asr-green);color:var(--asr-green-d)}
.asr-opt.sel{border-color:var(--asr-green);background:var(--asr-cream);color:var(--asr-green-d)}

.asr-saber{
  background:var(--asr-cream);border:1px dashed var(--asr-green);border-radius:12px;
  padding:13px 15px;margin-top:14px;font-size:.88rem;line-height:1.55;color:#33401d;
}
.asr-saber b{color:var(--asr-green-d)}

.asr-foot{margin-top:17px}
.asr-next{
  width:100%;padding:14px;border:none;border-radius:14px;background:var(--asr-green);color:#fff;
  font-size:1rem;font-weight:700;cursor:pointer;font-family:inherit;
}
.asr-next:hover{background:var(--asr-green-d)}
.asr-next[disabled]{opacity:.45;cursor:not-allowed}
.asr-hint{display:block;text-align:center;color:var(--asr-gris);margin-top:10px;font-size:.76rem}

/* ── Pantalla de resultado ── */
.asr-result{text-align:center;padding:6px 2px}
.asr-result-ico{font-size:2.2rem;line-height:1;margin-bottom:8px}
.asr-result h3{font-size:1.2rem;font-weight:800;margin:0 0 10px;color:var(--asr-ink)}
.asr-result p{font-size:.95rem;line-height:1.55;color:#3a4528;margin:0 0 18px}
.asr-cta{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;width:100%;
  padding:15px;border:none;border-radius:14px;background:var(--asr-green);color:#fff;
  font-size:1.02rem;font-weight:700;cursor:pointer;text-decoration:none;font-family:inherit;
}
.asr-cta:hover{background:var(--asr-green-d)}
.asr-cta svg{display:block}
.asr-restart{
  display:inline-block;margin-top:12px;background:none;border:none;color:var(--asr-gris);
  font-size:.8rem;cursor:pointer;text-decoration:underline;font-family:inherit;
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE — casos límite
   ════════════════════════════════════════════════════════════ */
/* Portrait estrecho (≤400px): las 3 opciones apiladas en vertical,
   más legibles y sin recortar "No estoy seguro". */
@media (max-width:400px){
  .asr-overlay{padding:10px}
  .asr-opts{flex-direction:column;gap:7px}
  .asr-opt{min-width:0;width:100%}
}
/* Móvil landscape / alturas bajas (≤430px de alto): se compacta la
   cabecera y el cuerpo hace scroll interno; cerrar siempre visible. */
@media (max-height:430px){
  .asr-overlay{padding:10px}
  .asr-head{padding:12px 20px}
  .asr-tag{margin-bottom:6px}
  .asr-hook{font-size:1.06rem;line-height:1.25}
  .asr-body{padding:13px 20px 16px}
  .asr-progress{margin-bottom:11px}
  .asr-q{font-size:.98rem;margin-bottom:11px}
  .asr-saber{padding:10px 13px;margin-top:11px}
  .asr-foot{margin-top:12px}
}