/**
 * Homepage v2 — Clean luxury perfumery
 */

/* Prevent horizontal scrollbar from 100vw breakout elements */
body.home {
  overflow-x: hidden;
}

/* Kill the old secondary / top bar if it somehow shows */
body #top .nectar-box-roll,
body #header-secondary-outer {
  display: none !important;
}

/* ── Mega Menu Dropdown Styling ── */
body .nectar-global-section-megamenu {
  padding: 0 !important;
  border-radius: 12px !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.12), 0 4px 16px rgba(0,0,0,0.06) !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
  overflow: hidden !important;
}

body .nectar-global-section-megamenu .inner {
  padding: 0 !important;
}

body .nectar-global-section-megamenu .vc_row {
  padding: 0 !important;
  margin: 0 !important;
}

body .nectar-global-section-megamenu .vc_column-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Promo image column */
body .nectar-global-section-megamenu .megamenu-promo {
  border-radius: 0 !important;
}

/* ── Mega Menu: Promo Panel ── */
.mm-promo {
  position: relative;
  overflow: hidden;
  height: 100%;
  min-height: 340px;
  background: #f5efe6;
}

.mm-promo > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}

.mm-promo-overlay {
  position: relative;
  z-index: 2;
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  height: 100%;
  min-height: 340px;
  background: linear-gradient(to top, rgba(0,0,0,0.82) 0%, rgba(0,0,0,0.4) 50%, rgba(0,0,0,0.1) 100%);
}

.mm-promo-overlay h4 {
  font-family: 'Playfair Display', serif !important;
  font-size: 22px !important;
  color: #fff !important;
  margin: 0 0 8px !important;
  line-height: 1.3 !important;
}

.mm-promo-overlay p {
  font-size: 13px !important;
  color: rgba(255,255,255,0.8) !important;
  margin: 0 0 16px !important;
  line-height: 1.5 !important;
}

.mm-promo-overlay > a {
  display: inline-block !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #fff !important;
  text-decoration: none !important;
  letter-spacing: 0.5px !important;
  border-bottom: 1px solid rgba(255,255,255,0.5) !important;
  padding-bottom: 2px !important;
  width: fit-content !important;
}

.mm-promo-overlay > a:hover {
  border-bottom-color: #fff !important;
}

/* ── Mega Menu: Category Grid ── */
.mm-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 24px 40px !important;
  padding: 8px 0 !important;
}

.mm-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 14px !important;
  text-decoration: none !important;
  color: inherit !important;
  padding: 10px 0 !important;
  transition: opacity 0.2s ease !important;
}

.mm-item:hover {
  opacity: 0.8 !important;
}

.mm-item:hover strong {
  color: #b8860b !important;
}

.mm-icon {
  font-size: 24px !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
  width: 32px !important;
  text-align: center !important;
}

.mm-text {
  display: flex !important;
  flex-direction: column !important;
}

.mm-text strong {
  display: block !important;
  font-size: 14px !important;
  color: #1a1a1a !important;
  margin-bottom: 3px !important;
  transition: color 0.2s !important;
}

.mm-desc {
  font-size: 12.5px !important;
  color: #777 !important;
  line-height: 1.4 !important;
}

/* ── Mega Menu: Footer link ── */
.mm-footer {
  border-top: 1px solid #eee !important;
  padding-top: 16px !important;
  margin-top: 8px !important;
}

.mm-footer a {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #b8860b !important;
  text-decoration: none !important;
  letter-spacing: 0.3px !important;
}

.mm-footer a:hover {
  color: #96700a !important;
}

/* Hide hamburger on desktop — all nav is inline */
@media (min-width: 1000px) {
  body #header-outer .slide-out-widget-area-toggle:not(.mobile-icon) {
    display: none !important;
  }
}

/* ============================================================
   HERO — Static full-width image with overlay
   ============================================================ */
