/* ============================================================
   BACCOZONE — DARK MAHOGANY LUXURY v3
   20-Year Veteran Grade — Zero Compromise
   ============================================================ */

/* ── GOOGLE FONTS ── */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700;900&family=Libre+Caslon+Text:ital,wght@0,400;0,700;1,400&family=Work+Sans:wght@300;400;500;600;700;800&display=swap');

/* ── ROOT VARIABLES ── */
:root {
  --bg:          #faf7f2;
  --bg-up:       #fcfbfa;
  --bg-card:     #ffffff;
  --bg-hover:    #f5f0e6;
  --gold:        #c8882a;
  --gold-lt:     #e3a542;
  --gold-dk:     #a07820;
  --gold-10:     rgba(200,136,42,0.10);
  --gold-20:     rgba(200,136,42,0.20);
  --gold-30:     rgba(200,136,42,0.30);
  --gold-glow:   rgba(200,136,42,0.50);
  --cream:       #2d1709;
  --cream-60:    rgba(45,23,9,0.60);
  --cream-30:    rgba(45,23,9,0.7);
  --amber:       #5a3a29;
  --ember:       #8b3520;
  --r:           20px;   /* global border-radius */
  --ease:        cubic-bezier(0.16, 1, 0.3, 1);
  --t:           0.5s var(--ease);
}

/* ═══ RESET ════════════════════════════════════════════════ */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { overflow-x:hidden; }

/* ── LENIS SMOOTH SCROLL ── */
html.lenis, html.lenis body {
  height: auto;
}
.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}
.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}
.lenis.lenis-stopped {
  overflow: hidden;
}
.lenis.lenis-scrolling iframe {
  pointer-events: none;
}

/* ── GSAP UTILITIES ── */
.line { overflow:hidden; }
.word { overflow:hidden; padding-bottom: 0.1em; margin-bottom: -0.1em; transform-origin: bottom; }
body {
  background: var(--bg);
  color: var(--cream);
  font-family: 'Work Sans', sans-serif;
  overflow-x: hidden;
  cursor: none;
  -webkit-font-smoothing: antialiased;
}
img { display:block; max-width:100%; }
a   { color:inherit; text-decoration:none; }
button { border:none; background:none; cursor:none; font-family:inherit; }

/* ═══ SCROLLBAR ══════════════════════════════════════════ */
::-webkit-scrollbar { width:4px; height:4px; }
::-webkit-scrollbar-track { background:var(--bg); }
::-webkit-scrollbar-thumb { background:var(--gold-30); border-radius:2px; }
::-webkit-scrollbar-thumb:hover { background:var(--gold-glow); }

.custom-scrollbar::-webkit-scrollbar { width:6px; height:6px; display:block; }
.custom-scrollbar::-webkit-scrollbar-track { background:rgba(255,255,255,0.02); border-radius:3px; }
.custom-scrollbar::-webkit-scrollbar-thumb { background:rgba(200,136,42,0.4); border-radius:3px; }
.custom-scrollbar::-webkit-scrollbar-thumb:hover { background:var(--gold); }
::selection { background:var(--gold-20); color:var(--cream); }
.no-scrollbar::-webkit-scrollbar { display:none; }
.no-scrollbar { -ms-overflow-style:none; scrollbar-width:none; }

/* ═══ SCROLL PROGRESS ════════════════════════════════════ */
#scroll-progress-bar {
  position:fixed; top:0; left:0; height:2px; width:0%;
  background: linear-gradient(90deg, var(--ember), var(--gold), var(--gold-lt));
  z-index:100000; box-shadow:0 0 8px var(--gold);
  transition: width 0.1s linear;
}

/* ═══ CURSOR ═════════════════════════════════════════════ */
#cursor-glow {
  position:fixed; width:500px; height:500px; border-radius:50%;
  background: radial-gradient(circle, rgba(200,136,42,0.07) 0%, rgba(139,53,32,0.04) 40%, transparent 70%);
  pointer-events:none; transform:translate(-50%,-50%); z-index:9998;
  mix-blend-mode:screen; will-change:transform;
}
#cursor-dot {
  position:fixed; width:8px; height:8px; border-radius:50%;
  background:var(--gold); pointer-events:none;
  transform:translate(-50%,-50%); z-index:9999;
  box-shadow:0 0 10px var(--gold), 0 0 28px var(--gold-30);
  transition:transform 0.15s ease, opacity 0.3s ease;
  will-change:transform;
}

