@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Plus+Jakarta+Sans:wght@300;400;500;600;700&display=swap');

:root {
  --elolo-primary: #9c0062;       /* Magenta précieux */
  --elolo-primary-light: #c21a86; /* Magenta plus clair */
  --elolo-secondary: #2d1a29;     /* Prune profond */
  --elolo-accent: #d4af37;        /* Or royal */
  --elolo-bg: #fdfafc;            /* Blanc perlé chaud */
  --elolo-border: rgba(45, 26, 41, 0.08);
  --elolo-radius-lg: 30px;
}

/* --- Top Bar Carousel --- */
.elolo-topbar {
  background: var(--elolo-secondary) !important;
  color: #ffffff !important;
  padding: 10px 0 !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  text-align: center !important;
  z-index: 999 !important;
  position: relative !important;
}

.elolo-topbar-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 20px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 15px !important;
}

.elolo-topbar-nav {
  background: none !important;
  border: none !important;
  color: var(--elolo-accent) !important;
  cursor: pointer !important;
  padding: 5px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: opacity 0.2s !important;
}

.elolo-topbar-nav:hover {
  opacity: 0.8 !important;
}

.elolo-topbar-track {
  display: inline-flex !important;
  overflow: hidden !important;
  position: relative !important;
  height: 18px !important;
  align-items: center !important;
  justify-content: center !important;
  flex-grow: 1 !important;
  max-width: 600px !important;
}

.elolo-topbar-slide {
  display: none !important;
  text-align: center !important;
  width: 100% !important;
}

.elolo-topbar-slide.active {
  display: inline-block !important;
  animation: eloloFadeIn 0.5s ease-in-out !important;
}

@keyframes eloloFadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* --- Hero Section Main Style --- */
.elolo-hero {
  position: relative !important;
  overflow: hidden !important;
  padding: 100px 0 !important; /* Slightly more vertical padding */
  background: linear-gradient(135deg, #fdfafc 0%, #f7e6f3 50%, #fbf3f8 100%) !important; /* Premium warm pinkish-white gradient */
  display: flex !important;
  flex-direction: column !important;
  margin-top: 0 !important;
  z-index: 1 !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  width: 100% !important;
}

/* Background glowing blobs */
.elolo-hero-glow-blob-1 {
  position: absolute !important;
  top: 10% !important;
  right: 5% !important;
  width: 350px !important;
  height: 350px !important;
  background: radial-gradient(circle, rgba(156, 0, 98, 0.08) 0%, rgba(156, 0, 98, 0) 70%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
  border-radius: 50% !important;
  filter: blur(40px) !important;
}

.elolo-hero-glow-blob-2 {
  position: absolute !important;
  bottom: 5% !important;
  right: 25% !important;
  width: 300px !important;
  height: 300px !important;
  background: radial-gradient(circle, rgba(212, 175, 55, 0.08) 0%, rgba(212, 175, 55, 0) 70%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
  border-radius: 50% !important;
  filter: blur(40px) !important;
}

/* Fond avec watermark subtil */
.elolo-hero-bg-pattern {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" opacity="0.02" fill="%239c0062"><path d="M50 15c-5 8-15 15-20 25 5 2 10-3 15-7-2 8-5 18 5 22 8-4 5-14 3-22 5 4 10 9 15 7-5-10-15-17-20-25z"/></svg>') !important;
  background-size: 300px !important;
  pointer-events: none !important;
  opacity: 0.8 !important;
  z-index: 1 !important;
}

.elolo-hero-container {
  position: relative !important;
  z-index: 5 !important;
  width: 100% !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: 1.15fr 0.85fr !important;
  gap: 48px !important;
  align-items: center !important;
}

/* --- Left Column Content --- */
.elolo-hero-content {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  text-align: left !important;
  z-index: 2 !important;
}

.elolo-hero-tag {
  display: inline-flex !important;
  align-items: center !important;
  background: rgba(212, 175, 55, 0.08) !important;
  border: 1px solid rgba(212, 175, 55, 0.25) !important;
  color: var(--elolo-secondary) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 2px !important;
  padding: 6px 14px !important;
  border-radius: 30px !important;
  margin-bottom: 24px !important;
}

.elolo-hero-tag-text {
  color: var(--elolo-secondary) !important;
}

.elolo-hero-title {
  font-family: 'Playfair Display', serif !important;
  font-size: clamp(38px, 5.5vw, 68px) !important; /* Larger editorial scale */
  line-height: 1.1 !important; /* Tighter layout */
  font-weight: 600 !important;
  color: var(--elolo-secondary) !important;
  margin: 0 0 20px 0 !important;
  letter-spacing: -1px !important; /* Closer letters for premium feel */
}

.elolo-hero-title-line1 {
  display: block !important;
  margin-bottom: 4px !important;
}

.elolo-hero-title-line2 {
  font-family: 'Playfair Display', serif !important;
  font-style: italic !important;
  font-weight: 600 !important;
  color: var(--elolo-primary) !important;
  background: linear-gradient(135deg, var(--elolo-primary), var(--elolo-primary-light)) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block !important;
}

.elolo-hero-description {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 18px !important; /* Complies with min 16px, body 18px */
  line-height: 1.8 !important; /* breathable spacing */
  color: rgba(45, 26, 41, 0.8) !important;
  margin: 0 0 36px 0 !important;
  max-width: 520px !important;
}

.elolo-hero-actions {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
}

/* --- Buttons --- */
.elolo-hero-btn-primary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  background-color: var(--elolo-secondary) !important;
  color: #ffffff !important;
  border: 1px solid var(--elolo-secondary) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  padding: 13px 28px !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: 0 6px 18px rgba(45, 26, 41, 0.15) !important;
}

.elolo-hero-btn-primary .btn-text-mobile {
  display: none !important;
}

.elolo-hero-btn-primary:hover {
  background-color: var(--elolo-primary) !important;
  border-color: var(--elolo-accent, #d4af37) !important; /* Subtle gold accent on hover */
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 24px rgba(156, 0, 98, 0.25) !important;
  color: #ffffff !important;
}

.elolo-hero-btn-primary svg {
  transition: transform 0.3s ease !important;
}

.elolo-hero-btn-primary:hover svg {
  transform: translateX(4px) !important;
}

.elolo-hero-btn-ghost {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--elolo-secondary) !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  text-decoration: none !important;
  position: relative !important;
  padding: 8px 0 !important;
  transition: color 0.3s ease !important;
}

.elolo-hero-btn-ghost::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 2px !important;
  background-color: var(--elolo-accent) !important;
  transform: scaleX(1) !important;
  transform-origin: left !important;
  transition: transform 0.3s ease !important;
}

.elolo-hero-btn-ghost:hover {
  color: var(--elolo-primary) !important;
}

.elolo-hero-btn-ghost:hover::after {
  background-color: var(--elolo-primary) !important;
}

/* --- Right Column Visual --- */
.elolo-hero-visual {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 2 !important;
}

.elolo-hero-visual .image-wrapper-floating {
  position: relative !important;
  width: 100% !important;
  max-width: 440px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 32px !important;
  overflow: hidden !important;
  box-shadow: 0 30px 70px rgba(45, 26, 41, 0.15) !important;
  border: 1px solid rgba(212, 175, 55, 0.25) !important;
  animation: eloloFloat 6s ease-in-out infinite !important;
  z-index: 5 !important;
}

.elolo-hero-visual .hero-product-image {
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  display: block !important;
}

@media (max-width: 768px) {
  .elolo-hero-container {
    grid-template-columns: 1fr !important;
    gap: 40px !important;
    text-align: center !important;
  }
  .elolo-hero-content {
    align-items: center !important;
  }
  .elolo-hero-actions {
    justify-content: center !important;
  }
}


/* --- Bottom Reassurance features bar (Minimalist horizontal list) --- */
.elolo-features-bar {
  background: #ffffff !important; /* White bar */
  padding: 16px 0 !important;
  border-top: 1px solid rgba(45, 26, 41, 0.06) !important;
  border-bottom: 1px solid rgba(45, 26, 41, 0.06) !important;
  position: relative !important;
  z-index: 10 !important;
}

.features-grid {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  box-sizing: border-box !important;
}

.feature-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: var(--elolo-secondary) !important;
}