.dp-hero-static {
  position: relative;
  min-height: 560px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.dp-hero-static .dp-hero-overlay {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 60px 24px 40px;
  max-width: 700px;
}

.dp-hero-static .dp-hero-overlay h1 {
  font-family: 'Playfair Display', serif !important;
  font-size: 46px !important;
  color: #fff !important;
  margin: 0 0 16px !important;
  line-height: 1.15 !important;
  text-shadow: 0 2px 20px rgba(0,0,0,0.4);
}

.dp-hero-static .dp-hero-overlay p {
  font-family: 'Inter', sans-serif;
  font-size: 17px;
  color: rgba(255,255,255,0.9);
  margin: 0 0 28px;
  line-height: 1.6;
  text-shadow: 0 1px 8px rgba(0,0,0,0.3);
}

.dp-hero-static .dp-hero-cta {
  display: inline-block;
  padding: 14px 40px;
  background: #b8860b;
  color: #fff;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 3px;
  transition: background 0.3s;
}

.dp-hero-static .dp-hero-cta:hover {
  background: #96700a;
  color: #fff;
}

.dp-hero-cta--outline {
  background: transparent !important;
  border: 1.5px solid #fff;
}

.dp-hero-cta--outline:hover {
  background: #fff !important;
  color: #1a1a1a !important;
}

.dp-hero-ctas {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
}

/* Hero Content Block — standalone section with gradient bg */
.dp-hero-content {
  background: linear-gradient(135deg, #1a1209 0%, #3d2b10 100%);
  text-align: center;
  padding: 50px 24px 44px;
  color: #fff;
}

.dp-hero-content h1 {
  font-family: 'Playfair Display', serif !important;
  font-size: 38px !important;
  color: #fff !important;
  margin: 0 0 14px !important;
  line-height: 1.2 !important;
}

.dp-hero-content p {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  color: rgba(255,255,255,0.85);
  margin: 0 auto 22px;
  line-height: 1.6;
  max-width: 700px;
}

@media (max-width: 999px) {
  .dp-hero-content {
    padding: 36px 20px 32px;
  }
  .dp-hero-content h1 {
    font-size: 26px !important;
  }
  .dp-hero-content p {
    font-size: 14px;
  }
}

/* Hero trust bar */
.dp-hero-trust {
  margin-bottom: 12px;
}

.dp-hero-trust__stars {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: #b8860b;
  background: rgba(0,0,0,0.4);
  padding: 6px 16px;
  border-radius: 20px;
  display: inline-block;
}

.dp-hero-trust__bar {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 24px;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  color: rgba(255,255,255,0.85);
  letter-spacing: 0.3px;
}

@media (max-width: 999px) {
  .dp-hero-trust__bar {
    gap: 8px;
    font-size: 11px;
  }
  .dp-hero-ctas {
    flex-direction: column;
    align-items: center;
  }
}

/* Hero content CTAs */
.dp-hero-content .dp-hero-cta {
  display: inline-block;
  padding: 14px 40px;
  background: #e8c97a;
  color: #1a1209;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 3px;
  border: none;
  transition: background 0.3s, color 0.3s;
}

.dp-hero-content .dp-hero-cta:hover {
  background: #d4b565;
  color: #1a1209;
}

.dp-hero-content .dp-hero-cta--outline {
  background: transparent;
  border: 1.5px solid #fff;
  color: #fff;
}

.dp-hero-content .dp-hero-cta--outline:hover {
  background: #fff;
  color: #1a1209;
}

/* Hide floating currency switcher — moved to header */
.woo-multi-currency.wmc-sidebar {
  display: none !important;
}

/* Currency switcher — pill buttons in header */
.dp-currency-switch {
  display: flex !important;
  align-items: center;
}

.dp-currency-pills {
  display: flex;
  align-items: center;
  gap: 2px;
  background: rgba(0,0,0,0.06);
  border-radius: 6px;
  padding: 2px;
}

.dp-currency-pill {
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 10px;
  text-decoration: none !important;
  color: #999;
  transition: all 0.2s;
  letter-spacing: 0.5px;
  border-radius: 4px;
  line-height: 1;
}

.dp-currency-pill--active {
  background: #b8860b !important;
  color: #fff !important;
  box-shadow: 0 1px 3px rgba(184,134,11,0.3);
}

.dp-currency-pill:hover:not(.dp-currency-pill--active) {
  color: #1a1a1a;
}

body.home .dp-currency-pill--active {
  color: #fff !important;
}

body.home:not(.dp-scrolled) .dp-currency-pills {
  background: rgba(255,255,255,0.12);
}

body.home:not(.dp-scrolled) .dp-currency-pill {
  color: rgba(255,255,255,0.5);
}

body.home:not(.dp-scrolled) .dp-currency-pill--active {
  background: #b8860b;
  color: #fff;
}

/* Hide language switcher */
.dp-lang-switch {
  display: none !important;
}

/* Hide currency switcher on mobile */
@media (max-width: 999px) {
  .dp-currency-switch {
    display: none !important;
  }
}

/* ============================================================
   Mobile slide-out menu restyle
   ============================================================ */
#slide-out-widget-area {
  background: #1a1209 !important;
}

#slide-out-widget-area .inner-wrap {
  padding: 20px 0 !important;
}

/* Close button */
#slide-out-widget-area .slide_out_area_close .close-line {
  background: #fff !important;
}

/* Hide duplicate mobile-only menu (second container has the real items) */
#slide-out-widget-area .off-canvas-menu-container.mobile-only {
  display: none !important;
}

/* Hide currency/lang switcher and secondary items in slide-out */
#slide-out-widget-area .dp-currency-switch,
#slide-out-widget-area .dp-lang-switch,
#slide-out-widget-area .trp-language-switcher-container,
#slide-out-widget-area .secondary-header-items {
  display: none !important;
}

/* Menu items styling */
#slide-out-widget-area .off-canvas-menu-container .menu > li > a {
  font-family: 'Playfair Display', serif !important;
  font-size: 22px !important;
  color: #fff !important;
  padding: 14px 32px !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  text-decoration: none !important;
  display: block;
}

#slide-out-widget-area .off-canvas-menu-container .menu > li > a:hover {
  color: #e8c97a !important;
}

/* Submenu: style only, let Salient JS handle open/close via inline max-height */
#slide-out-widget-area .off-canvas-menu-container .sub-menu {
  background: rgba(255,255,255,0.05) !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  overflow: hidden;
}

/* Submenu items */
#slide-out-widget-area .off-canvas-menu-container .sub-menu li a {
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  color: rgba(255,255,255,0.7) !important;
  padding: 10px 32px 10px 48px !important;
  text-decoration: none !important;
}

#slide-out-widget-area .off-canvas-menu-container .sub-menu li a:hover {
  color: #e8c97a !important;
}

/* Submenu toggle arrow */
#slide-out-widget-area .off-canvas-menu-container .menu > li.menu-item-has-children > a::after {
  color: #b8860b !important;
}

/* Sub-submenu category labels */
#slide-out-widget-area .off-canvas-menu-container .sub-menu .menu-item-has-children > a[href="#"] {
  font-weight: 600 !important;
  color: rgba(255,255,255,0.4) !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  padding-top: 16px !important;
}

