/* ============================================================
   Quiz "¿En qué etapa está tu marca?" — modal sobre el home.
   Carga condicional (is_front_page()). Usa los tokens del
   design system; mobile-first.
   ============================================================ */

.cwq{position:fixed;inset:0;z-index:200}
.cwq[hidden]{display:none}
.cwq__backdrop{position:absolute;inset:0;background:rgba(13,24,41,.62);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}

.cwq__dialog{position:relative;margin:4vh auto 0;width:min(840px,94vw);max-height:92vh;overflow:auto;
  background:var(--paper);border-radius:var(--radius-card);padding:34px 28px 28px;
  box-shadow:0 30px 80px rgba(0,0,0,.35)}
@media(min-width:700px){.cwq__dialog{margin-top:6vh;padding:44px 52px 36px}}

.cwq__x{position:absolute;top:14px;right:16px;background:none;border:none;font-size:26px;line-height:1;
  cursor:pointer;color:var(--ink);padding:6px;transition:transform var(--speed) var(--ease)}
.cwq__x:hover{transform:rotate(90deg)}

.cwq__head{text-align:center;margin-bottom:26px}
.cwq__head .kicker{margin-bottom:16px}
.cwq__progress-label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#555;display:block;margin-bottom:8px}
.cwq__progress-bar{height:2px;background:rgba(0,0,0,.12);border-radius:2px;overflow:hidden}
.cwq__progress-bar span{display:block;height:100%;width:0;background:var(--ink);transition:width .4s var(--ease)}

/* Transición suave entre preguntas */
.cwq__body{opacity:0;transform:translateY(10px);transition:opacity .35s var(--ease),transform .35s var(--ease)}
.cwq__body.cwq--in{opacity:1;transform:none}

.cwq__pregunta{font-family:var(--font-display);font-weight:400;font-size:clamp(20px,2.6vw,26px);line-height:1.3;
  text-align:center;margin-bottom:26px}
.cwq__campo{display:flex;flex-direction:column;gap:12px}

/* Opción múltiple */
.cwq__opcion{font-family:var(--font-body);font-size:.95em;text-align:left;padding:18px 22px;border:1px solid var(--ink);
  border-radius:var(--radius-card);background:transparent;color:var(--ink);cursor:pointer;line-height:1.45;
  transition:background var(--speed) var(--ease),color var(--speed) var(--ease),transform var(--speed) var(--ease)}
