/*
 * MAXCON24 consultation funnel.
 * Uses the MAXCON24 theme tokens when present (CSS custom properties from the
 * theme build) and falls back to the V3 palette, so the funnel keeps its look
 * under any theme. Mobile first; tap targets ≥ 48 px; visible focus.
 */

.mxc {
	--mxc-navy: var(--color-midnight, #0f2533);
	--mxc-navy-2: var(--color-navy, #1c3a4e);
	--mxc-gold: var(--color-gold, #b88a49);
	--mxc-gold-deep: var(--color-gold-deep, #8c6832);
	--mxc-gold-soft: var(--color-gold-soft, #f1e6d3);
	--mxc-cream: var(--color-mist, #f6f1e8);
	--mxc-line: var(--color-line, #e7e0d4);
	--mxc-text: var(--color-body, #1f2933);
	--mxc-muted: var(--color-muted, #5c6168);
	--mxc-bronze: var(--color-teal, #85623a);
	--mxc-error: #b42318;
	--mxc-display: var(--font-display, "Literata", Georgia, serif);
	--mxc-sans: var(--font-sans, "Epilogue", system-ui, sans-serif);
	--mxc-radius: var(--radius-card, 14px);
	--mxc-shadow: 0 1px 2px rgb(15 37 51 / .05), 0 14px 34px -18px rgb(15 37 51 / .28);
	color: var(--mxc-text);
	font-family: var(--mxc-sans);
	background: var(--mxc-cream);
	padding-bottom: 5rem;
}
.mxc *, .mxc *::before, .mxc *::after { box-sizing: border-box; }
.mxc img { max-width: 100%; height: auto; display: block; }
.mxc a { color: var(--mxc-navy-2); }
.mxc :focus-visible { outline: 2px solid var(--mxc-gold); outline-offset: 3px; border-radius: 4px; }
.mxc-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.mxc-wrap { width: 100%; max-width: calc(80rem + 2 * var(--g)); margin-inline: auto; padding-inline: var(--g); --g: 1.25rem; }
@media (min-width: 640px) { .mxc-wrap { --g: 2rem; } }
@media (min-width: 1280px) { .mxc-wrap { --g: 5rem; } }
.mxc-narrow { max-width: 46rem; padding-top: 4rem; }

/* Type */
.mxc-head { padding-top: 2.5rem; padding-bottom: 2rem; }
.mxc-h1, .mxc-h2, .mxc-h3 { font-family: var(--mxc-display); font-weight: 350; color: var(--mxc-navy); letter-spacing: -.012em; text-wrap: balance; margin: 0; }
.mxc-h1 { font-size: clamp(2rem, 1.35rem + 2.4vw, 3.25rem); line-height: 1.1; margin-top: 1rem; max-width: 22ch; }
.mxc-h2 { font-size: clamp(1.7rem, 1.3rem + 1.4vw, 2.5rem); line-height: 1.15; margin-top: .75rem; }
.mxc-h3 { font-size: 1.375rem; line-height: 1.3; }
.mxc-lead { font-size: clamp(1.0625rem, 1rem + .35vw, 1.25rem); line-height: 1.6; color: var(--mxc-muted); max-width: 46rem; margin: 1.25rem 0 0; }
.mxc-body { font-size: 1.0625rem; line-height: 1.7; margin: 1.5rem 0 0; max-width: 44rem; }
.mxc-muted { color: var(--mxc-muted); font-size: .9375rem; display: flex; gap: .5rem; align-items: flex-start; margin: .75rem 0 0; }
.mxc-eyebrow { font-size: .8125rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--mxc-bronze); margin: 2rem 0 0; }
.mxc-eyebrow span { color: rgb(15 37 51 / .55); font-weight: 700; }
.mxc-eyebrow-inline { font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--mxc-bronze); font-size: .75rem; }
.mxc-ico { width: 1.5rem; height: 1.5rem; flex-shrink: 0; }
.mxc-ico-s { width: 1.05rem; height: 1.05rem; flex-shrink: 0; }

/* Buttons */
.mxc-btn { display: inline-flex; align-items: center; justify-content: center; gap: .6rem; min-height: 3rem; padding: .8rem 1.6rem; border-radius: .6rem; font: 600 1rem/1.2 var(--mxc-sans); text-decoration: none; cursor: pointer; border: 1px solid transparent; transition: background-color .2s, color .2s, border-color .2s, transform .2s; }
.mxc-btn:active { transform: translateY(1px); }
.mxc-btn-gold { background: var(--mxc-gold); color: #fff !important; /* Trial, matches the theme; revert: var(--mxc-navy). */ box-shadow: 0 6px 18px -8px rgb(184 138 73 / .65); }
.mxc-btn-gold:hover { background: var(--mxc-gold-deep); color: #fff !important; }
.mxc-btn-ghost { background: #fff; color: var(--mxc-navy) !important; border-color: var(--mxc-line); }
.mxc-btn-ghost:hover { border-color: rgb(15 37 51 / .4); }
.mxc-btn-block { width: 100%; }
.mxc-actions { margin-top: 2rem; display: flex; flex-wrap: wrap; gap: .75rem; }
@media (max-width: 639px) { .mxc-actions .mxc-btn, .mxc-q-nav .mxc-btn { width: 100%; } }

/* Step indicator */
.mxc-steps ol { list-style: none; margin: 0; padding: 0; display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }
.mxc-steps li { display: flex; align-items: center; gap: .5rem; font-size: .8125rem; color: var(--mxc-muted); }
.mxc-steps li + li::before { content: ""; width: 1.25rem; height: 1px; background: var(--mxc-line); margin-right: .1rem; }
.mxc-steps-dot { width: 1.75rem; height: 1.75rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: .75rem; font-weight: 700; border: 1px solid var(--mxc-line); background: #fff; color: var(--mxc-muted); flex-shrink: 0; }
.mxc-steps .is-done .mxc-steps-dot { background: var(--mxc-gold); border-color: var(--mxc-gold); color: var(--mxc-navy); }
.mxc-steps .is-current .mxc-steps-dot { background: var(--mxc-navy); border-color: var(--mxc-navy); color: #fff; }
.mxc-steps .is-current { color: var(--mxc-navy); font-weight: 600; }
@media (max-width: 767px) { .mxc-steps li:not(.is-current) .mxc-steps-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } .mxc-steps li + li::before { width: .6rem; } }

/* Alerts */
.mxc-alert { border-left: 3px solid var(--mxc-error); background: #fff4f2; color: #7a271a; padding: .9rem 1.1rem; border-radius: .5rem; margin: 1.25rem 0; }
.mxc-alert p { margin: 0; }
.mxc-test-badge { display: inline-flex; gap: .5rem; align-items: center; background: #fff7e6; color: #7a4b00; border: 1px dashed #d8a24a; border-radius: 999px; padding: .4rem .9rem; font-size: .8125rem; font-weight: 600; margin: 1rem 0 0; }
.mxc-chip { display: inline-flex; flex-wrap: wrap; gap: .75rem; align-items: center; margin: 1.25rem 0 0; padding: .45rem 1rem; background: #fff; border: 1px solid var(--mxc-line); border-radius: 999px; font-weight: 600; color: var(--mxc-navy); font-size: .9375rem; }
.mxc-chip a { font-weight: 500; font-size: .875rem; }

/* Route cards */
.mxc-routes { display: grid; gap: 1.25rem; grid-template-columns: 1fr; margin-top: 1rem; }
@media (min-width: 640px) { .mxc-routes { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .mxc-routes { grid-template-columns: repeat(3, 1fr); } .mxc-route-card.is-combo { grid-column: span 1; } }
.mxc fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.mxc-route-card { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--mxc-line); border-radius: var(--mxc-radius); overflow: hidden; cursor: pointer; transition: border-color .2s, box-shadow .25s, transform .25s; }
.mxc-route-card:hover { box-shadow: var(--mxc-shadow); transform: translateY(-2px); }
.mxc-route-card input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.mxc-route-card:has(input:checked) { border-color: var(--mxc-gold); box-shadow: 0 0 0 2px var(--mxc-gold), var(--mxc-shadow); }
.mxc-route-card:has(input:focus-visible) { outline: 2px solid var(--mxc-navy); outline-offset: 3px; }
.mxc-route-media { display: grid; aspect-ratio: 16 / 10; background: var(--mxc-gold-soft); overflow: hidden; }
.mxc-route-media.is-split { grid-template-columns: 1fr 1fr; gap: 2px; }
.mxc-route-media img { width: 100%; height: 100%; object-fit: cover; }
.mxc-route-body { display: flex; flex-direction: column; gap: .4rem; padding: 1.25rem 1.35rem 1.5rem; }
.mxc-route-kicker { font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--mxc-bronze); }
.mxc-route-title { font-family: var(--mxc-display); font-size: 1.5rem; line-height: 1.2; color: var(--mxc-navy); }
.mxc-route-desc { font-size: .975rem; line-height: 1.5; color: var(--mxc-muted); }
.mxc-route-people { display: flex; gap: .45rem; align-items: flex-start; font-size: .8125rem; color: var(--mxc-muted); margin-top: .35rem; padding-top: .7rem; border-top: 1px solid var(--mxc-line); }
.mxc-route-check { position: absolute; top: .8rem; right: .8rem; width: 2rem; height: 2rem; border-radius: 50%; background: #fff; border: 1px solid var(--mxc-line); display: flex; align-items: center; justify-content: center; color: transparent; }
.mxc-route-card:has(input:checked) .mxc-route-check { background: var(--mxc-gold); border-color: var(--mxc-gold); color: var(--mxc-navy); }

/* Fee page */
.mxc-fee-grid { display: grid; gap: 2.5rem; padding-bottom: 3rem; }
@media (min-width: 1024px) { .mxc-fee-grid { grid-template-columns: 7fr 5fr; gap: 4rem; align-items: start; } .mxc-fee-side { position: sticky; top: 6.5rem; } }
.mxc-fee-main .mxc-eyebrow { margin-top: 0; }
.mxc-benefits { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: 1.25rem; }
@media (min-width: 640px) { .mxc-benefits { grid-template-columns: repeat(3, 1fr); } }
.mxc-benefits li { display: flex; flex-direction: column; gap: .8rem; background: #fff; border: 1px solid var(--mxc-line); border-radius: var(--mxc-radius); padding: 1.25rem; }
.mxc-benefits strong { display: block; font-family: var(--mxc-display); font-weight: 400; font-size: 1.15rem; color: var(--mxc-navy); line-height: 1.3; }
.mxc-benefits li span span { display: block; font-size: .9375rem; color: var(--mxc-muted); margin-top: .35rem; line-height: 1.5; }
.mxc-benefit-ico { width: 2.75rem; height: 2.75rem; border-radius: 50%; border: 1px solid var(--mxc-gold); color: var(--mxc-gold-deep); display: flex; align-items: center; justify-content: center; }
.mxc-faq, .mxc-terms { margin-top: 1.75rem; border-top: 1px solid var(--mxc-line); padding-top: 1rem; }
.mxc-faq summary, .mxc-terms summary { cursor: pointer; font-weight: 600; color: var(--mxc-navy); min-height: 2.75rem; display: flex; align-items: center; }
.mxc-faq p, .mxc-terms p { line-height: 1.65; color: var(--mxc-text); margin: .5rem 0 0; }
.mxc-price-card { background: var(--mxc-navy); color: #fff; border-radius: var(--mxc-radius); overflow: hidden; box-shadow: var(--mxc-shadow); }
.mxc-price-img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.mxc-price-body { padding: 1.75rem; }
.mxc-price { font-family: var(--mxc-display); font-size: 3rem; line-height: 1; margin: 0; color: #fff; }
.mxc-price-meta { display: flex; gap: .5rem; align-items: center; color: rgb(255 255 255 / .8); margin: .75rem 0 1.5rem; }
.mxc-credit { display: flex; gap: .55rem; align-items: flex-start; margin: 1.1rem 0 0; font-size: .9375rem; color: var(--mxc-gold-soft); line-height: 1.5; }
.mxc-price-card .mxc-terms { border-color: rgb(255 255 255 / .15); }
.mxc-price-card .mxc-terms summary { color: #fff; font-weight: 500; font-size: .9375rem; }
.mxc-price-card .mxc-terms p { color: rgb(255 255 255 / .8); font-size: .875rem; }
.mxc-price-card :focus-visible { outline-color: #fff; }

/* Calendar */
.mxc-cal { padding-top: 3rem; border-top: 1px solid var(--mxc-line); }
.mxc-tz { display: flex; gap: .55rem; align-items: flex-start; color: var(--mxc-text); margin: 1rem 0 0; max-width: 52rem; line-height: 1.55; }
.mxc-calendly, .mxc-test { margin-top: 1.75rem; background: #fff; border: 1px solid var(--mxc-line); border-radius: var(--mxc-radius); padding: 1.5rem; }
.mxc-calendly .mxc-btn { margin-top: 1rem; }
.mxc-calendly-frame { min-height: 700px; margin-top: 1rem; }
.mxc-cal-status { font-weight: 600; color: var(--mxc-navy); }
.mxc-form-grid { display: grid; gap: 1rem; margin-top: 1rem; }
@media (min-width: 640px) { .mxc-form-grid { grid-template-columns: 1fr 1fr; } .mxc-span-2 { grid-column: span 2; } }

/* Fields */
.mxc-field { display: flex; flex-direction: column; gap: .45rem; }
.mxc-field[hidden] { display: none; }
.mxc-label, .mxc legend.mxc-label { font-weight: 600; color: var(--mxc-navy); font-size: 1rem; padding: 0; margin-bottom: .45rem; }
.mxc-opt { font-weight: 400; color: var(--mxc-muted); font-size: .875rem; }
.mxc-help { font-size: .875rem; color: var(--mxc-muted); margin: -.2rem 0 .5rem; }
.mxc input[type=text], .mxc input[type=email], .mxc input[type=number], .mxc select, .mxc textarea {
	width: 100%; min-height: 3rem; padding: .7rem .9rem; border: 1px solid var(--mxc-line); border-radius: .55rem; background: #fff; font: 400 1rem/1.4 var(--mxc-sans); color: var(--mxc-text);
}
.mxc textarea { min-height: 6rem; resize: vertical; }
.mxc .mxc-input--short { max-width: 9rem; }
.mxc input:focus, .mxc select:focus, .mxc textarea:focus { border-color: var(--mxc-navy); outline: 2px solid rgb(184 138 73 / .45); outline-offset: 0; }
.mxc .has-error input, .mxc .has-error select, .mxc .has-error textarea, .mxc .has-error .mxc-choice { border-color: var(--mxc-error); }
.mxc-error { color: var(--mxc-error); font-size: .9rem; font-weight: 600; margin: .2rem 0 0; }
.mxc-choices { display: flex; flex-wrap: wrap; gap: .55rem; }
.mxc-choice { position: relative; display: inline-flex; align-items: center; min-height: 3rem; padding: .55rem 1.05rem; border: 1px solid var(--mxc-line); border-radius: 999px; background: #fff; cursor: pointer; font-size: .975rem; transition: border-color .2s, background-color .2s; }
.mxc-choice:hover { border-color: rgb(15 37 51 / .35); }
.mxc-choice input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.mxc-choice:has(input:checked) { background: var(--mxc-navy); border-color: var(--mxc-navy); color: #fff; }
.mxc-choice:has(input:focus-visible) { outline: 2px solid var(--mxc-gold); outline-offset: 2px; }
.mxc-choice:has(input:disabled) { opacity: .45; cursor: not-allowed; }
.mxc-choices--img { display: grid; grid-template-columns: repeat(2, 1fr); gap: .8rem; }
@media (min-width: 768px) { .mxc-choices--img { grid-template-columns: repeat(3, 1fr); } }
.mxc-choices--img .mxc-choice { flex-direction: column; align-items: stretch; padding: 0; border-radius: .8rem; overflow: hidden; }
.mxc-choice-img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.mxc-choices--img .mxc-choice-text { padding: .65rem .85rem; font-weight: 600; }
.mxc-choices--img .mxc-choice:has(input:checked) { box-shadow: 0 0 0 2px var(--mxc-gold); }
.mxc-check label { display: flex; gap: .75rem; align-items: flex-start; line-height: 1.55; cursor: pointer; }
.mxc-check input[type=checkbox] { width: 1.35rem; height: 1.35rem; margin-top: .15rem; accent-color: var(--mxc-navy); flex-shrink: 0; }

/* Questionnaire */
.mxc-progress { padding-top: 2rem; }
.mxc-progress p { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin: 0 0 .6rem; font-size: .875rem; color: var(--mxc-muted); }
.mxc-progress-bar { display: block; height: 4px; background: var(--mxc-line); border-radius: 4px; overflow: hidden; }
.mxc-progress-bar span { display: block; height: 100%; background: var(--mxc-gold); transition: width .5s; }
.mxc-q-grid { display: grid; gap: 2rem; padding-top: 2rem; }
.mxc-q-form { background: #fff; border: 1px solid var(--mxc-line); border-radius: var(--mxc-radius); padding: 1.5rem; }
@media (min-width: 768px) { .mxc-q-form { padding: 2.25rem 2.5rem; } }
.mxc-q-form .mxc-h2 { margin-top: 0; }
.mxc-q-form .mxc-h2:focus { outline: none; }
.mxc-fields { display: grid; gap: 1.6rem; margin-top: 1.75rem; }
.mxc-q-nav { display: flex; justify-content: space-between; gap: .75rem; flex-wrap: wrap; margin-top: 2.25rem; padding-top: 1.5rem; border-top: 1px solid var(--mxc-line); }
.mxc-saved { margin-top: 1rem; font-size: .8125rem; }
.mxc-q-media { margin: 0; border-radius: var(--mxc-radius); overflow: hidden; position: relative; background: var(--mxc-gold-soft); }
.mxc-q-media img { width: 100%; height: 100%; object-fit: cover; }
.mxc-q--side .mxc-q-media { aspect-ratio: 16 / 10; }
@media (min-width: 1024px) {
	.mxc-q--side .mxc-q-grid { grid-template-columns: 5fr 7fr; align-items: start; }
	.mxc-q--side .mxc-q-media { aspect-ratio: 4 / 5; position: sticky; top: 6.5rem; }
}
.mxc-q--top .mxc-q-media { aspect-ratio: 21 / 8; }
.mxc-q--top .mxc-q-form, .mxc-q--split .mxc-q-form { max-width: 52rem; margin-inline: auto; width: 100%; }
@media (min-width: 1024px) { .mxc-q--top .mxc-q-form, .mxc-q--split .mxc-q-form { margin-top: -5rem; position: relative; box-shadow: var(--mxc-shadow); } }
.mxc-q-media.is-split { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; aspect-ratio: 21 / 8; }
.mxc-split-cap { position: absolute; left: 50%; bottom: 1rem; transform: translateX(-50%); background: rgb(255 255 255 / .95); color: var(--mxc-navy); font-weight: 700; font-size: .8125rem; letter-spacing: .1em; text-transform: uppercase; padding: .45rem 1rem; border-radius: 999px; white-space: nowrap; }
@media (max-width: 1023px) { .mxc-q-media.is-split { aspect-ratio: 16 / 9; } .mxc-split-cap { bottom: .6rem; } }
.mxc-q--plain .mxc-q-form { max-width: 46rem; margin-inline: auto; width: 100%; }

/* Confirmation */
.mxc-confirm-grid { display: grid; gap: 2rem; }
@media (min-width: 1024px) { .mxc-confirm-grid { grid-template-columns: 1fr 1fr; gap: 3rem; align-items: start; } }
.mxc-appt { background: var(--mxc-navy); color: #fff; border-radius: var(--mxc-radius); padding: 1.75rem; }
.mxc-appt a { color: var(--mxc-gold-soft); }
.mxc-appt-route { font-family: var(--mxc-display); font-size: 1.6rem; margin: 0 0 1rem; }
.mxc-appt ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .85rem; }
.mxc-appt li { display: flex; gap: .75rem; align-items: flex-start; line-height: 1.5; }
.mxc-appt .mxc-ico { color: var(--mxc-gold); }
.mxc-appt .mxc-muted { color: rgb(255 255 255 / .75); display: inline; }
.mxc-appt-manage { margin: 1.25rem 0 0; padding-top: 1rem; border-top: 1px solid rgb(255 255 255 / .15); font-size: .9375rem; }
.mxc-next ol { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .7rem; }
.mxc-next li { display: flex; gap: .75rem; align-items: center; color: var(--mxc-muted); }
.mxc-next li.is-done { color: var(--mxc-text); }
.mxc-next li.is-current { color: var(--mxc-navy); font-weight: 600; }
.mxc-next li.is-done .mxc-steps-dot { background: var(--mxc-gold); border-color: var(--mxc-gold); color: var(--mxc-navy); }
.mxc-next li.is-current .mxc-steps-dot { background: var(--mxc-navy); border-color: var(--mxc-navy); color: #fff; }

@media (prefers-reduced-motion: reduce) { .mxc * { transition: none !important; } }