/* Force all text white in slide-out menu — override salient-dynamic-styles */
body #slide-out-widget-area,
body #slide-out-widget-area.slide-out-from-right-hover,
body #slide-out-widget-area .off-canvas-menu-container,
body #slide-out-widget-area .off-canvas-menu-container a,
body #slide-out-widget-area .off-canvas-menu-container .menu li a {
  color: #fff !important;
}

body #slide-out-widget-area .off-canvas-menu-container .menu > li > a:hover,
body #slide-out-widget-area .off-canvas-menu-container li.open > a {
  color: #e8c97a !important;
}

body #slide-out-widget-area .off-canvas-menu-container .sub-menu a {
  color: rgba(255,255,255,0.7) !important;
}

body #slide-out-widget-area .off-canvas-menu-container .sub-menu a:hover {
  color: #e8c97a !important;
}

/* Remove Salient separators and borders */
#slide-out-widget-area .off-canvas-menu-container .menu > li {
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

#slide-out-widget-area .off-canvas-menu-container .menu > li::before,
#slide-out-widget-area .off-canvas-menu-container .menu > li::after {
  display: none !important;
}

/* Remove bottom border on last item */
#slide-out-widget-area .off-canvas-menu-container .menu > li:last-child > a {
  border-bottom: none !important;
}

/* Background overlay */
#slide-out-widget-area-bg.slide-out-from-right-hover {
  background: rgba(0,0,0,0.6) !important;
}

/* Header icons — white on homepage before scroll, black after scroll */
body.home:not(.dp-scrolled) #header-outer #top nav > ul.buttons > li#search-btn > div > a,
body.home:not(.dp-scrolled) #header-outer #top nav > ul.buttons > li#nectar-user-account > div > a,
body.home:not(.dp-scrolled) #header-outer #top nav > ul.buttons > li#search-btn span,
body.home:not(.dp-scrolled) #header-outer #top nav > ul.buttons > li#nectar-user-account span,
body.home:not(.dp-scrolled) #header-outer #top nav > ul.buttons > li.nectar-woo-cart i {
  color: #fff !important;
}

/* Mobile icons — white before scroll on homepage */
body.home:not(.dp-scrolled) #header-outer .slide-out-widget-area-toggle a .lines,
body.home:not(.dp-scrolled) #header-outer .slide-out-widget-area-toggle a .lines::before,
body.home:not(.dp-scrolled) #header-outer .slide-out-widget-area-toggle a .lines::after {
  background: #fff !important;
}

body.home:not(.dp-scrolled) #header-outer #top a.mobile-search span.icon-salient-search,
body.home:not(.dp-scrolled) #header-outer #top a#mobile-cart-link i.icon-salient-cart,
body.home:not(.dp-scrolled) #header-outer #top .slide-out-widget-area-toggle.mobile-icon a {
  color: #fff !important;
}

/* Hero row override — keep Salient's full-width breakout margins intact */
.dp-hero-row {
  padding: 0 !important;
}

.dp-hero-row > .col,
.dp-hero-row .vc_column-inner,
.dp-hero-row .wpb_raw_code,
.dp-hero-row .wpb_wrapper {
  padding: 0 !important;
  margin: 0 !important;
  max-width: none !important;
}

@media (max-width: 999px) {
  .dp-hero-static {
    min-height: 220px;
    background-size: 100% auto;
    background-position: center center;
    background-color: #1a1209;
  }
  .dp-hero-static .dp-hero-overlay h1 {
    font-size: 30px !important;
  }
  .dp-hero-static .dp-hero-overlay p {
    font-size: 15px;
  }
}

/* ============================================================
   SCROLLING MARQUEE BAR — Gold reassurance strip
   ============================================================ */
.dp-scrollbar {
  background: #b8860b;
  overflow: hidden;
  white-space: nowrap;
  padding: 12px 0;
}

.dp-scrollbar__track {
  display: inline-flex;
  animation: dp-marquee 20s linear infinite;
}

.dp-scrollbar__item {
  color: #fff;
  font-size: 13px;
  font-family: 'Inter', sans-serif;
  font-weight: 500;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding: 0 32px;
}

@keyframes dp-marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* Scrollbar row: remove Salient padding */
.dp-scrollbar-row,
.dp-scrollbar-row .vc_column-inner,
.dp-scrollbar-row .wpb_raw_code {
  padding: 0 !important;
  margin: 0 !important;
}

/* ============================================================
   CATEGORY GRID — 3-column gender categories
   ============================================================ */
.dp-catgrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
  padding: 0;
  padding-bottom: 70px;
}

.dp-catgrid__card {
  position: relative;
  height: 420px;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  transition: transform 0.3s ease;
  text-decoration: none;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #1a1a1a;
}

.dp-catgrid__card:hover {
  transform: scale(1.02);
}

.dp-catgrid__card--homme {
  background-image: url('/wp-content/uploads/2024/12/univers-homme-dubai-parfumerie.webp');
}
.dp-catgrid__card--femme {
  background-image: url('/wp-content/uploads/2024/12/univers-femme-dubai-parfumerie.webp');
}
.dp-catgrid__card--mixte {
  background-image: url('/wp-content/uploads/2024/12/univers-mixte-dubai-parfumerie.webp');
}

.dp-catgrid__label {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 24px;
  background: linear-gradient(to top, rgba(0,0,0,0.5), transparent);
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-family: 'Inter', sans-serif;
}

/* Catgrid row: remove Salient padding */
.dp-catgrid-row,
.dp-catgrid-row .vc_column-inner,
.dp-catgrid-row .wpb_raw_code {
  padding: 0 !important;
  margin: 0 !important;
}

