/** Shopify CDN: Minification failed

Line 14:51 Unexpected "\\n"
Line 1030:49 Unexpected "\\n"
Line 1185:37 Unexpected "\\n"

**/
/* ============================================================
   GLORIA NATURALS - CONSOLIDATED CSS (gn-cro.css)
   Auto-generated by consolidation script.
   Sources: gn-premium-enhancements.css, gn-vitality.css
   ============================================================ */

\n/* ==== BEGIN gn-premium-enhancements.css ==== */\n
/* ============================================================
   GLORIA NATURALS - PREMIUM ENHANCEMENTS CSS
   The "Wow Factor" - Luxury animations and interactions
   ============================================================ */

/* ============================================================
   1. SCROLL-TRIGGERED ANIMATIONS - CINEMATIC REVEALS
   ============================================================ */

/* Fade up with scale */
.gn-animate-in {
  opacity: 0;
  transform: translateY(60px) scale(0.95);
  transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.gn-animate-in.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* Slide from left */
.gn-slide-left {
  opacity: 0;
  transform: translateX(-80px);
  transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.gn-slide-left.is-visible {
  opacity: 1;
  transform: translateX(0);
}

/* Slide from right */
.gn-slide-right {
  opacity: 0;
  transform: translateX(80px);
  transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.gn-slide-right.is-visible {
  opacity: 1;
  transform: translateX(0);
}

/* Zoom reveal */
.gn-zoom-reveal {
  opacity: 0;
  transform: scale(0.8);
  transition: all 1s cubic-bezier(0.16, 1, 0.3, 1);
}

.gn-zoom-reveal.is-visible {
  opacity: 1;
  transform: scale(1);
}

/* Rotate in */
.gn-rotate-in {
  opacity: 0;
  transform: perspective(1000px) rotateY(-15deg) translateX(-30px);
  transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.gn-rotate-in.is-visible {
  opacity: 1;
  transform: perspective(1000px) rotateY(0) translateX(0);
}

/* Staggered grid items */
.gn-stagger-grid > * {
  opacity: 0;
  transform: translateY(40px);
  transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Collection grids: keep layout visible; per-card animation handles reveal */
.product-grid.gn-stagger-grid > * {
  opacity: 1;
  transform: none;
}

.gn-stagger-grid.is-visible > *:nth-child(1) { transition-delay: 0.0s; }
.gn-stagger-grid.is-visible > *:nth-child(2) { transition-delay: 0.1s; }
.gn-stagger-grid.is-visible > *:nth-child(3) { transition-delay: 0.2s; }
.gn-stagger-grid.is-visible > *:nth-child(4) { transition-delay: 0.3s; }
.gn-stagger-grid.is-visible > *:nth-child(5) { transition-delay: 0.4s; }
.gn-stagger-grid.is-visible > *:nth-child(6) { transition-delay: 0.5s; }
.gn-stagger-grid.is-visible > *:nth-child(7) { transition-delay: 0.6s; }
.gn-stagger-grid.is-visible > *:nth-child(8) { transition-delay: 0.7s; }

.gn-stagger-grid.is-visible > * {
  opacity: 1;
  transform: translateY(0);
}

/* ============================================================
   2. PREMIUM BUTTONS - LIQUID RIPPLE & MAGNETIC
   ============================================================ */

/* Base button enhancement */
.tp-btn,
.quick-add__submit,
button[type="submit"],
.btn,
.button {
  position: relative;
  overflow: hidden;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  isolation: isolate;
}

/* Liquid ripple effect */
.tp-btn::before,
.quick-add__submit::before {
  content: '';
  position: absolute;
  top: var(--ripple-y, 50%);
  left: var(--ripple-x, 50%);
  width: 0;
  height: 0;
  background: radial-gradient(circle, rgba(255,255,255,0.4) 0%, transparent 70%);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  transition: width 0.6s ease, height 0.6s ease, opacity 0.6s ease;
  opacity: 0;
  z-index: -1;
}

.tp-btn:active::before,
.quick-add__submit:active::before {
  width: 300px;
  height: 300px;
  opacity: 1;
  transition: width 0s, height 0s, opacity 0s;
}

/* Button glow pulse for primary CTAs */
.tp-btn__primary {
  animation: gn-btn-glow 3s infinite;
}

@keyframes gn-btn-glow {
  0%, 100% { box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); }
  50% { box-shadow: 0 4px 25px rgba(201, 169, 98, 0.4), 0 0 40px rgba(201, 169, 98, 0.2); }
}

/* Button press effect */
.tp-btn:active,
.button:active,
.btn:active {
  transform: scale(0.96) translateY(2px);
}

/* ============================================================
   3. IMAGE ENHANCEMENTS - KEN BURNS & SHIMMER
   ============================================================ */

/* Ken Burns zoom effect on images */
.gn-ken-burns {
  overflow: hidden;
}

.gn-ken-burns img {
  animation: gn-ken-burns 20s ease-in-out infinite alternate;
  will-change: transform;
}

@keyframes gn-ken-burns {
  0% { transform: scale(1) translate(0, 0); }
  100% { transform: scale(1.1) translate(-2%, -2%); }
}

/* Golden shimmer overlay for hero images */
.gn-shimmer-overlay {
  position: relative;
  overflow: hidden;
}

.gn-shimmer-overlay::after {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(
    45deg,
    transparent 40%,
    rgba(201, 169, 98, 0.1) 50%,
    transparent 60%
  );
  animation: gn-shimmer 8s linear infinite;
  pointer-events: none;
}

@keyframes gn-shimmer {
  0% { transform: translateX(-50%) translateY(-50%) rotate(0deg); }
  100% { transform: translateX(50%) translateY(50%) rotate(0deg); }
}

/* Image reveal on scroll */
.gn-image-reveal {
  position: relative;
  overflow: hidden;
}

.gn-image-reveal::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--gn-cream, #FAF8F5);
  transform: scaleX(1);
  transform-origin: right;
  transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1);
  z-index: 2;
}

.gn-image-reveal.is-visible::before {
  transform: scaleX(0);
}

.gn-image-reveal img {
  transform: scale(1.2);
  transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1) 0.3s;
}

.gn-image-reveal.is-visible img {
  transform: scale(1);
}

/* ============================================================
   4. TYPOGRAPHY ANIMATIONS
   ============================================================ */

/* Split text reveal - words */
.gn-text-split-words {
  overflow: hidden;
}

.gn-text-split-words .word {
  display: inline-block;
  transform: translateY(100%);
  opacity: 0;
  transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.gn-text-split-words.is-visible .word {
  transform: translateY(0);
  opacity: 1;
}

.gn-text-split-words.is-visible .word:nth-child(1) { transition-delay: 0.0s; }
.gn-text-split-words.is-visible .word:nth-child(2) { transition-delay: 0.05s; }
.gn-text-split-words.is-visible .word:nth-child(3) { transition-delay: 0.1s; }
.gn-text-split-words.is-visible .word:nth-child(4) { transition-delay: 0.15s; }
.gn-text-split-words.is-visible .word:nth-child(5) { transition-delay: 0.2s; }
.gn-text-split-words.is-visible .word:nth-child(6) { transition-delay: 0.25s; }
.gn-text-split-words.is-visible .word:nth-child(7) { transition-delay: 0.3s; }
.gn-text-split-words.is-visible .word:nth-child(8) { transition-delay: 0.35s; }

/* Elegant underline reveal */
.gn-underline-reveal {
  position: relative;
  display: inline-block;
}

.gn-underline-reveal::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, var(--gn-gold), var(--gn-gold-dark));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.gn-underline-reveal.is-visible::after {
  transform: scaleX(1);
}

/* Counter animation */
.gn-counter {
  font-variant-numeric: tabular-nums;
}

/* Typewriter effect */
.gn-typewriter {
  overflow: hidden;
  border-right: 2px solid var(--gn-gold);
  white-space: nowrap;
  animation: gn-typewriter 3s steps(40) 1s forwards, gn-blink 0.75s step-end infinite;
  width: 0;
}

@keyframes gn-typewriter {
  to { width: 100%; }
}

@keyframes gn-blink {
  50% { border-color: transparent; }
}

/* ============================================================
   5. FLOATING ELEMENTS & DEPTH
   ============================================================ */

/* Floating animation */
.gn-float {
  animation: gn-float 6s ease-in-out infinite;
}

@keyframes gn-float {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  25% { transform: translateY(-10px) rotate(1deg); }
  75% { transform: translateY(5px) rotate(-1deg); }
}

/* Floating with delay variations */
.gn-float-delay-1 { animation-delay: 0s; }
.gn-float-delay-2 { animation-delay: 1s; }
.gn-float-delay-3 { animation-delay: 2s; }
.gn-float-delay-4 { animation-delay: 3s; }

/* Parallax depth layers */
.gn-parallax-container {
  position: relative;
  overflow: hidden;
}

.gn-parallax-layer {
  position: absolute;
  inset: 0;
  transition: transform 0.1s linear;
  will-change: transform;
}

.gn-parallax-layer[data-depth="0.1"] { transform: translateY(calc(var(--scroll) * 0.1)); }
.gn-parallax-layer[data-depth="0.2"] { transform: translateY(calc(var(--scroll) * 0.2)); }
.gn-parallax-layer[data-depth="0.3"] { transform: translateY(calc(var(--scroll) * 0.3)); }

/* ============================================================
   6. SECTION DIVIDERS & DECORATIVE ELEMENTS
   ============================================================ */

/* Elegant wave divider */
.gn-wave-divider {
  position: relative;
  height: 60px;
  overflow: hidden;
}

.gn-wave-divider::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 200%;
  height: 100%;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M321.39,56.44c58-10.79,114.16-30.13,172-41.86,82.39-16.72,168.19-17.73,250.45-.39C823.78,31,906.67,72,985.66,92.83c70.05,18.48,146.53,26.09,214.34,3V0H0V27.35A600.21,600.21,0,0,0,321.39,56.44Z' fill='%23FAF8F5'/%3E%3C/svg%3E");
  background-size: 50% 100%;
  animation: gn-wave 15s linear infinite;
}