.feature-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--elolo-accent) !important; /* Gold icons */
  flex-shrink: 0 !important;
}

.feature-icon svg {
  width: 16px !important;
  height: 16px !important;
}

.feature-info h3 {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--elolo-secondary) !important;
  margin: 0 !important;
  letter-spacing: 0.5px !important;
}

.feature-info p {
  display: none !important; /* Hide description */
}

/* --- Body content beneath hero --- */
.homepage-body-content {
  padding: 60px 0 !important;
}

/* --- Animations (NO INITIAL OPACITY HIDING) --- */
@keyframes floating {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-12px);
  }
  100% {
    transform: translateY(0px);
  }
}

@keyframes floating-slow {
  0% {
    transform: translateY(0px) rotate(-1deg);
  }
  50% {
    transform: translateY(-6px) rotate(1deg);
  }
  100% {
    transform: translateY(0px) rotate(-1deg);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0.1;
    transform: translateY(15px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-slide-up {
  animation: fadeInUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards !important;
}

/* --- Header transparency integration fixes --- */
.zta-transparent-header + .elolo-hero {
  /* Underlay behind glassmorphic header */
  margin-top: -115px !important;
}

/* --- Responsive Layout Breakpoints --- */
@media screen and (max-width: 1024px) {
  .elolo-hero-grid {
    grid-template-columns: 1fr !important;
    text-align: center !important;
    gap: 40px !important;
    padding-bottom: 40px !important;
  }
  
  .elolo-hero-content {
    align-items: center !important;
    text-align: center !important;
  }
  
  .hero-description {
    margin: 0 auto 30px auto !important;
  }
  
  .hero-actions {
    justify-content: center !important;
  }
  
  .hero-rating-badge {
    align-items: center !important;
    margin: 0 auto !important;
  }
  
  .features-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 30px !important;
  }
}

@media screen and (max-width: 768px) {
  .elolo-hero {
    padding: 50px 0 !important;
    margin-top: 0 !important; /* Overrides negative header offset on mobile */
  }
  .elolo-hero-glow-blob-1 {
    width: 200px !important;
    height: 200px !important;
    top: 15% !important;
  }
  .elolo-hero-glow-blob-2 {
    width: 160px !important;
    height: 160px !important;
    bottom: 5% !important;
  }
  .elolo-hero-container {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
    text-align: center !important;
  }
  .elolo-hero-content {
    align-items: center !important;
    text-align: center !important;
  }
  .elolo-hero-tag {
    margin-bottom: 16px !important;
  }
  .elolo-hero-title {
    font-size: clamp(28px, 8vw, 36px) !important;
    letter-spacing: -0.5px !important;
    line-height: 1.15 !important;
  }
  .elolo-hero-description {
    font-size: 16px !important;
    line-height: 1.7 !important;
    text-align: center !important;
    max-width: 100% !important;
    margin: 0 auto 24px auto !important;
  }
  .elolo-hero-actions {
    flex-direction: column !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 280px !important;
    margin: 0 auto !important;
  }
  .elolo-hero-btn-primary,
  .elolo-hero-btn-ghost {
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }
  .elolo-hero-btn-primary .btn-text-desktop {
    display: none !important;
  }
  .elolo-hero-btn-primary .btn-text-mobile {
    display: inline-block !important;
  }
  .elolo-hero-btn-ghost {
    padding: 10px 0 !important;
  }
  .elolo-hero-visual .image-wrapper-floating {
    max-width: 280px !important;
    margin: 0 auto !important;
  }
  .elolo-hero-badge-card {
    left: 50% !important;
    transform: translateX(-50%) !important;
    bottom: 10px !important;
    animation: eloloFloatReverseMobile 6s ease-in-out infinite !important;
  }
}

@media screen and (max-width: 550px) {
  .features-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  
  .feature-item {
    justify-content: center !important;
  }
  
  .elolo-hero {
    padding-top: 130px !important;
  }
}

/*--------------------------------------------------------------
ELOLOBEAUTY TOP BAR & CAROUSEL ANNOUNCEMENT BAR
--------------------------------------------------------------*/
.elolo-top-header {
  background-color: var(--elolo-secondary) !important;
  color: #ffffff !important;
  padding: 8px 0 !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.5px !important;
  border-bottom: 1px solid rgba(212, 175, 55, 0.1) !important;
  z-index: 9999 !important;
}

.elolo-announcement-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  max-width: 1000px !important;
  margin: 0 auto !important;
  position: relative !important;
}

.elolo-announcement-btn {
  background: none !important;
  border: none !important;
  color: rgba(255, 255, 255, 0.6) !important;
  cursor: pointer !important;
  padding: 4px 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.3s ease !important;
  border-radius: 50% !important;
}

.elolo-announcement-btn:hover {
  color: var(--elolo-accent) !important;
  background-color: rgba(255, 255, 255, 0.08) !important;
}

.elolo-announcement-slider {
  flex-grow: 1 !important;
  overflow: hidden !important;
  position: relative !important;
  height: 20px !important;
}

.elolo-announcement-track {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
}

.elolo-announcement-slide {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  text-align: center !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(10px) !important;
  transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.elolo-announcement-slide.active {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}

.elolo-announcement-slide strong {
  color: var(--elolo-accent) !important;
  font-weight: 700 !important;
}


/*--------------------------------------------------------------
ELOLOBEAUTY MAIN HEADER ROW & SEARCH BAR
--------------------------------------------------------------*/
.main-header {
  background-color: var(--elolo-bg) !important;
  border-bottom: 1px solid var(--elolo-border) !important;
  padding: 20px 0 !important;
  transition: all 0.4s ease !important;
}

/* Redesign Search Bar */
.main-header-col2 {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

/* Target Advanced Search Forms */
.main-header-col2 .thunk-search-wrap,
.main-header-col2 form,
.main-header-col2 .th-advanced-search-form,
.main-header-col2 .thaps-search-box {
  width: 100% !important;
  max-width: 480px !important;
  position: relative !important;
}

/* Target the input fields */
.main-header-col2 input[type="search"],
.main-header-col2 input[type="text"],
.main-header-col2 .th-advanced-search-form input.search-field,
.main-header-col2 .th-aps-form input[type="text"],
.th-aps-form input[type="search"],
.th-aps-form input[type="text"],
.mobile-nav-bar .th-aps-form input[type="search"],
.mobile-nav-bar .th-aps-form input[type="text"] {
  width: 100% !important;
  height: 46px !important;
  padding: 0 54px 0 24px !important;
  box-sizing: border-box !important;
  background-color: rgba(45, 26, 41, 0.02) !important;
  border: 1px solid rgba(156, 0, 98, 0.08) !important;
  border-radius: 30px !important;
  color: var(--elolo-secondary) !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  outline: none !important;
}

.main-header-col2 input[type="search"]:focus,
.main-header-col2 input[type="text"]:focus,
.main-header-col2 .th-advanced-search-form input.search-field:focus,
.th-aps-form input[type="search"]:focus,
.th-aps-form input[type="text"]:focus,
.mobile-nav-bar .th-aps-form input[type="search"]:focus,
.mobile-nav-bar .th-aps-form input[type="text"]:focus {
  background-color: #ffffff !important;
  border-color: var(--elolo-primary) !important;
  box-shadow: 0 0 0 4px rgba(156, 0, 98, 0.06) !important;
}

/* Target the submit button/icon */
.main-header-col2 button[type="submit"],
.main-header-col2 .th-advanced-search-form button.search-submit,
.main-header-col2 .th-aps-form button[type="submit"],
.main-header-col2 .th-aps-form-btn,
.th-aps-form button[type="submit"],
.th-aps-form .th-aps-form-btn,
.mobile-nav-bar .th-aps-form button[type="submit"],
.mobile-nav-bar .th-aps-form .th-aps-form-btn {
  position: absolute !important;
  right: 5px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 38px !important;
  height: 38px !important;
  background-color: var(--elolo-primary) !important;
  border: none !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: transparent !important;
  font-size: 0 !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
}

.main-header-col2 button[type="submit"] svg,
.main-header-col2 .th-advanced-search-form button.search-submit svg,
.th-aps-form button[type="submit"] svg,
.th-aps-form .th-aps-form-btn svg,
.mobile-nav-bar .th-aps-form button[type="submit"] svg,
.mobile-nav-bar .th-aps-form .th-aps-form-btn svg {
  stroke: #ffffff !important;
}

.main-header-col2 button[type="submit"]:hover,
.main-header-col2 .th-advanced-search-form button.search-submit:hover,
.th-aps-form button[type="submit"]:hover,
.th-aps-form .th-aps-form-btn:hover,
.mobile-nav-bar .th-aps-form button[type="submit"]:hover,
.mobile-nav-bar .th-aps-form .th-aps-form-btn:hover {
  background-color: var(--elolo-primary-light) !important;
  transform: translateY(-50%) scale(1.05) !important;
}

.main-header-col2 button[type="submit"] i,
.main-header-col2 button[type="submit"] svg {
  color: #ffffff !important;
  font-size: 15px !important;
}


/*--------------------------------------------------------------
ELOLOBEAUTY HEADER ICONS ROW (WISHLIST, ACCOUNT, CART)
--------------------------------------------------------------*/
.thunk-icon-market {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  justify-content: flex-end !important;
}

/* Hide wishlist and account icons as requested */
.thunk-icon-market a.whishlist,
.thunk-icon-market a.account {
  display: none !important;
}

/* Individual links */
.thunk-icon-market .cart-contents a,
.thunk-icon-market .cart-contents > a,
.thunk-icon-market .taiowc-icon a {
  position: relative !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  color: var(--elolo-secondary) !important;
  margin: 0 !important;
}

/* Remove default plugin square borders */
.thunk-icon-market .cart-contents *,
.thunk-icon-market .cart-contents a {
  border-radius: 50% !important;
}
.thunk-icon-market .cart-contents i {
  border: none !important;
  background: transparent !important;
}

/* Mobile Header Clean Layout */
.responsive-main-header .main-header-bar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 15px !important;
  background: transparent !important;
}

.responsive-main-header .main-header-col1 {
  flex: 1 !important;
  max-width: 50% !important;
}

.responsive-main-header .main-header-col3 {
  flex: 1 !important;
  max-width: 50% !important;
  display: flex !important;
  justify-content: flex-end !important;
}

.responsive-main-header .main-header-col2 {
  flex: 0 0 100% !important;
  margin-top: 15px !important;
}

.responsive-main-header .menu-toggle .menu-btn {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.thunk-icon-market a.whishlist:hover,
.thunk-icon-market a.account:hover,
.thunk-icon-market .cart-contents a:hover,
.thunk-icon-market .taiowc-icon a:hover {
  border-color: var(--elolo-primary-light) !important;
  background-color: rgba(156, 0, 98, 0.02) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(156, 0, 98, 0.05) !important;
}

.thunk-icon-market svg {
  width: 20px !important;
  height: 20px !important;
  stroke: var(--elolo-secondary) !important;
  stroke-width: 1.5px !important;
  transition: stroke 0.3s ease !important;
}

.thunk-icon-market a.whishlist:hover svg,
.thunk-icon-market a.account:hover svg,
.thunk-icon-market .cart-contents a:hover svg {
  stroke: var(--elolo-primary) !important;
}

/* Cart badge positioning */
.thunk-icon-market .cart-count-item,
.cart-contents .cart-count-item {
  position: absolute !important;
  top: -4px !important;
  right: -4px !important;
  background-color: var(--elolo-cart-badge-bg, var(--elolo-accent)) !important; /* Premium Gold Badge */
  color: var(--elolo-cart-badge-text, var(--elolo-secondary)) !important; /* Gold on Dark Prune contrast */
  font-weight: 700 !important;
  font-size: 11px !important;
  min-width: 18px !important;
  height: 18px !important;
  line-height: 18px !important;
  border-radius: 10px !important;
  text-align: center !important;
  padding: 0 5px !important;
  box-shadow: 0 2px 6px rgba(45, 26, 41, 0.2) !important;
  border: 1.5px solid #ffffff !important;
}


/*--------------------------------------------------------------
ELOLOBEAUTY NAVIGATION TAB BAR & LINKS
--------------------------------------------------------------*/
.below-header {
  background-color: #ffffff !important;
  border-bottom: 1px solid var(--elolo-border) !important;
  padding: 8px 0 !important;
  transition: all 0.3s ease !important;
}

/* Center menu layout now that Category list is commented out */
.below-header-bar {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.below-header-col1 {
  display: none !important; /* hide category column since it's empty */
}

.below-header-col2 {
  width: 100% !important;
  max-width: 800px !important;
  display: flex !important;
  justify-content: center !important;
}

.below-header nav {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
}

/* Align Nav Menu */
.below-header nav ul.th-shop-mania-menu {
  display: flex !important;
  justify-content: center !important;
  gap: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.below-header nav ul.th-shop-mania-menu > li {
  position: relative !important;
  margin: 0 !important;
}

/* Nav Link Styling */
.below-header nav ul.th-shop-mania-menu > li > a {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  color: var(--elolo-secondary) !important;
  padding: 12px 0 !important;
  text-decoration: none !important;
  transition: color 0.3s ease !important;
  position: relative !important;
  display: inline-block !important;
}

.below-header nav ul.th-shop-mania-menu > li > a:hover {
  color: var(--elolo-primary) !important;
}

/* Gold Underline Animation on Hover */
.below-header nav ul.th-shop-mania-menu > li > a::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 2px !important;
  background-color: var(--elolo-accent) !important;
  transform: scaleX(0) !important;
  transform-origin: center !important;
  transition: transform 0.35s cubic-bezier(0.25, 1, 0.5, 1) !important;
}

.below-header nav ul.th-shop-mania-menu > li:hover > a {
  color: var(--elolo-primary) !important;
}

.below-header nav ul.th-shop-mania-menu > li.current-menu-item > a {
  color: var(--elolo-primary) !important;
  font-weight: 700 !important;
}

/* Mobile active menu item */
.mobile-nav-bar .th-shop-mania-menu > li.current-menu-item > a {
  color: var(--elolo-primary) !important;
  font-weight: 700 !important;
  background-color: rgba(156, 0, 98, 0.04) !important;
  border-left: 3px solid var(--elolo-primary) !important;
  padding-left: 17px !important; /* adjust for 3px border if original was 20 */
}


/*--------------------------------------------------------------
ELOLOBEAUTY STICKY / SCROLLED STYLES (GLASSMORPHISM)
--------------------------------------------------------------*/
.thsm-header.sticky-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  z-index: 99999 !important;
}

.sticky-header .main-header {
  background: rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(15px) !important;
  -webkit-backdrop-filter: blur(15px) !important;
  padding: 12px 0 !important;
  box-shadow: 0 4px 30px rgba(45, 26, 41, 0.03) !important;
  border-bottom: 1px solid rgba(156, 0, 98, 0.05) !important;
}

.sticky-header .below-header {
  background: rgba(255, 255, 255, 0.9) !important;
  backdrop-filter: blur(15px) !important;
  -webkit-backdrop-filter: blur(15px) !important;
  padding: 4px 0 !important;
  border-bottom: 1px solid rgba(156, 0, 98, 0.05) !important;
  box-shadow: 0 10px 30px rgba(45, 26, 41, 0.03) !important;
}

/* Hide announcement bar on sticky scroll to save screen space */
.sticky-header .top-header {
  display: none !important;
}


/*--------------------------------------------------------------
ELOLOBEAUTY SINGLE-ROW HEADER NAVIGATION GRID
--------------------------------------------------------------*/
@media screen and (min-width: 1025px) {
  .main-header-bar {
    display: grid !important;
    grid-template-columns: 1.2fr 2.6fr 1.2fr !important;
    align-items: center !important;
    column-gap: 30px !important;
  }
  
  .main-header-col2 {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
  }
  
  .below-header {
    display: none !important;
  }
}

.desktop-navigation {
  display: block !important;
  width: 100% !important;
}

.desktop-navigation ul.th-shop-mania-menu {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.desktop-navigation ul.th-shop-mania-menu > li {
  position: relative !important;
}

.desktop-navigation ul.th-shop-mania-menu > li > a {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  color: var(--elolo-secondary) !important;
  padding: 12px 0 !important;
  text-decoration: none !important;
  transition: color 0.3s ease !important;
  display: inline-block !important;
  position: relative !important;
}

.desktop-navigation ul.th-shop-mania-menu > li > a:hover {
  color: var(--elolo-primary) !important;
}

/* Elegant gold underline on hover */
.desktop-navigation ul.th-shop-mania-menu > li > a::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 2px !important;
  background-color: var(--elolo-accent) !important;
  transform: scaleX(0) !important;
  transform-origin: center !important;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.desktop-navigation ul.th-shop-mania-menu > li > a:hover::after {
  transform: scaleX(1) !important;
}


/*--------------------------------------------------------------
ELOLOBEAUTY SLIDE-DOWN SEARCH OVERLAY
--------------------------------------------------------------*/
.elolo-search-overlay {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: var(--elolo-bg) !important;
  z-index: 1000 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(-10px) !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
  display: flex !important;
  align-items: center !important;
  box-shadow: 0 8px 30px rgba(45, 26, 41, 0.04) !important;
}

.elolo-search-overlay.open {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}

.elolo-search-overlay-container {
  width: 100% !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  box-sizing: border-box !important;
}

.elolo-search-overlay-content {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 30px !important;
}

.elolo-search-box-wrap {
  flex-grow: 1 !important;
  max-width: 600px !important;
  margin: 0 auto !important;
  position: relative !important;
}

/* Style the search inputs in the overlay */
.elolo-search-overlay input[type="search"],
.elolo-search-overlay input[type="text"],
.elolo-search-overlay .th-advanced-search-form input.search-field,
.elolo-search-overlay .th-aps-form input[type="text"] {
  width: 100% !important;
  height: 48px !important;
  padding: 0 60px 0 28px !important;
  background-color: rgba(45, 26, 41, 0.03) !important;
  border: 1px solid rgba(156, 0, 98, 0.1) !important;
  border-radius: 30px !important;
  color: var(--elolo-secondary) !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  transition: all 0.3s ease !important;
  outline: none !important;
}

.elolo-search-overlay input[type="search"]:focus,
.elolo-search-overlay input[type="text"]:focus {
  background-color: #ffffff !important;
  border-color: var(--elolo-primary) !important;
  box-shadow: 0 0 0 4px rgba(156, 0, 98, 0.08) !important;
}

/* Search button inside overlay search box */
.elolo-search-overlay button[type="submit"],
.elolo-search-overlay .th-advanced-search-form button.search-submit,
.elolo-search-overlay .th-aps-form button[type="submit"],
.elolo-search-overlay .th-aps-form-btn {
  position: absolute !important;
  right: 6px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 36px !important;
  height: 36px !important;
  background-color: var(--elolo-primary) !important;
  border: none !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #ffffff !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
}

.elolo-search-overlay button[type="submit"]:hover {
  background-color: var(--elolo-primary-light) !important;
  transform: translateY(-50%) scale(1.05) !important;
}

/* Search close button */
.elolo-search-close {
  background: none !important;
  border: none !important;
  color: var(--elolo-secondary) !important;
  cursor: pointer !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid var(--elolo-border) !important;
  transition: all 0.3s ease !important;
  background-color: #ffffff !important;
}

.elolo-search-close:hover {
  background-color: rgba(156, 0, 98, 0.05) !important;
  border-color: var(--elolo-primary-light) !important;
  color: var(--elolo-primary) !important;
  transform: rotate(90deg) !important;
}


/*--------------------------------------------------------------
ELOLOBEAUTY ICON BAR SEARCH TOGGLE
--------------------------------------------------------------*/
.thunk-icon-market a.elolo-search-toggle {
  position: relative !important;
  width: 44px !important;
  height: 44px !important;
  border: 1px solid var(--elolo-border) !important;
  background-color: #ffffff !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  color: var(--elolo-secondary) !important;
  margin: 0 !important;
}

.thunk-icon-market a.elolo-search-toggle:hover {
  border-color: var(--elolo-primary-light) !important;
  background-color: rgba(156, 0, 98, 0.02) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(156, 0, 98, 0.05) !important;
}

.thunk-icon-market a.elolo-search-toggle:hover svg {
  stroke: var(--elolo-primary) !important;
}


/*--------------------------------------------------------------
ELOLOBEAUTY HERO VISUAL (ZURA ALIGNMENT & TREATMENT)
--------------------------------------------------------------*/
.elolo-hero-visual .image-wrapper-floating {
  max-width: 450px !important;
  aspect-ratio: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  animation: floating 6s ease-in-out infinite !important;
}

.elolo-hero-visual .hero-product-image {
  border-radius: 30px !important;
  box-shadow: 0 20px 50px rgba(45, 26, 41, 0.12) !important;
  border: 4px solid #ffffff !important;
  width: 100% !important;
  height: auto !important;
}

/* Adjustments for sticky scroll header with new single row grid */
.sticky-header .main-header-bar {
  padding: 4px 0 !important;
}


/*--------------------------------------------------------------
HIDE OLD ELEMENTOR HERO FOR GOOD
--------------------------------------------------------------*/
.home [data-elementor-id="54"] > .elementor-section:first-of-type,
.home .elementor-54 > .elementor-section:first-of-type,
.home #content article.page [data-elementor-id="54"] > .elementor-section:first-of-type {
  display: none !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  visibility: hidden !important;
}

/*--------------------------------------------------------------
ELOLOBEAUTY — TRUST STRIP
--------------------------------------------------------------*/
.elolo-trust-strip {
  background: #ffffff !important;
  padding: 18px 0 !important;
  border-top: 1px solid var(--elolo-border) !important;
  border-bottom: 1px solid rgba(212, 175, 55, 0.15) !important;
}
.elolo-trust-strip-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  box-sizing: border-box !important;
}
.elolo-trust-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
.elolo-trust-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  background: rgba(212, 175, 55, 0.08) !important;
  border-radius: 50% !important;
  color: var(--elolo-accent) !important;
  flex-shrink: 0 !important;
}
.elolo-trust-icon svg { width: 16px !important; height: 16px !important; }
.elolo-trust-text {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--elolo-secondary) !important;
  letter-spacing: 0.3px !important;
}
.elolo-trust-divider {
  width: 1px !important;
  height: 24px !important;
  background: rgba(45, 26, 41, 0.08) !important;
  flex-shrink: 0 !important;
}
/*--------------------------------------------------------------
ELOLOBEAUTY — SECTION TITLES ORNAMENT (shared)
--------------------------------------------------------------*/
.elolo-section-title-wrap { text-align: center !important; margin-bottom: 48px !important; }
.elolo-section-label {
  display: inline-block !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 3px !important;
  color: var(--elolo-accent) !important;
  margin-bottom: 12px !important;
}
.elolo-section-title {
  font-family: 'Playfair Display', serif !important;
  font-size: clamp(28px, 3vw, 40px) !important;
  font-weight: 600 !important;
  color: var(--elolo-secondary) !important;
  margin: 0 0 16px 0 !important;
  line-height: 1.2 !important;
}
.elolo-section-title.light { color: #ffffff !important; }
.elolo-section-title.gold { color: var(--elolo-accent) !important; }
.elolo-section-title.magenta { color: var(--elolo-primary) !important; }
.elolo-section-ornament {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  margin-top: 4px !important;
}
.elolo-section-ornament-line {
  height: 1px !important;
  width: 50px !important;
  background: linear-gradient(to right, transparent, var(--elolo-accent)) !important;
}
.elolo-section-ornament-line.right {
  background: linear-gradient(to left, transparent, var(--elolo-accent)) !important;
}
.elolo-section-ornament-diamond {
  width: 6px !important;
  height: 6px !important;
  background: var(--elolo-accent) !important;
  transform: rotate(45deg) !important;
  flex-shrink: 0 !important;
}
.elolo-section-subtitle {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  color: rgba(45, 26, 41, 0.65) !important;
  max-width: 520px !important;
  margin: 16px auto 0 !important;
  line-height: 1.65 !important;
}
.elolo-section-subtitle.light { color: rgba(255,255,255,0.65) !important; }
/*--------------------------------------------------------------
ELOLOBEAUTY — PRODUCTS GRID v3 (Liquid Glass Premium)
--------------------------------------------------------------*/
/* Styles v3 définis dans le template inline — synchronisation externe */
/* Wishlist icon */
.elolo-product-card-wishlist { position: absolute !important; top: 12px !important; right: 12px !important; width: 36px !important; height: 36px !important; background: rgba(255,255,255,0.85) !important; backdrop-filter: blur(8px) !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; z-index: 2 !important; border: none !important; transition: opacity 0.3s ease, transform 0.3s ease !important; opacity: 0 !important; transform: scale(0.8) !important; }
.elolo-product-card:hover .elolo-product-card-wishlist { opacity: 1 !important; transform: scale(1) !important; }
/* Séparateur produit card */
.elolo-product-card-separator { height: 1px !important; background: rgba(212,175,55,0.15) !important; margin: 2px 0 !important; }
/* Compteur avis */
.elolo-product-card-stars-count { font-family: 'Plus Jakarta Sans', sans-serif !important; font-size: 12px !important; color: rgba(45,26,41,0.45) !important; margin-left: 5px !important; }
/* CTA wrap */
.elolo-products-cta-wrap { text-align: center !important; margin-top: 52px !important; }
/* Suppression des overrides de grille obsolètes — gérés inline dans le template */
/*--------------------------------------------------------------
ELOLOBEAUTY — INGREDIENTS BENTO
--------------------------------------------------------------*/
.elolo-ingredients-section {
  background: var(--elolo-secondary) !important;
  padding: 80px 0 !important;
  position: relative !important;
  overflow: hidden !important;
}
.elolo-ingredients-section::before,
.elolo-ingredients-section::after {
  display: none !important;
  content: none !important;
}
.elolo-ingredients-inner {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  box-sizing: border-box !important;
}
.elolo-bento-grid {
  display: grid !important;
  grid-template-columns: 1.4fr 1fr !important;
  grid-template-rows: auto auto !important;
  gap: 16px !important;
}
.elolo-bento-card {
  position: relative !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  border: 1px solid rgba(212, 175, 55, 0.3) !important;
  background: rgba(255, 255, 255, 0.04) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.elolo-bento-card:hover {
  border-color: rgba(212, 175, 55, 0.65) !important;
  transform: translateY(-3px) !important;
}
.elolo-bento-card.large { grid-row: span 2 !important; }
.elolo-bento-card-img {
  width: 100% !important;
  height: 100% !important;
  min-height: 180px !important;
  object-fit: cover !important;
  display: block !important;
  opacity: 0.85 !important;
  transition: opacity 0.3s ease !important;
}
.elolo-bento-card.large .elolo-bento-card-img { min-height: 320px !important; }
.elolo-bento-card:hover .elolo-bento-card-img { opacity: 1 !important; }
.elolo-bento-card-overlay {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  padding: 20px !important;
  background: linear-gradient(to top, rgba(45,26,41,0.9) 0%, transparent 100%) !important;
}
.elolo-bento-badge {
  display: inline-block !important;
  background: var(--elolo-accent) !important;
  color: var(--elolo-secondary) !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  padding: 4px 10px !important;
  border-radius: 20px !important;
  margin-bottom: 8px !important;
}
.elolo-bento-card-title {
  font-family: 'Playfair Display', serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  margin: 0 0 4px 0 !important;
}
.elolo-bento-card.large .elolo-bento-card-title { font-size: 26px !important; }
.elolo-bento-card-desc {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  color: rgba(255,255,255,0.75) !important;
  margin: 0 !important;
  line-height: 1.5 !important;
}
.elolo-bento-tagline {
  text-align: center !important;
  padding: 20px !important;
  background: rgba(212,175,55,0.08) !important;
  border-radius: 16px !important;
  border: 1px solid rgba(212,175,55,0.2) !important;
  margin-top: 4px !important;
  grid-column: span 2 !important;
}
.elolo-bento-tagline p {
  font-family: 'Playfair Display', serif !important;
  font-style: italic !important;
  font-size: 18px !important;
  color: var(--elolo-accent) !important;
  margin: 0 !important;
}
@media (max-width: 768px) {
  .elolo-bento-grid { grid-template-columns: 1fr !important; }
  .elolo-bento-card.large { grid-row: span 1 !important; }
  .elolo-bento-tagline { grid-column: span 1 !important; }
}
/*--------------------------------------------------------------
ELOLOBEAUTY — TESTIMONIALS BENTO
--------------------------------------------------------------*/
.elolo-testimonials-section {
  background: linear-gradient(160deg, #fdfafc 0%, #f9eef5 60%, #fbf3f8 100%) !important;
  padding: 80px 0 !important;
}
.elolo-testimonials-inner {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  box-sizing: border-box !important;
}
.elolo-testimonials-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 20px !important;
}
.elolo-testimonial-card {
  background: #ffffff !important;
  border-radius: 20px !important;
  padding: 28px !important;
  border-left: 3px solid var(--elolo-accent) !important;
  box-shadow: 0 4px 20px rgba(45,26,41,0.05) !important;
  transition: all 0.3s ease !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}
.elolo-testimonial-card:hover { transform: translateY(-4px) !important; box-shadow: 0 12px 35px rgba(45,26,41,0.1) !important; }
.elolo-testimonial-stars { display: flex !important; gap: 3px !important; }
.elolo-testimonial-stars svg { width: 14px !important; height: 14px !important; fill: var(--elolo-accent) !important; }
.elolo-testimonial-text {
  font-family: 'Playfair Display', serif !important;
  font-style: italic !important;
  font-size: 15px !important;
  color: var(--elolo-secondary) !important;
  line-height: 1.7 !important;
  margin: 0 !important;
  flex-grow: 1 !important;
}
.elolo-testimonial-author { display: flex !important; align-items: center !important; gap: 8px !important; }
.elolo-testimonial-author-name {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--elolo-secondary) !important;
}
.elolo-testimonial-verified {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: #2f88ff !important;
}
.elolo-testimonial-verified svg { width: 14px !important; height: 14px !important; fill: #2f88ff !important; }
@media (max-width: 768px) { .elolo-testimonials-grid { grid-template-columns: 1fr !important; } }
/*--------------------------------------------------------------
ELOLOBEAUTY — BRAND STORY
--------------------------------------------------------------*/
.elolo-story-section {
  background: #ffffff !important;
  padding: 80px 0 !important;
}
.elolo-story-inner {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 64px !important;
  align-items: center !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  box-sizing: border-box !important;
}
.elolo-story-image-wrap {
  position: relative !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  box-shadow: 0 20px 60px rgba(45,26,41,0.12) !important;
}
.elolo-story-image-wrap img {
  width: 100% !important;
  min-height: 420px !important;
  object-fit: cover !important;
  display: block !important;
}
.elolo-story-content { display: flex !important; flex-direction: column !important; gap: 24px !important; }
.elolo-story-quote {
  font-family: 'Playfair Display', serif !important;
  font-style: italic !important;
  font-size: clamp(22px, 2.5vw, 30px) !important;
  font-weight: 600 !important;
  color: var(--elolo-secondary) !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  padding-left: 24px !important;
  border-left: 3px solid var(--elolo-accent) !important;
}
.elolo-story-body {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  color: rgba(45,26,41,0.7) !important;
  line-height: 1.75 !important;
  margin: 0 !important;
}
.elolo-story-cta {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: var(--elolo-primary) !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: gap 0.3s ease !important;
}
.elolo-story-cta:hover { gap: 14px !important; }
@media (max-width: 768px) { .elolo-story-inner { grid-template-columns: 1fr !important; gap: 40px !important; } }

/* Mobile Menu Close Styling */
.menu-close {
  background-color: transparent !important;
  text-align: right !important;
  padding: 20px 20px 0 20px !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  border-bottom: none !important;
}
.menu-close .menu-close-btn {
  color: var(--elolo-secondary) !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  position: relative !important;
  padding-right: 30px !important;
  display: inline-flex !important;
  align-items: center !important;
  text-decoration: none !important;
  transition: color 0.3s ease !important;
}
.menu-close .menu-close-btn:hover {
  color: var(--elolo-primary) !important;
}
.menu-close .menu-close-btn:before, 
.menu-close .menu-close-btn:after {
  content: ' ' !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  width: 16px !important;
  height: 2px !important;
  background-color: currentColor !important;
  margin-top: -1px !important;
  transition: transform 0.3s ease !important;
}
.menu-close .menu-close-btn:before {
  transform: rotate(45deg) !important;
}
.menu-close .menu-close-btn:after {
  transform: rotate(-45deg) !important;
}
.menu-close .menu-close-btn:hover:before {
  transform: rotate(135deg) !important;
}
.menu-close .menu-close-btn:hover:after {
  transform: rotate(45deg) !important;
}

/* --- Hero Section Floating & Parallax Badges & Keyframes --- */
.elolo-hero-badge-card {
  position: absolute !important;
  bottom: 40px !important;
  left: -30px !important;
  background: rgba(253, 250, 252, 0.8) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border: 1px solid rgba(212, 175, 55, 0.3) !important;
  border-radius: 16px !important;
  padding: 12px 20px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  box-shadow: 0 15px 35px rgba(45, 26, 41, 0.1) !important;
  z-index: 10 !important;
  animation: eloloFloatReverse 6s ease-in-out infinite !important;
}

.elolo-hero-badge-card .badge-icon {
  color: var(--elolo-accent, #d4af37) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
}

.elolo-hero-badge-card .badge-text {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--elolo-secondary, #2d1a29) !important;
  letter-spacing: 0.5px !important;
  white-space: nowrap !important;
}

@keyframes eloloFloat {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-12px); }
  100% { transform: translateY(0px); }
}

@keyframes eloloFloatReverse {
  0% { transform: translateY(0px); }
  50% { transform: translateY(8px); }
  100% { transform: translateY(0px); }
}

@keyframes eloloFloatReverseMobile {
  0% { transform: translate(-50%, 0px); }
  50% { transform: translate(-50%, 8px); }
  100% { transform: translate(-50%, 0px); }
}

@media (max-width: 768px) {
  .elolo-hero-badge-card {
    left: 50% !important;
    transform: translateX(-50%) !important;
    bottom: 10px !important;
    animation: eloloFloatReverseMobile 6s ease-in-out infinite !important;
  }
}