/* ═══ PAGE LOADER ════════════════════════════════════════ */
#page-loader {
  position:fixed; inset:0; background:#1a0e05; z-index:99999;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2.5rem;
  /* GSAP will animate clip-path or transform, no CSS transition needed here */
}
.loader-logo-text {
  font-family:'Cinzel',serif; font-size:2.2rem; font-weight:700;
  letter-spacing:10px; text-transform:uppercase;
  background:linear-gradient(135deg,#c8882a,#e3a542,#c8882a);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.loader-tagline { color:rgba(200,136,42,0.3); font-size:0.62rem; letter-spacing:5px; text-transform:uppercase; }
.loader-bar { width:220px; height:1px; background:rgba(200,136,42,0.1); position:relative; overflow:hidden; }
.loader-bar::after {
  content:''; position:absolute; left:-100%; top:0; width:100%; height:100%;
  background:linear-gradient(90deg,transparent,var(--gold),var(--gold-lt),transparent);
  animation:sweep 1.4s ease-in-out infinite;
}

/* ═══ NAVBAR ══════════════════════════════════════════════ */
.navbar-luxury {
  position:fixed; top:0; left:0; right:0; margin:0 auto;
  width:100%; max-width:100%; z-index:1000; padding:1.5rem 0;
  transition: background-color 0.5s cubic-bezier(0.16, 1, 0.3, 1), backdrop-filter 0.5s cubic-bezier(0.16, 1, 0.3, 1), top 0.5s cubic-bezier(0.16, 1, 0.3, 1), width 0.5s cubic-bezier(0.16, 1, 0.3, 1), max-width 0.5s cubic-bezier(0.16, 1, 0.3, 1), border-radius 0.5s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.5s cubic-bezier(0.16, 1, 0.3, 1), padding 0.5s cubic-bezier(0.16, 1, 0.3, 1);
  background:linear-gradient(180deg, rgba(26,14,5,0.7) 0%, transparent 100%);
  border: 1px solid transparent;
  border-radius: 0;
}
.navbar-luxury.scrolled {
  top:24px;
  width: calc(100% - 48px);
  max-width: 1200px;
  background: rgba(18, 9, 3, 0.65);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border: 1px solid rgba(200,136,42,0.25);
  border-radius: 100px;
  padding: 0.6rem 0;
  box-shadow: 0 14px 40px rgba(0,0,0,0.95), 0 0 25px rgba(200,136,42,0.1);
}
.navbar-luxury.scrolled > div {
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}
.nav-logo-name {
  font-family:'Cinzel',serif; font-size:1.25rem;
  letter-spacing:4px; color:var(--gold); text-transform:uppercase; font-weight:700;
}
.nav-link-lux {
  position:relative; font-size:0.72rem; font-weight:600;
  letter-spacing:2.5px; text-transform:uppercase;
  color:rgba(245,234,213,0.65); transition:color 0.35s ease; padding-bottom:4px;
}
.nav-link-lux::after {
  content:''; position:absolute; bottom:0; left:0; width:0; height:1px;
  background:var(--gold); transition:width 0.45s var(--ease);
}
.nav-link-lux:hover, .nav-link-lux.active { color:var(--gold); }
.nav-link-lux:hover::after, .nav-link-lux.active::after { width:100%; }
#mob-menu a.active { color:var(--gold) !important; }

/* Navbar CTA — icon-only at md, full at lg */
.nav-cta-btn {
  padding: 0.65rem 0.9rem;
  font-size: 0.65rem;
  letter-spacing: 2.5px;
  border-radius: 12px;
}
@media (min-width: 1024px) {
  .nav-cta-btn { padding: 0.65rem 1.4rem; }
}

/* Navbar scrolled at small widths — collapse pill radius */
@media (max-width: 1200px) {
  .navbar-luxury.scrolled {
    top:24px;
    width: calc(100% - 48px);
    max-width: 1200px;
    background: rgba(18, 9, 3, 0.65);
    backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
    border: 1px solid rgba(200,136,42,0.25);
    border-radius: 100px;
    padding: 0.6rem 0;
    box-shadow: 0 14px 40px rgba(0,0,0,0.95), 0 0 25px rgba(200,136,42,0.1);
  }
}

/* Mobile menu dropdown when navbar is floating pill */
.navbar-luxury.scrolled #mob-menu {
  border-radius: 0 0 24px 24px !important;
  left: 0; right: 0;
  width: 100%;
  margin-top: 0;
  border: 1px solid rgba(200,136,42,0.25);
  border-top: none;
}
/* Ensure the navbar never clips the dropdown */
.navbar-luxury { overflow: visible !important; }

/* When menu is open, make the navbar and dropdown merge into one shape */
.navbar-luxury.menu-open {
  background: #2d1709 !important;
}
.navbar-luxury.scrolled.menu-open {
  border-radius: 24px 24px 0 0;
  border-bottom: none;
  box-shadow: 0 14px 40px rgba(0,0,0,0.55);
}

/* Mobile drawer Order button */
.mob-order-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  width: 100%;
  padding: 0.9rem 1.5rem;
  background: var(--gold);
  color: #2d1709;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 4px;
  text-transform: uppercase;
  border-radius: 14px;
  position: relative;
  overflow: hidden;
  transition: background 0.3s ease, box-shadow 0.3s ease, transform 0.2s ease;
  cursor: pointer;
}
.mob-order-btn::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(120deg, transparent 25%, rgba(255,255,255,0.28) 50%, transparent 75%);
  transform: translateX(-200%);
  transition: transform 0.6s ease;
}
.mob-order-btn:active {
  transform: scale(0.97);
  box-shadow: 0 0 30px rgba(200,136,42,0.5);
}
.mob-order-btn:hover::before { transform: translateX(200%); }
.mob-order-btn:hover {
  background: var(--gold-lt);
  box-shadow: 0 0 40px rgba(200,136,42,0.55);
}

/* ── MOBILE MENU LINKS (dark brown bg + gold bold text) ── */
.mob-menu-link {
  display: flex;
  align-items: center;
  padding: 1rem 1.5rem;
  color: #c8882a;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(200,136,42,0.15);
  position: relative;
  transition: color 0.2s ease, background 0.2s ease;
  cursor: pointer;
}
.mob-menu-link:hover, .mob-menu-link:active {
  color: #e3a542;
  background: rgba(200,136,42,0.06);
}
.mob-menu-link.active {
  color: #e3a542 !important;
  background: rgba(200,136,42,0.08);
}

/* Grab button inside mob-menu — same style as other links, icon inline */

/* ═══ HERO ════════════════════════════════════════════════ */
.hero-section {
  position:relative; min-height:100vh; min-height:100dvh; overflow:hidden;
  background:#1a0e05; display:flex; align-items:center; justify-content:center;
  padding: 8rem 0 4rem; /* add padding top for navbar, padding bottom for safety */
}
.hero-video-wrap { position:absolute; inset:0; z-index:1; overflow:hidden; }
.hero-video-wrap video {
  width:100%; height:100%; object-fit:cover;
  transform: scale(1.18); /* Crop out watermark */
  opacity:0.38; /* Removed heavy filter for smoother playback */
}
.hero-overlay {
  position:absolute; inset:0; z-index:2; pointer-events:none;
  background:
    radial-gradient(ellipse at 50% 100%, rgba(139,53,32,0.35) 0%, transparent 65%),
    linear-gradient(to bottom, rgba(26,14,5,0.4) 0%, rgba(26,14,5,0.2) 50%, rgba(26,14,5,0.85) 100%);
}
#smoke-puff-container { position:absolute; inset:0; z-index:3; pointer-events:none; overflow:hidden; }
#particle-canvas { position:absolute; inset:0; z-index:4; pointer-events:none; }
.hero-vignette {
  position:absolute; inset:0; z-index:5; pointer-events:none;
  background:radial-gradient(ellipse at center, transparent 18%, rgba(26,14,5,0.7) 100%);
}
.hero-slide { 
  opacity:0; 
  transition:opacity 2s ease;
  will-change: opacity;
  transform: translate3d(0,0,0);
}
.hero-slide.active { opacity:1; }