@media (max-width: 999px) {
  .dp-catgrid {
    grid-template-columns: repeat(2, 1fr);
  }
  .dp-catgrid__card {
    height: 300px;
  }
}

/* ============================================================
   HIDE OLD HERO SECTIONS (replaced by dp-hero-static)
   ============================================================ */
.home_header,
.home_header_m,
.home_header_icons,
.home_header_icons_m {
  display: none !important;
}

/* ============================================================
   SECTION HEADINGS — Consistent luxury typography
   ============================================================ */
.dp-section-title {
  font-family: 'Playfair Display', serif !important;
  font-size: 32px !important;
  color: #1a1a1a !important;
  text-align: center !important;
  margin: 0 0 8px !important;
  line-height: 1.2 !important;
}

.dp-section-subtitle {
  font-family: 'Inter', sans-serif !important;
  font-size: 15px !important;
  color: #777 !important;
  text-align: center !important;
  margin: 0 0 32px !important;
  line-height: 1.5 !important;
}

/* ============================================================
   FEATURE SECTION — Coffrets / Échantillons (beige bg)
   ============================================================ */
.dp-feature-row {
  background: #f5efe6 !important;
}

.dp-feature-row .dp-feature-text h2 {
  font-family: 'Playfair Display', serif !important;
  font-size: 30px !important;
  color: #1a1a1a !important;
  margin: 0 0 12px !important;
}

.dp-feature-row .dp-feature-text p {
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  color: #555;
  line-height: 1.7;
  margin: 0 0 24px;
}

.dp-feature-row .dp-feature-cta {
  display: inline-block;
  padding: 12px 32px;
  background: #b8860b;
  color: #fff;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 3px;
  transition: background 0.3s;
}

.dp-feature-row .dp-feature-cta:hover {
  background: #96700a;
  color: #fff;
}

/* ============================================================
   PROMO BANNER — Full-width brand highlight
   ============================================================ */
.dp-promo-banner {
  position: relative;
  min-height: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.dp-promo-banner .dp-promo-content {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 40px 24px;
}

.dp-promo-banner .dp-promo-content h2 {
  font-family: 'Playfair Display', serif !important;
  font-size: 36px !important;
  color: #fff !important;
  margin: 0 0 12px !important;
  text-shadow: 0 2px 12px rgba(0,0,0,0.3);
}

.dp-promo-banner .dp-promo-content p {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  color: rgba(255,255,255,0.9);
  margin: 0 0 24px;
  text-shadow: 0 1px 6px rgba(0,0,0,0.2);
}

.dp-promo-banner .dp-promo-cta {
  display: inline-block;
  padding: 12px 36px;
  background: #fff;
  color: #1a1a1a;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 3px;
  transition: background 0.3s, color 0.3s;
}

.dp-promo-banner .dp-promo-cta:hover {
  background: #b8860b;
  color: #fff;
}

@media (max-width: 999px) {
  .dp-promo-banner {
    min-height: 240px;
  }
  .dp-promo-banner .dp-promo-content h2 {
    font-size: 26px !important;
  }
}

/* ============================================================
   BRAND LOGOS GRID — Top 15 brands
   ============================================================ */
.dp-brand-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 16px;
}

.dp-brand-grid__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px 12px;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 8px;
  text-decoration: none;
  transition: border-color 0.3s, box-shadow 0.3s, transform 0.2s;
  min-height: 100px;
}

.dp-brand-grid__item:hover {
  border-color: #b8860b;
  box-shadow: 0 4px 16px rgba(184,134,11,0.12);
  transform: translateY(-2px);
}

.dp-brand-grid__item img {
  max-width: 120px;
  max-height: 50px;
  object-fit: contain;
  margin-bottom: 8px;
}

.dp-brand-grid__name {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #1a1a1a;
  text-align: center;
  letter-spacing: 0.3px;
}

.dp-brand-grid__item:hover .dp-brand-grid__name {
  color: #b8860b;
}

.dp-brand-grid__count {
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  color: #999;
  margin-top: 4px;
}

@media (max-width: 999px) {
  .dp-brand-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
  }
  .dp-brand-grid__item {
    padding: 16px 8px;
  }
}