.cwq__opcion:hover,.cwq__opcion:focus-visible{transform:translateY(-2px)}
.cwq__opcion.selected,.cwq__opcion:active{background:var(--ink);color:#fff}

/* Escala con etiquetas (pills) */
.cwq__etiquetas{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:560px){.cwq__etiquetas{grid-template-columns:repeat(4,1fr)}}
.cwq__etiqueta{font-family:var(--font-body);font-size:13px;letter-spacing:.04em;padding:16px 12px;text-align:center;
  border:1px solid var(--ink);border-radius:var(--radius-btn);background:transparent;color:var(--ink);cursor:pointer;
  transition:background var(--speed) var(--ease),color var(--speed) var(--ease),transform var(--speed) var(--ease)}
.cwq__etiqueta:hover,.cwq__etiqueta:focus-visible{transform:translateY(-2px)}
.cwq__etiqueta.selected,.cwq__etiqueta:active{background:var(--ink);color:#fff}

/* Escala 1–10 */
.cwq__escala{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
@media(min-width:560px){.cwq__escala{grid-template-columns:repeat(10,1fr)}}
.cwq__num{aspect-ratio:1;border:1px solid var(--ink);border-radius:50%;background:transparent;color:var(--ink);
  font-family:var(--font-body);font-size:14px;cursor:pointer;
  transition:background var(--speed),color var(--speed),transform var(--speed)}
.cwq__num:hover,.cwq__num.selected{background:var(--ink);color:#fff;transform:translateY(-2px)}

/* Reparto de 100 puntos */
.cwq__reparto{display:flex;flex-direction:column;gap:8px;font-size:13.5px}
.cwq__reparto input[type=range]{width:100%;accent-color:var(--ink)}
.cwq__total{text-align:center;font-size:13px;color:#a33}
.cwq__total--ok{color:var(--ink)}
.cwq__continuar{align-self:center;margin-top:8px}
.cwq__continuar:disabled{opacity:.35;cursor:not-allowed;transform:none}

/* Texto libre */
.cwq__texto{font-family:var(--font-body);font-size:15px;padding:16px 18px;border:1px solid var(--ink);
  border-radius:var(--radius-card);width:100%}
.cwq__texto:focus{outline:2px solid var(--ink);outline-offset:2px}

.cwq__foot{margin-top:22px;min-height:20px}
.cwq__back{background:none;border:none;font-family:var(--font-body);font-size:12px;letter-spacing:.12em;
  text-transform:uppercase;color:#555;cursor:pointer;padding:4px 0;border-bottom:1px solid transparent;
  transition:color var(--speed),border-color var(--speed)}
.cwq__back:hover{color:var(--ink);border-bottom-color:currentColor}

/* Resultado */
.cwq__resultado{text-align:center;display:flex;flex-direction:column;align-items:center;gap:16px}
.cwq__titular{font-family:var(--font-display);font-style:italic;font-weight:600;font-size:clamp(22px,3vw,30px);line-height:1.25}
.cwq__diagnostico{font-size:14px;max-width:560px;color:#333}
.cwq__continuar-res{margin-top:14px}

/* Bloque de cierre — diseño de Calu (2026-07-06): tarjeta clara con
   divisor, preguntas numeradas centradas y banda negra inferior. */
.cwq__regalo{margin-top:22px;width:100%;border:1px solid rgba(0,0,0,.12);border-radius:20px;overflow:hidden;
  display:flex;flex-direction:column;box-shadow:0 10px 34px rgba(0,0,0,.07)}
.cwq__regalo-contenido{padding:28px 26px 26px;display:flex;flex-direction:column;gap:16px;align-items:center}
@media(min-width:700px){.cwq__regalo-contenido{padding:32px 46px 30px}}
.cwq__gift-icon{width:30px;height:30px;color:var(--ink)}
.cwq__regalo-oferta{font-size:14px;font-weight:600;line-height:1.55;max-width:560px;text-align:center}
.cwq__regalo-hr{border:none;border-top:1px solid rgba(0,0,0,.25);width:100%;margin:4px 0 6px}

/* Preguntas de calificación: una columna, centradas y numeradas */
.cwq__calif{display:flex;flex-direction:column;gap:26px;width:100%;text-align:center}
.cwq__calif-item{display:flex;flex-direction:column;gap:12px;font-size:12.5px;align-items:center}
.cwq__calif-titulo{font-weight:600;font-size:14px}
.cwq__calif-item input[type=range]{width:min(420px,100%);accent-color:var(--ink)}
.cwq__anclas{display:flex;justify-content:space-between;gap:14px;font-size:10.5px;color:#999;width:min(460px,100%)}
.cwq__anclas i{font-style:normal;flex:1;line-height:1.35}
.cwq__anclas i:first-child{text-align:left}
.cwq__anclas i:last-child{text-align:right}

/* Presupuesto: grilla 2×2 compacta */
.cwq__presu{display:grid;grid-template-columns:1fr;gap:12px;width:100%;max-width:520px}
@media(min-width:560px){.cwq__presu{grid-template-columns:1fr 1fr}}
.cwq__presu-op{font-family:var(--font-body);font-size:12px;text-align:center;padding:14px 16px;border:1px solid rgba(0,0,0,.35);
  border-radius:var(--radius-btn);background:transparent;color:var(--ink);cursor:pointer;line-height:1.4;
  transition:background var(--speed),color var(--speed),border-color var(--speed)}
.cwq__presu-op:hover{border-color:var(--ink)}
.cwq__presu-op.selected{background:var(--ink);color:#fff;border-color:var(--ink)}

/* Banda negra inferior: nombre + correo + ENVÍAMELO + privacidad */
.cwq__banda{background:var(--ink);padding:22px 26px 14px;display:flex;flex-direction:column;gap:8px}
@media(min-width:700px){.cwq__banda{padding:26px 46px 16px}}
.cwq__banda-campos{display:flex;flex-direction:column;gap:12px}
@media(min-width:640px){.cwq__banda-campos{flex-direction:row;align-items:stretch}}
.cwq__banda-campos input{flex:1;font-family:var(--font-body);font-size:13px;padding:14px 16px;
  border:none;border-radius:4px;background:#fff;color:var(--ink)}
.cwq__banda-campos input::placeholder{color:#777}
.cwq__enviar{font-family:var(--font-body);font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  padding:14px 28px;border:1px solid #fff;border-radius:var(--radius-btn);background:transparent;color:#fff;
  cursor:pointer;white-space:nowrap;transition:background var(--speed) var(--ease),color var(--speed) var(--ease)}
.cwq__enviar:hover{background:#fff;color:var(--ink)}
.cwq__privacidad{font-size:10.5px;color:rgba(255,255,255,.75);text-decoration:none;align-self:flex-start}
a.cwq__privacidad:hover{color:#fff;text-decoration:underline}
.cwq__msg{font-size:13px;color:#fff}
.cwq__msg a{color:#fff;text-decoration:underline}

/* CTA del servicio: al final y discreto — enlace subrayado, no botón */
.cwq__cta-servicio{margin-top:18px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  color:#555;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px;
  transition:color var(--speed)}
.cwq__cta-servicio:hover{color:var(--ink)}


@media(prefers-reduced-motion:reduce){
  .cwq__body{opacity:1;transform:none;transition:none}
}