/* Hallmark · component: perfume price comparison · genre: editorial
 * theme: existing Parfumistas system · warm brown, flat offer rows
 * states: default, hover, focus, active, disabled, loading, error, success
 * pre-emit critique: P5 H5 E4 S5 R5 V4 */
.pvc, .pvc-jump {
  --pvc-paper: var(--pv-system-surface, #fff);
  --pvc-soft: var(--pv-system-surface-soft, #f5f0eb);
  --pvc-ink: var(--pv-system-ink-warm, #4b3528);
  --pvc-muted: var(--pv-system-muted-strong, #5f5a56);
  --pvc-action: var(--pv-system-action, #7d573f);
  --pvc-rule: var(--pv-system-border, #e5e0db);
  --pvc-control-rule: #96867a;
  --pvc-positive: var(--pv-system-positive-text, #256c3d);
  --pvc-error: #9d3030;
  --pvc-font: var(--pv-system-font, "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  --pvc-display: var(--pv-system-display, "Newsreader", Georgia, "Times New Roman", serif);
}
.pvc {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  margin: 2.5rem 0;
  padding: clamp(1rem, 3vw, 2rem);
  border: 1px solid var(--pvc-rule);
  border-radius: .5rem;
  background: var(--pvc-paper);
  color: var(--pvc-ink);
  font: 400 1rem/1.6 var(--pvc-font);
  text-align: left;
  scroll-margin-top: 11rem;
  overflow-wrap: anywhere;
}
.pvc *, .pvc *::before, .pvc *::after { box-sizing: border-box; }
.pvc [hidden] { display: none !important; }
.pvc :where(h2, h3, p, ul) { margin: 0; padding: 0; }
.pvc :where(h2, h3) { color: var(--pvc-ink); font-style: normal; min-width: 0; overflow-wrap: anywhere; }
.pvc :where(a, button, select) { -webkit-tap-highlight-color: transparent; }
.pvc :where(a, button, select):focus-visible { outline: 3px solid var(--pvc-action); outline-offset: 3px; }
.pvc .pvc__header { display: grid; grid-template-columns: minmax(0, 1fr) minmax(12rem, auto); gap: 1rem 2rem; align-items: end; }
.pvc .pvc__title { margin: 0 0 .375rem; font: 500 clamp(1.75rem, 2.6vw, 2.25rem)/1.15 var(--pvc-display); letter-spacing: -.02em; }
.pvc .pvc__intro p { color: var(--pvc-muted); max-width: 45ch; font-size: .9375rem; }
.pvc .pvc__market-form { min-width: 0; margin: 0; }
.pvc label { display: block; margin-bottom: .375rem; color: var(--pvc-ink); font-size: .8125rem; font-weight: 600; line-height: 1.5; }
.pvc .pvc__market-fields { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; }
.pvc select { width: 100%; min-width: 0; max-width: 100%; min-height: 44px; margin: 0; padding: .625rem 2rem .625rem .75rem; border: 1px solid var(--pvc-control-rule); border-radius: .25rem; background-color: var(--pvc-paper); color: var(--pvc-ink); font: 500 .875rem/1.5 var(--pvc-font); cursor: pointer; box-shadow: none; text-overflow: ellipsis; }
.pvc .pvc__market-fields select { flex: 1 1 11rem; }
.pvc .pvc__market-help { margin: .875rem 0 1.25rem; color: var(--pvc-muted); font-size: .8125rem; max-width: 85ch; }
.pvc .pvc__filters { display: flex; flex-wrap: wrap; align-items: end; gap: .875rem 1rem; padding: 1.125rem 0; border-top: 1px solid var(--pvc-rule); border-bottom: 1px solid var(--pvc-rule); }
.pvc .pvc__field { flex: 1 1 8rem; min-width: 0; max-width: 15rem; }
.pvc .pvc__field--sort { flex: 2 1 16rem; max-width: 24rem; margin-left: auto; }
.pvc .pvc__summary { display: flex; flex-wrap: wrap; gap: .25rem 1rem; justify-content: space-between; margin-top: 1.125rem; }
.pvc .pvc__count { font-size: .9375rem; font-weight: 700; }
.pvc .pvc__updated { color: var(--pvc-muted); font-size: .8125rem; }
.pvc .pvc__compare-note, .pvc .pvc__sort-note { margin-top: .375rem; color: var(--pvc-muted); font-size: .8125rem; }
.pvc .pvc__sort-note { padding: .625rem .75rem; background: var(--pvc-soft); border-radius: .25rem; }
.pvc .pvc__offers { display: grid; list-style: none; margin-top: .75rem; }
.pvc .pvc__offer { display: grid; grid-template-columns: minmax(0, 1fr) minmax(10.5rem, .65fr) minmax(9rem, auto); align-items: center; gap: 1rem 1.5rem; padding: 1.375rem 0; margin: 0; border-bottom: 1px solid var(--pvc-rule); background: var(--pvc-paper); list-style: none; }
.pvc .pvc__retailer h3 { font: 700 1rem/1.4 var(--pvc-font); }
.pvc .pvc__variant { margin-top: .375rem; color: var(--pvc-muted); font-size: .875rem; line-height: 1.55; }
.pvc .pvc__stock { display: block; margin-top: .5rem; font-size: .8125rem; color: var(--pvc-muted); }
.pvc .pvc__stock--available { color: var(--pvc-positive); }
.pvc .pvc__stock--available::before { content: ""; display: inline-block; width: .375rem; height: .375rem; margin-right: .375rem; border-radius: 50%; background: currentColor; vertical-align: .1em; }
.pvc .pvc__price-block { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; font-variant-numeric: tabular-nums; }
.pvc .pvc__price-label { color: var(--pvc-muted); font-size: .8125rem; line-height: 1.5; }
.pvc .pvc__price { font: 700 1.5rem/1.5 var(--pvc-font); color: var(--pvc-ink); letter-spacing: -.035em; white-space: nowrap; }
.pvc .pvc__unit-price { margin-bottom: .125rem; color: var(--pvc-muted); font-size: .8125rem; line-height: 1.55; }
.pvc .pvc__shipping, .pvc .pvc__total { color: var(--pvc-muted); font-size: .8125rem; line-height: 1.55; }
.pvc .pvc__total { margin-top: .125rem; font-weight: 600; color: var(--pvc-ink); }
.pvc .pvc__offer-action { display: flex; flex-direction: column; gap: .5rem; align-items: stretch; max-width: 13.5rem; }
.pvc .pvc__button { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 44px; padding: .625rem 1rem; margin: 0; border: 1px solid var(--pvc-action); border-radius: .25rem; background: var(--pvc-action); color: var(--pvc-paper); font: 600 .875rem/1.5 var(--pvc-font); text-decoration: none; text-transform: none; letter-spacing: 0; white-space: nowrap; cursor: pointer; box-shadow: none; }
/* The legacy theme applies an important brown to every link, including filled actions. */
.pvc .pvc__offer-action a.pvc__button { color: var(--pvc-paper) !important; }
.pvc .pvc__button--quiet { background: var(--pvc-paper); color: var(--pvc-action); }
.pvc .pvc__button span, .pvc .pvc__search-link span { font-size: 1rem; line-height: 1; }
.pvc .pvc__checked { display: block; text-align: center; color: var(--pvc-muted); font-size: .8125rem; line-height: 1.5; }
.pvc .pvc__price-note { margin-top: 1rem; color: var(--pvc-muted); font-size: .8125rem; }
.pvc .pvc__empty { padding: 1.5rem; margin: .5rem 0 0; border-radius: .25rem; background: var(--pvc-soft); color: var(--pvc-ink); }
.pvc .pvc__empty h3 { font: 500 1.5rem/1.3 var(--pvc-display); }
.pvc .pvc__empty p { margin-top: .5rem; max-width: 65ch; color: var(--pvc-muted); font-size: .9375rem; }
.pvc .pvc__empty .pvc__button { margin-top: 1rem; }
.pvc .pvc__empty--filtered { margin-top: 1rem; }
.pvc .pvc__searches { margin-top: 1.75rem; }
.pvc .pvc__searches > h3 { font: 500 1.375rem/1.3 var(--pvc-display); }
.pvc .pvc__search-help { margin-top: .5rem; max-width: 85ch; color: var(--pvc-muted); font-size: .8125rem; }
.pvc .pvc__search-list { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.5rem; margin-top: .625rem; }
.pvc .pvc__search-list li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .25rem .75rem; min-width: 0; margin: 0; padding: .875rem 0; border-bottom: 1px solid var(--pvc-rule); }
.pvc .pvc__search-list li > div { min-width: 0; }
.pvc .pvc__search-list strong { display: block; font-size: .875rem; font-weight: 600; }
.pvc .pvc__search-list li > div > span { display: block; margin-top: .125rem; color: var(--pvc-muted); font-size: .8125rem; }
.pvc .pvc__search-link { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; gap: .375rem; padding: .5rem 0 .5rem .375rem; color: var(--pvc-action); font: 600 .8125rem/1.5 var(--pvc-font); text-decoration: underline; text-underline-offset: .2em; white-space: nowrap; }
.pvc .pvc__disclosure { margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid var(--pvc-rule); font-size: .8125rem; line-height: 1.65; color: var(--pvc-muted); }
.pvc .pvc__feedback { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; padding: .875rem 1rem; margin-bottom: 1rem; border: 1px solid var(--pvc-error); border-radius: .25rem; color: var(--pvc-error); }
.pvc .pvc__feedback p { flex: 1 1 15rem; font-size: .875rem; }
.pvc .pvc__live { margin: 0; color: var(--pvc-muted); font-size: .8125rem; }
.pvc .pvc__live:not(:empty) { margin-bottom: 1rem; }
.pvc[data-state="success"] .pvc__live { color: var(--pvc-positive); }
.pvc[aria-busy="true"] .pvc__offers, .pvc[aria-busy="true"] .pvc__empty { opacity: .6; }
.pvc .pvc__button:disabled, .pvc select:disabled { opacity: .55; cursor: not-allowed; }
.pvc .pvc__button:active, .pvc .pvc__search-link:active { transform: translateY(1px); }
.pvc.pvc--enhanced .pvc__no-js { display: none; }
.pvc-jump { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 44px; max-width: 100%; margin: .875rem 0; padding: .625rem .875rem; border: 1px solid var(--pvc-control-rule); border-radius: .25rem; background: var(--pvc-paper); color: var(--pvc-action); font: 600 .875rem/1.5 var(--pvc-font); text-decoration: none; white-space: nowrap; }
.pvc-jump svg { flex: 0 0 18px; }
.pvc-jump:focus-visible { outline: 3px solid var(--pvc-action); outline-offset: 3px; }
.pvc-jump:active { transform: translateY(1px); }
@media (hover: hover) {
  .pvc-jump:hover { background: var(--pvc-soft); color: var(--pvc-ink); }
  .pvc .pvc__button:hover { background: var(--pvc-ink); border-color: var(--pvc-ink); color: var(--pvc-paper); }
  .pvc .pvc__button--quiet:hover { background: var(--pvc-soft); border-color: var(--pvc-action); color: var(--pvc-ink); }
  .pvc select:hover { background-color: var(--pvc-soft); }
  .pvc .pvc__search-link:hover { color: var(--pvc-ink); text-decoration-thickness: 2px; }
}
@media (max-width: 48rem) {
  .pvc .pvc__header { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
  .pvc .pvc__market-form { max-width: 25rem; }
  .pvc .pvc__offer { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; }
  .pvc .pvc__retailer { grid-column: 1 / -1; }
  .pvc .pvc__offer-action { justify-self: end; width: 100%; }
  .pvc .pvc__search-list { grid-template-columns: minmax(0, 1fr); }
  .pvc .pvc__field { max-width: none; }
  .pvc .pvc__field--sort { flex-basis: 100%; max-width: none; margin-left: 0; }
}
@media (max-width: 24rem) {
  .pvc { padding: 1rem; }
  .pvc .pvc__empty { padding: 1.125rem; }
  .pvc .pvc__offer { grid-template-columns: minmax(0, 1fr); }
  .pvc .pvc__offer-action { max-width: none; justify-self: stretch; }
  .pvc .pvc__price-block { margin-top: -.25rem; }
  .pvc .pvc__checked { text-align: left; }
  .pvc .pvc__search-list li { column-gap: .5rem; }
}
@media (prefers-reduced-motion: reduce) {
  .pvc *, .pvc *::before, .pvc *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
  .pvc .pvc__button:active, .pvc .pvc__search-link:active { transform: none; }
}
.pvc .pvc__quick-links { display:flex; flex-wrap:wrap; gap:.55rem; margin:0 0 1rem; }
.pvc .pvc__quick-links a { display:inline-flex; gap:.25rem; align-items:center; padding:.55rem .75rem; border:1px solid currentColor; border-radius:999px; text-decoration:none; font-size:.9rem; }
.pvc .pvc__quick-links a:hover { text-decoration:underline; }
.pvc-gallery-links { display:flex; flex-direction:column; gap:.6rem; width:100%; margin:1rem 0 0; scroll-margin-top:11rem; }
.pvc-gallery-links a { display:flex !important; align-items:center; gap:.5rem; min-width:0; min-height:44px; width:100%; box-sizing:border-box; padding:.625rem .75rem; border:1px solid rgba(80,60,45,.35); color:inherit; text-decoration:none; font-size:.875rem; line-height:1.5; white-space:normal; background:rgba(255,255,255,.35); }
.pvc-gallery-links .pvc-gallery-link__logo { display:block; flex:0 0 24px; width:24px; height:24px; margin:0; object-fit:contain; }
.pvc-gallery-links .pvc-gallery-link__text { display:block; min-width:0; overflow-wrap:break-word; }
.pvc-gallery-links .pvc-gallery-link__text > span, .pvc-gallery-links .pvc-gallery-link__text > strong { display:inline; }
.pvc-gallery-links .pvc-gallery-link__text > strong { white-space:nowrap; }
.pvc-gallery-links a:hover { text-decoration:underline; border-color:currentColor; }
.pvc-gallery-links a:focus-visible { outline:2px solid currentColor; outline-offset:3px; }