/* tuc-quiz.css — inline 6-step quiz */

.tuc-quiz {
  background: var(--tuc-c-paper);
  border: 1px solid var(--tuc-c-ink-100);
  border-radius: var(--tuc-radius-lg);
  box-shadow: var(--tuc-shadow-md);
  padding: clamp(var(--tuc-sp-5), 4vw, var(--tuc-sp-7));
  max-width: 720px;
  margin-inline: auto;
}

/* Reserve height to avoid CLS during step swaps */
.tuc-quiz__viewport { min-height: 460px; position: relative; }

@media (min-width: 760px) {
  .tuc-quiz__viewport { min-height: 420px; }
}

.tuc-quiz__progress {
  display: flex; align-items: center; gap: var(--tuc-sp-3);
  margin-bottom: var(--tuc-sp-5);
}

.tuc-quiz__bar {
  flex: 1 1 auto;
  height: 6px;
  background: var(--tuc-c-ink-100);
  border-radius: var(--tuc-radius-pill);
  overflow: hidden;
}

.tuc-quiz__bar-fill {
  display: block;
  height: 100%;
  width: 0%;
  background: var(--tuc-c-brand-500);
  border-radius: inherit;
  transition: width var(--tuc-dur-base) var(--tuc-ease-out);
}

.tuc-quiz__count {
  font-size: var(--tuc-fs-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--tuc-c-ink-500);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.tuc-quiz__step { display: none; }
.tuc-quiz__step.is-active { display: block; }

.tuc-quiz__question {
  font-family: var(--tuc-ff-display);
  font-size: var(--tuc-fs-xl);
  line-height: var(--tuc-lh-snug);
  font-weight: 700;
  margin: 0 0 var(--tuc-sp-5);
}

.tuc-quiz__options {
  list-style: none; padding: 0; margin: 0;
  display: grid; gap: var(--tuc-sp-3);
}

@media (min-width: 600px) {
  .tuc-quiz__options--cols { grid-template-columns: 1fr 1fr; }
}

.tuc-quiz__option {
  display: block; cursor: pointer;
}

.tuc-quiz__option input { position: absolute; opacity: 0; pointer-events: none; }

.tuc-quiz__option-label {
  display: flex;
  align-items: center;
  gap: var(--tuc-sp-3);
  padding: 14px 18px;
  border-radius: var(--tuc-radius-md);
  border: 1.5px solid var(--tuc-c-ink-100);
  background: var(--tuc-c-paper);
  font-weight: 500;
  transition: border-color var(--tuc-dur-fast) var(--tuc-ease-out),
              background-color var(--tuc-dur-fast) var(--tuc-ease-out),
              transform var(--tuc-dur-fast) var(--tuc-ease-out);
  min-height: 56px;
}

.tuc-quiz__option:hover .tuc-quiz__option-label {
  border-color: var(--tuc-c-brand-500);
  background: var(--tuc-c-brand-100);
}

.tuc-quiz__option input:checked + .tuc-quiz__option-label {
  border-color: var(--tuc-c-brand-600);
  background: var(--tuc-c-brand-100);
  box-shadow: inset 0 0 0 1px var(--tuc-c-brand-600);
}

.tuc-quiz__option input:focus-visible + .tuc-quiz__option-label {
  box-shadow: var(--tuc-focus-ring);
}

.tuc-quiz__nav {
  display: flex;
  justify-content: space-between;
  gap: var(--tuc-sp-3);
  max-width: 720px;
  margin-inline: auto;
  margin-top: var(--tuc-sp-6);
}

.tuc-quiz__nav .tuc-btn[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}

/* Result screen */
.tuc-result__profile {
  background: var(--tuc-c-cream);
  border-radius: var(--tuc-radius-md);
  padding: var(--tuc-sp-5);
  margin-bottom: var(--tuc-sp-5);
}

.tuc-result__list {
  list-style: none; padding: 0; margin: 0 0 var(--tuc-sp-5);
  display: grid; gap: var(--tuc-sp-2);
}

.tuc-result__list li::before {
  content: "✓";
  color: var(--tuc-c-brand-600);
  margin-right: var(--tuc-sp-2);
  font-weight: 700;
}

.tuc-lead {
  display: grid; gap: var(--tuc-sp-3);
  max-width: 520px;
}

.tuc-lead__field { display: grid; gap: 6px; }

.tuc-lead__field input[type="email"],
.tuc-lead__field input[type="text"] {
  font: inherit;
  padding: 14px 16px;
  border-radius: var(--tuc-radius-md);
  border: 1.5px solid var(--tuc-c-ink-100);
  background: var(--tuc-c-paper);
  min-height: 52px;
}

.tuc-lead__consent {
  display: flex; gap: var(--tuc-sp-2);
  align-items: flex-start;
  font-size: var(--tuc-fs-sm);
  color: var(--tuc-c-ink-700);
  line-height: var(--tuc-lh-snug);
}

.tuc-lead__consent input { margin-top: 4px; }

.tuc-lead__error {
  color: var(--tuc-c-error);
  font-size: var(--tuc-fs-sm);
  min-height: 1.2em;
}

.tuc-lead__success {
  background: var(--tuc-c-brand-100);
  border-radius: var(--tuc-radius-md);
  padding: var(--tuc-sp-5);
  text-align: center;
}

/* Step transition (no layout shift) */
.tuc-quiz__step.is-entering {
  animation: tuc-step-in var(--tuc-dur-base) var(--tuc-ease-out);
}

@keyframes tuc-step-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .tuc-quiz__step.is-entering { animation: none; }
}

/* TUC-36 — Quiz viewport: reducir min-height a 280px */
.tuc-quiz__viewport { min-height: 280px; }
