/* ═══════════════════════════════════════════════════════════
   QUIZ MODAL
   De-scoped from src/components/QuizModal.astro. Same
   declarations; Astro's [data-astro-cid-*] attribute removed.
═══════════════════════════════════════════════════════════ */
.qm-overlay{position:fixed;inset:0;background:rgba(35,32,28,.6);backdrop-filter:blur(4px);z-index:1003;
  display:none;align-items:center;justify-content:center;padding:18px;opacity:0;transition:opacity .25s}
.qm-overlay.open{display:flex;opacity:1}
.qm-card{background:#fff;border-radius:var(--radius-lg);max-width:460px;width:100%;padding:28px 26px 24px;
  box-shadow:0 30px 80px rgba(35,32,28,.34);position:relative;max-height:94vh;max-height:94dvh;overflow:auto;-webkit-overflow-scrolling:touch;
  transform:translateY(14px) scale(.98);transition:transform .28s var(--ease)}
.qm-overlay.open .qm-card{transform:none}
.qm-x{position:absolute;top:10px;right:14px;font-size:28px;line-height:1;color:#c3bcae;background:none;z-index:2}
.qm-x:hover{color:var(--ink)}
.qm-progress{height:6px;background:var(--sand);border-radius:99px;margin:6px 0 22px;overflow:hidden}
.qm-bar{height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--mag));border-radius:99px;transition:width .35s var(--ease)}
.qm-step{display:none}.qm-step.on{display:block;animation:qmIn .3s var(--ease) both}
@keyframes qmIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.qm-eyebrow{font-family:var(--fB);font-weight:600;color:var(--mag);font-size:13px;margin-bottom:6px}
.qm-q{font-family:var(--fD);font-weight:600;font-size:26px;color:var(--ink);letter-spacing:-.015em;line-height:1.1;margin-bottom:18px}
.qm-field{margin-bottom:14px}
.qm-field label,.qm-label{display:block;font-family:var(--fB);font-weight:600;font-size:13px;color:var(--ink);margin-bottom:7px}
.qm-label{margin-top:4px}
.qm-multi{font-weight:500;color:#8a8378;font-size:12px}
.qm-chip.sel::after{content:' ✓'}
.qm-field input{width:100%;padding:13px 15px;border:1.5px solid var(--rule);border-radius:var(--radius-sm);font-family:var(--fB);font-size:16px;background:#fff;color:var(--ink)}
.qm-field input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(8,113,201,.12)}
.qm-chips{display:flex;flex-wrap:wrap;gap:8px}
.qm-chip{padding:10px 14px;border:1.5px solid var(--rule);border-radius:99px;background:#fff;cursor:pointer;font-family:var(--fB);font-size:14px;font-weight:500;color:var(--ink);transition:all .15s}
.qm-chip:hover{border-color:var(--blue)}
.qm-chip.sel{background:var(--blue);color:#fff;border-color:var(--blue)}
.qm-err{color:var(--mag);font-size:13px;margin-top:12px}
.qm-note-wa{font-family:var(--fB);font-size:12.5px;color:#5a544a;background:rgba(37,211,102,.09);border-radius:var(--radius-sm);padding:10px 12px;margin-top:4px;line-height:1.45}
.qm-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:22px}
.qm-back{background:none;color:#8a8378;font-weight:600;font-size:15px;padding:10px 4px}
.qm-back:hover{color:var(--ink)}
.qm-result{text-align:left}
.qm-rec-badge{display:inline-block;background:rgba(37,158,79,.12);color:#2e9e4f;font-weight:600;font-size:12.5px;padding:6px 13px;border-radius:99px;margin-bottom:14px}
.qm-rec-name{font-family:var(--fD);font-weight:600;font-size:30px;color:var(--ink);line-height:1.05;letter-spacing:-.02em}
.qm-rec-meta{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.qm-rec-chip{background:var(--sand);border-radius:99px;padding:6px 13px;font-size:13px;font-weight:600;color:#5a544a}
.qm-rec-why{background:var(--pale);border-left:3px solid var(--mag);border-radius:0 var(--radius-sm) var(--radius-sm) 0;padding:14px 16px;margin:16px 0;font-size:14.5px;line-height:1.55;color:#4a453d}
.qm-rec-ctas{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.qm-fine{font-family:var(--fB);font-size:12px;color:#8a8378;text-align:center;margin-top:14px}
@media(max-width:520px){.qm-card{padding:24px 18px 20px}.qm-rec-name{font-size:26px}}

/* Added in the WordPress port: the original exposed no selected
   state to assistive tech beyond a ' ✓' pseudo-element. */
.qm-chip[aria-pressed="true"]{background:var(--blue);color:#fff;border-color:var(--blue)}
.qm-result:focus{outline:none}