:root {
  font-family: "Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;
  color: #000;
  background: #fff;
  font-synthesis: none;
  --green: #15803d;
  --green-hover: #2c8d50;
  --green-border: #086d31;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 280px; }
button { font: inherit; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
button:focus-visible { outline: 3px solid #101828; outline-offset: 4px; }
[hidden] { display: none !important; }

.quiz-header { width: min(100% - 20px, 448px); margin: 0 auto; padding-top: 20px; }
.brand-row { position: relative; display: flex; justify-content: center; }
.brand-logo { width: 128px; height: 128px; display: block; object-fit: contain; }
.progress-track { height: 8px; background: #e7f2eb; overflow: hidden; border-radius: 20px; margin-top: 16px; }
.progress-fill { width: 4.1667%; height: 100%; background: var(--green); transition: width 220ms ease; }

.quiz-main { width: min(100% - 20px, 704px); margin: 32px auto 36px; }
.question-screen { animation: arrive 180ms ease both; }
h1 { font-size: 48px; font-weight: 900; line-height: 1; text-align: center; margin: 0 0 24px; letter-spacing: 0; overflow-wrap: break-word; }
h1:focus { outline: none; }
.options-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.option-card { min-width: 0; padding: 0; border: 1px solid var(--green-border); border-bottom-width: 8px; border-radius: 6px; background: var(--green); color: #fff; text-align: left; cursor: pointer; overflow: hidden; transition: transform 150ms ease, background-color 150ms ease; }
.option-image { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; background: #f6f6f6; }
.option-caption { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 12px; font-size: 16px; line-height: 24px; font-weight: 500; }
.option-arrow { display: grid; flex: 0 0 26px; width: 26px; height: 26px; place-items: center; border: 1px solid rgb(255 255 255 / 50%); border-radius: 50%; }
.option-arrow svg { width: 13px; height: 13px; stroke: currentColor; stroke-width: 1; stroke-linecap: round; stroke-linejoin: round; }
@media (hover: hover) { .option-card:hover { transform: scale(1.025); background-color: var(--green-hover); } }
.option-card.is-selected { background: var(--green-hover); transform: scale(0.98); }
.option-card:disabled { cursor: default; opacity: 1; }
.legal-note { font-size: 12px; font-weight: 400; line-height: 1.25; text-align: center; color: #64748b; margin: 20px 6px 0; }

.preview-end { max-width: 448px; margin: 52px auto 0; text-align: center; }
.preview-end h1 { font-size: 32px; line-height: 1.15; margin-bottom: 18px; }
.preview-kicker { font-size: 12px; font-weight: 800; color: var(--green); letter-spacing: 0.09em; text-transform: uppercase; margin: 0 0 14px; }
.preview-end p { line-height: 1.5; }
.preview-description { color: #64748b; margin: 18px auto 26px; max-width: 350px; }
.selected-answer { display: inline-flex; padding: 10px 20px; border-radius: 30px; background: #edf6ef; color: #126c34; font-size: 16px; font-weight: 700; }
.return-button { display: block; width: 100%; border: 1px solid var(--green-border); border-bottom-width: 5px; border-radius: 6px; background: var(--green); color: white; padding: 15px 20px; font-size: 16px; font-weight: 700; cursor: pointer; }
.return-button:hover { background: var(--green-hover); }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.noscript-note { max-width: 448px; margin: 24px auto; padding: 16px; text-align: center; }

/* Etapas de perguntas e explicações reproduzidas dos prints. */
.compact-main { max-width: 448px; }
.standard-screen h1 { font-size: 30px; line-height: 1.1; margin-bottom: 22px; }
.standard-screen.title-small h1 { font-size: 24px; }
.extra-top { padding-top: 24px; }
.extra-top-large { padding-top: 40px; }
.extra-top-small { padding-top: 10px; }
.answer-list { display: grid; gap: 8px; }
.answer-option { width: 100%; min-width: 0; padding: 0; border: 1px solid #dedede; border-radius: 6px; background: #fff; color: #020617; text-align: left; box-shadow: 0 2px 3px #00000026; cursor: pointer; transition: background 150ms, border-color 150ms, transform 150ms; }
.answer-option .option-caption { padding: 12px; min-height: 58px; font-size: 16px; line-height: 1.45; font-weight: 400; }
.answer-option .option-arrow { color: #69717c; border-color: #dedede; flex-basis: 25px; width: 25px; height: 25px; }
.answer-option.is-selected, .answer-option[aria-pressed="true"] { color: #fff; background: var(--green); border-color: var(--green-border); }
.answer-option.is-selected .option-arrow, .answer-option[aria-pressed="true"] .option-arrow { color: #fff; border-color: #ffffff80; }
.answer-option[aria-pressed="true"] .radio-indicator::after { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.answer-option:disabled { opacity: 1; cursor: default; }
@media (hover: hover) { .answer-option:hover:not(:disabled):not([aria-pressed="true"]) { background: #f4faf6; border-color: #93c7a2; } }
.question-subtitle { font-size: 16px; line-height: 1.45; margin: -7px 0 20px; text-align: center; }
.question-subtitle.italic { font-style: italic; }
.question-subtitle.muted { color: #64748b; }
.duration-question .question-subtitle { margin-bottom: 36px; }
.question-gap-large h1 { margin-bottom: 36px; }
.blue-text { color: #3064ff; }
.info-paragraph { font-size: 17px; line-height: 1.45; text-align: center; margin: 18px 0; color: #020617; }
.info-paragraph strong { font-weight: 800; }
.info-paragraph.emphasis { font-size: 24px; font-weight: 900; line-height: 1.08; color: #000; margin: 22px 0; }
.media-crop { position: relative; overflow: hidden; width: 100%; margin: 20px auto; }
.media-crop img { position: absolute; height: auto; max-width: none; display: block; }
.flow-illustration { width: calc(100% - 10px); border-radius: 10px; }
.continue-button { display: block; width: 100%; min-height: 62px; border: 0; border-bottom: 7px solid var(--green-border); border-radius: 5px; background: var(--green); color: #fff; font-size: 16px; line-height: 1.3; font-weight: 700; padding: 17px 12px; cursor: pointer; margin: 32px 0 0; transition: background 150ms, transform 150ms; }
.continue-button:hover { background: var(--green-hover); }
.continue-button:active { transform: translateY(2px); }
.continue-button:disabled { opacity: 1; cursor: default; }
.muscle-info .continue-button { margin-top: 26px; }
.evolution-chart { margin: 20px 0 26px; }
.evolution-chart svg { display: block; width: 100%; height: auto; overflow: visible; }
.chart-grid { stroke: #b8bec4; stroke-width: 1; stroke-dasharray: 3 3; fill: none; }
.chart-axis { fill: #082150; font-size: 12px; font-weight: 400; }
.chart-you { font-size: 14px; fill: #000; }
.evolution-info .continue-button { margin-top: 36px; }
.method-info .continue-button { margin-top: 48px; }
.leading-media-main { margin-top: 16px; }
.health-info > .media-crop { margin-top: 0; margin-bottom: 20px; }
.health-info h1 { margin-bottom: 12px; }
.health-info .info-paragraph { margin-top: 0; }
.health-info .continue-button { margin-top: 48px; }
.anatomy-info h1 { font-size: 36px; margin-bottom: 12px; }
.anatomy-info .info-paragraph { margin: 10px 0; }
.anatomy-image { margin: 18px auto; }
.anatomy-info .continue-button { margin-top: 34px; }
.comparison-table { width: calc(100% - 10px); margin: 20px auto 10px; border-collapse: collapse; table-layout: fixed; font-family: Arial, sans-serif; }
.comparison-table th, .comparison-table td { border: 1px solid #555; text-align: center; padding: 7px; height: 78px; }
.comparison-table th { width: 70%; font-size: 15px; font-weight: 400; line-height: 1.3; }
.comparison-table td { width: 30%; }
.comparison-table svg { width: 48px; height: 48px; display: block; margin: auto; fill: none; stroke-width: 7; stroke-linejoin: bevel; }
.comparison-check { stroke: #91d668; filter: drop-shadow(1px 1px 1px #cbecb7); }
.comparison-cross { stroke: #ed5261; filter: drop-shadow(1px 1px 1px #f5a8ae); }
.testimonial { margin: 10px 0 0; border: 1px solid #ededed; border-radius: 5px; padding: 14px; color: #020617; font-size: 16px; line-height: 1.45; }
.testimonial-header { display: flex; align-items: center; gap: 11px; margin-bottom: 8px; }
.testimonial-avatar { display: block; width: 46px; height: 46px; flex: 0 0 46px; border-radius: 50%; object-fit: cover; object-position: center; background: #e6f1e9; border: 1px solid #d8e2db; }
.testimonial-person { min-width: 0; }
.testimonial-stars { color: #ffc400; font-size: 14px; letter-spacing: 0; line-height: 1.2; }
.testimonial cite { display: block; font-style: normal; margin: 2px 0 6px; }
.testimonial p { margin: 0; }
.comparison-info .continue-button { margin-top: 24px; }
.restart-link { display: block; margin: 20px auto; background: transparent; border: 0; padding: 8px; color: #64748b; text-decoration: underline; font-size: 14px; cursor: pointer; }

@media (max-width: 480px) {
  .quiz-header { padding-top: 9px; }
  .brand-logo { width: clamp(84px, 26.25vw, 100px); height: auto; aspect-ratio: 1; }
  .progress-track { margin-top: 8px; height: 7px; }
  .quiz-main { margin-top: 24px; }
  .quiz-main.leading-media-main { margin-top: 16px; }
  h1 { font-size: clamp(35px, 12.5vw, 48px); line-height: 1.01; margin-bottom: 20px; }
  .option-card { border-bottom-width: 7px; }
  .option-caption { gap: 10px; min-height: 50px; padding: 10px; font-size: clamp(12px, 4.2vw, 16px); line-height: 20px; }
  .option-arrow { flex-basis: 22px; width: 22px; height: 22px; }
  .option-arrow svg { width: 11px; height: 11px; }
  .legal-note { font-size: 10px; margin-top: 18px; }
  .wide-only { display: none; }
  .preview-end { margin-top: 42px; }
  .standard-screen h1 { font-size: clamp(22px, 6.875vw, 27px); line-height: 1.08; margin-bottom: 18px; }
  .standard-screen.title-small h1 { font-size: clamp(18px, 5.625vw, 22px); line-height: 1.08; }
  .answer-option .option-caption { min-height: 49px; padding: 12px 10px; font-size: clamp(13.4px, 4.2vw, 16px); line-height: 1.4; gap: 11px; }
  .answer-option .option-arrow { flex-basis: 22px; width: 22px; height: 22px; }
  .question-subtitle { font-size: clamp(13.4px, 4.2vw, 16px); margin: -5px 0 16px; }
  .duration-question .question-subtitle { margin-bottom: 36px; }
  .question-gap-large h1 { margin-bottom: 36px; }
  .info-paragraph { font-size: clamp(13.5px, 4.25vw, 16px); line-height: 1.4; }
  .info-paragraph.emphasis { font-size: clamp(18px, 5.625vw, 22px); line-height: 1.08; margin: 20px 0; }
  .continue-button { min-height: 54px; padding: 14px 10px; border-bottom-width: 6px; font-size: 13.5px; }
  .anatomy-info h1 { font-size: clamp(27px, 8.4vw, 32px); line-height: 1.08; margin-bottom: 12px; }
  .health-info h1 { margin-bottom: 12px; }
  .comparison-table th, .comparison-table td { height: 58px; padding: 5px; }
  .comparison-table th { font-size: 11px; }
  .comparison-table svg { width: 40px; height: 40px; }
  .testimonial { font-size: 13.5px; padding: 12px 14px; }
  .testimonial-stars { font-size: 12px; }
  .evolution-chart { margin: 18px 0 24px; }
}

@keyframes arrive { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* Opções pulsam em sequência; os demais botões mantêm a respiração. */
@keyframes button-breathe {
  0%, 100% { scale: 1; box-shadow: 0 0 5px 0 rgb(22 163 74 / .16); }
  50% { scale: 1.02; box-shadow: 0 0 18px 4px rgb(22 163 74 / .38), 0 0 0 3px rgb(22 163 74 / .14); }
}
@keyframes option-breathe-2 { 0%, 50.000000%, 100% { scale: 1; box-shadow: 0 0 5px 0 rgb(22 163 74 / .16); } 25.000000% { scale: 1.02; box-shadow: 0 0 18px 4px rgb(22 163 74 / .38), 0 0 0 3px rgb(22 163 74 / .14); } }
@keyframes option-breathe-3 { 0%, 33.333333%, 100% { scale: 1; box-shadow: 0 0 5px 0 rgb(22 163 74 / .16); } 16.666667% { scale: 1.02; box-shadow: 0 0 18px 4px rgb(22 163 74 / .38), 0 0 0 3px rgb(22 163 74 / .14); } }
@keyframes option-breathe-4 { 0%, 25.000000%, 100% { scale: 1; box-shadow: 0 0 5px 0 rgb(22 163 74 / .16); } 12.500000% { scale: 1.02; box-shadow: 0 0 18px 4px rgb(22 163 74 / .38), 0 0 0 3px rgb(22 163 74 / .14); } }
@keyframes option-breathe-5 { 0%, 20.000000%, 100% { scale: 1; box-shadow: 0 0 5px 0 rgb(22 163 74 / .16); } 10.000000% { scale: 1.02; box-shadow: 0 0 18px 4px rgb(22 163 74 / .38), 0 0 0 3px rgb(22 163 74 / .14); } }
@media (prefers-reduced-motion: no-preference) {
  #quiz-content button:not(.faq-question) {
    animation: button-breathe 1.4s ease-in-out infinite;
  }
  #quiz-content [data-option] { animation: none; }
  #quiz-content [data-option-count="2"] > button { animation: option-breathe-2 2.8s ease-in-out infinite; }
  #quiz-content [data-option-count="3"] > button { animation: option-breathe-3 4.2s ease-in-out infinite; }
  #quiz-content [data-option-count="4"] > button { animation: option-breathe-4 5.6s ease-in-out infinite; }
  #quiz-content [data-option-count="5"] > button { animation: option-breathe-5 7.0s ease-in-out infinite; }
  #quiz-content [data-option-count] > button:nth-child(2) { animation-delay: 1.4s; }
  #quiz-content [data-option-count] > button:nth-child(3) { animation-delay: 2.8s; }
  #quiz-content [data-option-count] > button:nth-child(4) { animation-delay: 4.2s; }
  #quiz-content [data-option-count] > button:nth-child(5) { animation-delay: 5.6s; }
  #quiz-content button:is(:active, :disabled) {
    animation: none;
  }
}
.selection-hint { margin: 16px 0 20px; text-align: center; color: #59625e; font-size: 15px; line-height: 1.4; }
.full-image {
  width: 100%;
  margin: 20px auto;
}

.full-image img {
  display: block;
  width: 100%;
  height: auto;
}

/* Relatos em áudio: reprodução iniciada pelo visitante. */
.customer-audio-info .question-subtitle { color: #626e66; line-height: 1.5; margin: 0 0 25px; }
.customer-audio-card { padding: 19px 16px 15px; margin: 14px 0; text-align: left; border: 1px solid #dbe9df; border-radius: 16px; background: linear-gradient(135deg, #f2f9f4, #fff 70%); box-shadow: 0 4px 16px rgb(20 70 38 / .045); }
.customer-audio-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 13px; }
.customer-audio-eyebrow { font-size: 9px; letter-spacing: .09em; color: #657a6b; font-weight: 800; }
.customer-audio-card h2 { margin: 3px 0 0; color: #183523; font-size: 18px; line-height: 1.2; font-weight: 800; }
.customer-audio-wave { width: 29px; height: 24px; flex-shrink: 0; margin-left: auto; stroke: #22994c; stroke-width: 2; stroke-linecap: round; }
.customer-audio-card audio { display: block; width: 100%; min-width: 0; height: 54px; border-radius: 28px; }
.customer-audio-error { margin: 10px 0 0; font-size: 13px; color: #775232; line-height: 1.4; }
.customer-audio-info .continue-button { margin-top: 24px; }
@media (max-width: 360px) {
  .customer-audio-card { padding: 15px 10px 12px; }
  .customer-audio-heading { gap: 9px; }
  .customer-audio-eyebrow { font-size: 8px; }
}

.customer-audio-avatar { display: block; flex: 0 0 56px; width: 56px; height: 56px; border-radius: 50%; object-fit: cover; object-position: center; background: #e6f1e9; border: 2px solid #d5e8db; }
.customer-audio-person { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.customer-audio-location { margin: 5px 0 0; font-size: 12px; line-height: 1.4; color: #657a6b; }

.customer-audio-duration { margin: 7px 3px 0; color: #657a6b; font-size: 12px; line-height: 1.4; text-align: right; }
.customer-audio-info .customer-audio-privacy { margin: 20px 4px 0; color: #69756d; font-size: 12px; line-height: 1.5; text-align: center; }

/* Vídeo da etapa pesquisa: preserva a proporção do arquivo. */
.quiz-video-frame { width: 100%; margin: 22px auto; overflow: hidden; border-radius: 12px; background: #111; }
.quiz-video { display: block; width: 100%; height: auto; aspect-ratio: auto 16 / 9; max-height: 75vh; object-fit: contain; }

.quiz-video-frame { position: relative; }
#quiz-content .video-sound-toggle { position: absolute; top: 12px; right: 12px; z-index: 2; display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 10px 14px; border: 1px solid rgb(255 255 255 / .5); border-radius: 24px; background: rgb(0 0 0 / .76); color: #fff; font-size: 13px; font-weight: 800; cursor: pointer; animation: none; box-shadow: 0 2px 8px rgb(0 0 0 / .2); }
.video-sound-toggle svg { width: 22px; height: 22px; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.video-sound-toggle[aria-pressed="false"] .video-sound-waves,
.video-sound-toggle[aria-pressed="true"] .video-sound-slash { display: none; }
#quiz-content [data-video-gated][hidden] { display: none !important; }