/* ================================================================
   Purfumely — UI Enhancements v4  |  css/enhancements.css
   ================================================================ */

/* ── PRELOADER ────────────────────────────────────────────────── */
#preloader {
  position: fixed; inset: 0; z-index: 9999;
  background: #0A0A0A;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
/* Spray preloader has no visible HTML elements — canvas does everything */
#pl-main-canvas { position:absolute;inset:0;width:100%;height:100%;display:block; }

/* Simple preloader (non-home pages) */
.pl-content { text-align:center;position:relative;z-index:2; }
.pl-logo {
  font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:52px;color:#D4AF37;letter-spacing:2px;margin-bottom:8px;
  animation:plLogoPulse 2s ease-in-out infinite;
}
@keyframes plLogoPulse {
  0%,100%{text-shadow:0 0 20px rgba(212,175,55,0.3);}
  50%{text-shadow:0 0 50px rgba(212,175,55,0.9),0 0 100px rgba(212,175,55,0.3);}
}
.pl-tagline{font-size:11px;text-transform:uppercase;letter-spacing:4px;color:#86868B;margin-bottom:40px;}
.pl-bar-wrap{width:240px;height:2px;background:rgba(212,175,55,0.12);border-radius:2px;margin:0 auto 12px;overflow:hidden;}
.pl-bar{width:100%;height:100%;}
.pl-fill{height:100%;width:0%;background:linear-gradient(90deg,#8A6010,#D4AF37,#F5E27A,#D4AF37);background-size:200%;border-radius:2px;transition:width 0.1s linear;animation:plShimmer 1.5s linear infinite;}
@keyframes plShimmer{0%{background-position:200% 0;}100%{background-position:-200% 0;}}
.pl-percent{font-size:12px;color:rgba(212,175,55,0.45);letter-spacing:2px;}
.pl-particles{position:absolute;inset:0;pointer-events:none;overflow:hidden;}
.pl-p{position:absolute;border-radius:50%;background:#D4AF37;animation:plFloat linear infinite;}
@keyframes plFloat{0%,100%{transform:translateY(0) scale(1);opacity:var(--op,.4);}50%{transform:translateY(-28px) scale(1.2);opacity:calc(var(--op,.4)*1.4);}}

/* ── SCROLL PROGRESS ──────────────────────────────────────────── */
#scroll-progress{position:fixed;top:0;left:0;height:2px;width:0;background:linear-gradient(90deg,#8A6010,#D4AF37,#F5E27A);z-index:9000;box-shadow:0 0 8px rgba(212,175,55,0.7);transition:width 0.05s linear;}

/* ── CUSTOM CURSOR ────────────────────────────────────────────── */
#cursor-dot{position:fixed;width:8px;height:8px;background:#D4AF37;border-radius:50%;pointer-events:none;z-index:9998;box-shadow:0 0 10px rgba(212,175,55,0.9);mix-blend-mode:difference;}
#cursor-ring{position:fixed;width:40px;height:40px;border:1.5px solid rgba(212,175,55,0.55);border-radius:50%;pointer-events:none;z-index:9997;transition:border-color 0.3s,width 0.3s,height 0.3s;}
#cursor-dot.cursor-hover{transform:scale(3)!important;background:rgba(212,175,55,0.45);}
#cursor-ring.cursor-hover{width:64px;height:64px;margin:-12px;border-color:rgba(212,175,55,0.85);}
.cursor-spark{position:fixed;width:4px;height:4px;background:#D4AF37;border-radius:50%;pointer-events:none;z-index:9996;animation:sparkFly 0.6s ease-out forwards;transform:translate(-50%,-50%);}
@keyframes sparkFly{0%{transform:translate(-50%,-50%) translate(0,0) scale(1);opacity:1;}100%{transform:translate(-50%,-50%) translate(var(--tx),var(--ty)) scale(0);opacity:0;}}
@media(pointer:coarse){#cursor-dot,#cursor-ring{display:none;}}

/* ── NAV SCROLL STATE ─────────────────────────────────────────── */
.nav.nav-scrolled{
  background:rgba(10,10,10,0.93)!important;
  backdrop-filter:blur(24px)!important;
  -webkit-backdrop-filter:blur(24px)!important;
  box-shadow:0 4px 40px rgba(0,0,0,0.55),0 1px 0 rgba(212,175,55,0.12)!important;
}

/* ── HERO V2 ──────────────────────────────────────────────────── */
.hero-v2{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;background:radial-gradient(ellipse at 30% 50%,#1a1208 0%,#0A0A0A 65%);}
#hero-video,#hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;opacity:0;transition:opacity 1s ease;}
#hero-particles{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;}
.hero-overlay-v2{position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(10,10,10,0.5) 0%,rgba(10,10,10,0.15) 40%,rgba(10,10,10,0.6) 80%,rgba(10,10,10,0.97) 100%);}
.hero-content-v2{position:relative;z-index:3;padding:0 24px;max-width:820px;}

/* Hero text reveal */
.hero-eyebrow,.hero-h1,.hero-sub,.hero-ctas,.hero-proof,.hero-stats{opacity:0;animation:heroReveal 0.9s cubic-bezier(0.16,1,0.3,1) forwards;animation-delay:var(--d,0s);animation-play-state:paused;}
@keyframes heroReveal{0%{opacity:0;transform:translateY(28px);}100%{opacity:1;transform:translateY(0);}}

/* Gold shimmer text */
.gold-shimmer-text{background:linear-gradient(90deg,#8A6010 0%,#D4AF37 25%,#F5E27A 45%,#D4AF37 65%,#8A6010 100%);background-size:200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmerSlide 3s linear infinite;}
@keyframes shimmerSlide{0%{background-position:200% 0;}100%{background-position:-200% 0;}}

/* Hero stats */
.hero-stats{display:flex;align-items:center;justify-content:center;margin-top:32px;background:rgba(10,10,10,0.65);border:1px solid rgba(212,175,55,0.2);border-radius:50px;padding:16px 32px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);width:fit-content;margin-left:auto;margin-right:auto;}
.hstat{text-align:center;padding:0 24px;display:flex;flex-direction:column;align-items:center;}
.hstat-num{font-family:'Cormorant Garamond',serif;font-size:32px;font-weight:600;color:#D4AF37;line-height:1;display:inline-block;}
.hstat-suffix{font-family:'Cormorant Garamond',serif;font-size:18px;color:#D4AF37;display:inline-block;line-height:1;vertical-align:top;margin-top:5px;}
.hstat-label{font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:#86868B;margin-top:4px;}
.hstat-sep{width:1px;height:38px;background:rgba(212,175,55,0.2);flex-shrink:0;}

/* Scroll cue */
.scroll-cue{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);z-index:3;display:flex;flex-direction:column;align-items:center;gap:8px;color:rgba(212,175,55,0.5);font-size:10px;text-transform:uppercase;letter-spacing:3px;animation:scrollBob 2s ease-in-out infinite;}
.scroll-cue-line{width:1px;height:38px;background:linear-gradient(180deg,transparent,rgba(212,175,55,0.6));}
@keyframes scrollBob{0%,100%{transform:translateX(-50%) translateY(0);}50%{transform:translateX(-50%) translateY(6px);}}

/* ── SECTION V2 HEADERS ───────────────────────────────────────── */
.section-v2{padding:80px 0;}
.section-head-v2{display:flex;justify-content:flex-start;align-items:center;gap:16px;margin-bottom:40px;flex-wrap:wrap;}
.section-title-v2{font-family:'Cormorant Garamond',serif;font-size:36px;font-weight:500;color:#D4AF37;}
.section-ornament{color:rgba(212,175,55,0.4);font-size:14px;flex-shrink:0;}

/* ── COUNTDOWN BOXES ──────────────────────────────────────────── */
.countdown-v2{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.cd-box{background:#151515;border:1px solid rgba(212,175,55,0.3);border-radius:10px;padding:10px 16px;text-align:center;min-width:60px;position:relative;overflow:hidden;}
.cd-box.cd-flip{animation:cdFlip 0.3s ease;}
@keyframes cdFlip{0%{transform:scaleY(1);}50%{transform:scaleY(0.82);background:rgba(212,175,55,0.1);}100%{transform:scaleY(1);}}
.cd-box span{display:block;font-family:'Cormorant Garamond',serif;font-size:28px;font-weight:600;color:#E03C31;line-height:1;}
.cd-label{font-size:8px;text-transform:uppercase;letter-spacing:1.5px;color:#86868B;margin-top:4px;}
.cd-colon{color:#E03C31;font-size:24px;font-weight:700;line-height:1;animation:cdBlink 1s step-end infinite;margin-bottom:12px;}
@keyframes cdBlink{0%,100%{opacity:1;}50%{opacity:0.3;}}

/* ── AI BANNER V2 ─────────────────────────────────────────────── */
.ai-banner-v2{position:relative;background:#151515;border:1px solid rgba(212,175,55,0.2);border-radius:24px;padding:64px;display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;overflow:hidden;}
.ai-glow-orb{position:absolute;border-radius:50%;pointer-events:none;}
.ai-glow-1{width:400px;height:400px;top:-150px;right:-100px;background:radial-gradient(circle,rgba(212,175,55,0.07) 0%,transparent 70%);}
.ai-glow-2{width:300px;height:300px;bottom:-100px;left:10%;background:radial-gradient(circle,rgba(212,175,55,0.05) 0%,transparent 70%);}
.ai-eyebrow{display:inline-block;font-size:11px;color:#D4AF37;text-transform:uppercase;letter-spacing:3px;margin-bottom:20px;background:rgba(212,175,55,0.08);border:1px solid rgba(212,175,55,0.2);padding:6px 16px;border-radius:20px;}
.ai-heading{font-family:'Cormorant Garamond',serif;font-size:44px;font-weight:500;color:#FBFBFD;line-height:1.1;margin-bottom:20px;}
.ai-desc{color:#D2D2D7;font-size:16px;line-height:1.7;margin-bottom:28px;}
.ai-right{display:flex;flex-direction:column;align-items:center;gap:32px;}
.ai-sphere{position:relative;width:160px;height:160px;display:flex;align-items:center;justify-content:center;}
.ai-sphere-core{font-size:40px;color:#D4AF37;z-index:2;animation:aiCorePulse 3s ease-in-out infinite;text-shadow:0 0 30px rgba(212,175,55,0.8);}
@keyframes aiCorePulse{0%,100%{text-shadow:0 0 20px rgba(212,175,55,0.5);transform:scale(1);}50%{text-shadow:0 0 60px rgba(212,175,55,1),0 0 120px rgba(212,175,55,0.3);transform:scale(1.12);}}
.ai-ring{position:absolute;border-radius:50%;border:1px solid rgba(212,175,55,0.3);animation:aiRingOrbit linear infinite;}
.ai-ring-1{width:100px;height:100px;top:30px;left:30px;animation-duration:6s;}
.ai-ring-2{width:140px;height:140px;top:10px;left:10px;animation-duration:10s;animation-direction:reverse;opacity:0.5;}
.ai-ring-3{width:160px;height:160px;top:0;left:0;animation-duration:14s;opacity:0.2;}
@keyframes aiRingOrbit{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
.ai-steps{display:flex;flex-direction:column;gap:10px;width:100%;}
.ai-step{display:flex;align-items:center;gap:12px;font-size:14px;color:#D2D2D7;padding:10px 16px;background:rgba(212,175,55,0.04);border:1px solid rgba(212,175,55,0.1);border-radius:10px;transition:all 0.3s;}
.ai-step:hover{background:rgba(212,175,55,0.09);border-color:rgba(212,175,55,0.3);color:#FBFBFD;}
.ai-step-num{font-family:'Cormorant Garamond',serif;font-size:18px;font-weight:600;color:#D4AF37;min-width:28px;}
@media(max-width:768px){.ai-banner-v2{grid-template-columns:1fr;padding:40px 24px;gap:32px;text-align:center;} .ai-heading{font-size:32px;} .ai-sphere{margin:0 auto;}}

/* ── STATS STRIP ──────────────────────────────────────────────── */
.stats-strip{position:relative;padding:64px 0;background:#151515;border-top:1px solid rgba(212,175,55,0.1);border-bottom:1px solid rgba(212,175,55,0.1);overflow:hidden;}
.stats-strip-glow{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(212,175,55,0.05) 0%,transparent 70%);pointer-events:none;}
.stats-grid{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;}
.stat-item{text-align:center;padding:0 48px;}
.stat-number{display:flex;align-items:baseline;justify-content:center;gap:2px;}
.stat-count{font-family:'Cormorant Garamond',serif;font-size:64px;font-weight:500;background:linear-gradient(135deg,#8A6010,#D4AF37,#F5E27A,#D4AF37);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1;}
.stat-unit{font-family:'Cormorant Garamond',serif;font-size:36px;-webkit-text-fill-color:rgba(212,175,55,0.7);}
.stat-label{color:#86868B;font-size:12px;text-transform:uppercase;letter-spacing:1.5px;margin-top:8px;line-height:1.5;}
.stat-div{width:1px;height:60px;background:rgba(212,175,55,0.2);flex-shrink:0;}
@media(max-width:768px){.stats-grid{gap:32px;} .stat-item{padding:0 20px;} .stat-count{font-size:48px;} .stat-div{display:none;}}

/* ── TRUST CARD V2 ────────────────────────────────────────────── */
.trust-v2{position:relative;overflow:hidden;}
.trust-v2::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(212,175,55,0.06),transparent 60%);opacity:0;transition:opacity 0.4s;}
.trust-v2:hover::before{opacity:1;}
.trust-card-shine{position:absolute;top:-100%;left:-100%;width:60%;height:200%;background:linear-gradient(105deg,transparent,rgba(212,175,55,0.08),transparent);transform:skewX(-20deg);transition:left 0.7s ease;pointer-events:none;}
.trust-v2:hover .trust-card-shine{left:200%;}

/* ── NEWSLETTER V2 ────────────────────────────────────────────── */
.newsletter-v2{position:relative;overflow:hidden;padding:80px 0;background:#151515;}
.nl-glow-left,.nl-glow-right{position:absolute;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,rgba(212,175,55,0.07) 0%,transparent 70%);pointer-events:none;top:50%;transform:translateY(-50%);}
.nl-glow-left{left:-200px;} .nl-glow-right{right:-200px;}
.nl-ornament{font-size:32px;color:rgba(212,175,55,0.4);margin-bottom:16px;animation:ornamentSpin 8s linear infinite;}
@keyframes ornamentSpin{0%{transform:rotate(0deg)scale(1);}50%{transform:rotate(180deg)scale(1.2);}100%{transform:rotate(360deg)scale(1);}}
.nl-badges{display:flex;gap:24px;justify-content:center;flex-wrap:wrap;margin-top:20px;font-size:12px;color:#86868B;}

/* ── WHATSAPP FLOAT ───────────────────────────────────────────── */
.wa-float{position:fixed;bottom:28px;right:28px;z-index:500;display:flex;align-items:center;gap:10px;background:#25D366;color:#fff;padding:14px 20px;border-radius:50px;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:1px;text-decoration:none;box-shadow:0 4px 24px rgba(37,211,102,0.4);transition:all 0.3s ease;overflow:hidden;}
.wa-float:hover{background:#1ebe57;transform:translateY(-3px);box-shadow:0 8px 32px rgba(37,211,102,0.5);}
.wa-label{font-family:'Inter',sans-serif;}
.wa-pulse-ring{position:absolute;inset:-2px;border:2px solid #25D366;border-radius:50px;animation:waPulse 2.5s ease-out infinite;pointer-events:none;}
@keyframes waPulse{0%{transform:scale(1);opacity:0.7;}100%{transform:scale(1.25);opacity:0;}}
@media(max-width:768px){.wa-float{bottom:72px;right:16px;padding:14px;border-radius:50%;} .wa-label{display:none;}}

/* ── SCROLL REVEAL — SCOPED TO [data-reveal] ONLY ─────────────── */
[data-reveal]{opacity:0;transform:translateY(36px);transition:opacity 0.75s cubic-bezier(0.16,1,0.3,1),transform 0.75s cubic-bezier(0.16,1,0.3,1);}
[data-reveal].revealed{opacity:1;transform:translateY(0);}

/* Cards inside [data-reveal] start hidden — revealed by IntersectionObserver */
[data-reveal] .card,
[data-reveal] .trust-card,
[data-reveal] .ai-step {
  opacity:0;transform:translateY(20px);
  transition:opacity 0.55s ease,transform 0.55s ease,border-color 0.3s ease!important;
}
[data-reveal] .card.card-revealed,
[data-reveal] .trust-card.card-revealed,
[data-reveal] .ai-step.card-revealed {
  opacity:1;transform:translateY(0);
}

/* Cards OUTSIDE [data-reveal] — fully visible by default */
.card,.trust-card{transition:transform 0.3s ease,border-color 0.3s ease,box-shadow 0.3s ease!important;}

/* ── CARD HOVER GLOW ──────────────────────────────────────────── */
.card:hover{box-shadow:0 0 0 1px rgba(212,175,55,0.55),0 8px 40px rgba(212,175,55,0.1),0 2px 8px rgba(0,0,0,0.5)!important;}
.card:hover .bottle-svg{filter:drop-shadow(0 0 28px rgba(212,175,55,0.35))!important;}

/* ── MAGNETIC BUTTONS ─────────────────────────────────────────── */
/* transform is handled exclusively by JS RAF lerp — no CSS transition conflict */
.btn-mag{transition:background 0.25s ease,box-shadow 0.25s ease,color 0.25s ease,border-color 0.25s ease!important;}
.btn-mag:hover{box-shadow:0 8px 32px rgba(212,175,55,0.28);}
.btn.btn-primary.btn-mag:hover{box-shadow:0 8px 32px rgba(212,175,55,0.38);}

/* ── LIQUID FILL EFFECT ────────────────────────────────────────── */
.btn-mag{position:relative;overflow:hidden;}
.btn-mag .btn-liquid{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(135deg,rgba(212,175,55,0.18) 0%,rgba(212,175,55,0) 60%);
  transform:translateY(100%);
  transition:transform 0.55s cubic-bezier(0.16,1,0.3,1);
  border-radius:inherit;
}
.btn-mag:hover .btn-liquid{transform:translateY(0);}
.btn.btn-secondary.btn-mag .btn-liquid{background:linear-gradient(135deg,rgba(212,175,55,0.22) 0%,rgba(212,175,55,0.04) 60%);}

/* ── HERO CLICK RIPPLE ─────────────────────────────────────────── */
.hero-click-ripple{
  position:fixed;border-radius:50%;pointer-events:none;z-index:10;
  border:1.5px solid rgba(212,175,55,0.6);
  transform:scale(0);opacity:1;
  animation:heroRippleOut 1.4s cubic-bezier(0.16,1,0.3,1) forwards;
}
@keyframes heroRippleOut{
  0%{transform:scale(0);opacity:0.8;}
  100%{transform:scale(1);opacity:0;}
}

/* ── FLOATING SCENT WORDS ──────────────────────────────────────── */
.scent-word-float{
  position:absolute;pointer-events:none;z-index:1;
  font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:300;
  font-size:clamp(11px,1.4vw,18px);letter-spacing:0.12em;
  color:rgba(212,175,55,0);
  text-transform:uppercase;white-space:nowrap;
  animation:scentWordRise var(--dur,6s) ease-out forwards;
}
@keyframes scentWordRise{
  0%  {transform:translateY(0) scale(0.85);color:rgba(212,175,55,0);}
  15% {color:rgba(212,175,55,0.14);}
  75% {color:rgba(212,175,55,0.08);}
  100%{transform:translateY(-140px) scale(1.1);color:rgba(212,175,55,0);}
}

/* ── SECTION PARALLAX LAYERS ───────────────────────────────────── */
.parallax-title{will-change:transform;}
.hero-content-v2{will-change:transform;}

/* ── HERO PROOF PULSE ──────────────────────────────────────────── */
.hero-proof{animation:proofPulse 3.5s ease-in-out infinite;}
@keyframes proofPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(212,175,55,0);}
  50%{box-shadow:0 0 0 6px rgba(212,175,55,0.08);}
}

/* ── SECTION TITLE SHIMMER ─────────────────────────────────────── */
.section-title-v2{background:linear-gradient(90deg,#D4AF37 0%,#F5E27A 45%,#D4AF37 55%,#D4AF37 100%);
  background-size:300% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;animation:titleShimmer 5s linear infinite;}
@keyframes titleShimmer{0%{background-position:200% center;}100%{background-position:-100% center;}}

/* ── ANNOUNCEMENT BAR GLOW ──────────────────────────────────────── */
.announce{position:relative;overflow:hidden;}
.announce::before{content:'';position:absolute;top:0;left:-100%;width:60%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(212,175,55,0.12),transparent);
  animation:announceSweep 4s linear infinite;pointer-events:none;z-index:1;}
@keyframes announceSweep{0%{left:-60%;}100%{left:110%;}}

/* ── SHOP HERO / PAGE HERO ────────────────────────────────────── */
.page-hero{position:relative;padding:72px 0 48px;overflow:hidden;background:radial-gradient(ellipse at 60% 50%,#1a1208 0%,#0A0A0A 70%);}
.page-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 30% 50%,rgba(212,175,55,0.07) 0%,transparent 55%);pointer-events:none;}
.page-hero-inner{position:relative;z-index:1;}
.page-hero h1{font-family:'Cormorant Garamond',serif;font-size:clamp(36px,5vw,60px);color:#D4AF37;margin-top:12px;line-height:1.1;}
.page-hero p{color:#D2D2D7;margin-top:10px;font-size:16px;max-width:520px;}

/* ── MOBILE HERO ──────────────────────────────────────────────── */
@media(max-width:768px){
  .hero-v2{min-height:100svh;}
  .hero-stats{padding:12px 20px;}
  .hstat{padding:0 14px;} .hstat-num{font-size:24px;} .hstat-label{font-size:9px;}
  .section-title-v2{font-size:28px;}
  .countdown-v2{gap:6px;} .cd-box{min-width:48px;padding:8px 12px;} .cd-box span{font-size:22px;}
  .scroll-cue{display:none;}
}

/* Hero image fallback (same as video) */
#hero-image {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; z-index: 0;
  opacity: 0; transition: opacity 1s ease;
}

/* ================================================================
   Purfumely — Enhancements v6 ADDITIONS
   ================================================================ */

/* ── FIX: pl-bg for simple preloader ─────────────────────────── */
.pl-bg{position:absolute;inset:0;background:#0A0A0A;}

/* ── GRAIN TEXTURE OVERLAY (luxury feel) ────────────────────── */
body::before{
  content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  background-repeat:repeat;background-size:128px 128px;opacity:0.4;
}

/* ── 3D CARD TILT ─────────────────────────────────────────────── */
.card{transform-style:preserve-3d;will-change:transform;}
.card .bottle-svg{transition:transform 0.18s ease,filter 0.3s ease;will-change:transform;}
.card-hovered{z-index:10 !important;}

/* ── BOTTLE SPRAY SPARK PARTICLES ────────────────────────────── */
.bottle-spark{
  position:fixed;pointer-events:none;z-index:9995;
  border-radius:50%;transform:translate(-50%,-50%);
  animation:bottleSpray 0.65s ease-out forwards;
}
@keyframes bottleSpray{
  0%{transform:translate(-50%,-50%) translate(0,0) scale(1);opacity:0.9;}
  100%{transform:translate(-50%,-50%) translate(var(--bsvx),var(--bsvy)) scale(0);opacity:0;}
}

/* ── BUTTON RIPPLE ────────────────────────────────────────────── */
.btn-ripple{
  position:absolute;border-radius:50%;
  background:rgba(255,255,255,0.22);
  transform:scale(0);animation:rippleOut 0.65s linear forwards;
  pointer-events:none;
}
@keyframes rippleOut{to{transform:scale(1);opacity:0;}}

/* ── BACK TO TOP BUTTON ───────────────────────────────────────── */
.back-to-top{
  position:fixed;bottom:32px;right:32px;z-index:499;
  width:46px;height:46px;border-radius:50%;
  background:var(--charcoal);border:1px solid var(--gold-20);
  color:var(--gold);font-size:18px;font-weight:600;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  opacity:0;transform:translateY(16px);
  transition:opacity 0.3s ease,transform 0.3s ease,border-color 0.2s,box-shadow 0.2s;
  pointer-events:none;
  box-shadow:0 4px 20px rgba(0,0,0,0.4);
}
.back-to-top.btt-visible{opacity:1;transform:translateY(0);pointer-events:auto;}
.back-to-top:hover{border-color:var(--gold);box-shadow:0 0 20px rgba(212,175,55,0.25);}
@media(max-width:768px){.back-to-top{bottom:76px;right:16px;width:40px;height:40px;font-size:16px;}}

/* ── SECTION TITLE LETTER ANIMATION ──────────────────────────── */
.lt{
  display:inline-block;opacity:0;transform:translateY(16px);
  animation:ltReveal 0.5s cubic-bezier(0.16,1,0.3,1) forwards;
}
@keyframes ltReveal{to{opacity:1;transform:translateY(0);}}
.section-title-v2:not(.lt-active){} /* before split */

/* ── PAGE LEAVE TRANSITION ────────────────────────────────────── */
body{transition:opacity 0.3s ease;}
body.page-leaving{opacity:0;}

/* ── CARD REVEAL: blur-in ─────────────────────────────────────── */
[data-reveal] .card,
[data-reveal] .trust-card,
[data-reveal] .ai-step,
[data-reveal] .reward-card{
  opacity:0;transform:translateY(24px);
  filter:blur(4px);
  transition:opacity 0.6s ease,transform 0.6s ease,filter 0.6s ease,border-color 0.3s ease !important;
}
[data-reveal] .card.card-revealed,
[data-reveal] .trust-card.card-revealed,
[data-reveal] .ai-step.card-revealed,
[data-reveal] .reward-card.card-revealed{
  opacity:1;transform:translateY(0);filter:blur(0);
}

/* ── CARD WISHLIST PULSE ──────────────────────────────────────── */
.wishlist-icon.active{
  animation:wishPulse 0.4s ease;
  color:var(--gold) !important;
}
@keyframes wishPulse{0%{transform:scale(1);}50%{transform:scale(1.4);}100%{transform:scale(1);}}

/* ── IMPROVED NAV ACTIVE GLOW ─────────────────────────────────── */
.nav-links a.active{color:var(--gold);}
.nav-links a.active::after{width:100%;}
.nav-links a:hover{text-shadow:0 0 18px rgba(212,175,55,0.4);}

/* ── LOGO HOVER GLOW ──────────────────────────────────────────── */
.logo:hover{text-shadow:0 0 28px rgba(212,175,55,0.5);transition:text-shadow 0.3s ease;}

/* ── ADD-TO-CART BUTTON SUCCESS STATE ────────────────────────── */
.add-cart-btn.cart-added{
  background:var(--green) !important;
  color:#fff !important;
  border-color:var(--green) !important;
  animation:cartBounce 0.35s cubic-bezier(0.16,1,0.3,1);
}
@keyframes cartBounce{0%{transform:scale(1);}50%{transform:scale(1.08);}100%{transform:scale(1);}}

/* ── TOAST GLASSMORPHISM ──────────────────────────────────────── */
.toast{
  background:rgba(21,21,21,0.92) !important;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border:1px solid rgba(212,175,55,0.4) !important;
  box-shadow:0 8px 40px rgba(0,0,0,0.55),0 0 0 1px rgba(212,175,55,0.06) !important;
}

/* ── STICKY NAV TRANSITION ────────────────────────────────────── */
.nav{transition:background 0.4s ease,box-shadow 0.4s ease;}

/* ── PILL ACTIVE TRANSITION ──────────────────────────────────── */
.pill-toggle,.filter-pill{transition:all 0.22s cubic-bezier(0.16,1,0.3,1);}
.pill-toggle.active{box-shadow:0 0 12px rgba(212,175,55,0.3);}
.filter-pill.active{box-shadow:0 0 14px rgba(212,175,55,0.3);}

/* ── SECTION SEPARATOR ORNAMENT ──────────────────────────────── */
.section-sep{
  display:flex;align-items:center;gap:16px;
  margin:64px 0;opacity:0.35;
}
.section-sep::before,.section-sep::after{
  content:'';flex:1;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}
.section-sep-icon{color:var(--gold);font-size:16px;flex-shrink:0;}

/* ── PRODUCT CARD IMAGE SHIMMER ──────────────────────────────── */
.card-img::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(105deg,transparent 30%,rgba(212,175,55,0.06) 50%,transparent 70%);
  transform:translateX(-100%);transition:transform 0s;
}
.card:hover .card-img::after{
  transform:translateX(100%);
  transition:transform 0.8s ease;
}

/* ── SCROLL BAR STYLING ──────────────────────────────────────── */
::-webkit-scrollbar{width:6px;height:6px;}
::-webkit-scrollbar-track{background:#0A0A0A;}
::-webkit-scrollbar-thumb{background:rgba(212,175,55,0.35);border-radius:3px;}
::-webkit-scrollbar-thumb:hover{background:rgba(212,175,55,0.6);}

/* ── MOBILE DRAWER BACKDROP ───────────────────────────────────── */
.mobile-drawer{box-shadow:-8px 0 40px rgba(0,0,0,0.7);}

/* ── FORM INPUT FOCUS GLOW ────────────────────────────────────── */
input:focus,textarea:focus,select:focus{
  box-shadow:0 0 0 3px rgba(212,175,55,0.1) !important;
}

/* ── HERO CTA GLOW ───────────────────────────────────────────── */
.btn-primary{box-shadow:0 4px 20px rgba(212,175,55,0.2);}
.btn-primary:hover{box-shadow:0 8px 32px rgba(212,175,55,0.38) !important;}

/* ── FAQ ITEM HOVER ──────────────────────────────────────────── */
.faq-item{transition:border-color 0.25s ease;}
.faq-item:hover{border-color:rgba(212,175,55,0.4);}
.faq-item.open{border-color:rgba(212,175,55,0.5);}

/* ── CHECKOUT/CART THUMB GLOW ─────────────────────────────────── */
.cart-thumb:hover,.pdp-thumb:hover{border-color:var(--gold) !important;box-shadow:0 0 14px rgba(212,175,55,0.2);}

/* ── SELECT ELEMENT ───────────────────────────────────────────── */
select{appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M0 0l6 8 6-8z' fill='%23D4AF37'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;padding-right:36px !important;}

/* ── PRICE TAG ANIMATION ─────────────────────────────────────── */
.price-new{transition:color 0.3s ease;}

/* ================================================================
   PURFUMELY — EXTRAORDINARY v8 CSS
   Things no other perfume website has done.
   ================================================================ */

/* ── NAV smart-hide transition ───────────────────────────────── */
.nav{transition:transform 0.4s cubic-bezier(0.16,1,0.3,1),background 0.4s ease,box-shadow 0.4s ease !important;}

/* ── CURSOR TRAIL ────────────────────────────────────────────── */
.cursor-trail{
  position:fixed;border-radius:50%;
  background:radial-gradient(circle,rgba(212,175,55,0.7),rgba(212,175,55,0));
  pointer-events:none;z-index:9996;
  will-change:transform;
}
@media(pointer:coarse){.cursor-trail{display:none;}}

/* ── AMBIENT GLOW that follows cursor ────────────────────────── */
#ambient-glow{
  position:fixed;width:600px;height:600px;border-radius:50%;
  background:radial-gradient(circle,rgba(212,175,55,0.045) 0%,transparent 70%);
  pointer-events:none;z-index:0;will-change:transform;
  transition:transform 0.1s linear;
  overflow:hidden;
  max-width:100vw;
}
@media(pointer:coarse){#ambient-glow{display:none;}}

/* ── LIQUID MORPHING ORB ─────────────────────────────────────── */
#liquid-orb{
  position:fixed;width:min(560px,100vw);height:min(560px,100vh);
  top:50%;left:50%;transform:translate(-50%,-50%);
  background:radial-gradient(ellipse at 40% 35%,rgba(212,175,55,0.04) 0%,rgba(180,120,20,0.02) 40%,transparent 70%);
  pointer-events:none;z-index:0;
  border-radius:60% 40% 70% 30% / 30% 60% 40% 70%;
  filter:blur(40px);
  overflow:hidden;
}

/* ── AMBIENT CANVAS ──────────────────────────────────────────── */
#ambient-particles{mix-blend-mode:screen;}

/* ── CARD SPOTLIGHT on hover ─────────────────────────────────── */
.card{
  --spotlight-x:50%;--spotlight-y:50%;
  position:relative;overflow:hidden;
}
.card::before{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(circle 120px at var(--spotlight-x) var(--spotlight-y),rgba(212,175,55,0.09),transparent 80%);
  opacity:0;transition:opacity 0.3s ease;border-radius:inherit;
}
.card.card-hovered::before{opacity:1;}

/* ── CARD SHIMMER sweep ──────────────────────────────────────── */
.card-img{position:relative;overflow:hidden;}
.card-img::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 30%,rgba(212,175,55,0.07) 50%,transparent 70%);transform:translateX(-110%);}
.card:hover .card-img::after{transform:translateX(110%);transition:transform 0.9s ease;}

/* ── CARD 3D ──────────────────────────────────────────────────── */
.card{transform-style:preserve-3d;will-change:transform;transition:box-shadow 0.3s ease;}
.card .bottle-svg,.card .product-photo{transition:transform 0.4s cubic-bezier(0.16,1,0.3,1),filter 0.4s ease !important;}
.card.card-hovered .bottle-svg,.card.card-hovered .product-photo{filter:drop-shadow(0 20px 28px rgba(212,175,55,0.35));}

/* ── NAV TEXT SCRAMBLE — keep width stable ───────────────────── */
.nav-links a{display:inline-block;min-width:max-content;}

/* ── LETTER ANIMATION ────────────────────────────────────────── */
.lt{display:inline-block;opacity:0;transform:translateY(18px);animation:ltReveal 0.55s cubic-bezier(0.16,1,0.3,1) forwards;}
@keyframes ltReveal{to{opacity:1;transform:translateY(0);}}

/* ── SCROLL REVEAL blur-in ───────────────────────────────────── */
[data-reveal] .card,[data-reveal] .trust-card,[data-reveal] .ai-step,[data-reveal] .reward-card,[data-reveal] .stat-item{
  opacity:0;transform:translateY(30px);filter:blur(6px);
  transition:opacity 0.65s ease,transform 0.65s ease,filter 0.65s ease !important;
}
[data-reveal] .card.card-revealed,[data-reveal] .trust-card.card-revealed,[data-reveal] .ai-step.card-revealed,[data-reveal] .reward-card.card-revealed,[data-reveal] .stat-item.card-revealed{opacity:1;transform:translateY(0);filter:blur(0);}

/* ── PAGE LEAVE TRANSITION ───────────────────────────────────── */
body.page-leaving{opacity:0 !important;transition:opacity 0.3s ease !important;pointer-events:none;}

/* ── BACK TO TOP ──────────────────────────────────────────────── */
.back-to-top{position:fixed;bottom:32px;right:88px;z-index:499;width:46px;height:46px;border-radius:50%;background:rgba(21,21,21,0.92);backdrop-filter:blur(12px);border:1px solid rgba(212,175,55,0.25);color:var(--gold);font-size:18px;font-weight:700;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transform:translateY(16px);transition:opacity 0.35s ease,transform 0.35s ease,border-color 0.2s,box-shadow 0.2s;pointer-events:none;box-shadow:0 4px 20px rgba(0,0,0,0.4);}
.back-to-top.btt-visible{opacity:1;transform:translateY(0);pointer-events:auto;}
.back-to-top:hover{border-color:var(--gold);box-shadow:0 0 24px rgba(212,175,55,0.3);}
@media(max-width:768px){.back-to-top{bottom:76px;right:16px;width:40px;height:40px;font-size:15px;}}

/* ── BOTTLE SPRAY SPARKS ─────────────────────────────────────── */
.bottle-spark{position:fixed;pointer-events:none;z-index:9994;border-radius:50%;transform:translate(-50%,-50%);animation:bottleSpray 0.65s ease-out forwards;}
@keyframes bottleSpray{0%{transform:translate(-50%,-50%) translate(0,0) scale(1);opacity:0.9;}100%{transform:translate(-50%,-50%) translate(var(--bsvx),var(--bsvy)) scale(0);opacity:0;}}

/* ── BUTTON RIPPLE ───────────────────────────────────────────── */
.btn-ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,0.22);transform:scale(0);animation:rippleOut 0.7s linear forwards;pointer-events:none;}
@keyframes rippleOut{to{transform:scale(1);opacity:0;}}

/* ── TOAST glassmorphism ──────────────────────────────────────── */
.toast{background:rgba(16,16,16,0.96) !important;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(212,175,55,0.45) !important;box-shadow:0 8px 48px rgba(0,0,0,0.65),0 0 0 1px rgba(212,175,55,0.07) !important;}

/* ── CART ADDED SUCCESS ──────────────────────────────────────── */
.add-cart-btn.cart-added{background:var(--green,#34C759) !important;color:#fff !important;border-color:var(--green,#34C759) !important;animation:cartBounce 0.38s cubic-bezier(0.16,1,0.3,1);}
@keyframes cartBounce{0%{transform:scale(1);}50%{transform:scale(1.09);}100%{transform:scale(1);}}

/* ── WISHLIST PULSE ───────────────────────────────────────────── */
.wishlist-icon.active{animation:wishPulse 0.4s ease;color:var(--gold) !important;}
@keyframes wishPulse{0%{transform:scale(1);}50%{transform:scale(1.5);}100%{transform:scale(1);}}

/* ── PILL TRANSITIONS ────────────────────────────────────────── */
.pill-toggle,.filter-pill{transition:all 0.22s cubic-bezier(0.16,1,0.3,1);}
.pill-toggle.active{box-shadow:0 0 14px rgba(212,175,55,0.3);}
.filter-pill.active{box-shadow:0 0 14px rgba(212,175,55,0.3);}

/* ── SCROLLBAR ───────────────────────────────────────────────── */
::-webkit-scrollbar{width:5px;height:5px;}
::-webkit-scrollbar-track{background:#0A0A0A;}
::-webkit-scrollbar-thumb{background:rgba(212,175,55,0.32);border-radius:3px;}
::-webkit-scrollbar-thumb:hover{background:rgba(212,175,55,0.6);}

/* ── INPUT FOCUS GLOW ────────────────────────────────────────── */
input:focus,textarea:focus,select:focus{box-shadow:0 0 0 3px rgba(212,175,55,0.12) !important;}

/* ================================================================
   PURFUMELY — ANDROID / MOBILE FIXES v12
   Covers: hero overflow, touch interactions, safe-area, tap targets
   ================================================================ */

/* ── PREVENT HORIZONTAL OVERFLOW ON ALL VIEWPORTS ───────────── */
html,body{ overflow-x:hidden !important; max-width:100vw; }
.hero-v2,.hero{ overflow:hidden; }

/* ── HERO CONTENT — mobile safe padding & sizing ────────────── */
@media(max-width:480px){
  .hero-content-v2,.hero-content{
    padding:0 16px !important;
    max-width:100% !important;
  }
  .hero-h1,.hero h1{
    font-size:clamp(32px,9vw,52px) !important;
    line-height:1.1 !important;
  }
  .hero-sub,.hero .sub{
    font-size:15px !important;
    padding:0 8px;
  }
  .hero-ctas{
    flex-direction:column !important;
    align-items:stretch !important;
    gap:12px !important;
    padding:0 8px;
  }
  .hero-ctas .btn{ width:100%; }
  /* Hero stats — stack on very small screens */
  .hero-stats{
    flex-wrap:wrap !important;
    gap:16px !important;
    border-radius:14px !important;
    padding:14px 16px !important;
    width:calc(100% - 32px) !important;
    margin-left:16px !important;
    margin-right:16px !important;
  }
  .hstat-sep{ display:none !important; }
  .hstat{ flex:1 1 80px; padding:0 8px !important; }
}

/* ── SECTION HEAD V2 — mobile wrap ──────────────────────────── */
@media(max-width:768px){
  .section-head-v2{
    flex-wrap:wrap !important;
    gap:10px !important;
    margin-bottom:28px !important;
  }
  .section-title-v2{ font-size:26px !important; }
  .countdown-v2{ width:100%; justify-content:flex-start; }
  /* Section padding on mobile */
  .section-v2{ padding:48px 0 !important; }
  /* Container padding */
  .container{ padding:0 16px !important; }
}

/* ── AI BANNER — fix on small screens ──────────────────────── */
@media(max-width:480px){
  .ai-banner-v2{ padding:28px 20px !important; gap:24px !important; }
  .ai-heading{ font-size:28px !important; }
}

/* ── GRID — ensure 1-col on mobile ──────────────────────────── */
@media(max-width:540px){
  .grid-3,.grid-4,.grid-2{ grid-template-columns:1fr !important; }
}

/* ── CARDS — remove 3D tilt on touch devices ────────────────── */
@media(pointer:coarse){
  .card{ transform:none !important; }
  .card:hover{ transform:none !important; }
  .card:active{ transform:scale(0.98) !important; }
}

/* ── BUTTONS — minimum 44px touch target (iOS/Android HIG) ──── */
.btn{ min-height:44px; min-width:44px; }
.size-btn{ min-height:40px; }
.nav-icon{ min-width:40px; min-height:40px; display:inline-flex; align-items:center; justify-content:center; }
.wishlist-icon{ min-width:36px !important; min-height:36px !important; }

/* ── MOBILE CART FAB — safe area bottom ─────────────────────── */
.mobile-cart-btn{
  bottom: calc(20px + env(safe-area-inset-bottom, 0px)) !important;
}

/* ── MOBILE DRAWER — safe area ──────────────────────────────── */
.mobile-drawer{
  padding-top: calc(80px + env(safe-area-inset-top, 0px)) !important;
  padding-bottom: calc(32px + env(safe-area-inset-bottom, 0px)) !important;
}

/* ── FOOTER — responsive footer grid ───────────────────────── */
@media(max-width:640px){
  .footer-grid{
    grid-template-columns:1fr 1fr !important;
    gap:32px 24px !important;
  }
}
@media(max-width:400px){
  .footer-grid{ grid-template-columns:1fr !important; }
}

/* ── NEWSLETTER FORM — stacked on mobile ────────────────────── */
@media(max-width:540px){
  .newsletter-form{
    flex-direction:column !important;
    align-items:stretch !important;
  }
  .newsletter-form .btn{ width:100%; }
}

/* ── STATS STRIP — mobile padding ───────────────────────────── */
@media(max-width:480px){
  .stats-strip{ padding:40px 0 !important; }
  .stat-count{ font-size:40px !important; }
  .stat-unit{ font-size:24px !important; }
}

/* ── TOUCH SCROLL SNAP for announcement bar ─────────────────── */
.announce{ -webkit-overflow-scrolling:touch; }

/* ── PRELOADER — mobile layout fix ─────────────────────────── */
@media(max-width:768px){
  #preloader{ touch-action:none; }
  #pl-skip-btn{
    bottom: calc(28px + env(safe-area-inset-bottom, 0px)) !important;
    font-size:12px !important;
    padding:10px 24px !important;
  }
}

/* ── BACK-TO-TOP — avoid overlap with cart FAB ───────────────── */
@media(max-width:768px){
  .back-to-top{ bottom:80px !important; right:16px !important; }
}

/* ── HERO 3D — disable perspective transform on mobile ──────── */
@media(pointer:coarse){
  .hero-content-v2,.hero-content{
    transform:none !important;
    transition:none !important;
  }
}

/* ── HERO CTA GLOW ───────────────────────────────────────────── */
.btn-primary{box-shadow:0 4px 24px rgba(212,175,55,0.22);}
.btn-primary:hover{box-shadow:0 8px 36px rgba(212,175,55,0.42) !important;}

/* ── LOGO HOVER ──────────────────────────────────────────────── */
.logo:hover{text-shadow:0 0 32px rgba(212,175,55,0.6);transition:text-shadow 0.35s ease;}

/* ── NAV ACTIVE ──────────────────────────────────────────────── */
.nav-links a.active{color:var(--gold);}
.nav-links a:hover{text-shadow:0 0 16px rgba(212,175,55,0.4);}

/* ── SELECT ELEMENT ──────────────────────────────────────────── */
select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M0 0l6 8 6-8z' fill='%23D4AF37'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px !important;}

/* ── SECTION SEPARATOR ───────────────────────────────────────── */
.section-sep{display:flex;align-items:center;gap:16px;margin:64px 0;opacity:0.3;}
.section-sep::before,.section-sep::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);}
.section-sep-icon{color:var(--gold);font-size:14px;flex-shrink:0;}

/* ── HERO PARALLAX content ───────────────────────────────────── */
.hero-content-v2,.hero-content{will-change:transform;}

/* ── GRAIN TEXTURE overlay ───────────────────────────────────── */
body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");background-repeat:repeat;background-size:128px;opacity:0.35;}

/* ── FOOTER TOP BAR ──────────────────────────────────────────── */
.footer-top-bar{border-top:1px solid rgba(212,175,55,0.1);border-bottom:1px solid rgba(212,175,55,0.06);background:rgba(21,21,21,0.8);}

/* ── PRODUCT PHOTO (admin uploaded) ──────────────────────────── */
.product-photo{width:100%;height:100%;object-fit:contain;transition:transform 0.4s cubic-bezier(0.16,1,0.3,1),filter 0.4s ease;}

/* ── FAQ HOVER ───────────────────────────────────────────────── */
.faq-item{transition:border-color 0.25s ease;}
.faq-item:hover{border-color:rgba(212,175,55,0.4);}
.faq-item.open{border-color:rgba(212,175,55,0.5);}

/* ── MOBILE DRAWER ───────────────────────────────────────────── */
.mobile-drawer{box-shadow:-8px 0 48px rgba(0,0,0,0.75);}

/* ── PRICE TRANSITION ────────────────────────────────────────── */
.price-new{transition:color 0.3s ease;}

/* ── PL-BG fix ───────────────────────────────────────────────── */
.pl-bg{position:absolute;inset:0;background:#0A0A0A;}

/* ── HERO IMAGE FALLBACK ─────────────────────────────────────── */
#hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;opacity:0;transition:opacity 1s ease;display:none;}

/* ================================================================
   Purfumely — v9 ADDITIONS (v8 exclusives merged in)
   ================================================================ */

/* ── SCENT TRAIL CANVAS ──────────────────────────────────────── */
/* canvas is injected by JS at z-index 99990 — no extra CSS needed */

/* ── CARD IDLE SHIMMER (v8 exclusive) ───────────────────────── */
.card-shimmer .card-img::before{
  content:'';position:absolute;inset:0;z-index:3;pointer-events:none;
  background:linear-gradient(115deg,transparent 20%,rgba(255,245,200,.15) 50%,transparent 80%);
  transform:translateX(-110%);animation:idleShimmer .85s ease forwards;
}
@keyframes idleShimmer{to{transform:translateX(110%);}}

/* ── FRAGRANCE NOTES PEEK (v8 exclusive) ────────────────────── */
.notes-peek{max-height:0;overflow:hidden;transition:max-height .4s cubic-bezier(0.16,1,0.3,1),opacity .35s ease;opacity:0;margin:0 14px;}
.card:hover .notes-peek{max-height:80px;opacity:1;}
.notes-peek-row{display:flex;flex-direction:column;gap:3px;padding:8px 0 4px;}
.notes-peek-line{display:flex;align-items:center;gap:6px;font-size:10px;color:#666;}
.notes-peek-line span:first-child{color:#D4AF37;font-weight:600;letter-spacing:.5px;min-width:32px;}
.notes-peek-line span:last-child{color:#888;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px;}

/* ── CART EXPLOSION PARTICLES (v8 exclusive) ────────────────── */
.cart-burst-particle{position:fixed;pointer-events:none;z-index:9996;border-radius:50%;transform:translate(-50%,-50%);animation:cartBurst .9s cubic-bezier(.2,.8,.3,1) forwards;}
@keyframes cartBurst{0%{transform:translate(-50%,-50%) translate(0,0) scale(1.4);opacity:1;}70%{opacity:.8;}100%{transform:translate(-50%,-50%) translate(var(--cbx),var(--cby)) scale(0);opacity:0;}}

/* ── FAMILY GLOW on card body border (v8 exclusive) ─────────── */
.card[data-family="Fresh"]:hover   .card-body{border-color:rgba(100,190,255,.22);}
.card[data-family="Woody"]:hover   .card-body{border-color:rgba(200,121,65,.22);}
.card[data-family="Sweet"]:hover   .card-body{border-color:rgba(255,130,200,.22);}
.card[data-family="Oriental"]:hover .card-body{border-color:rgba(180,100,255,.22);}

/* ── FAMILY PILL COLOURS (v8 exclusive) ─────────────────────── */
.family-pill{font-size:10px;padding:2px 8px;border-radius:20px;font-weight:600;letter-spacing:.5px;display:inline-block;margin:4px 0;}
.family-Fresh   {background:rgba(100,190,255,.12);color:#64BEFF;border:1px solid rgba(100,190,255,.25);}
.family-Woody   {background:rgba(200,121,65,.12); color:#C87941;border:1px solid rgba(200,121,65,.25);}
.family-Sweet   {background:rgba(255,130,200,.12);color:#FF82C8;border:1px solid rgba(255,130,200,.25);}
.family-Oriental{background:rgba(180,100,255,.12);color:#B464FF;border:1px solid rgba(180,100,255,.25);}

/* ── HERO CONTENT 3D TRANSITION ─────────────────────────────── */
.hero-content{transform-style:preserve-3d;}

/* ── ANNOUNCEMENT BAR ───────────────────────────────────────── */
.announcement-bar{width:100%;background:linear-gradient(90deg,#1A1200,#2A1E00,#1A1200);border-bottom:1px solid rgba(212,175,55,.2);color:#D4AF37;text-align:center;font-size:12px;letter-spacing:2px;padding:10px 16px;font-family:Inter,sans-serif;position:relative;z-index:101;}
.announcement-bar a{color:#F5E27A;text-decoration:underline;}

/* ── SOCIALS HOVER ───────────────────────────────────────────── */
.socials a{font-size:20px;transition:transform .2s ease;display:inline-block;}
.socials a:hover{transform:translateY(-3px) scale(1.15);}

/* ── SECTION SEPARATOR (v8 variant) ─────────────────────────── */
.section-v2+.section-v2::before{content:'';display:block;height:1px;background:linear-gradient(90deg,transparent,rgba(212,175,55,.12),transparent);margin:0 40px;}

/* ── CSS VARIABLE ADDITION ───────────────────────────────────── */
:root{--charcoal-light:#555;}

/* ── CARD 3D TILT ─────────────────────────────────────────────── */
.card{transform-style:preserve-3d;transition:box-shadow 0.3s ease;}
.card:hover{box-shadow:0 24px 64px rgba(0,0,0,0.45),0 0 0 1px rgba(212,175,55,0.12);}

/* ── HERO STATS ORNAMENT ──────────────────────────────────────── */
.hstat-num{background:linear-gradient(135deg,#F5E27A,#D4AF37);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}

/* ── SCROLL PROGRESS GOLD GRADIENT ───────────────────────────── */
#scroll-progress{background:linear-gradient(90deg,#8A6010,#D4AF37,#F5E27A,#D4AF37)!important;background-size:200% auto!important;animation:progressShimmer 2s linear infinite;}
@keyframes progressShimmer{0%{background-position:200% center;}100%{background-position:-200% center;}}

/* ── HERO EYEBROW + PROOF PARALLAX BASE ──────────────────────── */
.hero-eyebrow,.hero-proof,.hero-stats,.section-ornament{will-change:transform;}