/* Warm, immersive backdrop */
.trouver-parfum {
  display: grid;
  gap: clamp(1.5rem, 3vw, 2.75rem);
  position: relative;
  padding: clamp(0.45rem, 1.2vw, 0.9rem);
  border-radius: 0;
  border: none;
  box-shadow: none;
  background: radial-gradient(circle at 15% 30%, rgba(255, 208, 170, 0.55), transparent 55%),
    radial-gradient(circle at 85% 10%, rgba(229, 174, 255, 0.35), transparent 50%),
    linear-gradient(135deg, #fff4ee 0%, #fefbf6 50%, #f8ecf8 100%);
  overflow: hidden;
  max-width: none;
  width: 100%;
  margin: 0;
  min-height: calc(100dvh - var(--site-header-height, 72px));
}

/* Avoid any horizontal scroll created by animations on this page */
body,
.site-main {
  overflow-x: hidden;
}

.site-main {
  padding-top: 0;
  padding-bottom: 0;
}

@supports (overflow: clip) {
  body,
  .site-main {
    overflow-x: clip;
  }
}

@media (min-width: 901px) {
  body.has-history .trouver-parfum {
    position: relative;
    left: calc(var(--history-rail-width, 108px) / -2);
    width: calc(100% + var(--history-rail-width, 108px));
  }
}

.trouver-parfum::after {
  content: "";
  position: absolute;
  inset: 0.75rem;
  border-radius: inherit;
  border: 1px solid rgba(255, 255, 255, 0.4);
  pointer-events: none;
  mix-blend-mode: soft-light;
}

.trouver-parfum > * {
  position: relative;
  z-index: 1;
}

/* Keep the inner stack centered inside the full-bleed backdrop */
.trouver-parfum > .stack {
  width: min(100%, 1120px);
  margin-left: auto;
  margin-right: auto;
  justify-self: center;
  align-self: start;
}

/* Search scope + tabs */
.trouver-parfum__layout-stack {
  gap: clamp(0.08rem, 0.4vw, 0.22rem);
}

.trouver-parfum__seo-intro-top {
  display: grid;
  gap: 0.68rem;
  width: 100%;
  padding: clamp(1rem, 2.4vw, 1.45rem);
  border-radius: clamp(1rem, 2vw, 1.25rem);
  border: 1px solid rgba(116, 153, 180, 0.34);
  background:
    radial-gradient(circle at 10% 14%, rgba(198, 226, 245, 0.4), transparent 40%),
    radial-gradient(circle at 86% 8%, rgba(226, 206, 244, 0.24), transparent 38%),
    linear-gradient(146deg, rgba(255, 255, 255, 0.98), rgba(246, 250, 254, 0.97));
  box-shadow: 0 16px 34px rgba(21, 48, 69, 0.11);
}

.trouver-parfum__page-title {
  margin: 0;
  font-size: clamp(1.28rem, 2.6vw, 2.05rem);
  line-height: 1.16;
  color: #16364d;
}

.trouver-parfum__page-intro {
  margin: 0;
  max-width: 74ch;
  font-size: clamp(0.92rem, 1.2vw, 1rem);
  line-height: 1.54;
  color: #35556f;
}

.trouver-parfum__page-intro-label {
  margin: 0;
  font-size: 0.83rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #1f4864;
}

.trouver-parfum__page-intro-list {
  margin: 0;
  padding-left: 1.1rem;
  display: grid;
  gap: 0.28rem;
  color: #2f5168;
  font-size: 0.85rem;
}

.trouver-parfum__page-intro-list li {
  line-height: 1.4;
}

.trouver-parfum__search-scope {
  display: grid;
  justify-items: end;
  justify-self: end;
  width: 100%;
  margin-left: auto;
}

.trouver-parfum__scope-label {
  font-size: 0.56rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #8e4a26;
}

.search-scope-toggle {
  display: inline-grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.14rem;
  width: min(100%, 19.5rem);
  padding: 0.16rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(255, 189, 139, 0.34);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92), 0 6px 14px rgba(148, 73, 36, 0.1);
}

.search-scope-toggle__option {
  min-width: 0;
  position: relative;
}

.search-scope-toggle__option input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  margin: -1px;
  border: 0;
  padding: 0;
  white-space: nowrap;
  clip-path: inset(100%);
  clip: rect(0 0 0 0);
  overflow: hidden;
}

.search-scope-toggle__text {
  display: block;
  width: 100%;
  padding: 0.34rem 0.45rem;
  border-radius: 999px;
  text-align: center;
  font-size: 0.65rem;
  font-weight: 600;
  color: #8f522e;
  cursor: pointer;
  transition: transform var(--transition-base), background-color var(--transition-base),
    color var(--transition-base), box-shadow var(--transition-base);
  white-space: nowrap;
}

.search-scope-toggle__option input:checked + .search-scope-toggle__text {
  background: linear-gradient(135deg, #ffb886, #f4a0ba);
  color: #4a1f10;
  box-shadow: 0 5px 12px rgba(207, 97, 63, 0.24);
}

.search-scope-toggle__option input:not(:checked) + .search-scope-toggle__text:hover,
.search-scope-toggle__option input:not(:checked) + .search-scope-toggle__text:focus-visible {
  transform: translateY(-1px);
  background: rgba(255, 255, 255, 0.92);
}

.search-scope-toggle__tooltip {
  position: absolute;
  top: calc(100% + 0.4rem);
  right: 0;
  width: min(14rem, 70vw);
  padding: 0.45rem 0.58rem;
  border-radius: 0.55rem;
  border: 1px solid rgba(136, 74, 41, 0.22);
  background: rgba(255, 252, 248, 0.97);
  box-shadow: 0 10px 18px rgba(54, 28, 14, 0.15);
  color: #6b3a25;
  font-size: 0.67rem;
  line-height: 1.3;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-3px);
  transition: opacity var(--transition-base), transform var(--transition-base),
    visibility var(--transition-base);
  pointer-events: none;
  z-index: 5;
}

.search-scope-toggle__option:hover .search-scope-toggle__tooltip,
.search-scope-toggle__option .search-scope-toggle__text:hover + .search-scope-toggle__tooltip {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.search-scope-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.12rem;
  width: min(100%, 15rem);
  padding: 0.16rem;
  border-radius: 999px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.9), rgba(247, 251, 254, 0.9));
  border: 1px solid rgba(126, 154, 174, 0.34);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 6px 14px rgba(33, 59, 81, 0.1);
}

.search-scope-summary__pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 1.85rem;
  padding: 0.26rem 0.36rem;
  border-radius: 999px;
  border: 0;
  appearance: none;
  text-align: center;
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: #4f6276;
  background: transparent;
  cursor: pointer;
  white-space: normal;
  line-height: 1.12;
  transition: background-color var(--transition-base), color var(--transition-base),
    box-shadow var(--transition-base), transform var(--transition-base);
}

.search-scope-summary__pill:hover,
.search-scope-summary__pill:focus-visible {
  background: rgba(255, 255, 255, 0.78);
  transform: translateY(-1px);
}

.search-scope-summary__pill:focus-visible {
  outline: 2px solid rgba(42, 109, 146, 0.45);
  outline-offset: 1px;
}

.search-scope-summary__pill.is-active {
  background: linear-gradient(135deg, #35668f, #284f6f);
  color: #f6fbff;
  box-shadow: 0 4px 10px rgba(24, 58, 86, 0.3);
}

.search-scope-summary__pill.is-active:hover,
.search-scope-summary__pill.is-active:focus-visible {
  transform: none;
}

.search-scope-summary.is-locked {
  opacity: 0.9;
}

.search-scope-summary__pill:disabled,
.search-scope-summary__pill.is-locked {
  cursor: default;
  pointer-events: none;
}

.search-scope-summary.is-locked .search-scope-summary__pill {
  box-shadow: none;
}

.trouver-parfum__tabs {
  display: flex;
  justify-content: center;
}

@media (max-width: 700px) {
  .trouver-parfum__layout-stack {
    gap: 0.14rem;
  }

  .trouver-parfum__search-scope {
    width: 100%;
    justify-items: end;
  }

  .trouver-parfum__scope-label {
    text-align: right;
  }

  .search-scope-toggle {
    grid-template-columns: 1fr;
    width: 100%;
    border-radius: 1rem;
  }

  .search-scope-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: min(100%, 13.6rem);
    border-radius: 999px;
  }

  .search-scope-toggle__text {
    border-radius: 0.8rem;
    white-space: normal;
  }

  .search-scope-summary__pill {
    font-size: 0.58rem;
    padding: 0.22rem 0.28rem;
    white-space: normal;
    line-height: 1.1;
    min-height: 1.62rem;
  }

  .search-scope-toggle__tooltip {
    width: min(16rem, calc(100vw - 1.5rem));
  }
}

.tabs {
  display: inline-flex;
  background: rgba(255, 255, 255, 0.65);
  border-radius: 999px;
  padding: 0.35rem;
  border: 1px solid rgba(255, 189, 139, 0.3);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 12px 30px rgba(158, 84, 38, 0.15);
  gap: 0.35rem;
}

.tab {
  padding: 0.55rem 1.35rem;
  border-radius: 999px;
  border: none;
  background: transparent;
  font-weight: 600;
  color: #a4521f;
  cursor: pointer;
  transition: transform var(--transition-base), background-color var(--transition-base),
    color var(--transition-base);
}

.tab:hover,
.tab:focus-visible {
  transform: translateY(-1px);
  background: rgba(255, 255, 255, 0.85);
}

