/* Intent router A–F (Phase 2). Mobile-first, WCAG 2.2 AA: touch targets ≥44px,
   focus-visible rings, reduced-motion support. Uses the portal design tokens
   (--bg/--surface/--primary/--text/--muted/--border). */

/* ---- hero ---- */
.ir-hero{max-width:760px;margin:8px 0 20px}
.ir-hero__eyebrow{display:inline-flex;gap:8px;align-items:center;margin:0 0 10px;padding:5px 12px;
  border:1px solid color-mix(in oklab,var(--primary) 30%,transparent);border-radius:999px;
  color:var(--primary);font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.ir-hero h1{margin:0 0 10px;font-size:clamp(24px,4.4vw,36px);line-height:1.12;color:var(--text)}
.ir-hero__lede{margin:0;max-width:60ch;color:var(--muted);font-size:15px;line-height:1.65}

/* ---- router cards ---- */
.ir-router{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px;margin:4px 0 20px}
.ir-card{display:flex;align-items:flex-start;gap:12px;min-height:96px;padding:16px;border:1px solid var(--border);
  border-radius:16px;background:var(--surface);color:var(--text);text-decoration:none;transition:border-color .15s,transform .15s,box-shadow .15s}
.ir-card:hover{border-color:color-mix(in oklab,var(--primary) 45%,transparent);transform:translateY(-1px);
  box-shadow:0 10px 26px rgba(0,0,0,.10)}
.ir-card:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.ir-card__code{display:inline-grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border-radius:11px;
  background:color-mix(in oklab,var(--primary) 14%,transparent);color:var(--primary);font-size:15px;font-weight:900}
.ir-card__body{display:flex;flex-direction:column;gap:4px;min-width:0}
.ir-card__body strong{font-size:15px;line-height:1.3}
.ir-card__body span{color:var(--muted);font-size:13px;line-height:1.5}
.ir-card__arrow{flex:0 0 auto;margin-left:auto;color:var(--muted);font-size:16px;transition:transform .15s}
.ir-card:hover .ir-card__arrow{transform:translateX(3px)}

/* ---- result cards ---- */
.ir-result{scroll-margin-top:90px}
.ir-result-card{max-width:760px;margin:6px 0 18px;padding:20px 22px;border:1px solid
  color-mix(in oklab,var(--primary) 26%,transparent);border-radius:18px;background:var(--surface);
  box-shadow:0 14px 34px rgba(0,0,0,.10)}
.ir-result-card[hidden]{display:none}
.ir-result-card:focus{outline:none}
.ir-result-card:focus-visible{outline:2px solid var(--primary);outline-offset:3px}
/* One real heading per card; the section labels are paragraphs (six cards × five
   headings would flood the page with duplicate h2s). */
.ir-result__title{margin:0 0 12px;font-size:17px;font-weight:800;line-height:1.25;color:var(--text);
  letter-spacing:normal;text-transform:none}
.ir-result-card .ir-label{margin:16px 0 4px;font-size:12px;font-weight:800;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted)}
.ir-result-card p{margin:0;color:var(--text);font-size:14.5px;line-height:1.6}
.ir-result-card .ir-risk{color:var(--muted);border-left:3px solid color-mix(in oklab,var(--danger,#ef4444) 55%,transparent);
  padding-left:12px}

/* ---- CTAs ---- */
.ir-result__cta{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 4px}
.ir-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 18px;
  border:1px solid transparent;border-radius:999px;font:inherit;font-size:13.5px;font-weight:800;
  text-decoration:none;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.ir-btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.ir-btn--primary{background:var(--primary);color:#fff}
.ir-btn--primary:hover{filter:brightness(1.06)}
.ir-btn--ghost{background:none;border-color:var(--primary);color:var(--primary)}

/* ---- save plan ---- */
.ir-save{margin-top:16px;padding-top:14px;border-top:1px dashed var(--border)}
.ir-save label{display:block;margin-bottom:6px;font-size:13px;font-weight:800}
.ir-save__optional{color:var(--muted);font-weight:600}
.ir-save__row{display:flex;flex-wrap:wrap;gap:8px}
.ir-save__row input[type=email]{flex:1 1 220px;min-height:44px;padding:0 14px;border:1px solid var(--border);
  border-radius:999px;background:var(--bg);color:var(--text);font:inherit;font-size:13.5px}
.ir-save__row input[type=email]:focus{outline:2px solid var(--primary);outline-offset:1px;border-color:transparent}
.ir-save__msg{margin:8px 0 0;font-size:13px;color:var(--primary);font-weight:700}
.ir-save__msg.err{color:var(--danger,#ef4444)}
.ir-save__note{margin:8px 0 0;font-size:12px;line-height:1.6;color:var(--muted)}
.ir-save__note a{color:var(--primary)}

/* selected card (JS on) */
.ir-card[data-current]{border-color:var(--primary);background:color-mix(in oklab,var(--primary) 7%,var(--surface))}

/* ---- invite band (arrived via /r/{code}) ---- */
.ir-invite{max-width:760px;margin:0 0 18px;padding:14px 16px;border-radius:14px;
  border:1px solid color-mix(in oklab,var(--primary) 28%,transparent);
  background:color-mix(in oklab,var(--primary) 6%,transparent)}
.ir-invite__lead{margin:0 0 6px;font-size:14px;font-weight:700;color:var(--text)}
.ir-invite__body{margin:0;font-size:14px;line-height:1.65;color:var(--muted)}
.ir-invite__body a{color:var(--primary)}

/* ---- no-JS save confirmation ---- */
.ir-saved{max-width:760px;margin:0 0 14px;padding:12px 16px;border-radius:14px;
  border:1px solid color-mix(in oklab,var(--primary) 34%,transparent);
  background:color-mix(in oklab,var(--primary) 8%,transparent);color:var(--text);font-size:14px;font-weight:700}

/* ---- disclosure ---- */
.ir-disc{margin-top:22px;max-width:80ch;font-size:12px;line-height:1.65;color:var(--muted)}
.ir-disc a{color:var(--primary)}

/* ---- compact home block ---- */
.home-intent{margin:6px 0 18px}
.home-intent .ir-hero__eyebrow{margin-bottom:10px}
.home-intent .ir-router{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.home-intent .ir-result-card{box-shadow:none}

/* ---- reduced motion ---- */
@media (prefers-reduced-motion:reduce){
  .ir-card,.ir-card__arrow,.ir-btn{transition:none}
  .ir-card:hover{transform:none}
}

/* ---- paid next step (SPEC-014) ---- */
/* Deliberately quieter than the primary CTA: the free tool answers the intent,
   this is the optional continuation — a sales block that shouts here would
   undercut the honesty the rest of the card is built on. */
.ir-paid{margin:6px 0 4px;padding:12px 14px;border-radius:14px;
  border:1px dashed color-mix(in oklab,var(--primary) 30%,transparent);
  background:color-mix(in oklab,var(--primary) 5%,transparent)}
.ir-paid__why{margin:0 0 10px;font-size:13px;line-height:1.6;color:var(--text)}
.ir-paid__cta{font-size:13px}
