:root {
  /* Brand - women palette (warm tan/amber) */
  --brand-primary: #d4a574;
  --brand-secondary: #fff6ed;
  --brand-whitespace: #ffffff;

  /* Text */
  --text-primary: #141414;
  --text-secondary: #373737;
  --text-inverse: #ffffff;

  /* UI */
  --ui-verified: #d4a574;

  /* Border */
  --border-default: rgba(212, 165, 116, 0.15);

  /* Background */
  --surface-bg: #ffffff;
}

/* Lightning flash animation on sale text */
@keyframes lightning-flash {
  0%, 100% { text-shadow: none; filter: none; }
  10% { text-shadow: 0 0 8px rgba(255,200,0,0.8), 0 0 20px rgba(255,160,0,0.5); filter: brightness(1.4); }
  20% { text-shadow: none; filter: none; }
  30% { text-shadow: 0 0 12px rgba(255,200,0,0.9), 0 0 30px rgba(255,160,0,0.6); filter: brightness(1.6); }
  40% { text-shadow: none; filter: none; }
}
.flash-sale-text {
  animation: lightning-flash 3s ease-in-out infinite;
}

/* CTA button hover */
a[class*="cta-green"], a[class*="cta-dark"] {
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}
a[class*="cta-green"]:hover, a[class*="cta-dark"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
  filter: brightness(1.06);
}
a[class*="cta-green"]:active, a[class*="cta-dark"]:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

/* CTA loading spinner - on click, original text/arrow fade to opacity 0
   (preserving CTA dimensions) and an absolutely-positioned spinner overlays
   on top. Reset on bfcache pageshow (see landing.js). */
@keyframes cta-spin {
  to { transform: rotate(360deg); }
}
.cta-spinner {
  display: inline-block;
  width: 1.4em;
  height: 1.4em;
  border: 2.5px solid rgba(255, 255, 255, 0.35);
  border-top-color: #fff;
  border-radius: 50%;
  animation: cta-spin 0.7s linear infinite;
}
.cta-loading {
  position: relative;
}
.cta-loading > :not(.cta-spinner-overlay) {
  opacity: 0;
}
.cta-spinner-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

@keyframes green-dot-pulse {
  0%, 100% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(1.4);
    opacity: 0.6;
  }
}
img[src*="green-dot"] {
  animation: green-dot-pulse 1.6s ease-in-out infinite;
  transform-origin: center;
  will-change: transform, opacity;
}
@media (prefers-reduced-motion: reduce) {
  img[src*="green-dot"] {
    animation: none;
  }
}