.tab.active {
  background: linear-gradient(135deg, #ffb885, #f38dac);
  color: #431d0f;
  box-shadow: 0 8px 20px rgba(225, 105, 76, 0.35);
}

/* Panels + cards */
.trouver-parfum__panels {
  width: 100%;
  margin: 0;
}

.trouver-parfum__panel {
  gap: clamp(1rem, 3vw, 1.8rem);
  background: rgba(255, 255, 255, 0.9);
  border-radius: var(--radius-xl);
  box-shadow: 0 25px 60px rgba(124, 58, 32, 0.14);
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid rgba(255, 189, 139, 0.3);
}

.trouver-parfum__panel.card {
  background: rgba(255, 255, 255, 0.95);
}

.trouver-parfum__seo-band {
  width: min(calc(100vw - clamp(1rem, 3vw, 2.4rem)), 1680px);
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  margin-top: clamp(0.9rem, 2vw, 1.5rem);
}

.trouver-parfum__seo-band-inner {
  width: 100%;
  margin: 0 auto;
}

.trouver-parfum__seo-intro {
  display: grid;
  gap: 0.64rem;
}

.trouver-parfum__seo-kicker {
  margin: 0;
  font-size: 0.62rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 700;
  color: #2f627f;
}

.trouver-parfum__seo-intro h2 {
  margin: 0;
  font-size: clamp(1.08rem, 2vw, 1.55rem);
  color: #16344a;
  line-height: 1.18;
}

.trouver-parfum__seo-lead {
  margin: 0;
  font-size: clamp(0.84rem, 1.2vw, 1rem);
  color: #35556f;
  line-height: 1.45;
  max-width: 62ch;
}

.trouver-parfum__seo-points {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.trouver-parfum__seo-points li {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.52rem;
  padding: 0.16rem 0.62rem;
  border-radius: 999px;
  font-size: 0.77rem;
  font-weight: 600;
  color: #234b68;
  background: color-mix(in srgb, #e2f1fb 68%, #ffffff 32%);
  border: 1px solid rgba(112, 155, 184, 0.46);
}

.trouver-parfum__seo-links {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.4rem;
  font-size: 0.84rem;
  margin: 0;
}

.trouver-parfum__seo-links a {
  color: #1f5278;
  font-weight: 600;
  text-decoration: none;
  text-underline-offset: 0.14em;
}

.trouver-parfum__seo-links a:hover,
.trouver-parfum__seo-links a:focus-visible {
  text-decoration: underline;
  color: #163f5f;
}

.trouver-parfum__seo-links span {
  color: rgba(46, 78, 104, 0.45);
}

.trouver-parfum__seo-faq {
  display: grid;
  gap: 0.48rem;
  margin-top: 0.24rem;
  padding-top: clamp(0.58rem, 1.2vw, 0.8rem);
  border-top: 1px solid rgba(108, 148, 176, 0.34);
}

.trouver-parfum__seo-faq h3 {
  margin: 0;
  font-size: 0.88rem;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: #244a67;
}

.trouver-parfum__seo-faq-list {
  display: grid;
  gap: 0.38rem;
}

.trouver-parfum__seo-faq-item {
  border: 1px solid rgba(115, 153, 180, 0.38);
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.92), rgba(245, 250, 254, 0.9));
  border-radius: 0.78rem;
  overflow: clip;
}

.trouver-parfum__seo-faq-item summary {
  list-style: none;
  position: relative;
  margin: 0;
  padding: 0.56rem 2rem 0.56rem 0.72rem;
  font-size: 0.86rem;
  line-height: 1.35;
  font-weight: 650;
  color: #183f5b;
  cursor: pointer;
}

.trouver-parfum__seo-faq-item summary::-webkit-details-marker {
  display: none;
}

.trouver-parfum__seo-faq-item summary::after {
  content: "+";
  position: absolute;
  right: 0.72rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1rem;
  line-height: 1;
  color: #1f557a;
}

.trouver-parfum__seo-faq-item[open] summary::after {
  content: "−";
}

.trouver-parfum__seo-faq-item p {
  margin: 0;
  padding: 0 0.72rem 0.64rem;
  color: #3f5c73;
  font-size: 0.81rem;
  line-height: 1.42;
}

@media (min-width: 1080px) {
  .trouver-parfum__seo-intro {
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
    grid-template-areas:
      "title title"
      "intro intro"
      "label links1"
      "list links2";
    align-items: start;
    column-gap: clamp(1rem, 2vw, 1.8rem);
    row-gap: 0.56rem;
  }

  .trouver-parfum__page-title {
    grid-area: title;
  }

  .trouver-parfum__page-intro {
    grid-area: intro;
    max-width: none;
    font-size: 1.03rem;
  }

  .trouver-parfum__page-intro-label {
    grid-area: label;
    align-self: center;
  }

  .trouver-parfum__page-intro-list {
    grid-area: list;
    columns: 2;
    column-gap: 1.2rem;
    max-width: none;
  }

  .trouver-parfum__page-intro-list li {
    break-inside: avoid;
    margin-bottom: 0.24rem;
  }

  .trouver-parfum__seo-intro .trouver-parfum__seo-links:first-of-type {
    grid-area: links1;
    justify-self: end;
    align-self: center;
    text-align: right;
  }

  .trouver-parfum__seo-intro .trouver-parfum__seo-links:last-of-type {
    grid-area: links2;
    justify-self: end;
    text-align: right;
  }
}

.trouver-parfum__hint {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  font-size: 0.95rem;
  color: #704633;
}

.trouver-parfum__hint strong {
  font-size: 1rem;
  color: #bb4d22;
}

/* Entry modal */
.quiz-entry-modal {
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1.2rem;
  z-index: 120;
}

.quiz-entry-modal.is-visible {
  display: flex;
}

.quiz-entry-modal__backdrop {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 22% 14%, rgba(255, 205, 160, 0.33), transparent 42%),
    radial-gradient(circle at 82% 86%, rgba(244, 160, 186, 0.24), transparent 40%),
    rgba(26, 16, 12, 0.6);
  backdrop-filter: blur(8px);
  z-index: 1;
}

.quiz-entry-modal__dialog {
  position: relative;
  z-index: 2;
  width: min(100%, 640px);
  border-radius: 1.4rem;
  padding: clamp(1.3rem, 2.4vw, 1.9rem);
  background:
    radial-gradient(circle at 12% 16%, rgba(255, 224, 186, 0.42), transparent 48%),
    radial-gradient(circle at 84% 10%, rgba(246, 184, 207, 0.28), transparent 45%),
    linear-gradient(145deg, rgba(255, 253, 249, 0.98), rgba(255, 246, 236, 0.98));
  border: 1px solid rgba(255, 193, 143, 0.45);
  box-shadow: 0 48px 110px rgba(34, 18, 10, 0.36);
  animation: hint-modal-enter 0.34s ease;
}

.quiz-entry-modal__header h2 {
  margin: 0;
  color: #3e1d12;
  font-size: clamp(1.32rem, 3vw, 1.66rem);
}

.quiz-entry-modal__header p {
  margin: 0;
}

.quiz-entry-modal__eyebrow {
  margin-bottom: 0.22rem;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #b35d31;
}

.quiz-entry-modal__description {
  margin-top: 0.34rem;
}

.quiz-entry-modal__modes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.72rem;
  margin-top: 1rem;
}

.quiz-entry-modal__modes .button {
  min-height: 3rem;
}

.quiz-entry-modal__modes .button--coming-soon {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  opacity: 1;
}

.quiz-entry-modal__modes .button--coming-soon:disabled,
.quiz-entry-modal__modes .button--coming-soon[aria-disabled="true"] {
  cursor: not-allowed;
  color: #6d7480;
  border-color: rgba(122, 132, 145, 0.42);
  background: linear-gradient(135deg, rgba(236, 240, 244, 0.95), rgba(226, 233, 240, 0.94));
  box-shadow: none;
}

.quiz-entry-modal__modes .button--coming-soon:disabled:hover,
.quiz-entry-modal__modes .button--coming-soon[aria-disabled="true"]:hover {
  transform: none;
}

.quiz-entry-modal__modes .coming-soon-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 3.6rem;
  padding: 0.16rem 0.5rem;
  border-radius: 999px;
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #47535f;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(116, 129, 143, 0.34);
}

.quiz-entry-modal__scope {
  margin-top: 1rem;
  padding-top: 0.9rem;
  border-top: 1px solid rgba(211, 141, 93, 0.2);
}

.quiz-entry-modal__scope-label {
  margin: 0 0 0.45rem;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #904d2a;
}

.quiz-entry-modal .search-scope-toggle {
  width: 100%;
}

.trouver-parfum.quiz-gate-open .trouver-parfum__panel {
  filter: saturate(0.85) blur(1.3px);
  pointer-events: none;
  user-select: none;
}

body.tp-quiz-gate-open .chat-widget {
  filter: blur(2px) saturate(0.85);
  opacity: 0.72;
  pointer-events: none;
  transition: filter var(--transition-base), opacity var(--transition-base);
}

@media (max-width: 680px) {
  .quiz-entry-modal__modes {
    grid-template-columns: 1fr;
  }
}

@keyframes hint-modal-enter {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Quiz */
.quiz-layout {
  display: grid;
  gap: clamp(1rem, 3vw, 2.5rem);
}

@media (min-width: 900px) {
  .quiz-layout {
    grid-template-columns: minmax(0, 1.1fr) minmax(260px, 0.9fr);
    align-items: stretch;
  }
}

.quiz-layout__content {
  display: flex;
  flex-direction: column;
  gap: clamp(1.25rem, 2vw, 1.75rem);
  min-width: 0;
}

.quiz-layout__content .actions {
  margin-top: auto;
}

.progress {
  width: 100%;
  height: 10px;
  background: rgba(255, 189, 139, 0.25);
  border-radius: 999px;
  overflow: hidden;
}

.progress-bar {
  height: 100%;
  background: linear-gradient(90deg, #f97316, #ec4899);
  width: 0%;
  transition: width 0.4s ease;
}

.question-card {
  background: rgba(255, 255, 255, 0.9);
  border-radius: var(--radius-lg);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), 0 15px 45px rgba(186, 68, 18, 0.15);
  padding: clamp(1.25rem, 3vw, 2rem);
  width: 100%;
  max-width: none;
  margin: 0;
  min-height: 240px;
  border: 1px solid rgba(255, 190, 142, 0.4);
  overflow: hidden;
}

.question-card h2 {
  margin: 0;
  color: #4a2815;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.question-card__icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(249, 115, 22, 0.12), rgba(236, 72, 153, 0.14));
  color: #b25230;
  box-shadow: 0 10px 25px rgba(249, 115, 22, 0.16);
  flex-shrink: 0;
}

.question-card__icon-shape {
  width: 1.35rem;
  height: 1.35rem;
}

.question-card__label {
  line-height: 1.25;
}

.choices {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 0.85rem;
  margin: 1.5rem 0 0;
}

.choice {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.65rem;
  background: rgba(255, 240, 233, 0.85);
  padding: 0.75rem 1.45rem;
  border-radius: 999px;
  font-size: 1.02rem;
  cursor: pointer;
  transition: background-color var(--transition-base), transform var(--transition-base),
    color var(--transition-base), box-shadow var(--transition-base);
  border: 1px solid rgba(255, 189, 139, 0.5);
  font: inherit;
  color: #894223;
  text-align: left;
  min-height: 3rem;
}

.choice:hover,
.choice:focus-visible {
  background: linear-gradient(135deg, rgba(255, 184, 133, 0.9), rgba(245, 124, 167, 0.85));
  color: #381307;
  box-shadow: 0 6px 20px rgba(201, 98, 72, 0.25);
  transform: translateY(-1px);
}

.choice__icon {
  width: 2.1rem;
  height: 2.1rem;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(249, 115, 22, 0.18), rgba(236, 72, 153, 0.16));
  color: #b25230;
  box-shadow: 0 10px 18px rgba(249, 115, 22, 0.12);
  flex-shrink: 0;
}

.choice__icon--image {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 240, 233, 0.92));
  box-shadow: 0 10px 18px rgba(249, 115, 22, 0.1);
  padding: 0.2rem;
  overflow: hidden;
}

.choice__icon-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.choice__icon-shape {
  width: 1.2rem;
  height: 1.2rem;
}

.choice__label {
  line-height: 1.3;
}

.actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: space-between;
}