@media (max-width: 480px) {
  .dp-brand-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ============================================================
   ALL BRANDS — Button list
   ============================================================ */
.dp-all-brands {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 16px;
}

.dp-all-brands__btn {
  display: inline-block;
  padding: 8px 20px;
  border: 1px solid #ddd;
  border-radius: 30px;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: #1a1a1a;
  text-decoration: none;
  transition: all 0.25s;
  background: #fff;
}

.dp-all-brands__btn:hover {
  border-color: #b8860b;
  color: #b8860b;
  background: rgba(184,134,11,0.05);
}

/* ============================================================
   FAQ — Override Salient toggles for homepage
   ============================================================ */
/* FAQ — full restyle */
.home .toggles {
  max-width: 900px;
  margin: 0 auto;
}

.home .toggles .toggle {
  border: 1px solid #eee !important;
  border-radius: 10px !important;
  margin-bottom: 10px !important;
  background: #fff !important;
  overflow: hidden;
  transition: box-shadow 0.3s;
}

.home .toggles .toggle.open {
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
  border-color: #b8860b !important;
}

.home .toggles .toggle .toggle-title a.toggle-heading {
  font-family: 'Inter', sans-serif !important;
  font-size: 16px !important;
  color: #1a1a1a !important;
  font-weight: 600 !important;
  padding: 20px 24px !important;
  background: #fff !important;
}

.home .toggles .toggle.open .toggle-title a.toggle-heading {
  color: #b8860b !important;
  background: #fff !important;
  border-bottom: 1px solid #f0f0f0;
}

.home .toggles .toggle .toggle-title a.toggle-heading {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}

.home .toggles .toggle .toggle-title a.toggle-heading i {
  color: #b8860b !important;
  font-size: 14px !important;
  position: relative !important;
  margin-right: 14px !important;
  top: 0 !important;
  left: 0 !important;
}

.home .toggles .toggle .toggle-title a.toggle-heading:hover {
  background: #faf9f7 !important;
}

.home .toggles .toggle > div .inner-toggle-wrap {
  font-family: 'Inter', sans-serif !important;
  font-size: 15px !important;
  color: #555 !important;
  line-height: 1.8 !important;
  padding: 20px 24px !important;
  background: #faf9f7 !important;
}

/* ============================================================
   SEO TEXT — Bottom section
   ============================================================ */
.dp-seo-section h2 {
  font-family: 'Playfair Display', serif !important;
  font-size: 26px !important;
  color: #1a1a1a !important;
  margin: 0 0 16px !important;
}

.dp-seo-section p {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: #555;
  line-height: 1.8;
  margin: 0 0 14px;
}

/* ============================================================
   REASSURANCE BAR — Before footer
   ============================================================ */
.dp-reassurance {
  background: #f5f5f5;
  padding: 40px 16px;
  border-top: 1px solid #eee;
}

.dp-reassurance__inner {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  max-width: 1100px;
  margin: 0 auto;
  text-align: center;
}

.dp-reassurance__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}

.dp-reassurance__icon {
  width: 32px;
  height: 32px;
  color: #b8860b;
  margin-bottom: 4px;
}

.dp-reassurance__item strong {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #1a1a1a;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.dp-reassurance__item span {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  color: #777;
}

@media (max-width: 768px) {
  .dp-reassurance__inner {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}

/* ============================================================
   HOMEPAGE CTA BUTTONS — Consistent style
   ============================================================ */
.dp-cta-center {
  text-align: center;
  margin-top: 24px;
}

.dp-cta-btn {
  display: inline-block;
  padding: 12px 32px;
  border: 1.5px solid #1a1a1a;
  color: #1a1a1a;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  text-decoration: none !important;
  border-radius: 3px;
  transition: all 0.3s;
  background: transparent;
}

.dp-cta-btn:hover {
  background: #1a1a1a;
  color: #fff;
}

/* Old reassurance-bar class — hide it */
.reassurance-bar {
  display: none !important;
}

/* ============================================================
   NEWSLETTER
   ============================================================ */
.newsletter-block {
  max-width: 540px;
  margin: 0 auto;
}

.newsletter-label {
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  letter-spacing: 4px;
  color: #b8860b;
  text-transform: uppercase;
  margin: 0 0 16px;
}

.newsletter-heading {
  font-family: 'Playfair Display', serif;
  font-size: 34px;
  color: #fff;
  margin: 0 0 14px;
  line-height: 1.2;
}

.newsletter-desc {
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  color: #a09080;
  line-height: 1.6;
  margin: 0 0 28px;
}

.newsletter-form {
  display: flex;
  max-width: 440px;
  margin: 0 auto;
  border: 1px solid #3d3229;
  border-radius: 4px;
  overflow: hidden;
  transition: border-color .3s;
}

.newsletter-form:focus-within {
  border-color: #b8860b;
}

.newsletter-input {
  flex: 1;
  padding: 15px 18px;
  background: #251f1a;
  border: none;
  color: #fff;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  outline: none;
}

.newsletter-input::placeholder {
  color: #6b5e52;
}

.newsletter-btn {
  padding: 15px 28px;
  background: #b8860b;
  color: #fff;
  border: none;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .5px;
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap;
  transition: background .3s;
}

.newsletter-btn:hover {
  background: #96700a;
}

.newsletter-legal {
  font-size: 11px;
  color: #5a4e42;
  margin: 14px 0 0;
  font-family: 'Inter', sans-serif;
}

/* ============================================================
   SECTIONS
   ============================================================ */
.nos-marques {
  padding-top: 50px !important;
  padding-bottom: 50px !important;
}

.categories-phares .vc_column_inner {
  transition: transform .3s, box-shadow .3s;
}

.categories-phares .vc_column_inner:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 30px rgba(0,0,0,.08) !important;
}

.homepage-promos h2,
.homepage-nouveautes h2,
.homepage-avis h2 {
  font-family: 'Playfair Display', serif !important;
}

.homepage-avis .nectar-star-rating .star.filled {
  color: #b8860b !important;
}

/* ============================================================
   FIX #1 — Hero: use new webp image
   ============================================================ */
.dp-hero-row {
  background-image: url('/wp-content/uploads/2024/12/hero-dubai-parfumerie.webp') !important;
  background-size: cover !important;
  background-position: center center !important;
}

/* ============================================================
   FIX #2 — Marquee: full-width edge-to-edge (JS handles offset)
   ============================================================ */

/* ============================================================
   FIX #3 — Bons Plans: sale cards grid
   ============================================================ */
.dp-deals-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
}

.dp-deal-card {
  position: relative;
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
  text-decoration: none;
  color: inherit;
  transition: transform 0.3s, box-shadow 0.3s;
  display: flex;
  flex-direction: column;
}

.dp-deal-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 28px rgba(0,0,0,0.1);
}

.dp-deal-card__badge {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  background: #b8860b;
  color: #fff;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 4px;
  letter-spacing: 0.3px;
}

