/* Evopure quiz — [evo_quiz] (evopure-quiz.php). One contained card on the page (like the Daily Routine card): Cool Wash surface, the big
   signature corner, a labelled progress line across the top, one step at a time. Questions in New Spirit, hints and choices in the
   functional sans / body, choices are calm white tiles that fill navy when picked. Tokens come from chrome.css; no raw hex here. */
.evo-quizapp { --evo-quiz-pad: clamp(24px, 4.6vw, 64px); width: min(var(--evo-chrome-max, 1320px), 100% - 2 * var(--evo-gutter, 24px)); margin: clamp(32px, 5vw, 64px) auto clamp(48px, 7vw, 96px); }
.evo-quiz__editor { margin: 0 0 14px; padding: 10px 14px; background: var(--evo-navy); color: var(--evo-page); font: 500 13px/1.4 var(--e-global-typography-body-font-family), sans-serif; }
.evo-quiz__stage { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); min-height: max(560px, calc(100svh - var(--evo-header-h, 94px) - 48px)); padding: 72px var(--evo-quiz-pad) 64px; background: var(--evo-wash); border-radius: 0 var(--evo-radius-sweep) 0 0; overflow: hidden; isolation: isolate; }
/* progress: one caps label + hairline per step, across the top of the card */
.evo-quiz__bar { position: absolute; left: var(--evo-quiz-pad); right: var(--evo-quiz-pad); top: 28px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 14px; }
.evo-quiz__seg { display: block; padding: 0 0 10px; position: relative; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; line-height: 1; color: var(--evo-navy); opacity: .42; transition: opacity var(--evo-t-hover) var(--evo-ease); }
.evo-quiz__seg i { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: color-mix(in srgb, var(--evo-navy) 14%, transparent); }
.evo-quiz__seg i::after { content: ""; position: absolute; inset: 0; background: var(--evo-navy); transform-origin: 0 50%; transform: scaleX(0); transition: transform var(--evo-t-section) var(--evo-ease); }
.evo-quiz__seg.is-done, .evo-quiz__seg.is-current { opacity: 1; }
.evo-quiz__seg.is-done i::after, .evo-quiz__seg.is-current i::after { transform: scaleX(1); }
.evo-quiz__seg.is-current i::after { transform: scaleX(.5); }
/* steps: all stacked on one cell, one visible */
.evo-quiz__step { grid-area: 1 / 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; width: min(680px, 100%); opacity: 0; visibility: hidden; transform: translateY(12px); transition: opacity var(--evo-t-section) var(--evo-ease), transform var(--evo-t-section) var(--evo-ease), visibility 0s linear var(--evo-t-section); }
.evo-quiz__step.is-active { opacity: 1; visibility: visible; transform: none; transition: opacity var(--evo-t-section) var(--evo-ease) 80ms, transform var(--evo-t-section) var(--evo-ease) 80ms, visibility 0s; }
.evo-quiz__step[data-step="0"], .evo-quiz__results { width: 100%; }
/* two columns on desktop: the question on the left, the choices (or the image, or the form) on the right, so the stage is used */
.evo-quiz__step { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: clamp(32px, 4vw, 72px); align-items: center; width: 100%; }
.evo-quiz__lead { min-width: 0; }
.evo-quiz__body { min-width: 0; }
.evo-quiz__pick { margin: -12px 0 0; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--evo-slate); }
.evo-quiz__media { position: relative; }
.evo-quiz__media img { display: block; width: 100%; aspect-ratio: 5 / 4; object-fit: cover; background: var(--evo-white); border-radius: 0 var(--evo-radius-card) 0 0; }
.evo-quiz__facts { list-style: none; position: absolute; left: 0; bottom: 0; display: flex; margin: 0; padding: 0; background: var(--evo-page); }
.evo-quiz__facts li { padding: 16px 22px 14px; border-right: 1px solid var(--evo-line); font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--evo-slate); }
.evo-quiz__facts li:last-child { border-right: 0; }
.evo-quiz__facts b { display: block; margin-bottom: 4px; font-family: var(--e-global-typography-h3-font-family), serif; font-weight: 700; font-style: italic; font-size: 24px; line-height: 1; letter-spacing: 0; text-transform: none; color: var(--evo-navy); }
.evo-quiz__step.is-locking .evo-quiz__opt { pointer-events: none; }
.evo-quiz__results { display: block; }
.evo-quiz__results-head { margin: 0 0 26px; }
.evo-quiz__chips { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; padding: 0; }
.evo-quiz__chips li { margin: 0; padding: 8px 12px 7px; background: var(--evo-white); font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--evo-navy); }
.evo-quiz__chips li.evo-quiz__chips-edit { padding: 0 0 0 8px; background: transparent; }
.evo-quiz__chips li.evo-quiz__chips-edit .evo-quiz__back { padding: 6px 0; font-size: 10.5px; }
.evo-quiz__eyebrow { margin: 0 0 14px; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 11.5px; letter-spacing: .18em; text-transform: uppercase; line-height: 1.4; color: var(--evo-navy); }
.evo-quizapp .evo-quiz__title { margin: 0 0 14px; font-family: var(--e-global-typography-h2-font-family), serif; font-weight: 700; font-style: italic; font-size: clamp(32px, 3.4vw, 50px); line-height: 1.06; letter-spacing: -.01em; color: var(--evo-navy); text-wrap: balance; }
.evo-quizapp .evo-quiz__subtitle { margin: 0 0 10px; font-family: var(--e-global-typography-h2-font-family), serif; font-weight: 700; font-style: italic; font-size: clamp(24px, 2.2vw, 32px); line-height: 1.1; color: var(--evo-navy); }
.evo-quiz__text { margin: 0 0 26px; max-width: 34em; font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; font-size: clamp(16px, 1.15vw, 17.5px); line-height: 1.6; color: var(--evo-charcoal); text-wrap: pretty; }
.evo-quiz__note { margin: 18px 0 0; max-width: 34em; font-family: var(--e-global-typography-body-font-family), sans-serif; font-size: 13.5px; line-height: 1.55; color: var(--evo-slate); }
/* choices: white tiles, hairline, ring mark; picked = navy with the signature corner */
.evo-quiz__opts { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 10px; width: 100%; margin: 0 0 28px; }
.evo-quiz__opt { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; column-gap: 14px; width: 100%; min-height: 62px; margin: 0; padding: 14px 18px; text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent;
	background: var(--evo-white); color: var(--evo-navy); border: 1px solid transparent; border-radius: 0; box-shadow: none; font-family: var(--evo-nav-sans, var(--e-global-typography-subheadcaps-font-family), sans-serif); font-weight: 500; font-size: 17px; letter-spacing: 0; line-height: 1.3; text-transform: none;
	transition: background-color var(--evo-t-hover) var(--evo-ease), color var(--evo-t-hover) var(--evo-ease), border-color var(--evo-t-hover) var(--evo-ease); }