.trouver-parfum .button {
  border-radius: 999px;
  border: none;
  padding: 0.95rem 1.4rem;
  font-weight: 600;
  background: linear-gradient(135deg, #f97316, #f43f5e);
  box-shadow: 0 15px 35px rgba(249, 115, 22, 0.35);
}

.trouver-parfum .button--ghost {
  background: transparent;
  border: 1px solid rgba(249, 115, 22, 0.4);
  color: #b25230;
  box-shadow: none;
}

.actions .button {
  flex: 1 1 150px;
}

.button--with-gap {
  margin-top: 0.75rem;
}

/* Results */
.results-grid {
  display: grid;
  gap: clamp(0.9rem, 2vw, 1.2rem);
  grid-template-columns: 1fr;
}

.results-grid.is-hidden {
  display: none;
}

.results-grid > .results-heading,
.results-grid > .results-carousel,
.results-grid > .results-nav,
.results-grid > .results-hint,
.results-grid > .results-loading,
.results-grid > .status-message {
  grid-column: 1 / -1;
}

.results-heading {
  text-align: center;
}

.results-heading h2 {
  margin-bottom: 0.25rem;
  color: #4b2c1a;
}

.results-hint {
  text-align: center;
  font-size: 0.85rem;
  color: #5b6c7e;
  margin: -0.1rem auto 0;
  max-width: 460px;
}

.results-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  padding: 1.5rem 0;
  color: #7a594b;
}

.results-loading__spinner {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 3px solid rgba(249, 115, 22, 0.25);
  border-top-color: #f97316;
  animation: trouver-spinner 0.9s linear infinite;
}

@keyframes trouver-spinner {
  to {
    transform: rotate(360deg);
  }
}

.results-carousel {
  position: relative;
  overflow: hidden;
  width: min(100%, 540px);
  margin: 0 auto;
  padding: clamp(0.2rem, 1.2vw, 0.36rem) clamp(0.7rem, 2.4vw, 1rem);
}

.results-track {
  position: relative;
  z-index: 1;
  display: flex;
  width: 100%;
  transform: translateX(0);
  transition: transform 0.52s cubic-bezier(0.22, 0.74, 0.18, 1);
  touch-action: pan-y;
}

.results-card {
  position: relative;
  flex: 0 0 100%;
  max-width: min(100%, 450px);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(0.64rem, 1.55vw, 0.94rem);
  padding: clamp(1.04rem, 2.85vw, 1.28rem);
  border-radius: clamp(1.1rem, 3vw, 1.4rem);
  border: 1px solid rgba(117, 145, 164, 0.3);
  background: linear-gradient(170deg, rgba(255, 255, 255, 0.97), rgba(243, 248, 252, 0.95));
  box-shadow: 0 20px 48px rgba(22, 40, 58, 0.16);
  transition: transform 0.4s ease, box-shadow 0.34s ease, opacity 0.28s ease;
  will-change: transform;
}

.results-card.is-active {
  transform: scale(1) translateY(0);
  box-shadow: 0 28px 70px rgba(22, 55, 84, 0.24);
  opacity: 1;
}

.results-card.is-next,
.results-card.is-prev {
  transform: scale(0.965) translateY(14px);
  opacity: 0.84;
}

.results-card.is-dragging {
  cursor: grabbing;
  box-shadow: 0 34px 78px rgba(30, 72, 105, 0.33);
}

.results-card .perfume-card__logo {
  top: clamp(0.65rem, 2vw, 0.9rem);
  right: clamp(0.65rem, 2vw, 0.9rem);
  width: clamp(34px, 4.9vw, 46px);
  height: clamp(34px, 4.9vw, 46px);
}

.results-card .parfum-img {
  width: clamp(154px, 55vw, 210px);
  height: clamp(186px, 61vw, 232px);
  object-fit: contain;
  border-radius: clamp(0.8rem, 2.2vw, 1.1rem);
  background: #fff;
  padding: clamp(0.45rem, 1.8vw, 0.82rem);
  box-shadow: inset 0 0 0 1px rgba(148, 166, 183, 0.22), 0 15px 30px rgba(17, 32, 48, 0.12);
}

.results-card .parfum-title {
  margin-top: 0;
  font-size: clamp(1rem, 2.8vw, 1.18rem);
  font-weight: 700;
  color: #1f2f41;
}

.results-card .parfum-brand {
  margin-top: -0.02rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.055em;
  text-transform: uppercase;
  color: #5b7389;
}

.results-card .parfum-brand + .parfum-title {
  margin-top: -0.24rem;
}

.results-card .parfum-year {
  margin-top: -0.18rem;
  font-size: 0.72rem;
  font-weight: 650;
  color: #4b6278;
}

.results-card .perfume-card__accords {
  margin-top: 0.06rem;
  --perfume-card-accord-gap: clamp(0.24rem, 0.9vw, 0.36rem);
  color: rgba(29, 52, 74, 0.78);
}

.results-card .perfume-card__accord {
  gap: 0.14rem;
  border-radius: 0;
  padding: 0;
  background: transparent;
  border: 0;
}

.results-card .perfume-card__accord-dot {
  width: clamp(0.52rem, 1.05vw, 0.68rem);
  height: clamp(0.52rem, 1.05vw, 0.68rem);
  background: transparent;
  box-shadow: none;
}

.results-card .perfume-card__accord-dot .accord-dot__svg {
  width: 100%;
  height: 100%;
  display: block;
  filter: drop-shadow(0 1px 2px rgba(37, 52, 71, 0.22));
}

.results-card .perfume-card__accord-name {
  font-size: clamp(0.5rem, 0.8vw, 0.58rem);
  color: rgba(31, 50, 69, 0.82);
}

.results-card .parfum-miss {
  font-size: 0.84rem;
  color: #5a6b7b;
  line-height: 1.4;
}