.dp-deal-card img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
}

.dp-deal-card__info {
  padding: 14px 16px 18px;
}

.dp-deal-card__info h3 {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: #1a1a1a;
  margin: 0 0 8px;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.dp-deal-card__prices {
  display: flex;
  align-items: center;
  gap: 8px;
}

.dp-deal-card__old-price {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  color: #999;
  text-decoration: line-through;
}

.dp-deal-card__new-price {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #b8860b;
}

/* Override wc_price <span> in deal cards */
.dp-deal-card__old-price .woocommerce-Price-amount,
.dp-deal-card__new-price .woocommerce-Price-amount {
  color: inherit !important;
  font-size: inherit !important;
}

@media (max-width: 999px) {
  .dp-deals-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
}

@media (max-width: 480px) {
  .dp-deals-grid {
    gap: 10px;
    padding: 0 12px;
  }
  .dp-deal-card__info {
    padding: 10px 12px 14px;
  }
}

/* ============================================================
   FIX #4 — Coffrets: immersive hero section
   ============================================================ */
.dp-coffrets-hero {
  position: relative;
  min-height: 500px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-size: 100% auto;
  background-position: center center;
  background-repeat: no-repeat;
  background-color: #1a1209;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}

.dp-coffrets-hero__overlay {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 60px 24px;
  max-width: 640px;
  width: 100%;
  background: rgba(0,0,0,0.5);
  border-radius: 12px;
}

.dp-coffrets-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.3) 100%);
  z-index: 1;
}

.dp-coffrets-hero h2 {
  font-family: 'Playfair Display', serif !important;
  font-size: 36px !important;
  color: #fff !important;
  margin: 0 0 14px !important;
  line-height: 1.2 !important;
}

.dp-coffrets-hero p {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  color: rgba(255,255,255,0.9);
  margin: 0 0 20px;
  line-height: 1.6;
}

.dp-coffrets-hero__price {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: #b8860b;
  margin-bottom: 24px;
}

.dp-coffrets-hero__cta {
  display: inline-block;
  padding: 14px 40px;
  background: #b8860b;
  color: #fff;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 3px;
  transition: background 0.3s;
}

.dp-coffrets-hero__cta:hover {
  background: #96700a;
  color: #fff;
}

@media (max-width: 999px) {
  .dp-coffrets-hero {
    min-height: 300px;
  }
  .dp-coffrets-hero h2 {
    font-size: 26px !important;
  }
  .dp-coffrets-hero__overlay {
    padding: 40px 20px;
    margin: 0 16px;
  }
}

/* ============================================================
   FIX #5 — Star ratings: always visible, gold color
   ============================================================ */
.star-rating {
  font-size: 14px !important;
}

.star-rating::before {
  color: #ddd !important;
}

.star-rating span::before {
  color: #b8860b !important;
}

.dp-review-count {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  color: #999;
  display: block;
  text-align: center;
  margin-top: -2px;
}

/* Nouveauté badge */
.dp-new-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 3;
  background: #1a6b3a;
  color: #fff;
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 20px;
  letter-spacing: 0.3px;
  text-transform: uppercase;
}

/* Out of Stock badge */
.dp-oos-badge {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 3;
  background: rgba(26, 26, 26, 0.85);
  color: #e8c97a;
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 20px;
  letter-spacing: 0.3px;
  backdrop-filter: blur(4px);
  pointer-events: none;
}

/* Grey out the product image when out of stock */
.product.outofstock .product-wrap img,
.product.outofstock .woocommerce-LoopProduct-link img {
  opacity: 0.5;
  filter: grayscale(40%);
}

/* Hide Merchant "En rupture" badge — keep only custom "Victime de son succès" */                                                                         
.product.outofstock .merchant-product-labels {                              
    display: none !important;    
  }   

/* Ensure stars are visible in product loops (override Salient woocommerce.css) */
.woocommerce .products .classic .star-rating,
.woocommerce .products .material .star-rating,
.woocommerce .products .minimal .star-rating,
.woocommerce-page .products .classic .star-rating,
.woocommerce-page .products .material .star-rating,
.products .star-rating {
  display: block !important;
  visibility: visible !important;
  margin: 4px auto 6px !important;
  width: 5.4em;
  font-size: 14px !important;
}

/* ============================================================
   FIX #6 — Featured Brands: logo grid
   ============================================================ */
.dp-featured-brands {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 16px;
}

.dp-featured-brand-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 32px 20px 24px;
  background: #1a1209;
  border-radius: 12px;
  text-decoration: none !important;
  color: #fff;
  transition: transform 0.3s, box-shadow 0.3s;
  min-height: 180px;
}

.dp-featured-brand-card::before {
  display: none;
}

.dp-featured-brand-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
}

.dp-featured-brand-card__logo {
  max-width: 120px;
  max-height: 60px;
  width: auto;
  height: 50px;
  object-fit: contain;
  margin-bottom: 12px;
  background: rgba(255,255,255,0.9);
  padding: 8px 14px;
  border-radius: 6px;
}

.dp-featured-brand-card__logo--no-invert {
  /* same treatment for all */
}

.dp-featured-brand-card__name {
  font-family: 'Playfair Display', serif;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 4px;
  letter-spacing: 0.3px;
}

.dp-featured-brand-card__count {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  color: rgba(255,255,255,0.5);
}

@media (max-width: 999px) {
  .dp-featured-brands {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px;
  }
  .dp-featured-brand-card {
    min-height: 140px;
    padding: 24px 16px 20px;
  }
}

