/* Shared navigation for the quiz, results and matches pages:
   the numbered "Your path" links in the title bar and the results/matches switch. */
.flow{display:flex;align-items:center;gap:8px}
.flow-label{color:var(--mute);font-size:.85rem;font-weight:600;margin-right:2px}
.flow .step{display:inline-flex;align-items:center;gap:8px;margin:0;padding:6px 15px 6px 6px;border:1.5px solid var(--accent);border-radius:99px;background:var(--card);color:var(--accent);font-weight:650;font-size:.92rem;text-decoration:none;transition:background .15s,color .15s}
.flow .step .n{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--accent);color:#fff;font-size:.78rem;font-weight:700}
.flow .step:hover,.flow .step[aria-current="page"]{background:var(--accent);color:#fff}
.flow .step:hover .n,.flow .step[aria-current="page"] .n{background:#fff;color:var(--accent)}
.flow .step:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.flow .sep{color:var(--mute);font-size:1.1rem}

.switch-wrap{text-align:center;margin:6px 0 26px}
.switch-hint{margin:0 0 8px;color:var(--mute);font-size:.92rem}
.switch{display:inline-flex;gap:4px;padding:5px;background:var(--card);border:1.5px solid var(--accent);border-radius:99px;box-shadow:0 2px 10px rgba(0,0,0,.06)}
.switch a{margin:0;padding:9px 22px;border-radius:99px;color:var(--accent);font-weight:650;font-size:1rem;text-decoration:none}
.switch a:hover{background:var(--line)}
.switch a[aria-current="page"]{background:var(--accent);color:#fff}

/* Interest call to action (interest-cta.js): footer band with one-tap answers, and a sticky reminder bar. */
.interest-band{background:linear-gradient(135deg,#b8483e,#8f3a32);color:#fff;text-align:center;padding:40px 16px 44px}
.interest-band[hidden]{display:none}
.ib-eyebrow{margin:0;font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;opacity:.85}
.interest-band h2{margin:6px 0 8px;font-size:1.8rem;line-height:1.2}
.ib-q{max-width:560px;margin:0 auto 20px;opacity:.92}
.ib-choices{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:720px;margin:0 auto}
.ib-choices a{padding:11px 20px;border:2px solid #fff;border-radius:99px;color:#fff;font-weight:650;text-decoration:none;transition:background .15s,color .15s}
.ib-choices a:hover,.ib-choices a:focus-visible{background:#fff;color:#8f3a32;outline:none}
.ib-note{margin:16px auto 0;font-size:.88rem;opacity:.85}
.interest-bar{position:fixed;left:50%;bottom:16px;z-index:30;display:flex;align-items:center;gap:12px;max-width:calc(100% - 32px);padding:8px 8px 8px 18px;border-radius:99px;background:var(--ink);color:var(--bg);box-shadow:0 8px 24px rgba(0,0,0,.18);transform:translate(-50%,160%);visibility:hidden;transition:transform .3s ease,visibility .3s}
.interest-bar.show{transform:translate(-50%,0);visibility:visible}
.interest-bar span{font-weight:600;font-size:.95rem}
.interest-bar a{padding:8px 16px;border-radius:99px;background:var(--accent);color:#fff;font-weight:650;text-decoration:none;white-space:nowrap}
.interest-bar button{width:32px;height:32px;border:0;border-radius:50%;background:transparent;color:inherit;font-size:1.3rem;line-height:1;cursor:pointer;opacity:.7}
.interest-bar button:hover{opacity:1}
@media (prefers-reduced-motion:reduce){.interest-bar{transition:none}}

@media (max-width:640px){
  header{flex-wrap:wrap;row-gap:10px}
  .flow{width:100%;justify-content:center}
  .flow-label{display:none}
  .switch a{padding:9px 16px;font-size:.95rem}
  .interest-band h2{font-size:1.45rem}
  .ib-choices a{padding:10px 16px}
  .interest-bar{width:calc(100% - 24px);max-width:none;gap:8px;padding-left:16px}
  .interest-bar span{flex:1;min-width:0;font-size:.85rem;line-height:1.25}
}