.evo-quiz__opt-mark { position: relative; flex: none; width: 22px; height: 22px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px currentColor; transition: background-color var(--evo-t-hover) var(--evo-ease); }
.evo-quiz__opt-mark::after { content: ""; position: absolute; inset: 0; background: var(--evo-navy); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 8.3l2.3 2.3 4.7-4.9'/%3E%3C/svg%3E") center / 12px 12px no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 8.3l2.3 2.3 4.7-4.9'/%3E%3C/svg%3E") center / 12px 12px no-repeat; opacity: 0; transition: opacity var(--evo-t-hover) var(--evo-ease); }
.evo-quiz__opt-label { display: block; }
.evo-quiz__opt-sub { display: block; margin-top: 3px; font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; font-size: 14px; line-height: 1.4; color: var(--evo-slate); transition: color var(--evo-t-hover) var(--evo-ease); }
/* the theme reset paints every button:hover / :focus pink; each state is declared here so nothing leaks through */
.evo-quiz__opt:hover, .evo-quiz__opt:focus, .evo-quiz__opt:active { background: var(--evo-white); color: var(--evo-navy); border-color: var(--evo-navy); outline: 0; }
.evo-quiz__opt:focus-visible { outline: 1.5px solid var(--evo-navy); outline-offset: 2px; }
.evo-quiz__opt[aria-checked="true"]:hover, .evo-quiz__opt[aria-checked="true"]:focus, .evo-quiz__opt[aria-checked="true"]:active { background: var(--evo-navy); color: var(--evo-white); border-color: var(--evo-navy); }
.evo-quiz__opt[aria-checked="true"] { background: var(--evo-navy); color: var(--evo-white); border-color: var(--evo-navy); border-radius: 0 var(--evo-radius-sig) 0 0; }
.evo-quiz__opt[aria-checked="true"] .evo-quiz__opt-mark { background: var(--evo-white); box-shadow: none; }
.evo-quiz__opt[aria-checked="true"] .evo-quiz__opt-mark::after { opacity: 1; }
.evo-quiz__opt[aria-checked="true"] .evo-quiz__opt-sub { color: color-mix(in srgb, var(--evo-white) 72%, transparent); }
/* actions */
.evo-quiz__actions { display: flex; align-items: center; gap: 14px 28px; flex-wrap: wrap; }
.evo-quizapp .evo-btn { min-height: var(--evo-cta-h, 48px); padding: 0 28px; }
.evo-quizapp .evo-btn:disabled, .evo-quizapp .evo-btn:disabled:hover, .evo-quizapp .evo-btn:disabled:focus { opacity: .38; cursor: not-allowed; background: var(--evo-navy) !important; color: var(--evo-white) !important; border-radius: 0 !important; }
.evo-quizapp .evo-btn:disabled::after { display: none; }
.evo-quiz__back { margin: 0; padding: 12px 0; background: transparent; border: 0; cursor: pointer; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; line-height: 1; color: var(--evo-navy); text-decoration: none; box-shadow: inset 0 -1px 0 color-mix(in srgb, var(--evo-navy) 25%, transparent); transition: box-shadow var(--evo-t-hover) var(--evo-ease); }
.evo-quiz__back:hover, .evo-quiz__back:focus, .evo-quiz__back:active { background: transparent; color: var(--evo-navy); box-shadow: inset 0 -1px 0 var(--evo-navy); outline: 0; }
.evo-quiz__back:focus-visible { outline: 1.5px solid var(--evo-navy); outline-offset: 4px; }
.evo-quiz__actions--back { margin-top: 22px; }
/* email step: the site's form field */
.evo-quiz__form { width: 100%; max-width: 560px; }
.evo-quiz__label { display: block; margin: 0 0 8px; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--evo-navy); }
.evo-quiz__field { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
.evo-quiz__field input[type="email"] { min-height: var(--evo-cta-h, 48px); padding: 0 16px; background: var(--evo-white); border: 1px solid transparent; border-radius: 0; box-shadow: none; color: var(--evo-charcoal); font-family: var(--e-global-typography-body-font-family), sans-serif; font-size: 16px; transition: border-color var(--evo-t-hover) var(--evo-ease); }
.evo-quiz__field input[type="email"]:hover, .evo-quiz__field input[type="email"]:focus { border-color: var(--evo-navy); outline: 0; }
.evo-quiz__hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.evo-quiz__error { margin: 10px 0 0; font-family: var(--e-global-typography-body-font-family), sans-serif; font-size: 14px; color: var(--evo-navy); }
.evo-quizapp.is-busy .evo-quiz__submit { opacity: .6; pointer-events: none; }
/* results */
.evo-quiz__results { justify-content: flex-start; }
.evo-quiz__group { width: 100%; margin: 0 0 34px; }
.evo-quiz__group .evo-best { --evo-best-per: 3; --evo-best-bleed: 0px; --evo-best-gap: 16px; width: 100%; }
.evo-quiz__group .evo-best__rail { width: 100%; margin: -12px 0 0; padding: 12px 0 14px; scroll-padding-inline: 0; }
.evo-quiz__group .evo-pcard { flex-basis: calc((100% - 2 * var(--evo-best-gap)) / 3); }      /* the site's own card: grey body continuing the image's grey curve */
.evo-quizapp.is-results .evo-quiz__stage { background: var(--evo-page); }      /* results sit on the warm ground so the grey cards read */
.evo-quiz__title:focus { outline: none; }
.evo-quiz__group .evo-best__nav { top: -46px; }
.evo-quiz__code { margin: 0 0 22px; font-family: var(--e-global-typography-body-font-family), sans-serif; font-size: 16px; color: var(--evo-charcoal); }
.evo-quiz__code b { font-weight: 600; color: var(--evo-navy); letter-spacing: .06em; }
.evo-quiz__actions--end { margin-top: 4px; }
@media (max-width: 1024px) { .evo-quiz__step { grid-template-columns: minmax(0, 1fr); row-gap: 24px; align-items: start; } .evo-quiz__stage { min-height: 0; } .evo-quiz__group .evo-best { --evo-best-per: 2.2; } .evo-quiz__group .evo-pcard { flex-basis: calc((100% - var(--evo-best-gap)) / 2.2); } }
@media (max-width: 767px) {
	.evo-quizapp { --evo-quiz-pad: 18px; width: calc(100% - 32px); }
	.evo-quiz__stage { min-height: 0; padding: 66px var(--evo-quiz-pad) 36px; border-radius: 0 var(--evo-radius-card) 0 0; }
	.evo-quiz__step { grid-template-columns: minmax(0, 1fr); row-gap: 20px; }
	.evo-quiz__media img { aspect-ratio: 4 / 3; }
	.evo-quiz__facts { position: static; margin-top: 10px; background: transparent; }
	.evo-quiz__facts li { padding: 10px 14px 8px 0; border-right: 0; }
	.evo-quiz__bar { top: 20px; gap: 8px; }
	.evo-quiz__seg { font-size: 9px; letter-spacing: .12em; }
	.evo-quiz__opts { grid-template-columns: 1fr; gap: 8px; }
	.evo-quiz__opt { min-height: 56px; padding: 12px 14px; font-size: 16px; }
	.evo-quiz__field { grid-template-columns: 1fr; }
	.evo-quiz__group .evo-best { --evo-best-per: 1.25; } .evo-quiz__group .evo-pcard { flex-basis: 78%; }
	.evo-quiz__actions--end { flex-direction: column; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) { .evo-quiz__step, .evo-quiz__seg i::after, .evo-quiz__opt, .evo-quiz__opt-mark, .evo-quiz__opt-mark::after { transition: none; } }
