.question-tip { margin:0; color:var(--muted); }
.examples { margin-top:20px; }
.examples p { margin:0 0 8px; color:var(--muted); font-size:.88rem; font-weight:700; }
.examples div { display:flex; flex-wrap:wrap; gap:8px; }
.examples a { border:1px solid var(--line); border-radius:999px; background:#f7faf9; padding:7px 12px; color:var(--ink); font-size:.85rem; font-weight:600; text-decoration:none; }
.examples a:hover { border-color:var(--accent); background:var(--accent-soft); }
.answer-match { display:flex; align-items:center; gap:18px; margin:22px 0; padding:15px 17px; border-left:4px solid var(--accent); background:var(--accent-soft); }
.answer-match div { min-width:80px; }
.answer-match strong, .answer-match span { display:block; }
.answer-match strong { font-size:1.35rem; }
.answer-match span, .answer-match p { color:var(--muted); font-size:.84rem; }
.answer-match p { margin:0; }
.how-it-works { display:grid; grid-template-columns:repeat(auto-fit,minmax(255px,1fr)); gap:16px; margin-top:22px; }
.how-it-works article { border:1px solid var(--line); border-radius:12px; padding:20px; background:#fff; }
.how-it-works article span { display:inline-grid; place-items:center; width:30px; height:30px; border-radius:50%; background:var(--accent); color:#fff; font-weight:750; }
.how-it-works article p { color:var(--muted); }
@media (max-width:680px) { nav { flex-wrap:wrap; } .answer-match { align-items:stretch; flex-direction:column; } }
