:root {
  --champagne: #d4bf91;
  --champagne-soft: #e2d2ae;
  --champagne-muted: rgba(212, 191, 145, 0.62);
  --champagne-line: rgba(212, 191, 145, 0.46);
  --champagne-wash: rgba(184, 151, 97, 0.11);
}

/* La serif editorial de NOIR se usa con un peso fino y consistente. */
.upcoming-drop-overlay h2,
.noir-collection-heading h2,
.noir-product-name,
.product-top h3,
.product-title-button,
.product-card .product-title-button,
.product-card--exclusive .product-top h3,
.product-quickview-header h2,
.exclusive-detail-heading h2 {
  font-family: "Cormorant Garamond", Garamond, Georgia, serif;
  font-weight: 300;
}

.upcoming-drop-overlay h2,
.noir-collection-heading h2 {
  letter-spacing: -0.025em;
}

.noir-product-name {
  font-weight: 300;
  transition: color 220ms ease;
}

.product-top h3,
.product-title-button {
  font-size: clamp(1.16rem, 1.5vw, 1.38rem);
  font-weight: 300;
  letter-spacing: 0.01em;
  line-height: 1.05;
}

::selection {
  background: rgba(212, 191, 145, 0.28);
  color: var(--white);
}

.eyebrow,
.upcoming-drop-eyebrow,
.checkout-confirmation-kicker,
.exclusive-detail-story span,
.account-saved-order-address span {
  color: var(--champagne);
}

.cart-item-price,
.checkout-summary-price {
  color: var(--champagne-soft);
}

.site-nav a::after {
  background: var(--champagne);
}

.hero-dot.is-active {
  background: var(--champagne-soft);
}

.signal-bar a:hover,
.signal-bar a:focus-visible {
  box-shadow: inset 0 -2px 0 var(--champagne);
}

.filter-button.is-active {
  border-color: var(--champagne-line);
  background: var(--champagne-wash);
  color: var(--white);
}

.filter-button:hover,
.filter-button:focus-visible {
  border-color: var(--champagne);
  background: rgba(212, 191, 145, 0.08);
  color: var(--white);
}

.color-button:hover,
.color-button:focus-visible,
.color-button.is-selected,
.exclusive-size-button:hover,
.exclusive-size-button:focus-visible,
.exclusive-size-button.is-selected {
  border-color: var(--champagne);
}

.color-button.is-selected,
.exclusive-size-button.is-selected {
  background: var(--champagne-wash);
  color: var(--white);
  box-shadow: 0 0 0 1px rgba(212, 191, 145, 0.14);
}

.button:hover,
.button:focus-visible,
.add-button:hover,
.add-button:focus-visible,
.size-finder-guide-button:hover,
.size-finder-guide-button:focus-visible,
.icon-button:hover,
.icon-button:focus-visible,
.cart-trigger:hover,
.cart-trigger:focus-visible,
.account-trigger:hover,
.account-trigger:focus-visible {
  border-color: var(--champagne-line);
}

.catalog-meta a:hover,
.catalog-meta a:focus-visible,
.exclusive-detail-back:hover,
.exclusive-detail-back:focus-visible {
  color: var(--champagne-soft);
}

.noir-product-name:hover,
.noir-product-name:focus-visible,
.product-title-button:hover,
.product-title-button:focus-visible,
.product-card:hover .product-top h3,
.product-card:focus-within .product-top h3 {
  color: var(--champagne-soft);
}

/* En los catálogos, el precio parte de blanco y reserva champagne para la interacción. */
.product-card .price,
.product-card .price-current,
.product-quickview-price,
.product-quickview-price .price-current,
.exclusive-detail-price,
.exclusive-detail-price .price-current {
  color: var(--white);
  transition: color 220ms ease;
}

.product-card .price:hover,
.product-card .price:hover .price-current,
.product-quickview-price:hover,
.product-quickview-price:hover .price-current,
.exclusive-detail-price:hover,
.exclusive-detail-price:hover .price-current {
  color: var(--champagne-soft);
}

.button:focus-visible,
.add-button:focus-visible,
.filter-button:focus-visible,
.icon-button:focus-visible,
.cart-trigger:focus-visible,
.account-trigger:focus-visible,
.color-button:focus-visible,
.exclusive-size-button:focus-visible,
.size-finder-guide-button:focus-visible {
  outline-color: var(--champagne);
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--champagne-line);
  box-shadow: 0 0 0 1px rgba(212, 191, 145, 0.1);
  outline: none;
}