/*
 * CDHCI eligibility checker — a friendly, interactive lead-gen widget.
 * Scoped to .amc-checker. Reduced-motion aware.
 */
.amc-checker { --red: var(--wp--preset--color--danger);
	max-width: 940px; margin-inline: auto; color: var(--text);
	background: var(--surface); border: 1px solid var(--border);
	border-radius: 24px; box-shadow: var(--wp--preset--shadow--floating);
	overflow: hidden;
}
.amc-checker * { box-sizing: border-box; }
.amc-checker__head { padding: clamp(1.6rem,3vw,2.4rem) clamp(1.5rem,3vw,2.4rem) 0; display: flex; align-items: center; gap: clamp(1rem,2.5vw,1.8rem); }
.amc-checker__illo { flex: 0 0 auto; width: clamp(96px,14vw,148px); height: clamp(96px,14vw,148px); border-radius: 18px; overflow: hidden; background: var(--wp--preset--color--surface-alt); border: 1px solid var(--border); }
.amc-checker__illo img { width: 100%; height: 100%; object-fit: cover; object-position: center 35%; display: block; }
.amc-checker__headtext { min-width: 0; }
/* Bare guide variant (care quiz): no tile chrome — the transparent figure
   stands on a single gold ground line, sized to echo the homepage band. */
.amc-checker__illo--bare { width: clamp(150px, 18vw, 215px); height: auto; border: 0; background: none; border-radius: 0; overflow: visible; position: relative; padding-bottom: 10px; }
.amc-checker__illo--bare img { width: 100%; height: auto; object-fit: contain; }
.amc-checker__illo--bare::after { content: ""; position: absolute; left: 4%; right: 4%; bottom: 0; height: 5px; border-radius: 999px; background: var(--gold); }
@media (max-width: 560px) { .amc-checker__head { flex-direction: column; align-items: flex-start; } .amc-checker__illo { width: 110px; height: 110px; } .amc-checker__illo--bare { width: 150px; height: auto; } }
.amc-checker__headtext h2,
.amc-checker__headtext h3 { color: var(--green); font-size: var(--wp--preset--font-size--h-2-sm); font-weight: 700; letter-spacing: -.02em; margin: .7rem 0 0; line-height: 1.15; }
/* Badge margin (design.css, 1rem) is the whole gap — see the stacking note there. */
.amc-checker__headtext .amc-checker__eyebrow + h2,
.amc-checker__headtext .amc-checker__eyebrow + h3 { margin-top: 0; }
.amc-checker__intro { margin: .8rem 0 0; font-size: 1.05rem; max-width: 60ch; }
.amc-checker__body { padding: clamp(1.4rem,3vw,2.2rem); }