.results-card .button {
  width: min(100%, 12.2rem);
  justify-content: center;
  margin-top: auto;
  border-radius: 0.68rem;
  border: 1px solid
    color-mix(in srgb, var(--tp-continue-accent, #2e6a90) 60%, rgba(16, 37, 55, 0.4));
  padding: 0.46rem 0.86rem;
  min-height: 2.28rem;
  font-size: 0.92rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: #f7fbff;
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--tp-continue-accent, #2e6a90) 84%, #ffffff 16%),
    color-mix(in srgb, var(--tp-continue-accent, #2e6a90) 66%, #12293d 34%)
  );
  box-shadow: 0 8px 16px
    color-mix(in srgb, var(--tp-continue-accent, #2e6a90) 38%, rgba(16, 37, 55, 0.32));
}

.results-card .button:hover,
.results-card .button:focus-visible {
  transform: translateY(-1px) scale(1.01);
  filter: brightness(1.03);
}

.results-nav {
  position: absolute;
  inset: 0;
  z-index: 20;
  pointer-events: none;
  direction: ltr;
}

.results-nav__btn {
  pointer-events: auto;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 21;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid
    color-mix(in srgb, var(--tp-continue-accent, #2e6a90) 65%, rgba(14, 32, 47, 0.45));
  background: linear-gradient(
    140deg,
    color-mix(in srgb, var(--tp-continue-accent, #2e6a90) 82%, #ffffff 18%),
    color-mix(in srgb, var(--tp-continue-accent, #2e6a90) 62%, #0f2233 38%)
  );
  color: #f4fbff;
  cursor: pointer;
  font-size: 1.24rem;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform var(--transition-base), filter var(--transition-base);
  box-shadow: 0 9px 18px
    color-mix(in srgb, var(--tp-continue-accent, #2e6a90) 30%, rgba(21, 45, 66, 0.3));
}

.results-nav__btn--prev {
  left: clamp(0.18rem, 1vw, 0.56rem);
}

.results-nav__btn--next {
  right: clamp(0.18rem, 1vw, 0.56rem);
}

.results-nav__btn:hover,
.results-nav__btn:focus-visible {
  transform: translateY(calc(-50% - 1px)) scale(1.02);
  filter: brightness(1.03);
}

.results-nav__btn:disabled {
  opacity: 0.32;
  cursor: not-allowed;
  filter: grayscale(0.24) saturate(0.35);
  box-shadow: none;
}

.results-nav__status {
  display: none;
}

.results-nav__icon {
  width: 1.18rem;
  height: 1.18rem;
  display: block;
}

.results-carousel.is-nav-animating .results-card {
  transition: transform 0.52s cubic-bezier(0.22, 0.74, 0.18, 1),
    box-shadow 0.44s ease,
    opacity 0.32s ease;
}

.results-carousel.is-nav-animating .results-card.is-active {
  animation-duration: 0.46s;
  animation-timing-function: cubic-bezier(0.2, 0.86, 0.24, 1);
  animation-fill-mode: both;
}

.results-carousel.is-nav-animating.is-nav-forward .results-card.is-active {
  animation-name: tp-results-card-reveal-forward;
}

.results-carousel.is-nav-animating.is-nav-backward .results-card.is-active {
  animation-name: tp-results-card-reveal-backward;
}

.status-message {
  border-radius: 0.95rem;
  padding: 0.82rem 1rem;
  text-align: center;
  border: 1px solid rgba(111, 136, 156, 0.24);
}

.status-message--muted {
  background: rgba(240, 247, 252, 0.9);
  color: #50647a;
}

.status-message--error {
  background: rgba(255, 236, 236, 0.94);
  color: #8a2231;
}

.trouver-parfum .quiz-score-panel {
  border-radius: 1.15rem;
  border: 1px solid rgba(111, 139, 161, 0.28);
  background: linear-gradient(170deg, rgba(255, 255, 255, 0.96), rgba(242, 247, 251, 0.92));
  box-shadow: 0 16px 40px rgba(24, 46, 66, 0.12);
  padding: clamp(0.66rem, 1.5vw, 0.8rem);
  display: grid;
  gap: 0.36rem;
}

.trouver-parfum .quiz-score-panel.is-hidden {
  display: none;
}

.trouver-parfum .question-card.is-hidden,
.trouver-parfum .actions.is-hidden {
  display: none !important;
}

.trouver-parfum .quiz-score-panel__header {
  display: grid;
  gap: 0.2rem;
}

.trouver-parfum .quiz-score-panel__header h3 {
  margin: 0;
  font-size: clamp(1rem, 2vw, 1.13rem);
  color: #1f3248;
}

.trouver-parfum .quiz-score-panel__meta {
  margin: 0;
  color: #567089;
  font-size: 0.72rem;
  font-weight: 600;
}

.trouver-parfum .quiz-score-panel__criteria {
  display: grid;
  gap: 0.32rem;
}

.trouver-parfum .quiz-score-item {
  border-radius: 0.92rem;
  border: 1px solid rgba(118, 147, 168, 0.24);
  background: rgba(255, 255, 255, 0.94);
  padding: 0.36rem 0.5rem;
  display: grid;
  gap: 0.2rem;
}

.trouver-parfum .quiz-score-item--strong {
  border-color: rgba(88, 160, 115, 0.36);
  background: linear-gradient(180deg, rgba(247, 255, 251, 0.96), rgba(239, 252, 244, 0.95));
}

.trouver-parfum .quiz-score-item--weak {
  border-color: rgba(195, 132, 94, 0.34);
  background: linear-gradient(180deg, rgba(255, 252, 249, 0.96), rgba(255, 245, 236, 0.95));
}

.trouver-parfum .quiz-score-item__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
}

.trouver-parfum .quiz-score-item__head h4 {
  margin: 0;
  color: #273e54;
  font-size: 0.74rem;
}

.trouver-parfum .quiz-score-item__head span {
  color: #355a76;
  font-size: 0.69rem;
  font-weight: 700;
}

.trouver-parfum .quiz-score-item__bar {
  -webkit-appearance: none;
  appearance: none;
  height: 0.24rem;
  width: 100%;
  border-radius: 999px;
  border: 0;
  background: rgba(177, 194, 209, 0.42);
  overflow: hidden;
}

.trouver-parfum .quiz-score-item__bar::-webkit-progress-bar {
  background: rgba(177, 194, 209, 0.42);
  border-radius: 999px;
}

.trouver-parfum .quiz-score-item__bar::-webkit-progress-value {
  border-radius: 999px;
  background: linear-gradient(90deg, #3e8a70, #2f6988);
}

.trouver-parfum .quiz-score-item__bar::-moz-progress-bar {
  border-radius: 999px;
  background: linear-gradient(90deg, #3e8a70, #2f6988);
}

.trouver-parfum .quiz-score-item--weak .quiz-score-item__bar::-webkit-progress-value {
  background: linear-gradient(90deg, #d48a55, #c05b47);
}

.trouver-parfum .quiz-score-item--weak .quiz-score-item__bar::-moz-progress-bar {
  background: linear-gradient(90deg, #d48a55, #c05b47);
}

.trouver-parfum .quiz-score-item__choice {
  margin: 0;
  color: #445f76;
  font-size: 0.66rem;
}

.trouver-parfum .quiz-score-item__hint {
  margin: 0;
  color: #355068;
  font-size: 0.66rem;
  line-height: 1.22;
}

.trouver-parfum .quiz-score-panel__empty {
  margin: 0;
  color: #536a80;
  font-size: 0.82rem;
}

.trouver-parfum .quiz-score-panel__placeholder {
  border-radius: 1rem;
  border: 1px solid rgba(116, 143, 162, 0.24);
  background: rgba(246, 251, 255, 0.92);
  padding: 0.9rem;
  display: grid;
  gap: 0.35rem;
}

.trouver-parfum .quiz-score-panel__placeholder h3 {
  margin: 0;
  color: #25435f;
  font-size: 0.98rem;
}

.trouver-parfum .quiz-score-panel__placeholder p {
  margin: 0;
  color: #4e6780;
  font-size: 0.83rem;
}

.trouver-parfum .quiz-score-panel__placeholder--error {
  border-color: rgba(192, 106, 106, 0.38);
  background: rgba(255, 239, 239, 0.9);
}

.trouver-parfum .quiz-score-panel__placeholder--loading {
  border-color: rgba(110, 140, 163, 0.28);
  background: rgba(239, 247, 253, 0.94);
}

/* Favorite form */
.favorite-layout {
  display: grid;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

@media (min-width: 960px) {
  .favorite-layout {
    grid-template-columns: minmax(0, 1.05fr) minmax(240px, 0.8fr);
    align-items: stretch;
  }
}

.favorite-form {
  background: rgba(255, 255, 255, 0.92);
  border-radius: var(--radius-xl);
  padding: clamp(1rem, 3vw, 1.75rem);
  box-shadow: 0 25px 60px rgba(124, 58, 32, 0.14);
  border: 1px solid rgba(255, 189, 139, 0.35);
}

.favorite-form.stack {
  height: 100%;
}

.favorite-form__hint {
  margin: 0;
  color: #755040;
}

.favorite-form__label {
  font-weight: 600;
  color: #4a2815;
}

.favorite-form__combobox {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.favorite-form__combobox input[type="search"] {
  border-radius: 999px;
  border: 1px solid rgba(255, 189, 139, 0.55);
  padding: 0.9rem 1.2rem;
  font-size: 1rem;
  background: rgba(255, 255, 255, 0.9);
  transition: border-color var(--transition-base), box-shadow var(--transition-base);
}

.favorite-form__combobox input[type="search"]:focus {
  border-color: #f97316;
  box-shadow: 0 10px 30px rgba(249, 115, 22, 0.25);
}

.favorite-suggestions {
  margin: 0;
  padding: 0;
  list-style: none;
  border-radius: var(--radius-lg);
  border: 1px solid rgba(249, 115, 22, 0.25);
  background: #fffdf9;
  box-shadow: 0 15px 40px rgba(126, 34, 18, 0.18);
  position: absolute;
  top: calc(100% + 0.25rem);
  left: 0;
  right: 0;
  max-height: 220px;
  overflow-y: auto;
  z-index: 3;
}

.favorite-suggestions__option {
  padding: 0.65rem 0.9rem;
  cursor: pointer;
}

.favorite-suggestions__option.is-active,
.favorite-suggestions__option:hover {
  background: rgba(255, 184, 133, 0.2);
}

.favorite-results__grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.favorite-results__grid .parfum-card {
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid rgba(255, 189, 139, 0.35);
}

.favorite-visual {
  background: linear-gradient(140deg, #fff9f3 5%, #fde1f2 55%, #dccff8 100%);
  border-radius: var(--radius-xl);
  padding: clamp(1.25rem, 3vw, 2rem);
  box-shadow: 0 30px 70px rgba(67, 29, 15, 0.2);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 1.25rem;
  border: 1px solid rgba(255, 189, 139, 0.2);
}

.favorite-visual__scene {
  display: flex;
  justify-content: center;
  gap: 1rem;
  position: relative;
}

.favorite-visual__scene img {
  max-width: 160px;
  height: auto;
  filter: drop-shadow(0 20px 35px rgba(67, 29, 15, 0.25));
}

.favorite-visual__vial {
  width: 120px;
  opacity: 0.85;
}

.favorite-visual__vial--left {
  align-self: flex-end;
}

.favorite-visual__vial--right {
  align-self: flex-start;
}

.favorite-visual__caption {
  margin: 0;
  font-weight: 600;
  color: #6b3a25;
  text-align: center;
}

.favorite-visual__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
}

.favorite-visual__chips span {
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(249, 115, 22, 0.2);
  padding: 0.4rem 0.9rem;
  font-size: 0.9rem;
  color: #7c4b31;
  box-shadow: 0 10px 20px rgba(67, 29, 15, 0.1);
}

@media (min-width: 1024px) {
  .trouver-parfum__panels {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
    gap: clamp(1.5rem, 3vw, 2.5rem);
    align-items: flex-start;
    width: 100%;
  }

  .trouver-parfum__panels > .trouver-parfum__panel:not(.is-hidden) {
    grid-column: 1 / -1;
  }
}

/* 2026 Quiz Refresh */
@property --tp-wheel-fill-angle {
  syntax: "<angle>";
  inherits: true;
  initial-value: 28deg;
}

.trouver-parfum {
  --tp-ink: #1d2735;
  --tp-muted: #4e5d72;
  --tp-accent: #ce6f2b;
  --tp-accent-strong: #b9531e;
  --tp-question-accent: rgba(58, 118, 109, 0.64);
  --tp-soft: #f7eee3;
  --tp-bg-top-left: rgba(236, 207, 168, 0.28);
  --tp-bg-top-right: rgba(170, 204, 196, 0.22);
  --tp-bg-base-start: #f7f2ea;
  --tp-bg-base-mid: #f4efe8;
  --tp-bg-base-end: #eef3f1;
  --tp-ambiance-wash: rgba(202, 141, 72, 0.34);
  --tp-facette-wash: rgba(86, 133, 156, 0.26);
  --tp-blend-glow: rgba(132, 155, 161, 0.16);
  --tp-step-progress: 0;
  --tp-step-hue: 0deg;
  --tp-step-shift: 0%;
  --tp-step-alpha: 0.1;
  background:
    radial-gradient(circle at calc(8% + var(--tp-step-shift)) 12%, var(--tp-bg-top-left), transparent 40%),
    radial-gradient(circle at calc(92% - var(--tp-step-shift)) 10%, var(--tp-bg-top-right), transparent 38%),
    radial-gradient(
      circle at 50% calc(84% - (var(--tp-step-progress) * 24%)),
      var(--tp-blend-glow),
      transparent 54%
    ),
    linear-gradient(140deg, var(--tp-bg-base-start) 0%, var(--tp-bg-base-mid) 50%, var(--tp-bg-base-end) 100%);
  transition: background 0.5s ease, box-shadow 0.35s ease, filter 0.35s ease;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.55);
}

.trouver-parfum::before {
  content: "";
  position: absolute;
  inset: -10% 32% -12% -18%;
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(ellipse at left center, var(--tp-ambiance-wash) 0%, transparent 68%);
  opacity: calc(0.72 + (var(--tp-step-progress) * 0.18));
  transform: translateX(-5%);
  filter: hue-rotate(calc(var(--tp-step-hue) * 0.45)) saturate(calc(1 + (var(--tp-step-progress) * 0.22)));
  transition: opacity 0.35s ease, transform 0.42s ease, filter 0.45s ease;
}

.trouver-parfum::after {
  content: "";
  position: absolute;
  inset: -10% -18% -12% 32%;
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(ellipse at right center, var(--tp-facette-wash) 0%, transparent 68%);
  opacity: calc(0.64 + (var(--tp-step-progress) * 0.2));
  transform: translateX(5%);
  filter: hue-rotate(calc(var(--tp-step-hue) * -0.55)) saturate(calc(1 + (var(--tp-step-progress) * 0.24)));
  transition: opacity 0.35s ease, transform 0.42s ease, filter 0.45s ease;
}

.trouver-parfum.is-theme-reactive::before {
  animation: tp-left-theme-arrive 0.48s ease;
}

.trouver-parfum.is-theme-reactive::after {
  animation: tp-right-theme-arrive 0.48s ease;
}

.trouver-parfum[data-ambiance-theme="neutral"] {
  --tp-ambiance-wash: rgba(184, 145, 92, 0.3);
}

.trouver-parfum[data-ambiance-theme="frais"] {
  --tp-accent: #2b7f9f;
  --tp-accent-strong: #2f9b8d;
  --tp-bg-top-left: rgba(169, 219, 235, 0.4);
  --tp-bg-top-right: rgba(166, 222, 206, 0.36);
  --tp-bg-base-start: #eef8fb;
  --tp-bg-base-mid: #e9f6f2;
  --tp-bg-base-end: #edf2f7;
  --tp-ambiance-wash: rgba(98, 179, 210, 0.36);
}

.trouver-parfum[data-ambiance-theme="doux"] {
  --tp-accent: #af7b4c;
  --tp-accent-strong: #d09c63;
  --tp-bg-top-left: rgba(236, 206, 176, 0.4);
  --tp-bg-top-right: rgba(222, 205, 184, 0.34);
  --tp-bg-base-start: #fbf4ea;
  --tp-bg-base-mid: #f8efe2;
  --tp-bg-base-end: #f2ece5;
  --tp-ambiance-wash: rgba(211, 161, 116, 0.36);
}

.trouver-parfum[data-ambiance-theme="intense"] {
  --tp-accent: #a2542e;
  --tp-accent-strong: #7f3a31;
  --tp-bg-top-left: rgba(214, 169, 140, 0.42);
  --tp-bg-top-right: rgba(181, 169, 194, 0.34);
  --tp-bg-base-start: #f5ece4;
  --tp-bg-base-mid: #efe6df;
  --tp-bg-base-end: #e8e6eb;
  --tp-ambiance-wash: rgba(162, 98, 76, 0.38);
}

.trouver-parfum[data-ambiance-theme="chaleureux"] {
  --tp-accent: #ba6b2c;
  --tp-accent-strong: #925130;
  --tp-bg-top-left: rgba(236, 188, 141, 0.44);
  --tp-bg-top-right: rgba(225, 179, 145, 0.34);
  --tp-bg-base-start: #faefe2;
  --tp-bg-base-mid: #f4e8dc;
  --tp-bg-base-end: #efe7e1;
  --tp-ambiance-wash: rgba(202, 123, 65, 0.4);
}

.trouver-parfum[data-facette-theme="neutral"] {
  --tp-facette-wash: rgba(102, 129, 158, 0.24);
}

.trouver-parfum[data-facette-theme="floral"] {
  --tp-facette-wash: rgba(226, 108, 172, 0.48);
  --tp-bg-top-right: rgba(240, 169, 213, 0.34);
  --tp-bg-base-end: #f1e7ef;
  --tp-blend-glow: rgba(225, 126, 183, 0.3);
}

.trouver-parfum[data-facette-theme="boise"] {
  --tp-facette-wash: rgba(166, 122, 72, 0.48);
  --tp-bg-top-right: rgba(214, 179, 132, 0.34);
  --tp-bg-base-end: #efe8de;
  --tp-blend-glow: rgba(168, 129, 84, 0.3);
}

.trouver-parfum[data-facette-theme="epice"] {
  --tp-facette-wash: rgba(211, 101, 46, 0.48);
  --tp-bg-top-right: rgba(230, 168, 114, 0.34);
  --tp-bg-base-end: #f0e5dc;
  --tp-blend-glow: rgba(209, 117, 73, 0.3);
}

.trouver-parfum[data-facette-theme="sucre"] {
  --tp-facette-wash: rgba(201, 122, 146, 0.46);
  --tp-bg-top-right: rgba(230, 178, 195, 0.32);
  --tp-bg-base-end: #f2e7ea;
  --tp-blend-glow: rgba(201, 128, 155, 0.28);
}

.trouver-parfum[data-facette-theme="fruite"] {
  --tp-facette-wash: rgba(230, 120, 84, 0.48);
  --tp-bg-top-right: rgba(240, 177, 128, 0.34);
  --tp-bg-base-end: #f3e7df;
  --tp-blend-glow: rgba(224, 138, 100, 0.3);
}

.trouver-parfum[data-facette-theme="aromatique"] {
  --tp-facette-wash: rgba(86, 166, 118, 0.46);
  --tp-bg-top-right: rgba(161, 212, 170, 0.32);
  --tp-bg-base-end: #e8efe8;
  --tp-blend-glow: rgba(119, 179, 129, 0.28);
}

@keyframes tp-left-theme-arrive {
  0% {
    opacity: 0.45;
    transform: translateX(-24%);
  }
  100% {
    opacity: calc(0.72 + (var(--tp-step-progress) * 0.18));
    transform: translateX(-5%);
  }
}

@keyframes tp-right-theme-arrive {
  0% {
    opacity: 0.42;
    transform: translateX(24%);
  }
  100% {
    opacity: calc(0.64 + (var(--tp-step-progress) * 0.2));
    transform: translateX(5%);
  }
}

.trouver-parfum .tabs {
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(101, 123, 140, 0.2);
  box-shadow: 0 16px 28px rgba(13, 24, 36, 0.08);
  padding: 0.3rem;
  gap: 0.3rem;
}

.trouver-parfum .tab {
  color: var(--tp-muted);
  padding: 0.62rem 1.2rem;
  font-size: 0.96rem;
  letter-spacing: 0.01em;
}

.trouver-parfum .tab.active {
  color: #fff;
  background: linear-gradient(135deg, var(--tp-accent), var(--tp-accent-strong));
  box-shadow: 0 10px 22px rgba(22, 34, 48, 0.2);
}

.trouver-parfum .trouver-parfum__panel {
  background: rgba(255, 255, 255, 0.93);
  border: 2px solid color-mix(in srgb, var(--tp-season-border, #86a2ba) 70%, #ffffff 30%);
  box-shadow:
    0 24px 55px rgba(24, 35, 48, 0.12),
    0 0 0 1px color-mix(in srgb, var(--tp-season-border, #86a2ba) 30%, transparent),
    0 0 26px color-mix(in srgb, var(--tp-season-border, #86a2ba) 24%, transparent);
  transition: border-color 0.42s ease, box-shadow 0.42s ease;
}

.trouver-parfum .quiz-layout {
  gap: clamp(1.15rem, 2.3vw, 2rem);
}

@media (min-width: 980px) {
  .trouver-parfum .quiz-layout {
    grid-template-columns: minmax(0, 1.05fr) minmax(300px, 0.95fr);
  }
}

.trouver-parfum .quiz-mode {
  background: linear-gradient(165deg, rgba(251, 244, 232, 0.94), rgba(239, 247, 244, 0.92));
  border: 1px solid rgba(124, 146, 153, 0.24);
  border-radius: 1.1rem;
  box-shadow: 0 16px 38px rgba(26, 41, 56, 0.08);
}

.trouver-parfum .quiz-mode h2 {
  color: var(--tp-ink);
}

.trouver-parfum .quiz-mode p {
  color: var(--tp-muted);
}

.trouver-parfum .progress {
  height: 0.78rem;
  background: linear-gradient(90deg, rgba(173, 191, 205, 0.3), rgba(207, 188, 162, 0.25));
  border: 1px solid rgba(129, 147, 160, 0.25);
}

.trouver-parfum .progress-bar {
  position: relative;
  background: linear-gradient(90deg, #2c7b6d, var(--tp-accent) 58%, var(--tp-accent-strong));
  box-shadow: 0 8px 18px rgba(48, 121, 93, 0.3);
}

.trouver-parfum .progress-bar::after {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    -55deg,
    rgba(255, 255, 255, 0) 0,
    rgba(255, 255, 255, 0) 10px,
    rgba(255, 255, 255, 0.26) 10px,
    rgba(255, 255, 255, 0.26) 18px
  );
  animation: tp-progress-slide 1.1s linear infinite;
}

@keyframes tp-progress-slide {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(24px);
  }
}

.trouver-parfum .question-card {
  background: linear-gradient(170deg, #fffefe, #f5f8f9 75%);
  border: 1px solid rgba(121, 143, 160, 0.28);
  border-left: 6px solid var(--tp-question-accent, rgba(58, 118, 109, 0.64));
  border-radius: 1.2rem;
  box-shadow: 0 18px 45px rgba(27, 44, 61, 0.12);
  min-height: 270px;
  transition: border-left-color 0.35s ease, box-shadow 0.35s ease;
}

.trouver-parfum .question-card h2 {
  color: var(--tp-ink);
  font-size: clamp(0.95rem, 1.65vw, 1.12rem);
}

.trouver-parfum .question-card__icon {
  background: linear-gradient(145deg, rgba(44, 110, 99, 0.14), rgba(201, 129, 58, 0.2));
  color: #2b685f;
  box-shadow: 0 8px 20px rgba(49, 111, 101, 0.2);
}

.trouver-parfum .choices {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.72rem;
  margin-top: 1.25rem;
}

.trouver-parfum .choice {
  border-radius: 1rem;
  min-height: 3.25rem;
  padding: 0.72rem 0.96rem;
  background: linear-gradient(145deg, #f8f3ea, #edf3f1);
  border: 1px solid rgba(123, 144, 160, 0.28);
  color: #304156;
  font-size: 0.84rem;
  box-shadow: 0 8px 18px rgba(30, 45, 63, 0.08);
}

.trouver-parfum .choice:hover,
.trouver-parfum .choice:focus-visible {
  background: linear-gradient(145deg, #fefcf7, #f2f8f6);
  color: #182130;
  border-color: rgba(43, 121, 108, 0.45);
  box-shadow: 0 15px 28px rgba(38, 110, 99, 0.16);
  transform: translateY(-2px);
}

.trouver-parfum .choice.is-selecting {
  transform: scale(0.98);
  box-shadow: 0 8px 18px rgba(41, 111, 99, 0.22);
}

.trouver-parfum .choice__icon {
  width: 2.25rem;
  height: 2.25rem;
  background: linear-gradient(145deg, rgba(41, 114, 103, 0.18), rgba(208, 136, 57, 0.2));
  color: #29685f;
  box-shadow: 0 8px 16px rgba(41, 114, 103, 0.18);
}

.trouver-parfum .choice__icon--image {
  background: #fff;
  border: 1px solid rgba(109, 130, 146, 0.2);
  box-shadow: 0 9px 16px rgba(26, 39, 55, 0.1);
}

.trouver-parfum .choice__icon-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  filter: saturate(1.03) contrast(1.04);
}

.trouver-parfum .choice__label {
  font-weight: 600;
  font-size: 0.87rem;
}

.trouver-parfum .choice[data-ambiance-choice] {
  --ambiance-bg1: #f3f9f7;
  --ambiance-bg2: #e8f0ef;
  --ambiance-border: rgba(86, 132, 123, 0.34);
  --ambiance-border-strong: rgba(66, 120, 110, 0.56);
  --ambiance-ink: #21414a;
  --ambiance-icon-bg1: rgba(60, 143, 131, 0.22);
  --ambiance-icon-bg2: rgba(255, 255, 255, 0.82);
  background: linear-gradient(145deg, var(--ambiance-bg1), var(--ambiance-bg2));
  border-color: var(--ambiance-border);
  color: var(--ambiance-ink);
}

.trouver-parfum .choice[data-ambiance-choice] .choice__icon {
  width: 2.4rem;
  height: 2.4rem;
  background: linear-gradient(145deg, var(--ambiance-icon-bg1), var(--ambiance-icon-bg2));
  box-shadow: 0 10px 20px rgba(31, 66, 79, 0.16);
}

.trouver-parfum .choice[data-ambiance-choice] .choice__icon-shape {
  width: 1.34rem;
  height: 1.34rem;
}

.trouver-parfum .choice[data-ambiance-choice]:hover,
.trouver-parfum .choice[data-ambiance-choice]:focus-visible {
  border-color: var(--ambiance-border-strong);
  box-shadow: 0 16px 30px rgba(31, 66, 79, 0.16);
  filter: saturate(1.05);
}

.trouver-parfum .choice[data-ambiance-choice="propre_frais"] {
  --ambiance-bg1: #eef9f7;
  --ambiance-bg2: #dff4ef;
  --ambiance-border: rgba(51, 138, 122, 0.34);
  --ambiance-border-strong: rgba(35, 124, 108, 0.6);
  --ambiance-ink: #1f4e56;
  --ambiance-icon-bg1: rgba(46, 166, 144, 0.26);
  --ambiance-icon-bg2: rgba(255, 255, 255, 0.9);
}

.trouver-parfum .choice[data-ambiance-choice="marin_mineral"] {
  --ambiance-bg1: #ebf6ff;
  --ambiance-bg2: #dcecff;
  --ambiance-border: rgba(58, 126, 187, 0.34);
  --ambiance-border-strong: rgba(44, 108, 170, 0.62);
  --ambiance-ink: #1e476f;
  --ambiance-icon-bg1: rgba(88, 152, 214, 0.26);
  --ambiance-icon-bg2: rgba(255, 255, 255, 0.9);
}

.trouver-parfum .choice[data-ambiance-choice="vert_aromatique"] {
  --ambiance-bg1: #eef9ee;
  --ambiance-bg2: #dff0de;
  --ambiance-border: rgba(83, 146, 78, 0.35);
  --ambiance-border-strong: rgba(67, 126, 62, 0.62);
  --ambiance-ink: #24523b;
  --ambiance-icon-bg1: rgba(95, 168, 86, 0.24);
  --ambiance-icon-bg2: rgba(255, 255, 255, 0.9);
}

.trouver-parfum .choice[data-ambiance-choice="fleuri_lumineux"] {
  --ambiance-bg1: #fff0f7;
  --ambiance-bg2: #fde7f1;
  --ambiance-border: rgba(203, 109, 154, 0.34);
  --ambiance-border-strong: rgba(186, 88, 135, 0.62);
  --ambiance-ink: #6c3050;
  --ambiance-icon-bg1: rgba(225, 141, 183, 0.26);
  --ambiance-icon-bg2: rgba(255, 255, 255, 0.9);
}

.trouver-parfum .choice[data-ambiance-choice="fruite_gourmand"] {
  --ambiance-bg1: #fff5eb;
  --ambiance-bg2: #fde9d7;
  --ambiance-border: rgba(203, 132, 77, 0.34);
  --ambiance-border-strong: rgba(183, 112, 56, 0.62);
  --ambiance-ink: #6b3a1f;
  --ambiance-icon-bg1: rgba(230, 164, 101, 0.27);
  --ambiance-icon-bg2: rgba(255, 255, 255, 0.9);
}

.trouver-parfum .choice[data-ambiance-choice="epice_chaleureux"] {
  --ambiance-bg1: #fff0e8;
  --ambiance-bg2: #fdded2;
  --ambiance-border: rgba(195, 98, 65, 0.36);
  --ambiance-border-strong: rgba(178, 80, 48, 0.64);
  --ambiance-ink: #642c1d;
  --ambiance-icon-bg1: rgba(222, 120, 84, 0.27);
  --ambiance-icon-bg2: rgba(255, 255, 255, 0.9);
}

.trouver-parfum .choice[data-ambiance-choice="boise_fume"] {
  --ambiance-bg1: #f2efea;
  --ambiance-bg2: #e5dfd6;
  --ambiance-border: rgba(125, 108, 88, 0.36);
  --ambiance-border-strong: rgba(107, 90, 70, 0.63);
  --ambiance-ink: #3c3228;
  --ambiance-icon-bg1: rgba(149, 126, 102, 0.28);
  --ambiance-icon-bg2: rgba(255, 255, 255, 0.88);
}

.trouver-parfum .choice[data-ambiance-choice="sombre_cuir_animal"] {
  --ambiance-bg1: #f0ecf6;
  --ambiance-bg2: #e2daee;
  --ambiance-border: rgba(102, 78, 139, 0.35);
  --ambiance-border-strong: rgba(86, 62, 124, 0.64);
  --ambiance-ink: #38284f;
  --ambiance-icon-bg1: rgba(132, 101, 181, 0.29);
  --ambiance-icon-bg2: rgba(255, 255, 255, 0.88);
}

.trouver-parfum .choices--chips {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.trouver-parfum .choice--chip {
  border-radius: 999px;
  min-height: 2.9rem;
  padding: 0.58rem 0.85rem;
}

.trouver-parfum .choice--accord {
  --accord-color: #9baaba;
  justify-content: center;
  text-align: center;
  gap: 0;
  background: linear-gradient(
    145deg,
    color-mix(in srgb, var(--accord-color) 15%, #ffffff),
    color-mix(in srgb, var(--accord-color) 26%, #ffffff)
  );
  border-color: color-mix(
    in srgb,
    var(--accord-color) 42%,
    rgba(108, 128, 148, 0.35)
  );
  color: color-mix(in srgb, var(--accord-color) 58%, #1b293d);
  box-shadow: 0 10px 20px
    color-mix(in srgb, var(--accord-color) 20%, rgba(26, 39, 55, 0.14));
}

.trouver-parfum .choice--accord:hover,
.trouver-parfum .choice--accord:focus-visible {
  background: linear-gradient(
    145deg,
    color-mix(in srgb, var(--accord-color) 22%, #ffffff),
    color-mix(in srgb, var(--accord-color) 34%, #ffffff)
  );
  border-color: color-mix(in srgb, var(--accord-color) 56%, rgba(43, 64, 86, 0.4));
  color: color-mix(in srgb, var(--accord-color) 66%, #172130);
  box-shadow: 0 14px 24px
    color-mix(in srgb, var(--accord-color) 30%, rgba(20, 31, 45, 0.2));
}

.trouver-parfum .choice--note {
  --note-color: #7f95a8;
  justify-content: flex-start;
  text-align: left;
  gap: 0.5rem;
  background: linear-gradient(
    145deg,
    color-mix(in srgb, var(--note-color) 14%, #ffffff),
    color-mix(in srgb, var(--note-color) 24%, #ffffff)
  );
  border-color: color-mix(in srgb, var(--note-color) 40%, rgba(106, 126, 141, 0.36));
  color: color-mix(in srgb, var(--note-color) 65%, #1e2f41);
}

.trouver-parfum .choice--note .choice__icon {
  width: 2.2rem;
  height: 2.2rem;
  box-shadow: 0 8px 14px color-mix(in srgb, var(--note-color) 22%, rgba(12, 18, 28, 0.14));
}

.trouver-parfum .choice--note:hover,
.trouver-parfum .choice--note:focus-visible {
  background: linear-gradient(
    145deg,
    color-mix(in srgb, var(--note-color) 20%, #ffffff),
    color-mix(in srgb, var(--note-color) 34%, #ffffff)
  );
  border-color: color-mix(in srgb, var(--note-color) 58%, rgba(46, 62, 80, 0.45));
  color: color-mix(in srgb, var(--note-color) 78%, #172333);
}

.trouver-parfum .choice--chip.is-selected {
  background: linear-gradient(145deg, rgba(53, 120, 109, 0.95), rgba(58, 147, 131, 0.92));
  border-color: rgba(40, 102, 93, 0.7);
  color: #f8fffd;
  box-shadow: 0 14px 26px rgba(33, 96, 87, 0.28);
}

.trouver-parfum .choice--accord.is-selected {
  background: linear-gradient(
    145deg,
    color-mix(in srgb, var(--accord-color) 80%, #1a2230),
    color-mix(in srgb, var(--accord-color) 68%, #0f1723)
  );
  border-color: color-mix(in srgb, var(--accord-color) 62%, #172130);
  color: #f8fbff;
  box-shadow: 0 16px 28px
    color-mix(in srgb, var(--accord-color) 42%, rgba(16, 24, 36, 0.3));
}

.trouver-parfum .choice--chip.is-selected .choice__icon {
  background: rgba(255, 255, 255, 0.18);
  color: #f7fffc;
}

.trouver-parfum .choice--note.is-selected {
  background: linear-gradient(
    145deg,
    color-mix(in srgb, var(--note-color) 74%, #1a2230),
    color-mix(in srgb, var(--note-color) 64%, #0f1723)
  );
  border-color: color-mix(in srgb, var(--note-color) 58%, #182335);
  color: #f8fbff;
}

.trouver-parfum .choice-helper {
  margin: 0.5rem 0 0;
  color: #496073;
  font-size: 0.8rem;
  font-weight: 600;
}

.trouver-parfum .choices-toolbar {
  display: flex;
  justify-content: flex-end;
  margin-top: 0.55rem;
}

.trouver-parfum .choice-reroll {
  padding: 0.5rem 0.8rem;
  min-height: auto;
  font-size: 0.85rem;
}

.trouver-parfum .progress {
  display: none;
}

.trouver-parfum .trouver-parfum__panel {
  border-color: var(--tp-season-border, rgba(255, 189, 139, 0.3));
  transition: border-color 0.45s ease, box-shadow 0.45s ease;
}

.trouver-parfum .quiz-visual {
  --tp-wheel-progress: 0deg;
  --tp-wheel-fill-angle: 28deg;
  --tp-wheel-color: #6f9bb5;
  --tp-intensity: 0.82;
  --tp-season-border: rgba(112, 146, 171, 0.36);
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 1.45rem;
  border: 2px solid color-mix(in srgb, var(--tp-season-border) 82%, #ffffff 18%);
  background:
    radial-gradient(circle at 50% 38%, rgba(255, 255, 255, 0.9), rgba(247, 251, 250, 0.8) 42%, rgba(241, 236, 228, 0.74) 100%);
  box-shadow:
    0 24px 52px rgba(24, 39, 55, 0.14),
    0 0 24px color-mix(in srgb, var(--tp-season-border) 18%, transparent);
  padding: clamp(0.95rem, 2.1vw, 1.45rem);
  min-height: 340px;
  transition: border-color 0.38s ease, box-shadow 0.38s ease;
}

.trouver-parfum .quiz-visual::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--tp-season-border) 52%, #ffffff 48%),
    inset 0 0 42px color-mix(in srgb, var(--tp-season-border) 18%, transparent);
  opacity: 0.86;
}

.trouver-parfum .quiz-visual::after {
  content: "";
  position: absolute;
  inset: -28% -16% auto -16%;
  height: 84%;
  pointer-events: none;
  background: radial-gradient(
    circle at 50% 36%,
    color-mix(in srgb, var(--tp-ambiance-color, #6f9bb5) 26%, transparent),
    transparent 62%
  );
  opacity: calc(0.55 + var(--tp-intensity) * 0.15);
  transition: opacity 0.42s ease;
}

.trouver-parfum .quiz-visual.is-reactive::after {
  opacity: calc(0.6 + var(--tp-intensity) * 0.18);
}

.trouver-parfum .quiz-visual__scene {
  position: relative;
  width: 100%;
  min-height: 400px;
  border-radius: 1.05rem;
  overflow: hidden;
  opacity: 1;
  transform: translateY(0) scale(1);
  transition: opacity 0.45s ease, transform 0.45s ease, filter 0.45s ease;
}

.trouver-parfum .quiz-visual__accord-blobs {
  position: absolute;
  inset: 0;
  pointer-events: none;
  filter: saturate(calc(1.05 + var(--tp-intensity) * 0.4));
  z-index: 1;
}

.trouver-parfum .quiz-visual__blob {
  position: absolute;
  left: var(--blob-x);
  top: var(--blob-y);
  width: var(--blob-size);
  height: var(--blob-size);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background:
    radial-gradient(circle at 35% 35%,
      color-mix(in srgb, var(--blob-color) 72%, rgba(255, 255, 255, 0.2)),
      color-mix(in srgb, var(--blob-color) 84%, rgba(16, 20, 28, 0.04)) 62%,
      transparent 100%);
  opacity: var(--blob-opacity);
  filter: blur(var(--blob-blur));
  mix-blend-mode: normal;
  animation: tp-blob-breathe 6.8s ease-in-out infinite;
}

.trouver-parfum .quiz-visual__blob--halo {
  animation-duration: 8.2s;
  animation-direction: reverse;
}

.trouver-parfum .quiz-visual__bottle {
  position: absolute;
  left: 50%;
  top: 8%;
  transform: translateX(-50%);
  z-index: 4;
  pointer-events: none;
}

.trouver-parfum .quiz-visual__bottle img {
  width: clamp(120px, 24vw, 162px);
  filter: drop-shadow(0 18px 22px rgba(22, 43, 61, 0.28));
  animation: tp-bottle-float 6s ease-in-out infinite;
}

.trouver-parfum .quiz-visual__progress-wheel {
  --tp-wheel-scale: 0.88;
  position: absolute;
  left: 50%;
  top: 90%;
  transform: translate(-50%, -50%) scale(var(--tp-wheel-scale));
  width: clamp(70px, 12vw, 90px);
  aspect-ratio: 1;
  display: block;
  z-index: 3;
  opacity: 0;
  transition: opacity 0.34s ease, transform 0.38s cubic-bezier(0.2, 0.86, 0.24, 1);
  pointer-events: none;
}

.trouver-parfum .quiz-visual__progress-wheel.is-visible {
  opacity: 1;
}

.trouver-parfum .quiz-visual__progress-wheel::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: rgba(120, 142, 162, 0.18);
  -webkit-mask: radial-gradient(circle, transparent 57%, #000 58% 74%, transparent 75%);
  mask: radial-gradient(circle, transparent 57%, #000 58% 74%, transparent 75%);
  opacity: 0.9;
  pointer-events: none;
}

.trouver-parfum .quiz-visual__progress-wheel::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: conic-gradient(
    from -90deg,
    color-mix(in srgb, var(--tp-wheel-color) 88%, #ffffff 12%) 0deg,
    color-mix(in srgb, var(--tp-wheel-color) 68%, #ffffff 32%) var(--tp-wheel-fill-angle),
    transparent var(--tp-wheel-fill-angle) 360deg
  );
  -webkit-mask: radial-gradient(circle, transparent 58%, #000 59% 76%, transparent 77%);
  mask: radial-gradient(circle, transparent 58%, #000 59% 76%, transparent 77%);
  filter: drop-shadow(0 0 10px color-mix(in srgb, var(--tp-wheel-color) 40%, transparent));
  opacity: 0.98;
  pointer-events: none;
  transition: --tp-wheel-fill-angle 0.5s cubic-bezier(0.2, 0.86, 0.24, 1), filter 0.35s ease;
  animation: tp-wheel-spin 1.9s linear infinite;
}

.trouver-parfum .quiz-visual__wheel-svg {
  display: none;
}

.trouver-parfum .quiz-visual__wheel-track {
  fill: none;
  stroke: rgba(138, 159, 176, 0.24);
  stroke-width: 6;
}

.trouver-parfum .quiz-visual__wheel-progress {
  fill: none;
  stroke: var(--tp-wheel-color);
  stroke-width: 7;
  stroke-linecap: round;
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
  transition: stroke 0.34s ease, stroke-dashoffset 0.7s cubic-bezier(0.2, 0.86, 0.24, 1);
  filter: drop-shadow(0 0 9px color-mix(in srgb, var(--tp-wheel-color) 58%, transparent));
}

.trouver-parfum .quiz-visual__status {
  margin: 0.32rem 0 0;
  min-height: 1.25rem;
  text-align: center;
  font-size: 0.9rem;
  font-weight: 600;
  color: #3f556a;
  position: relative;
  z-index: 10;
  opacity: 0;
  transform: translateY(-2px);
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.trouver-parfum .quiz-visual__status.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.trouver-parfum .quiz-visual__results {
  position: absolute;
  inset: clamp(0.82rem, 2vw, 1.2rem);
  bottom: clamp(2.3rem, 5vw, 2.85rem);
  z-index: 8;
  overflow: visible;
}

.trouver-parfum .quiz-visual.is-results-ready {
  overflow: visible;
}

.trouver-parfum .quiz-visual.is-results-ready .quiz-visual__results {
  inset: clamp(0.46rem, 1.3vw, 0.78rem);
  bottom: clamp(0rem, 0.6vw, 0.2rem);
}

.trouver-parfum .quiz-visual__results .results-carousel {
  width: 100%;
  max-width: 100%;
}

.trouver-parfum .quiz-visual.is-results-ready .quiz-visual__scene {
  opacity: 0;
  transform: translateY(-10px) scale(0.986);
  filter: blur(2px);
  pointer-events: none;
}

.trouver-parfum .quiz-visual.is-results-ready .quiz-visual__status {
  color: #2b4f69;
}

.trouver-parfum .quiz-visual__note-rain {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 5;
}

.trouver-parfum .quiz-note-particle {
  position: absolute;
  left: var(--drop-x, 50%);
  top: -48px;
  width: 1.6rem;
  height: 1.6rem;
  transform: translate(-50%, -20px) rotate(var(--drop-rot, 0deg));
  animation: tp-note-drop 1.2s cubic-bezier(0.2, 0.92, 0.24, 1) forwards;
}

.trouver-parfum .quiz-note-particle__icon {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: color-mix(in srgb, var(--note-color) 16%, #ffffff);
  border: 1px solid color-mix(in srgb, var(--note-color) 42%, rgba(87, 110, 129, 0.32));
  box-shadow: 0 8px 12px rgba(20, 37, 53, 0.2);
}

.trouver-parfum .quiz-visual__note-floor {
  position: absolute;
  left: 50%;
  top: var(--tp-note-floor-top, 56%);
  bottom: auto;
  transform: translate(-50%, -50%);
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  min-height: 1.6rem;
  opacity: 0;
  transition: opacity 0.32s ease;
  pointer-events: none;
  z-index: 6;
}

.trouver-parfum .quiz-visual__note-floor.is-visible {
  opacity: 1;
}

.trouver-parfum .quiz-note-token {
  --note-color: #7f95a8;
  width: 1.62rem;
  height: 1.62rem;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in srgb, var(--note-color) 18%, rgba(255, 255, 255, 0.96));
  border: 1px solid color-mix(in srgb, var(--note-color) 42%, rgba(93, 117, 136, 0.34));
  box-shadow: 0 5px 10px rgba(18, 36, 53, 0.14);
  animation: tp-note-floor-float 2.9s ease-in-out infinite;
  animation-delay: var(--float-delay, 0s);
}

.trouver-parfum .quiz-note-token__icon {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
  padding: 0.16rem;
}

.trouver-parfum .quiz-note-token__icon .choice__icon-img {
  width: 100%;
  height: 100%;
}

.trouver-parfum .scale-question {
  --scale-step-count: 5;
  margin-top: 1rem;
  width: min(100%, 58rem);
  margin-left: auto;
  margin-right: auto;
  display: grid;
  gap: 0.86rem;
  padding: 1rem 1.28rem 1.28rem;
  border-radius: 1rem;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.74), rgba(244, 251, 251, 0.64));
  border: 1px solid rgba(95, 132, 147, 0.16);
}

.trouver-parfum .scale-question__value {
  margin: 0 auto;
  color: #1f3a49;
  font-weight: 700;
  font-size: 1.08rem;
  min-height: 1.75rem;
  padding: 0.24rem 0.72rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(96, 123, 142, 0.2);
  box-shadow: 0 6px 14px rgba(19, 46, 67, 0.08);
}

.trouver-parfum .scale-question__value--season {
  min-height: 1.75rem;
  min-width: 12.8rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.08rem;
}

.trouver-parfum .scale-question__track-wrap {
  position: relative;
  padding: 0.2rem 0 2.2rem;
  --scale-progress: 50%;
}

.trouver-parfum .scale-question__range {
  width: 100%;
  appearance: none;
  background: transparent;
  cursor: pointer;
  margin: 0;
}

.trouver-parfum .scale-question__range::-webkit-slider-runnable-track {
  height: 1.05rem;
  border-radius: 999px;
  background:
    linear-gradient(
      90deg,
      rgba(57, 121, 132, 0.84) 0%,
      rgba(81, 161, 157, 0.82) 50%,
      rgba(210, 145, 86, 0.82) 100%
    );
}

.trouver-parfum .scale-question--saison .scale-question__range::-webkit-slider-runnable-track {
  background: linear-gradient(
    90deg,
    rgba(242, 200, 75, 0.95) 0%,
    rgba(133, 202, 122, 0.9) 36%,
    rgba(185, 106, 54, 0.86) 68%,
    rgba(122, 166, 218, 0.92) 100%
  );
}

.trouver-parfum .scale-question__range::-webkit-slider-thumb {
  appearance: none;
  width: 1.7rem;
  height: 1.7rem;
  margin-top: -0.34rem;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.96);
  background: #216c74;
  box-shadow: 0 8px 16px rgba(15, 31, 43, 0.24);
}

.trouver-parfum .scale-question--saison .scale-question__range::-webkit-slider-thumb {
  background: var(--tp-season-accent, #7aa6da);
  border-color: color-mix(in srgb, var(--tp-season-accent, #7aa6da) 40%, #ffffff 60%);
}

.trouver-parfum .scale-question__range::-moz-range-track {
  height: 1.05rem;
  border-radius: 999px;
  background:
    linear-gradient(
      90deg,
      rgba(57, 121, 132, 0.84) 0%,
      rgba(81, 161, 157, 0.82) 50%,
      rgba(210, 145, 86, 0.82) 100%
    );
}

.trouver-parfum .scale-question--saison .scale-question__range::-moz-range-track {
  background: linear-gradient(
    90deg,
    rgba(242, 200, 75, 0.95) 0%,
    rgba(133, 202, 122, 0.9) 36%,
    rgba(185, 106, 54, 0.86) 68%,
    rgba(122, 166, 218, 0.92) 100%
  );
}

.trouver-parfum .scale-question__range::-moz-range-thumb {
  width: 1.7rem;
  height: 1.7rem;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.96);
  background: #216c74;
  box-shadow: 0 8px 16px rgba(15, 31, 43, 0.24);
}

.trouver-parfum .scale-question--saison .scale-question__range::-moz-range-thumb {
  background: var(--tp-season-accent, #7aa6da);
  border-color: color-mix(in srgb, var(--tp-season-accent, #7aa6da) 40%, #ffffff 60%);
}

.trouver-parfum .scale-question__markers {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0.1rem;
  height: 1.9rem;
  pointer-events: none;
}

.trouver-parfum .scale-question__marker {
  pointer-events: auto;
  position: absolute;
  left: var(--marker-pos, 0%);
  top: 50%;
  transform: translate(-50%, -50%);
  width: 0.62rem;
  height: 0.62rem;
  border: 2px solid rgba(103, 128, 146, 0.55);
  border-radius: 50%;
  background: #f6fafc;
  color: #5d798d;
  font: inherit;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(18, 38, 56, 0.12);
  transition: background-color var(--transition-base), color var(--transition-base),
    border-color var(--transition-base), transform var(--transition-base),
    box-shadow var(--transition-base);
}

.trouver-parfum .scale-question__marker-glyph {
  display: inline-block;
  line-height: 1;
  font-size: 0.62rem;
}

.trouver-parfum .scale-question__marker.is-bridge {
  width: 1.5rem;
  height: 0.22rem;
  border: none;
  border-radius: 999px;
  background: rgba(108, 136, 153, 0.55);
  box-shadow: none;
}

.trouver-parfum .scale-question__marker.is-bridge .scale-question__marker-glyph {
  display: none;
}

.trouver-parfum .scale-question__marker[data-active="true"] {
  background: #1f6c74;
  border-color: #1f6c74;
  color: #f7fcff;
  width: 0.86rem;
  height: 0.86rem;
  transform: translate(-50%, calc(-50% - 1px));
  box-shadow: 0 8px 15px rgba(17, 49, 67, 0.24);
}

.trouver-parfum .scale-question__marker.is-bridge[data-active="true"] {
  background: #1f6c74;
  box-shadow: none;
  transform: none;
}

.trouver-parfum .scale-question__marker:hover,
.trouver-parfum .scale-question__marker:focus-visible {
  transform: translate(-50%, calc(-50% - 1px));
  border-color: rgba(41, 101, 112, 0.62);
  color: #2a5f70;
}

.trouver-parfum .scale-question__legend {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 0.65rem;
  color: #5f7b90;
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}

.trouver-parfum .scale-question__legend .is-left {
  text-align: left;
}

.trouver-parfum .scale-question__legend .is-middle {
  text-align: center;
  color: #466278;
}

.trouver-parfum .scale-question__legend .is-right {
  text-align: right;
}

.trouver-parfum .scale-question__quick-actions {
  display: flex;
  justify-content: center;
  margin-top: 0.12rem;
}

.trouver-parfum .scale-question__quick-btn {
  border: 1px solid color-mix(in srgb, var(--tp-scale-accent, #6f9bb5) 48%, #8da4b7 52%);
  border-radius: 999px;
  padding: 0.42rem 0.9rem;
  background: color-mix(in srgb, var(--tp-scale-accent, #6f9bb5) 12%, #ffffff 88%);
  color: #24465c;
  font-size: 0.84rem;
  font-weight: 700;
  line-height: 1.1;
  cursor: pointer;
  transition: background-color var(--transition-base), border-color var(--transition-base),
    box-shadow var(--transition-base), transform var(--transition-base), color var(--transition-base);
}

.trouver-parfum .scale-question__quick-btn:hover,
.trouver-parfum .scale-question__quick-btn:focus-visible {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--tp-scale-accent, #6f9bb5) 70%, #5d788e 30%);
  box-shadow: 0 8px 16px color-mix(in srgb, var(--tp-scale-accent, #6f9bb5) 28%, rgba(19, 46, 67, 0.14));
}

.trouver-parfum .scale-question__quick-btn[data-active="true"] {
  color: #f8fcff;
  background: var(--tp-scale-accent, #6f9bb5);
  border-color: var(--tp-scale-accent, #6f9bb5);
  box-shadow: 0 10px 20px color-mix(in srgb, var(--tp-scale-accent, #6f9bb5) 45%, rgba(17, 49, 67, 0.24));
}

.trouver-parfum .scale-question--saison .scale-question__markers {
  height: 2.02rem;
}

.trouver-parfum .scale-question--saison .scale-question__marker {
  width: 1.86rem;
  height: 1.86rem;
}

.trouver-parfum .scale-question--saison .scale-question__marker[data-active="true"] {
  width: 2.02rem;
  height: 2.02rem;
  background: var(--tp-season-accent, #1f6c74);
  border-color: var(--tp-season-accent, #1f6c74);
  box-shadow: 0 10px 18px color-mix(in srgb, var(--tp-season-accent, #1f6c74) 42%, rgba(17, 49, 67, 0.24));
}

.trouver-parfum .scale-question--saison .scale-question__marker.is-minor {
  width: 1.5rem;
  height: 0.22rem;
}

.trouver-parfum .scale-question--saison .scale-question__marker.is-minor[data-active="true"] {
  width: 1.5rem;
  height: 0.22rem;
}

.trouver-parfum .scale-question--saison .scale-question__marker.is-major .scale-question__marker-glyph {
  font-size: 1.26rem;
}

.trouver-parfum .quiz-visual__glow {
  display: none !important;
}

.trouver-parfum .actions .button {
  border-radius: 0.95rem;
}

.trouver-parfum .actions .button:not(.button--ghost) {
  background: linear-gradient(
    135deg,
    var(--tp-continue-accent, var(--tp-accent)),
    color-mix(in srgb, var(--tp-continue-accent, var(--tp-accent-strong)) 70%, #1d2633 30%)
  );
  box-shadow: 0 14px 30px
    color-mix(in srgb, var(--tp-continue-accent, var(--tp-accent)) 46%, rgba(17, 37, 53, 0.34));
}

.trouver-parfum .actions .button.button--ghost {
  border: 1px solid rgba(106, 126, 141, 0.4);
  color: #2f4356;
  background: rgba(255, 255, 255, 0.78);
}

@keyframes tp-preview-pulse {
  0% {
    transform: translateY(0);
  }
  45% {
    transform: translateY(-2px);
  }
  100% {
    transform: translateY(0);
  }
}

@keyframes tp-bottle-float {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-7px);
  }
}

@keyframes tp-wheel-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@keyframes tp-results-card-reveal-forward {
  0% {
    transform: translateX(16px) scale(0.978) translateY(7px);
    opacity: 0.82;
  }
  100% {
    transform: scale(1) translateY(0);
    opacity: 1;
  }
}

@keyframes tp-results-card-reveal-backward {
  0% {
    transform: translateX(-16px) scale(0.978) translateY(7px);
    opacity: 0.82;
  }
  100% {
    transform: scale(1) translateY(0);
    opacity: 1;
  }
}

@keyframes tp-wheel-breathe {
  0%,
  100% {
    transform: translate(-50%, -50%) scale(1);
  }
  50% {
    transform: translate(-50%, -50%) scale(1.03);
  }
}

@keyframes tp-blob-breathe {
  0%,
  100% {
    transform: translate(-50%, -50%) scale(1);
  }
  50% {
    transform: translate(-50%, -50%) scale(1.06);
  }
}

@keyframes tp-note-drop {
  0% {
    transform: translate(-50%, -24px) rotate(var(--drop-rot, 0deg));
  }
  66% {
    transform: translate(-50%, calc(var(--drop-to) - 12px)) rotate(calc(var(--drop-rot, 0deg) * -0.45));
  }
  80% {
    transform: translate(-50%, var(--drop-to)) rotate(calc(var(--drop-rot, 0deg) * 0.2));
  }
  90% {
    transform: translate(-50%, calc(var(--drop-to) - 4px)) rotate(calc(var(--drop-rot, 0deg) * -0.12));
  }
  100% {
    transform: translate(-50%, var(--drop-to)) rotate(0deg);
    opacity: 0;
  }
}

@keyframes tp-note-floor-float {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-2px);
  }
}

@media (max-width: 760px) {
  .trouver-parfum__seo-band {
    width: 100%;
    left: auto;
    transform: none;
  }

  .trouver-parfum .quiz-layout {
    gap: 0.9rem;
  }

  .trouver-parfum .quiz-score-panel {
    padding: 0.78rem;
    gap: 0.62rem;
  }

  .trouver-parfum .quiz-visual {
    min-height: 320px;
    padding: 0.85rem;
  }

  .trouver-parfum .quiz-visual__scene {
    min-height: 322px;
  }

  .trouver-parfum .quiz-visual__bottle {
    top: 7%;
  }

  .trouver-parfum .quiz-visual__bottle img {
    width: clamp(100px, 30vw, 132px);
  }

  .trouver-parfum .quiz-visual__progress-wheel {
    width: clamp(60px, 17vw, 76px);
    top: 88%;
  }

  .trouver-parfum .quiz-visual__results {
    inset: 0.52rem;
    bottom: 0.28rem;
  }

  .trouver-parfum .results-card {
    max-width: 100%;
    padding: 0.84rem 0.78rem 0.88rem;
  }

  .trouver-parfum .results-nav {
    inset: 0;
  }

  .trouver-parfum .results-nav__btn {
    width: 42px;
    height: 42px;
    font-size: 1.12rem;
  }

  .trouver-parfum .results-nav__btn--prev {
    left: 0.08rem;
  }

  .trouver-parfum .results-nav__btn--next {
    right: 0.08rem;
  }

  .trouver-parfum .results-hint {
    font-size: 0.78rem;
  }

  .trouver-parfum__seo-intro-top {
    gap: 0.54rem;
    padding: 0.86rem 0.84rem;
  }

  .trouver-parfum__page-title {
    font-size: 1.08rem;
  }

  .trouver-parfum__page-intro {
    font-size: 0.82rem;
  }

  .trouver-parfum__page-intro-label {
    font-size: 0.74rem;
  }

  .trouver-parfum__page-intro-list {
    font-size: 0.76rem;
    gap: 0.22rem;
    padding-left: 0.96rem;
  }

  .trouver-parfum__seo-intro h2 {
    font-size: 1.06rem;
  }

  .trouver-parfum__seo-lead {
    font-size: 0.83rem;
  }

  .trouver-parfum__seo-points {
    gap: 0.34rem;
  }

  .trouver-parfum__seo-points li {
    font-size: 0.73rem;
    min-height: 1.38rem;
    padding: 0.12rem 0.52rem;
  }

  .trouver-parfum__seo-faq h3 {
    font-size: 0.77rem;
  }

  .trouver-parfum__seo-faq-item summary {
    font-size: 0.78rem;
    padding: 0.5rem 1.76rem 0.5rem 0.6rem;
  }

  .trouver-parfum__seo-faq-item p {
    font-size: 0.74rem;
    padding: 0 0.6rem 0.54rem;
  }

  .trouver-parfum .choices {
    grid-template-columns: 1fr;
  }

  .trouver-parfum .choices--ambiance {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .trouver-parfum .choices--facettes,
  .trouver-parfum .choices--notes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .trouver-parfum .question-card h2 {
    font-size: 0.84rem;
  }

  .trouver-parfum .choice {
    font-size: 0.7rem;
    min-height: 2.72rem;
    padding: 0.54rem 0.62rem;
    gap: 0.35rem;
  }

  .trouver-parfum .choice__label {
    font-size: 0.72rem;
  }

  .trouver-parfum .choice-helper {
    font-size: 0.68rem;
  }

  .trouver-parfum .choice__icon {
    width: 1.95rem;
    height: 1.95rem;
  }

  .trouver-parfum .choice--chip {
    min-height: 2.55rem;
    padding: 0.44rem 0.58rem;
  }

  .trouver-parfum .scale-question {
    width: min(100%, 100%);
    padding: 0.8rem 0.92rem 1.02rem;
  }

  .trouver-parfum .scale-question__legend {
    font-size: 0.72rem;
    gap: 0.38rem;
  }

  .trouver-parfum .scale-question__marker {
    width: 1.2rem;
    height: 1.2rem;
  }

  .trouver-parfum .scale-question--saison .scale-question__marker {
    width: 1.48rem;
    height: 1.48rem;
  }

  .trouver-parfum .scale-question--saison .scale-question__marker[data-active="true"] {
    width: 1.62rem;
    height: 1.62rem;
  }

  .trouver-parfum .scale-question--saison .scale-question__marker.is-minor {
    width: 1.18rem;
    height: 0.18rem;
  }

  .trouver-parfum .scale-question--saison .scale-question__marker.is-major .scale-question__marker-glyph {
    font-size: 1.04rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .trouver-parfum .quiz-visual__bottle img,
  .trouver-parfum .quiz-visual__progress-wheel,
  .trouver-parfum .quiz-visual__progress-wheel::after,
  .trouver-parfum .quiz-visual.is-reactive,
  .trouver-parfum .quiz-visual__blob,
  .trouver-parfum .quiz-note-particle,
  .trouver-parfum .quiz-note-token {
    animation: none !important;
  }
}