/* ============================================================
   FIX #7 — Brand Logos: visual cards (3-column)
   ============================================================ */
.dp-brand-visual-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 16px;
}

.dp-brand-visual-card {
  position: relative;
  min-height: 200px;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  background-size: cover;
  background-position: center;
  background-color: #2a2118;
  border-radius: 12px;
  text-decoration: none;
  color: #fff;
  transition: transform 0.3s, box-shadow 0.3s;
}

.dp-brand-visual-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
}

.dp-brand-visual-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.2) 60%, rgba(0,0,0,0.1) 100%);
  border-radius: 12px;
  transition: background 0.3s;
}

.dp-brand-visual-card:hover::before {
  background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.35) 100%);
}

.dp-brand-visual-card__overlay {
  position: relative;
  z-index: 2;
  padding: 24px;
  width: 100%;
}

.dp-brand-visual-card__name {
  display: block;
  font-family: 'Playfair Display', serif;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 4px;
}

.dp-brand-visual-card__count {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  color: rgba(255,255,255,0.7);
}

.dp-brand-visual-card:hover {
  border: 2px solid #b8860b;
}

@media (max-width: 999px) {
  .dp-brand-visual-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  .dp-brand-visual-card {
    min-height: 160px;
  }
  .dp-brand-visual-card__name {
    font-size: 18px;
  }
}

/* ============================================================
   FIX #8 — All Brands: compact with toggle
   ============================================================ */
.dp-all-brands__btn--hidden {
  display: none;
}

.dp-all-brands__toggle {
  display: inline-block;
  padding: 10px 24px;
  border: 1.5px solid #b8860b;
  border-radius: 30px;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #b8860b;
  background: transparent;
  cursor: pointer;
  transition: all 0.3s;
  margin-top: 6px;
}

.dp-all-brands__toggle:hover {
  background: #b8860b;
  color: #fff;
}

/* ============================================================
   Catgrid — switch to 2-column for 6 tiles
   ============================================================ */
@media (min-width: 1000px) {
  .dp-catgrid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.dp-catgrid__card--huile {
  background-image: url('/wp-content/uploads/2024/12/univers-huile-dubai-parfumerie.webp');
}
.dp-catgrid__card--encens {
  background-image: url('/wp-content/uploads/2024/12/univers-encens-dubai-parfumerie.webp');
}
.dp-catgrid__card--deo {
  background-image: url('/wp-content/uploads/2024/12/univers-deo-dubai-parfumerie.webp');
}

.dp-catgrid__card--huile,
.dp-catgrid__card--encens,
.dp-catgrid__card--deo {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #2a2118;
}

/* ============================================================
   Featured Brands — 3-column grid + Osma gold
   ============================================================ */
.dp-featured-brands {
  grid-template-columns: repeat(3, 1fr) !important;
}

.dp-featured-brand-card--gold {
  border: 2px solid #b8860b !important;
  box-shadow: 0 0 20px rgba(184,134,11,0.25);
  background: linear-gradient(135deg, #2a1f0e 0%, #1a1209 100%);
}

.dp-featured-brand-card--gold .dp-featured-brand-card__name {
  color: #e8c97a;
}

.dp-featured-brand-card--gold .dp-featured-brand-card__count {
  color: #b8860b;
}

/* ============================================================
   All Brands — 3×3 grid (curated)
   ============================================================ */
.dp-all-brands-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 16px;
}

.dp-all-brands-grid__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 28px 16px;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 10px;
  text-decoration: none;
  transition: border-color 0.3s, box-shadow 0.3s, transform 0.2s;
  min-height: 90px;
}

.dp-all-brands-grid__item:hover {
  border-color: #b8860b;
  box-shadow: 0 4px 16px rgba(184,134,11,0.12);
  transform: translateY(-2px);
}

.dp-all-brands-grid__name {
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: #1a1a1a;
}

.dp-all-brands-grid__item:hover .dp-all-brands-grid__name {
  color: #b8860b;
}

.dp-all-brands-grid__count {
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  color: #999;
  margin-top: 4px;
}

.dp-all-brands-grid__item--cta {
  background: #1a1a1a;
  border-color: #1a1a1a;
}

.dp-all-brands-grid__item--cta .dp-all-brands-grid__name {
  color: #fff;
}

.dp-all-brands-grid__item--cta .dp-all-brands-grid__count {
  color: rgba(255,255,255,0.6);
}

.dp-all-brands-grid__item--cta:hover {
  background: #b8860b;
  border-color: #b8860b;
}

.dp-all-brands-grid__item--cta:hover .dp-all-brands-grid__name,
.dp-all-brands-grid__item--cta:hover .dp-all-brands-grid__count {
  color: #fff !important;
}

@media (max-width: 768px) {
  .dp-all-brands-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }
  .dp-all-brands-grid__item {
    padding: 18px 10px;
  }
}

/* ============================================================
   Notes Iconiques — 1×3 tiles
   ============================================================ */
.dp-notes-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  max-width: 1100px;
  margin: 0 auto 40px;
  padding: 0 16px;
}

.dp-notes-grid__card {
  position: relative;
  min-height: 120px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 16px 20px;
  border-radius: 12px;
  text-decoration: none;
  color: #fff;
  background-size: cover;
  background-position: center;
  overflow: hidden;
  transition: transform 0.3s, box-shadow 0.3s;
}

.dp-notes-grid__card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.15) 60%);
  border-radius: 12px;
}

.dp-notes-grid__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.3);
}

