/* pages/fragrance.css — owns The Colour Wardrobe page. The whole page sits on
   ink, so it inherits .am-on-ink; this file only holds what is unique to it:
   the price line, the quiz row and the IFRA footnote. */

.am-scent__price-line {
  display: flex;
  gap: var(--am-gap-l);
  align-items: baseline;
  margin-bottom: var(--am-gap-2xl);
  flex-wrap: wrap;
}
.am-scent__price { font-family: var(--am-font-display); font-weight: 500; font-size: 30px; }
.am-scent__price-note { font-size: var(--am-size-small); color: var(--am-text-on-ink-meta); }

.am-scent__quiz[hidden] { display: none; }
.am-scent__quiz-question {
  font-size: var(--am-size-small);
  color: var(--am-text-on-ink-muted);
  margin-bottom: var(--am-gap-m);
}

.am-scent__shelf { border-top: 1px solid var(--am-hair-on-ink); }

.am-scent__legal {
  padding: var(--am-gap-xl) var(--am-rail-inline);
  font-size: var(--am-size-micro);
  color: var(--am-text-on-ink-meta);
  line-height: var(--am-leading-body);
}

.am-scent__lead {
  font-size: var(--am-size-body-l);
  line-height: var(--am-leading-copy);
  max-width: 440px;
  margin-bottom: 26px;
}