.hero-parallax-img {
  will-change: transform;
  transform: translate3d(0,0,0);
}

/* Hero text */
.hero-eyebrow {
  color:var(--gold); font-size:0.68rem; letter-spacing:7px;
  text-transform:uppercase; font-weight:600;
  opacity:0; transform: translateY(20px);
  display:inline-flex; align-items:center; gap:1.2rem;
  transition: opacity 1s ease 0.4s, transform 1s ease 0.4s;
}
.hero-section.loaded .hero-eyebrow { opacity: 1; transform: translateY(0); }
.hero-eyebrow::before, .hero-eyebrow::after {
  content:''; display:block; width:35px; height:1px; flex-shrink:0;
}
.hero-eyebrow::before { background:linear-gradient(90deg,transparent,var(--gold)); }
.hero-eyebrow::after  { background:linear-gradient(90deg,var(--gold),transparent); }

.hero-title-line { overflow:hidden; line-height:1.02; transform:translateZ(0); }
.hero-title-inner {
  display:block; font-family:'Cinzel',serif;
  font-size:clamp(2.8rem, 8vw, 7rem);
  font-weight:900; color:#fff;
  transform:translateY(110%);
  transition:transform 1.4s var(--ease);
  text-shadow:0 0 100px rgba(200,136,42,0.15), 0 4px 40px rgba(0,0,0,0.9);
  letter-spacing:-0.01em;
  will-change:transform;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.hero-title-inner.gold {
  background:linear-gradient(135deg,#c8882a 0%,#f5c842 50%,#c8882a 100%);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.hero-section.loaded .hero-title-inner { transform:translateY(0); }
.hero-title-inner:first-child { transition-delay:0.35s; }
.hero-title-inner:last-child  { transition-delay:0.6s; }

.hero-typewriter-row {
  opacity:0; transform: translateY(20px);
  transition: opacity 1s ease 0.6s, transform 1s ease 0.6s;
  font-family:'Cinzel',serif;
  font-size:clamp(1rem, 2.2vw, 1.65rem);
  color:rgba(245,234,213,0.8); letter-spacing:2px; min-height:2.5rem;
}
.hero-section.loaded .hero-typewriter-row { opacity: 1; transform: translateY(0); }
.hero-desc {
  opacity:0; transform:translateY(20px);
  transition: opacity 1s ease 0.8s, transform 1s ease 0.8s;
  color:rgba(245,234,213,0.7); font-size:1rem; font-weight:300; line-height:2;
  max-width:540px;
}
.hero-section.loaded .hero-desc { opacity: 1; transform: translateY(0); }
.hero-cta-wrap { opacity:0; transform: translateY(20px); transition: opacity 1s ease 1s, transform 1s ease 1s; }
.hero-section.loaded .hero-cta-wrap { opacity: 1; transform: translateY(0); }

/* Scroll indicator */
.scroll-indicator {
  position:absolute; bottom:2rem; left:50%; transform:translateX(-50%);
  z-index:20; display:flex; flex-direction:column; align-items:center; gap:0.5rem;
  opacity:0; animation:fadeUp 1s ease 2.4s forwards; cursor:pointer;
}
@media (min-width: 640px) {
  .scroll-indicator {
    transform: translateX(calc(-50% - 8px)); /* Nudge to align exactly with the gap of the unequal buttons above */
  }
}
.scroll-arrow {
  color: var(--gold); font-size: 1.5rem;
  animation: bounceArrow 2s infinite ease-in-out;
}
.scroll-text { 
  color:rgba(200,136,42,0.4); font-size:0.58rem; letter-spacing:5px; 
  text-transform:uppercase; margin-right: -5px; /* Offset letter-spacing for perfect centering */
}

@keyframes bounceArrow {
  0%, 100% { transform: translateY(0); opacity: 0.4; }
  50% { transform: translateY(8px); opacity: 1; }
}

/* ═══ SMOKE PUFFS ════════════════════════════════════════ */
.smoke-puff {
  position:absolute; border-radius:50%;
  background:radial-gradient(circle at 35% 35%, rgba(100,55,20,0.4), rgba(60,30,10,0.2), transparent);
  filter:blur(22px); pointer-events:none;
  animation:smokeDrift var(--dur,8s) ease-out var(--del,0s) 1 forwards;
}
@keyframes smokeDrift {
  0%   { transform:translate(0,0) scale(0.4) rotate(0); opacity:0; filter:blur(10px); }
  12%  { opacity:0.42; }
  100% { transform:translate(var(--drift,60px),-380px) scale(3.2) rotate(18deg); opacity:0; filter:blur(45px); }
}

/* ═══ BUTTONS ════════════════════════════════════════════ */
.btn-primary {
  display:inline-flex; align-items:center; gap:0.75rem;
  background:var(--gold); color:#2d1709;
  padding:1rem 2.5rem;
  font-weight:800; font-size:0.72rem; letter-spacing:3px; text-transform:uppercase;
  border-radius:var(--r);
  position:relative; overflow:hidden; transition:var(--t); cursor:none;
}
.btn-primary::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(120deg,transparent 25%,rgba(255,255,255,0.3) 50%,transparent 75%);
  transform:translateX(-200%); transition:transform 0.7s ease;
}
.btn-primary:hover::before { transform:translateX(200%); }
.btn-primary:hover {
  background:var(--gold-lt);
  box-shadow:0 0 55px rgba(200,136,42,0.6), 0 14px 40px rgba(0,0,0,0.5);
  transform:translateY(-3px);
}
.btn-outline {
  display:inline-flex; align-items:center; gap:0.75rem;
  border:1px solid var(--gold-30); color:var(--gold);
  padding:1rem 2.5rem; border-radius:var(--r);
  font-weight:600; font-size:0.72rem; letter-spacing:3px; text-transform:uppercase;
  transition:var(--t); cursor:none; backdrop-filter:blur(4px);
}
.btn-outline:hover {
  background:var(--gold-10); border-color:var(--gold);
  box-shadow:0 0 30px rgba(200,136,42,0.25); transform:translateY(-3px);
}

/* ═══ MARQUEE ════════════════════════════════════════════ */
.marquee-section { background:var(--gold); padding:0.9rem 0; overflow:hidden; position:relative; z-index:10; transform: translateZ(0); }
.marquee-track {
  display:flex; width:max-content;
  animation:marqueeRoll 30s linear infinite;
  will-change: transform;
  transform: translateZ(0);
}
.marquee-item { display:flex; align-items:center; gap:2.5rem; padding:0 2.5rem; white-space:nowrap; font-size:0.68rem; font-weight:800; letter-spacing:3.5px; text-transform:uppercase; color:#1a0e05; }
.marquee-dot { width:5px; height:5px; border-radius:50%; background:rgba(26,14,5,0.4); flex-shrink:0; }

/* ═══ GLOW AMBIENTS ════════════════════════════════════════════ */
.glow { position:absolute; border-radius:50%; pointer-events:none; z-index:0; transform: translateZ(0); will-change: transform; }
.glow-gold  { background:radial-gradient(circle,rgba(200,136,42,0.18) 0%, transparent 70%); }
.glow-warm  { background:radial-gradient(circle,rgba(139,53,32,0.2) 0%, transparent 70%); }
.glow-brown { background:radial-gradient(circle,rgba(90,45,12,0.25) 0%, transparent 70%); }

/* ═══ SECTION TITLES ══════════════════════════════════════ */
.section-eyebrow {
  display:inline-flex; align-items:center; gap:1rem;
  color:var(--gold); font-size:0.68rem; font-weight:700;
  letter-spacing:5px; text-transform:uppercase; margin-bottom:1.2rem;
}
.section-eyebrow::before { content:''; width:28px; height:1px; background:var(--gold); flex-shrink:0; }
.section-title {
  font-family:'Cinzel',serif;
  font-size:clamp(2rem, 4.5vw, 3.4rem);
  font-weight:700; color:var(--cream); line-height:1.1;
  letter-spacing:-0.01em;
}
.section-title .gold { background:linear-gradient(135deg,#c8882a,#e3a542); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }


/* ═══ CRAFT VIDEO SECTION ════════════════════════════════ */
.craft-section {
  position:relative; overflow:hidden; min-height:68vh;
  display:flex; align-items:center;
}
.craft-video-bg { position:absolute; inset:0; z-index:0; overflow:hidden; background:#1a0e05; }
.craft-video-bg video {
  width:100%; height:100%; object-fit:cover;
  transform: scale(1.18); /* Crop out watermark */
  opacity: 0.6; /* Removed heavy filter for smoother playback */
}
.craft-overlay {
  position:absolute; inset:0;
  background:linear-gradient(135deg, rgba(26,14,5,0.88) 0%, rgba(58,31,13,0.6) 50%, rgba(26,14,5,0.82) 100%);
}
.craft-content { position:relative; z-index:2; padding:6rem 0; }

/* ═══ STORE PHOTOS SECTION ═══════════════════════════════ */
.store-section {
  background:var(--bg-up); position:relative; overflow:hidden; padding:6rem 0;
}
.store-photo {
  border-radius:24px; overflow:hidden; position:relative;
  box-shadow:0 24px 80px rgba(45,23,9,0.5);
  transition:transform 0.8s var(--ease), box-shadow 0.8s var(--ease);
}
.store-photo::before {
  content:''; position:absolute; inset:0; z-index:1;
  background:linear-gradient(to top, rgba(45,23,9,0.9) 0%, transparent 60%);
  border-radius:24px;
}
.store-photo:hover { transform:translateY(-8px) scale(1.01); box-shadow:0 40px 100px rgba(58,31,13,0.65), 0 0 60px rgba(45,23,9,0.4); }
.store-photo img {
  width:100%; height:100%; object-fit:cover;
  filter:brightness(0.7) sepia(0.5) hue-rotate(-15deg) saturate(1.2) contrast(1.1);
  transition:filter 0.8s ease, transform 0.8s var(--ease);
  border-radius:24px;
}
.store-photo:hover img { filter:brightness(0.85) sepia(0.3) hue-rotate(-15deg) saturate(1.2) contrast(1.1); transform:scale(1.04); }
.store-photo-label {
  position:absolute; bottom:0; left:0; right:0; z-index:2;
  padding:1.5rem 2rem;
  font-family:'Cinzel',serif; font-size:0.7rem; font-weight:600;
  letter-spacing:4px; text-transform:uppercase; color:var(--gold);
}

/* ═══ ABOUT SECTION ══════════════════════════════════════ */
.about-section { background:#1a0e05; position:relative; overflow:hidden; padding:7rem 0; }
.about-img-frame {
  position:relative; border-radius:24px; overflow:hidden;
  box-shadow:0 24px 80px rgba(0,0,0,0.6);
}
.about-img-frame::before {
  content:''; position:absolute; inset:0; z-index:1; border-radius:24px;
  background:linear-gradient(135deg, rgba(200,136,42,0.08) 0%, transparent 50%);
}
.about-img-frame::after {
  content:''; position:absolute; inset:0; z-index:1;
  border:1px solid rgba(200,136,42,0.2); border-radius:24px; pointer-events:none;
}
.about-img-frame img {
  width:100%; object-fit:cover; border-radius:24px;
  filter:brightness(0.82) saturate(0.88) contrast(1.08);
  transition:filter 0.9s ease, transform 0.9s var(--ease);
}
.about-img-frame:hover img { filter:brightness(0.9) saturate(0.95) contrast(1.05); transform:scale(1.03); }

.feature-pill {
  background:var(--gold-10); border:1px solid var(--gold-20);
  border-radius:16px; padding:1.75rem 2rem;
  position:relative; overflow:hidden; transition:var(--t);
}
.feature-pill::before {
  content:''; position:absolute; top:0; left:0; width:0; height:2px;
  background:linear-gradient(90deg,var(--gold),var(--gold-lt));
  border-radius:2px 2px 0 0; transition:width 0.6s ease;
}
.feature-pill:hover { background:rgba(200,136,42,0.09); border-color:var(--gold-30); transform:translateY(-4px); box-shadow:0 20px 60px rgba(0,0,0,0.5); }
.feature-pill:hover::before { width:100%; }

/* ═══ STATS ══════════════════════════════════════════════ */
.stats-section { background:#2d1709; position:relative; overflow:hidden; }
.stat-item {
  text-align:center; padding:4.5rem 2rem; position:relative;
  transition:background 0.4s ease;
}
.stat-item + .stat-item:hover { background:rgba(200,136,42,0.08); }
.stat-item:hover { background:rgba(200,136,42,0.08); }
.stat-number {
  display:inline-block; font-family:'Cinzel',serif;
  font-size:clamp(1.8rem, 4.5vw, 4rem); font-weight:900;
  background:linear-gradient(135deg,#c8882a,#e3a542,#c8882a);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  line-height:1.2; margin-bottom:0.75rem;
  white-space: nowrap; padding: 0 0.25em;
}
.stat-label { color:#e3a542; font-size:0.7rem; letter-spacing:3px; text-transform:uppercase; font-weight:500; }

/* ═══ PRODUCT CARDS ══════════════════════════════════════ */
.products-section { background:linear-gradient(180deg,var(--bg) 0%,#faf7f2 100%); position:relative; overflow:hidden; }
.product-card {
  min-width:240px;
  max-width:260px;
  background:#2d1709;
  border:1px solid rgba(200,136,42,0.08);
  border-radius:24px; position:relative; overflow:hidden;
  cursor:none; transform-style:preserve-3d;
  transition:box-shadow 0.4s ease, border-color 0.4s ease;
  flex-shrink:0;
  scroll-snap-align:start;
}
.product-card:hover {
  border-color:var(--gold);
  box-shadow:0 0 0 1px var(--gold), 0 40px 100px rgba(58,31,13,0.65), 0 0 60px rgba(45,23,9,0.4);
}
.card-shine {
  position:absolute; inset:0; border-radius:24px;
  background:radial-gradient(circle at var(--mx,50%) var(--my,50%), rgba(200,136,42,0.15) 0%, transparent 65%);
  pointer-events:none; z-index:10; opacity:0; transition:opacity 0.3s ease;
}
.product-card:hover .card-shine { opacity:1; }
.card-img-wrap { aspect-ratio:4/5; overflow:hidden; position:relative; border-radius:24px 24px 0 0; }
.card-img-wrap img {
  width:100%; height:100%; object-fit:cover;
  filter:grayscale(100%) contrast(1.1);
  transition:filter 0.9s var(--ease), transform 0.9s var(--ease);
}
.product-card:hover .card-img-wrap img { filter:grayscale(0%) contrast(1) sepia(0%); transform:scale(1.06); }
.card-overlay {
  position:absolute; inset:0; z-index:2; border-radius:24px 24px 0 0;
  background:linear-gradient(to top, #2d1709 0%, transparent 15%);
  pointer-events:none;
}
.card-body { padding:1.5rem; }
.card-title { font-family:'Libre Caslon Text',serif; font-size:1.05rem; color:#f5ead5; line-height:1.45; min-height:3rem; margin-bottom:1rem; }
.card-btn {
  width:100%; border:1px solid var(--gold-30); color:var(--gold);
  padding:0.85rem; font-size:0.68rem; letter-spacing:3px; text-transform:uppercase;
  font-weight:700; font-family:'Work Sans',sans-serif; border-radius:12px;
  transition:var(--t); cursor:none; background:transparent;
}
.card-btn:hover { background:var(--gold); color:#2d1709; box-shadow:0 0 35px rgba(200,136,42,0.45); border-color:var(--gold); }

/* ═══ HOW IT WORKS ════════════════════════════════════════ */
.how-section { background:var(--bg); position:relative; overflow:hidden; padding:7rem 0; }
.step-icon-wrap { width:90px; height:90px; position:relative; margin:0 auto; flex-shrink:0; }
.step-icon-inner {
  width:100%; height:100%; border-radius:50%;
  background:var(--gold-10); border:1px solid var(--gold-20);
  display:flex; align-items:center; justify-content:center;
  position:relative; z-index:1; transition:var(--t);
}
.step-group:hover .step-icon-inner { background:rgba(200,136,42,0.14); border-color:var(--gold-30); box-shadow:0 0 50px rgba(200,136,42,0.25); }
.step-icon-ring {
  position:absolute; inset:-10px; border-radius:50%;
  border:1px solid rgba(200,136,42,0.14); animation:ringRotate 8s linear infinite;
}
.step-icon-ring::after {
  content:''; position:absolute; top:-2px; left:50%; transform:translateX(-50%);
  width:4px; height:4px; background:var(--gold); border-radius:50%;
  box-shadow:0 0 6px var(--gold);
}
.step-number {
  position:absolute; top:-8px; right:-8px; width:26px; height:26px;
  background:var(--gold); color:#2d1709; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-weight:900; font-size:0.7rem; z-index:5;
  box-shadow:0 0 12px rgba(200,136,42,0.5);
}
@media (min-width:768px) {
  .step-connector {
    display:block; position:absolute; top:45px;
    left:calc(33.33% + 45px); right:calc(33.33% + 45px); height:1px;
    background:linear-gradient(90deg,rgba(200,136,42,0.25),rgba(200,136,42,0.55),rgba(200,136,42,0.25));
  }
}

/* ═══ BRAND GALLERY STRIP ════════════════════════════════ */
.brand-strip-section { background:#faf7f2; padding:5rem 0; overflow:hidden; }
.brand-strip-track { display:flex; gap:1.25rem; animation:marqueeRoll 35s linear infinite; width:max-content; }
.brand-strip-track:hover { animation-play-state:paused; }
.brand-img-card {
  flex-shrink:0; width:280px; height:200px; border-radius:20px; overflow:hidden;
  position:relative; border:1px solid rgba(200,136,42,0.08);
  transition:border-color 0.4s ease, box-shadow 0.4s ease;
}
.brand-img-card:hover { border-color:var(--gold-30); box-shadow:0 20px 60px rgba(0,0,0,0.7); }
.brand-img-card img {
  width:100%; height:100%; object-fit:cover;
  filter:sepia(55%) contrast(1.1) brightness(0.6); border-radius:20px;
  transition:all 0.7s ease;
}
.brand-img-card:hover img { filter:sepia(10%) contrast(1) brightness(0.88); transform:scale(1.06); }
.brand-img-label {
  position:absolute; bottom:0; left:0; right:0;
  padding:1rem 1.25rem; border-radius:0 0 20px 20px;
  background:linear-gradient(to top, rgba(250,247,242,0.95), transparent);
  font-size:0.65rem; letter-spacing:3px; text-transform:uppercase;
  color:rgba(200,136,42,0.7); font-weight:600;
}

/* ═══ TESTIMONIALS ════════════════════════════════════════ */
.testimonials-section {
  background:linear-gradient(180deg,#faf7f2 0%,var(--bg) 100%);
  position:relative; overflow:hidden; padding:7rem 0;
}
.testi-card {
  background:var(--bg-card); border:1px solid rgba(200,136,42,0.09);
  border-radius:20px; padding:2rem; transition:var(--t);
  position:relative; overflow:hidden;
}
.testi-card:hover {
  border-color:var(--gold-30); background:rgba(200,136,42,0.04);
  transform:translateY(-5px); box-shadow:0 40px 100px rgba(58,31,13,0.65), 0 0 60px rgba(45,23,9,0.4);
}
.testi-avatar {
  width:44px; height:44px; border-radius:50%;
  background:rgba(200,136,42,0.14); border:1px solid var(--gold-30);
  display:flex; align-items:center; justify-content:center;
  color:var(--gold); font-weight:800; font-size:1rem; flex-shrink:0;
}
.testi-text {
  font-family:'Libre Caslon Text',serif; font-size:1rem; font-style:italic;
  color:rgba(45,23,9,0.78); line-height:1.85; margin-bottom:1.5rem;
}
.testi-name { color:var(--cream); font-weight:700; font-size:0.88rem; margin-bottom:0.25rem; }

/* Form */
.form-box {
  background:var(--bg-card); border:1px solid rgba(200,136,42,0.1);
  border-radius:24px; padding:2.5rem;
  transition:transform 0.5s var(--ease), border-color 0.4s ease, box-shadow 0.4s ease;
}
.form-box:hover {
  transform:translateY(-8px);
  border-color:var(--gold);
  box-shadow:0 0 0 1px var(--gold), 0 40px 100px rgba(58,31,13,0.65), 0 0 60px rgba(45,23,9,0.4);
}
.form-field { 
  position:relative; margin-bottom:2rem; 
  transition:transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), background 0.4s ease;
  border-radius:12px;
}
.form-field:focus-within {
  transform:scale(1.03) translateY(-2px);
  background:rgba(200,136,42,0.03);
  padding:0 10px;
  margin-left:-10px; margin-right:-10px;
}
.form-input {
  width:100%; background:transparent; border:none;
  border-bottom:1px solid rgba(200,136,42,0.15);
  padding:0.85rem 0; color:#ffffff !important;
  font-family:'Work Sans',sans-serif; font-size:1.1rem; font-weight:400;
  outline:none; transition:border-color 0.3s ease; cursor:text;
}
.form-input::placeholder { color:rgba(200,136,42,0.25); }
.form-input:focus { border-bottom-color:transparent; }
.form-underline {
  position:absolute; bottom:0; left:0; width:0; height:1px;
  background:linear-gradient(90deg,var(--gold),var(--gold-lt));
  transition:width 0.45s ease;
}
.form-input:focus + .form-underline { width:100%; }

/* ═══ FAQ — CARD STYLE ═══════════════════════════════════ */
.faq-section { background:var(--bg); padding:7rem 0; }
.faq-card {
  background:var(--bg-card);
  border:1px solid rgba(200,136,42,0.09);
  border-radius:20px; margin-bottom:14px; overflow:hidden;
  transition:border-color 0.4s var(--ease), box-shadow 0.4s var(--ease), background 0.4s ease;
}
.faq-card:hover {
  border-color:var(--gold-20);
  box-shadow:0 12px 40px rgba(58,31,13,0.45), 0 0 30px rgba(45,23,9,0.2);
}
.faq-card.open {
  border-color:var(--gold-30);
  background:var(--bg-hover);
  box-shadow:0 16px 50px rgba(58,31,13,0.55), 0 0 40px rgba(45,23,9,0.3);
}
.faq-q {
  width:100%; display:flex; justify-content:space-between; align-items:center;
  padding:1.5rem 1.75rem; gap:1.5rem;
  text-align:left; color:var(--cream);
  font-size:1rem; font-weight:600; letter-spacing:0.01em;
  cursor:none; background:none; border:none;
  transition:color 0.3s ease;
  font-family:'Work Sans',sans-serif;
}
.faq-q:hover { color:var(--gold); }
.faq-card.open .faq-q { color:var(--gold); }
.faq-chevron {
  width:36px; height:36px; flex-shrink:0; border-radius:50%;
  border:1px solid rgba(200,136,42,0.22);
  display:flex; align-items:center; justify-content:center;
  color:var(--gold); transition:var(--t);
}
.faq-card.open .faq-chevron {
  background:var(--gold); color:#2d1709;
  border-color:var(--gold); transform:rotate(180deg);
  box-shadow:0 0 20px rgba(200,136,42,0.4);
}
.faq-a {
  max-height:0; overflow:hidden;
  transition:max-height 0.55s cubic-bezier(0.16,1,0.3,1), padding 0.35s ease;
}
.faq-a-inner {
  padding:0 1.75rem 1.5rem;
  color:var(--amber); line-height:1.85; font-weight:300; font-size:0.95rem;
  border-top:1px solid rgba(200,136,42,0.08);
  padding-top:1.25rem;
}

/* ═══ CONTACT ════════════════════════════════════════════ */
.contact-section {
  background:var(--bg);
  position:relative; overflow:hidden; padding:7rem 0;
}
.contact-box {
  background: #1a0e05;
  box-shadow: 0 20px 60px rgba(0,0,0,0.3);
  transition: transform 0.5s var(--ease), border-color 0.4s ease, box-shadow 0.4s ease;
}
.contact-box:hover {
  transform: translateY(-8px);
  border-color: var(--gold);
  box-shadow: 0 0 0 1px var(--gold), 0 40px 100px rgba(58,31,13,0.65), 0 0 60px rgba(45,23,9,0.4);
}
.contact-link {
  display:flex; align-items:center; gap:1.5rem;
  padding:1.35rem 0;
  border-bottom:1px solid rgba(200,136,42,0.06);
  transition:var(--t); color:inherit;
}
.contact-link:hover { padding-left:0.65rem; }
.contact-link:last-child { border-bottom:none; }
.contact-icon {
  width:56px; height:56px; border:1px solid rgba(200,136,42,0.18); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:var(--gold); flex-shrink:0; transition:var(--t);
}
.contact-link:hover .contact-icon { background:var(--gold); color:#2d1709; border-color:var(--gold); box-shadow:0 0 40px rgba(200,136,42,0.45); }
.contact-label { color:rgba(200,136,42,0.85); font-size:0.62rem; letter-spacing:4px; text-transform:uppercase; margin-bottom:0.3rem; }
.contact-value { color:#f5ead5; font-size:1rem; font-weight:500; transition:color 0.3s ease; }
.contact-link:hover .contact-value { color:var(--gold); }

/* ═══ FOOTER ══════════════════════════════════════════════ */
.footer-lux {
  background:#1a0e05; border-top:1px solid rgba(200,136,42,0.07);
  padding:5.5rem 0 2.5rem; position:relative; overflow:hidden;
}
.footer-ambient {
  position:absolute; top:-120px; left:50%; transform:translateX(-50%);
  width:700px; height:350px;
  background:radial-gradient(ellipse at center,rgba(200,136,42,0.06) 0%,transparent 65%);
  pointer-events:none;
}
.footer-brand {
  font-family:'Cinzel',serif; font-size:1.8rem; font-weight:700;
  letter-spacing:5px; text-transform:uppercase;
  background:linear-gradient(135deg,#c8882a,#e3a542);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.footer-link {
  display:block; color:rgba(245,234,213,0.7); font-size:0.88rem; font-weight:300;
  margin-bottom:0.85rem; transition:color 0.3s ease, padding-left 0.35s ease;
}
.footer-link:hover { color:var(--gold); padding-left:8px; }

.footer-link-right {
  display:block; color:rgba(245,234,213,0.7); font-size:0.88rem; font-weight:300;
  margin-bottom:0.85rem; transition:color 0.3s ease, transform 0.35s ease;
}
.footer-link-right:hover { color:var(--gold); transform:translateX(-8px); }
.social-btn {
  width:44px; height:44px; border:1px solid rgba(200,136,42,0.14); border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  color:rgba(245,234,213,0.7); transition:var(--t); cursor:none;
}
.social-btn:hover {
  border-color:var(--gold); color:var(--gold); background:var(--gold-10);
  transform:translateY(-3px); box-shadow:0 10px 30px rgba(200,136,42,0.2);
}

/* ═══ MODAL ══════════════════════════════════════════════ */
.modal-lux {
  background:rgba(18,9,3,0.97); border-radius:28px;
  backdrop-filter:blur(28px); -webkit-backdrop-filter:blur(28px);
  border:1px solid var(--gold);
  box-shadow:0 0 0 1px var(--gold), 0 25px 60px rgba(0,0,0,0.95), 0 0 50px rgba(200,136,42,0.35);
  animation:modalIn 0.45s var(--ease) both;
}

/* ═══ SCROLL ANIMATIONS ══════════════════════════════════ */
.fade-up   { opacity:0; transform:translateY(55px); transition:opacity 1s cubic-bezier(0.2,0.8,0.2,1), transform 1s cubic-bezier(0.2,0.8,0.2,1); }
.fade-left { opacity:0; transform:translateX(-55px); transition:opacity 1s cubic-bezier(0.2,0.8,0.2,1), transform 1s cubic-bezier(0.2,0.8,0.2,1); }
.fade-right{ opacity:0; transform:translateX(55px);  transition:opacity 1s cubic-bezier(0.2,0.8,0.2,1), transform 1s cubic-bezier(0.2,0.8,0.2,1); }
.fade-up.in,.fade-left.in,.fade-right.in { opacity:1; transform:translate(0); }
.d1 { transition-delay:0.1s; } .d2 { transition-delay:0.2s; } .d3 { transition-delay:0.3s; }
.d4 { transition-delay:0.4s; } .d5 { transition-delay:0.5s; }

/* ═══ FLOATING ANIMATION ═════════════════════════════════ */
.float-slow { animation:floatSlow 6s ease-in-out infinite; }
.float-slow:nth-child(2n) { animation-delay:-3s; }

/* ═══ SPOTLIGHT ══════════════════════════════════════════ */
.spotlight { position:relative; }
.spotlight::after {
  content:''; position:absolute; inset:0; pointer-events:none; z-index:1;
  background:radial-gradient(circle 360px at var(--sx,50%) var(--sy,50%), rgba(200,136,42,0.06) 0%, transparent 70%);
  transition:background 0.12s ease;
}

/* ═══ KEYFRAMES ══════════════════════════════════════════ */
@keyframes fadeUp       { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:translateY(0)} }
@keyframes shimmer      { 0%{background-position:0 50%} 50%{background-position:100% 50%} 100%{background-position:0 50%} }
@keyframes sweep        { 0%{left:-100%} 100%{left:100%} }
@keyframes marqueeRoll  { from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes ringRotate   { from{transform:rotate(0)} to{transform:rotate(360deg)} }
@keyframes scrollPulse  { 0%,100%{opacity:0.3;transform:scaleY(0.7)} 50%{opacity:1;transform:scaleY(1)} }
@keyframes floatSlow    { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-14px)} }
@keyframes modalIn      { from{opacity:0;transform:translateY(28px) scale(0.96)} to{opacity:1;transform:translateY(0) scale(1)} }
@keyframes cursorBlink  { 0%,100%{opacity:1} 50%{opacity:0} }
@keyframes pulseGlow    { 0%,100%{box-shadow:0 0 0 0 rgba(200,136,42,0)} 50%{box-shadow:0 0 20px 6px rgba(200,136,42,0.2)} }

/* ═══ MATERIAL ICONS ═════════════════════════════════════ */
.material-symbols-outlined {
  font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;
  display:inline-flex; align-items:center; justify-content:center;
}

/* ═══ RESPONSIVE ═════════════════════════════════════════ */
@media (max-width: 1024px) {
  .section-title { font-size:clamp(1.75rem,4.5vw,2.8rem); }
}
@media (max-width: 768px) {
  body { cursor:auto; }
  #cursor-glow,#cursor-dot { display:none; }
  button,a { cursor:pointer; }
  .hero-title-inner { font-size:clamp(2.6rem,12vw,4.2rem); }
  .stat-item + .stat-item:hover { background:rgba(200,136,42,0.08); }
  .stat-item { padding:2.5rem 0.5rem; border-bottom:1px solid rgba(200,136,42,0.08); }
  .stat-item:hover { background:rgba(200,136,42,0.08); }
  .brand-strip-section { padding:3.5rem 0; }
  .craft-section { min-height:auto; }
  .craft-content { padding:4rem 0; }
  .btn-primary, .btn-outline { padding:0.9rem 2rem; font-size:0.68rem; }
  .faq-q { font-size:0.95rem; padding:1.25rem 1.25rem; }
  .faq-a-inner { padding:0 1.25rem 1.25rem; padding-top:1rem; }
  .about-section { background:#1a0e05; position:relative; overflow:hidden; padding:7rem 0; }
  .testimonials-section { padding:4rem 0; }
  .contact-section { padding:4rem 0; }
  .footer-lux { padding:4rem 0 2rem; }
  .how-section { padding:4rem 0; }
  .faq-section { padding:4rem 0; }
  .store-section { padding:3.5rem 0; }
}
@media (max-width: 480px) {
  .hero-title-inner { font-size:clamp(2.2rem,14vw,3.2rem); }
  .btn-primary, .btn-outline { padding:0.875rem 1.5rem; border-radius:14px; }
  .product-card { min-width:210px; max-width:230px; }
  .hero-desc {
  opacity:0; transform:translateY(20px);
  transition: opacity 1s ease 0.8s, transform 1s ease 0.8s;
  color:rgba(245,234,213,0.7); font-size:1rem; font-weight:300; line-height:2;
  max-width:540px;
}
  .form-box { padding:1.75rem; border-radius:18px; }
  .testi-card { padding:1.5rem; border-radius:16px; }
}

/* ═══ FLOATING WHATSAPP BUTTON ══════════════════════════ */
#wa-float {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  z-index: 9990;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  cursor: pointer;
}
.wa-inner {
  width: 58px; height: 58px;
  background: linear-gradient(135deg, #25d366, #128c7e);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 32px rgba(37,211,102,0.4), 0 2px 8px rgba(0,0,0,0.4);
  transition: transform 0.35s cubic-bezier(0.175,0.885,0.32,1.275), box-shadow 0.35s ease;
  position: relative; z-index: 2;
}
.wa-icon {
  width: 30px; height: 30px; color: #fff;
}
.wa-pulse {
  position: absolute; inset: 0;
  width: 58px; height: 58px;
  border-radius: 50%;
  background: rgba(37,211,102,0.4);
  animation: waPulse 2.2s ease-out infinite;
  z-index: 1;
}
.wa-tooltip {
  position: absolute;
  right: calc(100% + 14px);
  background: rgba(18,9,3,0.95);
  border: 1px solid rgba(200,136,42,0.25);
  color: var(--cream);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.5px;
  padding: 0.5rem 1rem;
  border-radius: 100px;
  white-space: nowrap;
  opacity: 0;
  transform: translateX(8px);
  transition: opacity 0.3s ease, transform 0.3s ease;
  pointer-events: none;
  backdrop-filter: blur(12px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.5);
}
.wa-tooltip::after {
  content: '';
  position: absolute;
  right: -6px; top: 50%;
  transform: translateY(-50%);
  border: 5px solid transparent;
  border-left-color: rgba(200,136,42,0.25);
}
#wa-float:hover .wa-inner {
  transform: scale(1.12);
  box-shadow: 0 12px 48px rgba(37,211,102,0.55), 0 4px 16px rgba(0,0,0,0.5);
}
#wa-float:hover .wa-tooltip {
  opacity: 1;
  transform: translateX(0);
}
@keyframes waPulse {
  0%   { transform: scale(1); opacity: 0.7; }
  70%  { transform: scale(1.65); opacity: 0; }
  100% { transform: scale(1.65); opacity: 0; }
}
@media (max-width: 480px) {
  #wa-float { bottom: 1.25rem; right: 1.25rem; }
  .wa-tooltip { display: none; }
}

/* ═══ MOBILE HORIZONTAL LAYOUT (≤ 768px) ════════════════════
   Hanya Store Photos dan Stats yang tetap berjajar horizontal
   ──────────────────────────────────────────────────────────── */
@media (max-width: 768px) {


  /* ── Stats: 2 kolom compact di mobile ── */
  .stats-section .grid {
    gap: 1rem;
  }
  .stat-item {
    padding: 1.5rem 0.35rem !important;
    border-bottom: none !important;
  }
  .stat-item + .stat-item:hover { background:rgba(200,136,42,0.08); }
  .stat-number {
    font-size: clamp(1.4rem, 5vw, 2rem) !important;
  }
  .stat-label { color:#e3a542; font-size:0.7rem; letter-spacing:3px; text-transform:uppercase; font-weight:500; }
}


.about-section .section-title { color: #f5ead5; }
.about-section .feature-pill h3 { color: #f5ead5 !important; }