.dp-notes-grid__arrow {
  position: absolute;
  top: 12px;
  right: 14px;
  font-size: 16px;
  z-index: 1;
  opacity: 0.6;
  transition: opacity 0.3s;
}

.dp-notes-grid__card:hover .dp-notes-grid__arrow {
  opacity: 1;
}

.dp-notes-grid__name {
  position: relative;
  z-index: 1;
  display: block;
  font-weight: 700;
  font-size: 14px;
  line-height: 1.3;
  color: #fff;
}

.dp-notes-grid__sub {
  position: relative;
  z-index: 1;
  display: block;
  font-size: 11px;
  opacity: 0.7;
  margin-top: 4px;
  color: #fff;
}

@media (max-width: 768px) {
  .dp-notes-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .dp-notes-grid__card {
    min-height: 70px;
  }
}

/* ============================================================
   Editorial SEO Text
   ============================================================ */
.dp-editorial {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 24px;
}

.dp-editorial h2 {
  font-family: 'Playfair Display', serif !important;
  font-size: 28px !important;
  color: #1a1a1a !important;
  margin: 0 0 20px !important;
}

.dp-editorial h3 {
  font-family: 'Playfair Display', serif !important;
  font-size: 20px !important;
  color: #1a1a1a !important;
  margin: 28px 0 10px !important;
}

.dp-editorial p {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: #555;
  line-height: 1.8;
  margin: 0 0 14px;
}

.dp-editorial a {
  color: #b8860b;
  text-decoration: none;
  border-bottom: 1px solid rgba(184,134,11,0.3);
  transition: border-color 0.3s;
}

.dp-editorial a:hover {
  border-bottom-color: #b8860b;
}

/* ============================================================
   Guide Section — pyramid + profiles
   ============================================================ */
.dp-guide {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 24px;
}

.dp-guide__pyramid {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  margin-bottom: 36px;
}

.dp-guide__note {
  text-align: center;
  padding: 14px 24px;
  border-radius: 8px;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  color: #555;
  line-height: 1.5;
}

.dp-guide__note strong {
  color: #1a1a1a;
}

.dp-guide__note--top {
  background: #f5efe6;
  width: 50%;
}

.dp-guide__note--mid {
  background: #ede4d4;
  width: 70%;
}

.dp-guide__note--base {
  background: #e2d5c0;
  width: 90%;
}

.dp-guide__profiles {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

.dp-guide__profile {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px 12px;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 10px;
  text-decoration: none;
  text-align: center;
  transition: border-color 0.3s, transform 0.2s;
}

.dp-guide__profile:hover {
  border-color: #b8860b;
  transform: translateY(-2px);
}

.dp-guide__profile strong {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: #1a1a1a;
  margin-bottom: 4px;
}

.dp-guide__profile span {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  color: #777;
}

@media (max-width: 768px) {
  .dp-guide__profiles {
    grid-template-columns: repeat(2, 1fr);
  }
  .dp-guide__note--top { width: 80%; }
  .dp-guide__note--mid { width: 90%; }
  .dp-guide__note--base { width: 100%; }
}

/* ============================================================
   Why Us + Ajmal Section
   ============================================================ */
.dp-why-us {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 24px;
  align-items: start;
}

.dp-why-us__ajmal {
  background: #f5efe6;
  padding: 32px;
  border-radius: 12px;
}

.dp-why-us__ajmal h3 {
  font-family: 'Playfair Display', serif !important;
  font-size: 22px !important;
  color: #1a1a1a !important;
  margin: 0 0 12px !important;
}

.dp-why-us__ajmal p {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: #555;
  line-height: 1.7;
  margin: 0 0 20px;
}

.dp-why-us__reasons h3 {
  font-family: 'Playfair Display', serif !important;
  font-size: 22px !important;
  color: #1a1a1a !important;
  margin: 0 0 16px !important;
}

.dp-why-us__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.dp-why-us__item {
  padding: 16px;
  background: #faf8f5;
  border-radius: 8px;
}

.dp-why-us__item strong {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: #1a1a1a;
  margin-bottom: 4px;
}

.dp-why-us__item span {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  color: #777;
}

@media (max-width: 768px) {
  .dp-why-us {
    grid-template-columns: 1fr;
  }
}

/* ============================================================
   Mini-Cart Shipping Progress Bar
   ============================================================ */
.dp-shipping-bar {
  position: relative;
  background: #f5f5f5;
  border-radius: 4px;
  padding: 10px 14px;
  margin-bottom: 12px;
  overflow: hidden;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  color: #555;
  text-align: center;
}

.dp-shipping-bar__progress {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background: rgba(184,134,11,0.1);
  transition: width 0.3s;
}

.dp-shipping-bar span {
  position: relative;
  z-index: 1;
}

.dp-shipping-bar--free {
  background: #f0faf0;
  color: #2d7d2d;
  font-weight: 600;
}

/* Blog links on product pages */
.dp-blog-links {
	margin: 30px 0;
	padding: 20px 24px;
	background: #faf8f5;
	border-left: 3px solid #b8860b;
	border-radius: 0 8px 8px 0;
}

.dp-blog-links h4 {
	margin: 0 0 12px 0;
	font-size: 15px;
	font-weight: 600;
	color: #1a1a2e;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.dp-blog-link {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 0;
	text-decoration: none !important;
	color: #1a1a2e;
	font-size: 14px;
	transition: color 0.2s;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.dp-blog-link:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.dp-blog-link:hover {
	color: #b8860b;
}

.dp-blog-link__icon {
	font-size: 18px;
	flex-shrink: 0;
}

.dp-blog-link__text {
	font-weight: 500;
}