@keyframes gn-wave {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* Gold line accent */
.gn-gold-line {
  width: 60px;
  height: 3px;
  background: linear-gradient(90deg, var(--gn-gold-light), var(--gn-gold), var(--gn-gold-light));
  margin: 20px auto;
  border-radius: 2px;
  position: relative;
  overflow: hidden;
}

.gn-gold-line::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.8), transparent);
  animation: gn-line-shine 3s infinite;
}

@keyframes gn-line-shine {
  0% { left: -100%; }
  50%, 100% { left: 200%; }
}

/* Decorative dots pattern */
.gn-dots-pattern {
  position: absolute;
  width: 100px;
  height: 100px;
  background-image: radial-gradient(var(--gn-gold) 1px, transparent 1px);
  background-size: 10px 10px;
  opacity: 0.3;
}

/* ============================================================
   7. LOADING & TRANSITION STATES
   ============================================================ */

/* Elegant skeleton with shine */
.gn-skeleton {
  background: linear-gradient(
    90deg,
    #f0f0f0 25%,
    #e8e8e8 50%,
    #f0f0f0 75%
  );
  background-size: 200% 100%;
  animation: gn-skeleton-shine 1.5s infinite;
}

@keyframes gn-skeleton-shine {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Page transition overlay */
.gn-page-transition {
  position: fixed;
  inset: 0;
  background: var(--gn-cream);
  z-index: 9999;
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform 0.6s cubic-bezier(0.86, 0, 0.07, 1);
}

.gn-page-transition.active {
  transform: scaleY(1);
  transform-origin: top;
}

/* Product flying to cart */
.gn-fly-to-cart {
  position: fixed;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: var(--gn-gold);
  z-index: 9999;
  pointer-events: none;
  opacity: 0;
}

.gn-fly-to-cart.active {
  animation: gn-fly-to-cart 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

@keyframes gn-fly-to-cart {
  0% {
    opacity: 1;
    transform: translate(var(--start-x), var(--start-y)) scale(1);
  }
  100% {
    opacity: 0;
    transform: translate(var(--end-x), var(--end-y)) scale(0.2);
  }
}

/* ============================================================
   8. ENHANCED SCROLL PROGRESS
   ============================================================ */

.gn-scroll-progress {
  height: 4px;
  background: linear-gradient(90deg,
    var(--gn-gold-light) 0%,
    var(--gn-gold) 50%,
    var(--gn-gold-dark) 100%
  );
  background-size: 200% 100%;
  animation: gn-progress-gradient 3s linear infinite;
}

@keyframes gn-progress-gradient {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ============================================================
   9. MAGNETIC CURSOR EFFECT (Desktop bonus)
   ============================================================ */

@media (hover: hover) {
  .gn-magnetic {
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  }
}

/* ============================================================
   10. ENHANCED WISHLIST HEART
   ============================================================ */

.gn-wishlist-btn.active {
  animation: gn-heart-celebrate 0.6s ease;
}

@keyframes gn-heart-celebrate {
  0% { transform: scale(1); }
  25% { transform: scale(1.3) rotate(-10deg); }
  50% { transform: scale(0.9) rotate(10deg); }
  75% { transform: scale(1.15) rotate(-5deg); }
  100% { transform: scale(1) rotate(0); }
}

/* Heart particles on favorite */
.gn-wishlist-btn.active::after {
  content: '❤️';
  position: absolute;
  font-size: 12px;
  animation: gn-heart-particle 0.8s ease-out forwards;
  pointer-events: none;
}

@keyframes gn-heart-particle {
  0% { opacity: 1; transform: translateY(0) scale(0.5); }
  100% { opacity: 0; transform: translateY(-30px) scale(1.5); }
}

/* ============================================================
   11. BADGE ENHANCEMENTS
   ============================================================ */

/* Badge animations removed - use wiggle animation from gn-simple-card.css instead */

/* ============================================================
   12. TOAST ENHANCEMENTS
   ============================================================ */

.gn-toast {
  backdrop-filter: blur(10px);
  background: rgba(26, 26, 26, 0.95);
}

.gn-toast.success {
  background: linear-gradient(135deg, rgba(76, 175, 80, 0.95), rgba(46, 125, 50, 0.95));
}

.gn-toast::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(255,255,255,0.2), transparent);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}

/* ============================================================
   13. COLLECTION HEADER ENHANCEMENTS
   ============================================================ */

.gn-collection-title,
.collection-hero__title,
.section-header__title {
  background: linear-gradient(135deg, var(--gn-black) 0%, #333 50%, var(--gn-black) 100%);
  background-size: 200% 200%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: gn-text-gradient 5s ease infinite;
}

@keyframes gn-text-gradient {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

/* ============================================================
   14. SMOOTH SCROLL SECTIONS
   ============================================================ */

.gn-snap-section {
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

.gn-snap-container {
  scroll-snap-type: y mandatory;
  overflow-y: scroll;
  height: 100vh;
}

/* Horizontal scroll showcase */
.gn-horizontal-scroll {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  gap: 20px;
  padding: 20px;
}

.gn-horizontal-scroll::-webkit-scrollbar {
  display: none;
}

.gn-horizontal-scroll > * {
  flex: 0 0 85%;
  scroll-snap-align: center;
}

/* ============================================================
   15. PRICE ANIMATION ON CHANGE
   ============================================================ */

.gn-price-change {
  animation: gn-price-flash 0.5s ease;
}

@keyframes gn-price-flash {
  0%, 100% { color: inherit; }
  50% { color: var(--gn-gold); transform: scale(1.1); }
}

/* ============================================================
   16. AMBIENT GLOW EFFECT
   ============================================================ */

.gn-ambient-glow {
  position: fixed;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(201, 169, 98, 0.15) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
  filter: blur(40px);
  animation: gn-ambient-drift 20s ease-in-out infinite;
}

@keyframes gn-ambient-drift {
  0%, 100% { transform: translate(0, 0); }
  25% { transform: translate(100px, 50px); }
  50% { transform: translate(50px, 100px); }
  75% { transform: translate(-50px, 50px); }
}

/* ============================================================
   17. QUANTITY SELECTOR ENHANCED
   ============================================================ */

.gn-qty-btn:active {
  transform: scale(0.85);
  background: var(--gn-gold);
  color: white;
}

.gn-qty-value {
  transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.gn-qty-value.changed {
  animation: gn-qty-pop 0.3s ease;
}

@keyframes gn-qty-pop {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.3); }
}

/* ============================================================
   18. LIVELYNESS ENHANCEMENTS - MICRO-INTERACTIONS
   ============================================================ */

/* Smooth color transitions on interactive elements */
a, button, [role="button"] {
  transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}

/* Section title entrance animation */
h1, h2, h3 {
  animation: gn-text-fade-in 0.8s ease-out;
}

@keyframes gn-text-fade-in {
  0% {
    opacity: 0;
    transform: translateY(10px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ============================================================
   CARD INSPIRATION LINE
   ============================================================ */
.gn-card-inspiration {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin: 2px 0 4px;
  min-width: 0;
  font-size: 14px;
  line-height: 1.2;
  color: #6B7280;
}

.gn-card-inspiration__label {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: #6B7280;
  white-space: nowrap;
}

.gn-card-inspiration__value {
  flex: 1 1 auto;
  min-width: 0;
  font-weight: 600;
  color: #374151;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.card__information .gn-inventory-stars,
.gn-simple-card__info .gn-inventory-stars,
.gn-product-info .gn-inventory-stars {
  margin: 0 !important;
}

.card__information .price,
.card__information .price__sale,
.gn-simple-card__price,
.gn-product-price {
  flex-wrap: nowrap !important;
  white-space: nowrap;
  gap: 8px !important;
}

.card__information .price,
.gn-simple-card__price,
.gn-product-price {
  margin-top: 0 !important;
}

.card__information .price__sale s,
.card__information .price__sale .price-item--regular,
.gn-simple-card__price--compare,
.gn-product-price-compare {
  white-space: nowrap;
}

/* Unified card price palette + alignment (red / grey / green) */
.card__information .price,
.card__information .price__sale,
.gn-simple-card__price,
.gn-product-price,
.gn-recent-row__price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: nowrap;
}

.card__information .price__sale .price-item--sale,
.card__information .price-item--sale,
.gn-simple-card__price--current,
.gn-product-price-current,
.gn-recent-row__price-current {
  color: #dd5768 !important;
  font-weight: 700;
}

.card__information .price__sale .price-item--regular,
.card__information s.price-item--regular,
.gn-simple-card__price--compare,
.gn-product-price-compare,
.gn-recent-row__price-compare {
  color: #9CA3AF !important;
  font-weight: 400;
  text-decoration: line-through;
}

.price-item--discount,
.gn-card-price-discount {
  color: #16A34A !important;
}

.gn-product-scents--inline {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 2px 0 6px;
  font-size: 14px;
  line-height: 1.25;
  color: #6B7280;
}

.gn-product-scents--inline .gn-product-scents__item {
  position: relative;
  padding-right: 8px;
  white-space: nowrap;
}

.gn-product-scents--inline .gn-product-scents__item::after {
  content: "•";
  position: absolute;
  right: 0;
  top: 0;
  color: #D1D5DB;
}

.gn-product-scents--inline .gn-product-scents__item:last-child::after {
  content: "";
}

.gn-simple-card__info .gn-card-inspiration__label {
  color: rgba(255, 255, 255, 0.7);
}

.gn-simple-card__info .gn-card-inspiration__value {
  color: #F3F4F6;
}

/* Discount percent on cards */
.price-item--discount,
.gn-card-price-discount {
  font-size: 14px !important;
  font-weight: 600;
  color: #16A34A;
  white-space: nowrap;
  line-height: 1.1;
}

.gn-currency-symbol {
  display: inline-block;
  margin-right: -1px;
  line-height: 1;
  vertical-align: baseline;
}

.gn-currency-symbol svg {
  display: block;
  width: 0.76em;
  height: 0.76em;
  fill: currentColor;
}

/* Card title size +2px */
.card__information .card__heading,
.card__information .card__heading a,
.card__information .prd-item-heading,
.card__information .prd-item-heading a {
  font-size: 18px !important;
}

.gn-simple-card__title,
.gn-product-title {
  font-size: 19px !important;
}

.gn-title-size {
  color: currentColor;
  opacity: 0.7;
  font-size: 0.7em;
  font-weight: inherit;
  letter-spacing: 0;
  white-space: nowrap;
}

@media (max-width: 767px) {
  .card__information .card__heading,
  .card__information .card__heading a,
  .card__information .prd-item-heading,
  .card__information .prd-item-heading a {
    font-size: 17px !important;
  }

  .gn-simple-card__title,
  .gn-product-title {
    font-size: 17px !important;
  }
}

/* Card price size -1/-2px */
.card__information .price__sale .price-item--sale,
.card__information .price-item--sale,
.gn-simple-card__price--current,
.gn-product-price-current,
.price-product-detail-big .price__sale .price-item--sale {
  font-size: 16px !important;
}

.card__information .price__sale .price-item--regular,
.card__information s.price-item--regular,
.gn-simple-card__price--compare,
.gn-product-price-compare,
.price-product-detail-big .price__sale .price-item--regular {
  font-size: 14px !important;
}

.price-product-detail-big .price__regular .price-item--regular {
  font-size: 16px !important;
}

.price-product-detail-big .price-item--discount {
  font-size: 14px !important;
}

/* PDP-only: make the entire price line ~1.7x larger */
.template-product .tp-product-detail__right .price__sale .price-item--sale,
.template-product .tp-product-detail__right .price__regular .price-item--regular,
.template-product .tp-product-detail__right .price__sale .price-item--regular,
.template-product .price-product-detail-big .price__sale .price-item--sale,
.template-product .price-product-detail-big .price__regular .price-item--regular,
.template-product .price-product-detail-big .price__sale .price-item--regular,
.template-product .price-product-detail-big .price-item--discount {
  font-size: 2em !important;
}

/* PDP-only: reduce scent row height to avoid large gaps */
.template-product .tp-product-detail__right .gn-product-scents {
  min-height: 0 !important;
  margin-bottom: 6px;
}

@media (max-width: 767px) {
  .template-product.gn-theme .tp-product-detail__right .gn-product-scents,
  .template-product .tp-product-detail__right .gn-product-scents {
    height: 25px !important;
    min-height: 0 !important;
    max-height: 25px !important;
    overflow: hidden;
  }
}

@media (max-width: 767px) {
  .card__information .price__sale .price-item--sale,
  .card__information .price-item--sale,
  .gn-simple-card__price--current,
  .gn-product-price-current,
  .price-product-detail-big .price__sale .price-item--sale,
  .price-product-detail-big .price__regular .price-item--regular {
    font-size: 16px !important;
  }

  .card__information .price__sale .price-item--regular,
  .card__information s.price-item--regular,
  .gn-simple-card__price--compare,
  .gn-product-price-compare,
  .price-product-detail-big .price__sale .price-item--regular,
  .price-product-detail-big .price-item--discount {
    font-size: 14px !important;
  }
}

.gn-simple-card__info .gn-product-scents--inline {
  color: rgba(255, 255, 255, 0.75);
}

.gn-simple-card__info .gn-product-scents--inline .gn-product-scents__item::after {
  color: rgba(255, 255, 255, 0.3);
}

/* ============================================================
   INSPIRATION HIGHLIGHT (Product page)
   ============================================================ */
.gn-inspiration-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 6px;
  padding: 8px 10px;
  border-radius: 10px;
  background: #f7f8fa;
  border: 1px solid #e6e8ec;
}

.gn-inspiration-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #374151;
  white-space: nowrap;
}

.gn-inspiration-values {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.gn-inspiration-chip {
  background: #1f2937;
  color: #ffffff;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
}

\n/* ==== END gn-premium-enhancements.css ==== */\n
\n/* ==== BEGIN gn-vitality.css ==== */\n
/* ============================================================
   GN VITALITY - "ALIVE" ANIMATIONS
   ============================================================ */

/* 1. SCROLL REVEALS */
.gn-reveal-item {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1),
        transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
    will-change: opacity, transform;
}

.gn-reveal-active {
    opacity: 1 !important;
    transform: translateY(0) !important;
    transition-delay: var(--reveal-delay, 0ms);
}

/* 2. MAGNETIC BUTTONS */
/* Smooth return to center when mouse leaves */
.tp-btn,
.btn,
.button,
.gn-magnetic {
    transition: transform 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94),
        background 0.3s ease,
        color 0.3s ease,
        box-shadow 0.3s ease;
    will-change: transform;
}

/* Optional: text shimmer for special headings */
@keyframes gn-shimmer {
    0% {
        background-position: -200% center;
    }

    100% {
        background-position: 200% center;
    }
}

.gn-text-shimmer {
    background: linear-gradient(90deg,
            var(--gn-text-dark) 0%,
            var(--gn-text-light) 50%,
            var(--gn-text-dark) 100%);
    background-size: 200% auto;
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    animation: gn-shimmer 3s linear infinite;
}

/* Badge animations removed - use wiggle animation from gn-simple-card.css instead */

/* Ensure Swiper doesn't collapse */
.gn-product-swiper,
.gn-card-swiper {
    min-height: 200px;
}

/* Recently Viewed & Recommendations Overrides */
.gn-recently-viewed-container,
.product-recommendations {
    background: transparent;
    padding-top: 40px;
    padding-bottom: 40px;
}

/* Heading styles handled in gn-simple-card.css Section 9 */

/* Fix grid layouts interfering */
.product-recommendations .grid__item {
    max-width: 100%;
}

/* Loading and Error States */
.product-recommendations__loading,
.product-recommendations__error {
    text-align: center;
    padding: 60px 20px;
    min-height: 200px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.product-recommendations__loading p,
.product-recommendations__error p {
    color: white;
    font-size: 16px;
    margin-top: 20px;
}

/* Loading spinner removed - using default theme loader */

.product-recommendations__error {
    background: rgba(220, 38, 38, 0.1);
    border-radius: 8px;
}

.product-recommendations__error p {
    color: #FCA5A5;
}

/* ============================================================
   10. INTERACTIVE ELEMENT GLOW
   ============================================================ */

.gn-quick-add,
.quick-add__submit,
.gn-wishlist-btn {
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.gn-quick-add:hover,
.quick-add__submit:hover,
.gn-wishlist-btn:hover {
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
    transform: translateY(-2px);
}

.gn-quick-add:active,
.quick-add__submit:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

/* ============================================================
   12. STORY RING GLOW ENHANCEMENT
   ============================================================ */

.gn-story-ring {
    box-shadow: 0 0 0 2px #1A1A1A, 0 0 16px rgba(201, 169, 98, 0.4);
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.gn-story-item:hover .gn-story-ring {
    box-shadow: 0 0 0 2px #1A1A1A, 0 0 24px rgba(201, 169, 98, 0.7);
    transform: scale(1.08);
}

/* ============================================================
   13. STRIKETHROUGH PRICES - GREY COLOR
   ============================================================ */

/* ALL PRICE STYLING REMOVED - Handled by gn-simple-card.css Section 4 */
/* See gn-simple-card.css lines 333-364 for complete price styling */

\n/* ==== END gn-vitality.css ==== */\n