.amc-checker__q-group + .amc-checker__q-group { margin-top: 1.6rem; }
.amc-checker__q-label { font-weight: 700; color: var(--green); font-size: .95rem; margin-bottom: .8rem; }
.amc-checker__opts { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
@media (max-width: 620px) { .amc-checker__opts { grid-template-columns: 1fr; } }

.amc-opt { position: relative; display: flex; gap: .8rem; align-items: flex-start; padding: .95rem 1.1rem; border: 1.5px solid var(--border); border-radius: 14px; background: #fff; cursor: pointer; transition: border-color .2s var(--ease), background .2s, transform .12s; }
.amc-opt:hover { border-color: var(--teal); }
.amc-opt:active { transform: scale(.995); }
.amc-opt input { position: absolute; opacity: 0; pointer-events: none; }
.amc-opt .box { flex: none; width: 24px; height: 24px; border-radius: 7px; border: 2px solid var(--border); display: grid; place-items: center; transition: background .2s, border-color .2s; margin-top: 1px; }
.amc-opt .box svg { width: 15px; height: 15px; opacity: 0; transform: scale(.5); transition: opacity .2s, transform .2s var(--ease); color: #fff; }
.amc-opt .txt { font-size: .96rem; line-height: 1.35; color: var(--text); }
.amc-opt input:checked ~ .box { background: var(--gold); border-color: var(--gold); }
.amc-opt input:checked ~ .box svg { opacity: 1; transform: none; color: var(--green); }
.amc-opt input:checked ~ .txt { color: var(--green); font-weight: 600; }
.amc-opt:has(input:checked) { border-color: var(--gold); background: #fffdf5; }
.amc-opt input:focus-visible ~ .box { outline: 3px solid var(--teal); outline-offset: 2px; }

.amc-checker__actions { margin-top: 1.6rem; display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; }
.amc-checker__btn { display: inline-flex; align-items: center; gap: .5em; padding: .85em 1.8em; border-radius: 999px; border: 0; cursor: pointer; font: inherit; font-weight: 700; font-size: 1rem; background: var(--gold); color: var(--green); position: relative; overflow: hidden; isolation: isolate; transition: color .3s ease, transform .2s var(--ease); }
.amc-checker__btn::after { content: ""; position: absolute; inset: -2px; z-index: -1; border-radius: inherit; background: var(--green); transform: translateX(-101%); transition: transform .5s cubic-bezier(.22, 1, .36, 1); }
.amc-checker__btn:hover { color: #fff; transform: translateY(-2px); }
.amc-checker__btn:hover::after { transform: translateX(0); }
.amc-checker__btn:focus-visible { outline: 3px solid var(--teal); outline-offset: 3px; }
.amc-checker__count { color: var(--muted); font-size: .92rem; }

/* Result */
.amc-checker__result { max-height: 0; opacity: 0; overflow: hidden; transition: max-height .5s var(--ease), opacity .4s ease, margin .4s; }
.amc-checker__result.open { max-height: 1400px; opacity: 1; margin-top: 1.8rem; }
.amc-checker__result-inner { border-top: 1px solid var(--border); padding-top: 1.8rem; }
.amc-checker__result h3 { color: var(--green); font-size: 1.3rem; margin: 0 0 .3rem; }
.amc-checker__result .sub { color: var(--text); margin: 0 0 1.2rem; }
.amc-checker__matches { display: grid; gap: .8rem; }
.amc-match { display: flex; gap: 1rem; align-items: flex-start; padding: 1.1rem 1.2rem; border-radius: 14px; background: #fff; border: 1px solid var(--border); border-left: 4px solid var(--gold); }
.amc-match .ic { flex: none; width: 42px; height: 42px; border-radius: 11px; background: linear-gradient(135deg,var(--gold),var(--gold-strong)); display: grid; place-items: center; color: var(--green); }
.amc-match b { color: var(--green); display: block; font-size: 1.05rem; }
.amc-match span { color: var(--text); font-size: .94rem; }
.amc-checker__cta { margin-top: 1.6rem; padding: 1.5rem 1.6rem; border-radius: 16px; background: var(--green); color: #fff; }
.amc-checker__cta p { margin: 0 0 1.1rem; color: rgba(255,255,255,.92); max-width: none; }
.amc-checker__cta b { color: #fff; }
/* Pill styling applies only to the action buttons — inline links in the CTA
   copy stay plain white underlined text. */
.amc-checker__cta-btns a { flex: none; display: inline-flex; align-items: center; gap: .5em; padding: .8em 1.6em; border-radius: 999px; background: var(--gold); color: var(--green); font-weight: 700; text-decoration: none; position: relative; overflow: hidden; isolation: isolate; transition: color .3s ease, transform .2s; }
/* On the green CTA panel the sweep goes white (green would blend into the panel). */
.amc-checker__cta-btns a::after { content: ""; position: absolute; inset: -2px; z-index: -1; border-radius: inherit; background: #fff; transform: translateX(-101%); transition: transform .5s cubic-bezier(.22, 1, .36, 1); }
.amc-checker__cta-btns a:hover { color: var(--green); transform: translateY(-2px); }
.amc-checker__cta-btns a:hover::after { transform: translateX(0); }
.amc-checker__cta p a { color: #fff; text-decoration: underline; text-underline-offset: 2px; }
.amc-checker__cta p a:hover { color: var(--gold); }
.amc-checker__cta-btns { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1.1rem; }
.amc-checker__or { color: rgba(255,255,255,.85); font-weight: 600; }
.amc-checker__cta a.amc-checker__call { background: none; border: 2px solid rgba(255,255,255,.85); color: #fff; }
.amc-checker__cta a.amc-checker__call:hover { color: var(--green); border-color: #fff; }
.amc-checker__note { margin-top: 1.2rem; font-size: .9rem; color: var(--text); padding-left: .9rem; border-left: 3px solid var(--gold); }
.amc-checker__note b { color: var(--green); }

/* Wizard chrome (staged flow) */
.amc-checker [hidden] { display: none !important; }
/* Question groups are real fieldsets now (screen readers announce the
   question with each option); strip the UA chrome so nothing changes visually. */
.amc-checker fieldset.amc-checker__q-group { border: 0; padding: 0; margin: 0; min-width: 0; }
/* The margin:0 reset above outranks the sibling-spacing rule, and the
   caregiver fieldset follows a plain options div — so spacing before a
   question group is granted here, whatever precedes it. */
.amc-checker * + fieldset.amc-checker__q-group { margin-top: 1.6rem; }
/* Legends ignore normal margin flow in some engines; float+width makes one
   behave like the block label it replaces. */
.amc-checker legend.amc-checker__q-label { float: left; width: 100%; padding: 0; margin-bottom: .8rem; }
.amc-checker legend.amc-checker__q-label + * { clear: both; }
/* Gate uses aria-disabled (stays focusable so the hint can be re-announced). */
.amc-checker__btn[aria-disabled="true"] { opacity: .45; cursor: not-allowed; transform: none; }
.amc-checker__btn[aria-disabled="true"]::after { display: none; }
/* Quick-path result: the inline "continue with the full check" action. */
.amc-checker__gofull { border: 0; background: none; font: inherit; font-weight: 700; color: var(--teal); cursor: pointer; padding: 0 .1em; text-decoration: underline; }
.amc-checker__gofull:hover { color: var(--green); }
/* No-JS fallback line (noscript gets mangled by the block parser): shown by
   default, hidden the moment the widget script binds. */
.amc-checker.amc-js .amc-checker__nojs { display: none; }
.amc-checker__nojs { font-size: .92rem; color: var(--muted); margin: 0 0 1.2rem; }
.amc-checker__progress { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.6rem; }
.amc-checker__bar { flex: 1; height: 6px; border-radius: 999px; background: var(--wp--preset--color--surface-alt, #F4F1EB); border: 1px solid var(--border); overflow: hidden; }
.amc-checker__bar i { display: block; height: 100%; width: 25%; border-radius: inherit; background: linear-gradient(90deg, var(--gold), var(--gold-strong)); transition: width .4s var(--ease); }
.amc-checker__stepcount { flex: none; font-size: .85rem; font-weight: 700; color: var(--teal); }
.amc-checker__step-title { color: var(--green); font-size: 1.25rem; margin: 0 0 .3rem; outline: none; }
.amc-checker__step-sub { margin: 0 0 1.3rem; color: var(--text); font-size: .98rem; max-width: 64ch; }
.amc-checker__step-sub b { color: var(--green); }
.amc-checker__opts--row { grid-template-columns: repeat(auto-fit, minmax(130px, max-content)); }
.amc-checker__opts--row .amc-opt { padding: .7rem 1.1rem; }
.amc-checker__hint { margin: .8rem 0 0; font-size: .9rem; color: var(--text); padding: .8rem 1rem; border-left: 3px solid var(--gold); background: #fffdf5; border-radius: 0 10px 10px 0; }
.amc-checker__hint b { color: var(--green); }
.amc-checker__nav { margin-top: 1.6rem; display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; }
.amc-checker__backbtn { border: 0; background: none; font: inherit; font-weight: 700; font-size: .95rem; color: var(--teal); cursor: pointer; padding: .5em .2em; }
.amc-checker__backbtn:hover { text-decoration: underline; }
.amc-checker__backbtn:focus-visible { outline: 3px solid var(--teal); outline-offset: 2px; border-radius: 6px; }
.amc-checker__btn:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.amc-checker__btn:disabled::after { display: none; }
.amc-checker__flags, .amc-checker__path { margin-top: 1.5rem; padding: 1.2rem 1.3rem; border-radius: 14px; background: #fff; border: 1px solid var(--border); }
.amc-checker__flags-title { margin: 0 0 .7rem; font-weight: 700; color: var(--green); font-size: .95rem; }
.amc-checker__flag { margin: 0; font-size: .92rem; color: var(--text); }
.amc-checker__flag + .amc-checker__flag { margin-top: .6rem; }
.amc-checker__flag b, .amc-checker__path b { color: var(--green); }
/* Owner call: the steps read in Parkinsans, a step up from the note sizing.
   The font sits on the li because design.css puts Roca directly on
   .wp-block-post-content li — inheritance from the ol never reaches them. */
.amc-checker__path ol { margin: 0; padding-left: 1.3rem; }
.amc-checker__path li { font-family: var(--wp--preset--font-family--sans, Parkinsans, sans-serif); font-size: 1.02rem; line-height: 1.6; color: var(--text); margin: .55rem 0; }
.amc-checker__restart { margin: 1.2rem 0 0; }
.amc-checker__restart button { border: 0; background: none; font: inherit; font-size: .9rem; font-weight: 600; color: var(--muted); cursor: pointer; padding: .3em .2em; }
.amc-checker__restart button:hover { color: var(--teal); text-decoration: underline; }

@media (prefers-reduced-motion: reduce) {
	.amc-checker *, .amc-checker__result { transition: none !important; }
}