.elementor-959 .elementor-element.elementor-element-4e0ae38{--display:flex;--min-height:80vh;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-end;--align-items:center;--overlay-opacity:0.1;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-959 .elementor-element.elementor-element-4e0ae38:not(.elementor-motion-effects-element-type-background), .elementor-959 .elementor-element.elementor-element-4e0ae38 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-959 .elementor-element.elementor-element-4e0ae38::before, .elementor-959 .elementor-element.elementor-element-4e0ae38 > .elementor-background-video-container::before, .elementor-959 .elementor-element.elementor-element-4e0ae38 > .e-con-inner > .elementor-background-video-container::before, .elementor-959 .elementor-element.elementor-element-4e0ae38 > .elementor-background-slideshow::before, .elementor-959 .elementor-element.elementor-element-4e0ae38 > .e-con-inner > .elementor-background-slideshow::before, .elementor-959 .elementor-element.elementor-element-4e0ae38 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#000000;--background-overlay:'';}.elementor-959 .elementor-element.elementor-element-0c7eed1{width:100%;max-width:100%;}.elementor-959 .elementor-element.elementor-element-69860f3{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:flex-start;--margin-top:0px;--margin-bottom:80px;--margin-left:0px;--margin-right:0px;--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-959 .elementor-element.elementor-element-f011889{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-959 .elementor-element.elementor-element-f011889:not(.elementor-motion-effects-element-type-background), .elementor-959 .elementor-element.elementor-element-f011889 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-959 .elementor-element.elementor-element-7e8c3d3 .elementor-heading-title{font-family:"Chivo", Sans-serif;font-size:26px;font-weight:700;}.elementor-959 .elementor-element.elementor-element-1b84d4f{--display:flex;}.elementor-959 .elementor-element.elementor-element-e673a09{--swiper-slides-to-display:4;--swiper-slides-gap:30px;--arrow-prev-left-align:0%;--arrow-prev-translate-x:0px;--arrow-prev-left-position:0px;--arrow-prev-top-align:50%;--arrow-prev-translate-y:-50%;--arrow-prev-top-position:0px;--arrow-next-right-align:0%;--arrow-next-translate-x:0%;--arrow-next-right-position:0px;--arrow-next-top-align:50%;--arrow-next-translate-y:-50%;--arrow-next-top-position:0px;}.elementor-959 .elementor-element.elementor-element-e673a09 .swiper-slide > .elementor-element{height:100%;}.elementor-959 .elementor-element.elementor-element-8645f82{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-959 .elementor-element.elementor-element-79dc440{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-959 .elementor-element.elementor-element-79dc440:not(.elementor-motion-effects-element-type-background), .elementor-959 .elementor-element.elementor-element-79dc440 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-959 .elementor-element.elementor-element-6752de0{text-align:center;}.elementor-959 .elementor-element.elementor-element-6752de0 .elementor-heading-title{font-family:"Chivo", Sans-serif;font-size:26px;font-weight:700;}.elementor-959 .elementor-element.elementor-element-d2f1d9d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-959 .elementor-element.elementor-element-d7fe23d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-959 .elementor-element.elementor-element-4b9f3ef{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-959 .elementor-element.elementor-element-750ec5b{--display:flex;}.elementor-959 .elementor-element.elementor-element-3a5a64f{--wd-img-height:80vh;}.elementor-959 .elementor-element.elementor-element-3a5a64f .banner-image{object-position:center center;}.elementor-959 .elementor-element.elementor-element-1b7bf06{--display:flex;}.elementor-959 .elementor-element.elementor-element-87d0608{--wd-img-height:80vh;}.elementor-959 .elementor-element.elementor-element-87d0608 .banner-image{object-position:center center;}@media(min-width:769px){.elementor-959 .elementor-element.elementor-element-f011889{--width:30%;}.elementor-959 .elementor-element.elementor-element-1b84d4f{--content-width:100%;}.elementor-959 .elementor-element.elementor-element-79dc440{--width:100%;}.elementor-959 .elementor-element.elementor-element-750ec5b{--width:50%;}.elementor-959 .elementor-element.elementor-element-1b7bf06{--width:50%;}}@media(max-width:1024px){.elementor-959 .elementor-element.elementor-element-69860f3{--margin-top:0px;--margin-bottom:60px;--margin-left:0px;--margin-right:0px;}.elementor-959 .elementor-element.elementor-element-e673a09{--swiper-slides-to-display:2;}}@media(max-width:768px){.elementor-959 .elementor-element.elementor-element-69860f3{--margin-top:0px;--margin-bottom:40px;--margin-left:0px;--margin-right:0px;}.elementor-959 .elementor-element.elementor-element-e673a09{--swiper-slides-to-display:1;}}/* Start custom CSS for heading, class: .elementor-element-7e8c3d3 */.elementor-959 .elementor-element.elementor-element-7e8c3d3 h2{
    position: relative;
}
.elementor-959 .elementor-element.elementor-element-7e8c3d3 h2::before{
    content:"";
    position: absolute;
    height: 40px;
    left:-10%;
    background-color:#8D7E6D ;
    width: 3px;
    top: 50%;
    translate: 0% -50%;
}/* End custom CSS */
/* Start custom CSS for loop-carousel, class: .elementor-element-e673a09 *//* ==========================================
   1. الإعدادات الأساسية للكارت (Card Container)
   ========================================== */
.e-loop-item .elementor-element-46d78c9 {
    position: relative;
    overflow: hidden;
    border-radius: 20px !important; /* حواف ناعمة حديثة */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
    background-size: 100% !important; 
    transition: background-size 0.6s cubic-bezier(0.25, 0.8, 0.25, 1), transform 0.4s ease !important;
}

/* رفع الكارت لأعلى قليلاً وتكبير الخلفية ببطء عند تمرير الماوس */
.e-loop-item:hover .elementor-element-46d78c9 {
    transform: translateY(-8px);
    background-size: 110% !important; /* تأثير الزووم */
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15) !important;
}

/* ==========================================
   2. تأثير الظل المتدرج (Gradient Overlay)
   ========================================== */
/* إضافة طبقة داكنة في الأسفل لإبراز الزر، تزيد كثافتها عند الـ Hover */
.e-loop-item .elementor-element-46d78c9::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.2) 50%, rgba(0,0,0,0) 100%);
    opacity: 0.6;
    transition: opacity 0.4s ease;
    z-index: 1;
}

.e-loop-item:hover .elementor-element-46d78c9::before {
    opacity: 0.9;
}

/* ==========================================
   3. تصميم الزر (Glassmorphism & Reveal Effect)
   ========================================== */
.e-loop-item .elementor-widget-button {
    z-index: 2; /* إبقاء الزر فوق طبقة التظليل */
    transform: translateY(15px); /* إزاحة مبدئية لأسفل */
    opacity: 0.8;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* ظهور الزر للأعلى بوضوح عند الـ Hover */
.e-loop-item:hover .elementor-widget-button {
    transform: translateY(0);
    opacity: 1;
}

/* تأثير الزجاج المكسنفر (Glass) على الزر نفسه */
.e-loop-item .elementor-button {
    background: rgba(255, 255, 255, 0.15) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    color: #ffffff !important;
    padding: 12px 35px !important;
    border-radius: 30px !important; /* زر بيضاوي انسيابي */
    letter-spacing: 1.5px;
    font-weight: 600;
    overflow: hidden;
    position: relative;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

/* تأثير اللمعان (Shine Effect) يمر على الزر */
.e-loop-item .elementor-button::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 100%;
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.4) 50%, rgba(255,255,255,0) 100%);
    transform: skewX(-25deg);
    transition: all 0.7s ease;
}

.e-loop-item:hover .elementor-button::after {
    left: 200%;
    transition: all 0.7s ease;
}

.e-loop-item .elementor-button:hover {
    background: #ffffff !important;
    color: #000000 !important;
}

/* ==========================================
   4. تحسين أزرار التمرير (Swiper Navigation)
   ========================================== */
.elementor-swiper-button {
    background: rgba(255, 255, 255, 0.7) !important;
    backdrop-filter: blur(5px);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50% !important;
    color: #000000 !important;
    width: 45px !important;
    height: 45px !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
.elementor-swiper-button svg{
    fill: #000!important;
    
    
}
.elementor-swiper-button:hover svg{
    fill: #FFF!important;
    
}

.elementor-swiper-button:hover {
    background: #000000 !important;
    color: #ffffff !important;
    transform: scale(1.1);
}
button{
    padding: 0!important;
    
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-6752de0 */.elementor-959 .elementor-element.elementor-element-6752de0 h2{
    position: relative;
}
.elementor-959 .elementor-element.elementor-element-6752de0 h2::before{
    content:"";
    position: absolute;
    height: 3px;
    left:10%;
    background-color:#8D7E6D ;
    width: 40%;
    
    top: 110%;
    translate: 50% 50%;
}/* End custom CSS */
/* Start custom CSS for wd_products, class: .elementor-element-f045c30 *//* ============================================================
   ALLUVIUM — Shop / Homepage Product Loop  v1.0
   الصفحة الرئيسية وصفحة المتجر — Product Grid Cards
   ضيفه في: WordPress → Appearance → Additional CSS
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600&family=Inter:wght@300;400;500;600;700&display=swap');

/* ---------- BRAND TOKENS (same palette) ---------- */
:root {
  --alv-cream:      #F7F3ED;
  --alv-sand:       #E8DDD0;
  --alv-beige:      #D6C9B8;
  --alv-gold:       #9B8B72;
  --alv-gold-dark:  #7A6D57;
  --alv-gold-light: #C4B49E;
  --alv-charcoal:   #1C1A18;
  --alv-mid:        #6B6158;
  --alv-white:      #FFFFFF;
  --alv-radius:     10px;
  --alv-t:          0.32s ease;
  --alv-shadow:     0 4px 24px rgba(155,139,114,0.12);
  --alv-shadow-lg:  0 12px 40px rgba(155,139,114,0.22);
}

/* ============================================================
   1. GRID CONTAINER
   ============================================================ */
.wd-products.grid-columns-4,
.wd-products.elements-grid {
  gap: 24px 20px !important;
}

/* Force equal columns with gap on all sizes */
@media (min-width: 1024px) {
  .wd-products.grid-columns-4 {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 24px 20px !important;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .wd-products.grid-columns-4 {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
  }
}

@media (max-width: 767px) {
  .wd-products.grid-columns-4 {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 14px !important;
  }
}

/* ============================================================
   2. PRODUCT CARD — WRAPPER
   ============================================================ */
.wd-products .wd-product.wd-col {
  /* reset any inherited width from woodmart carousel */
  width: auto !important;
  flex: unset !important;
}

.wd-products .wd-product .wd-product-wrapper {
  background: var(--alv-white);
  border-radius: var(--alv-radius);
  overflow: hidden;
  transition: transform var(--alv-t), box-shadow var(--alv-t);
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
  display: flex;
  flex-direction: column;
  height: 100%;
}

.wd-products .wd-product:hover .wd-product-wrapper {
  transform: translateY(-6px);
  box-shadow: var(--alv-shadow-lg);
}

/* ============================================================
   3. IMAGE AREA — fixed aspect ratio + crossfade hover
   ============================================================ */
.wd-products .wd-product .wd-product-thumb {
  position: relative;
  overflow: hidden;
  background: var(--alv-cream);
  /* 4:5 portrait ratio — perfect for fashion */
  aspect-ratio: 4 / 5;
}

/* Both images fill the thumb */
.wd-products .wd-product .wd-product-thumb .wd-product-img-link,
.wd-products .wd-product .wd-product-thumb .wd-product-img-hover {
  position: absolute;
  inset: 0;
  display: block;
}

.wd-products .wd-product .wd-product-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
  display: block !important;
  transition: transform 0.55s ease, opacity 0.45s ease !important;
}

/* Main image: subtle zoom on hover */
.wd-products .wd-product .wd-product-img-link img {
  opacity: 1;
  z-index: 1;
}

.wd-products .wd-product:hover .wd-product-img-link img {
  transform: scale(1.05);
}

/* Hover image: crossfade in */
.wd-products .wd-product .wd-product-img-hover.hover-img {
  z-index: 2;
  opacity: 0;
  transition: opacity 0.45s ease !important;
}

.wd-products .wd-product:hover .wd-product-img-hover.hover-img {
  opacity: 1;
}

.wd-products .wd-product .wd-product-img-hover.hover-img img {
  object-fit: cover;
  object-position: top center;
}

/* ============================================================
   4. ACTION BUTTONS — slide in from right on hover
   ============================================================ */
.wd-products .wd-product .wd-buttons.wd-pos-r-t {
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  left: auto !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  z-index: 10 !important;
  transform: translateX(52px) !important;
  transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.wd-products .wd-product:hover .wd-buttons.wd-pos-r-t {
  transform: translateX(0) !important;
}

/* Each action button */
.wd-products .wd-product .wd-buttons .wd-action-btn a,
.wd-products .wd-product .wd-buttons .wd-action-btn button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  height: 38px !important;
  background: rgba(255,255,255,0.95) !important;
  border-radius: 50% !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.12) !important;
  color: var(--alv-charcoal) !important;
  transition: background var(--alv-t), color var(--alv-t), transform var(--alv-t) !important;
  text-decoration: none !important;
}

.wd-products .wd-product .wd-buttons .wd-action-btn a:hover,
.wd-products .wd-product .wd-buttons .wd-action-btn button:hover {
  background: var(--alv-gold) !important;
  color: var(--alv-white) !important;
  transform: scale(1.08) !important;
}

/* Stagger appear animation */
.wd-products .wd-product .wd-buttons .wd-action-btn:nth-child(1) { transition-delay: 0ms !important; }
.wd-products .wd-product .wd-buttons .wd-action-btn:nth-child(2) { transition-delay: 40ms !important; }
.wd-products .wd-product .wd-buttons .wd-action-btn:nth-child(3) { transition-delay: 80ms !important; }
.wd-products .wd-product .wd-buttons .wd-action-btn:nth-child(4) { transition-delay: 120ms !important; }

/* Hide text labels in action buttons */
.wd-products .wd-product .wd-buttons .wd-action-text {
  position: absolute !important;
  clip: rect(0,0,0,0) !important;
  overflow: hidden !important;
  width: 1px !important;
  height: 1px !important;
}

/* ============================================================
   5. PRODUCT INFO BOTTOM
   ============================================================ */
.wd-products .wd-product .product-element-bottom {
  padding: 14px 14px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  flex: 1 !important;
  background: var(--alv-white) !important;
}

/* Product Title */
.wd-products .wd-product .wd-entities-title {
  margin: 0 !important;
}

.wd-products .wd-product .wd-entities-title a {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  color: var(--alv-charcoal) !important;
  text-decoration: none !important;
  line-height: 1.3 !important;
  display: block !important;
  transition: color var(--alv-t) !important;
}

.wd-products .wd-product .wd-entities-title a:hover {
  color: var(--alv-gold) !important;
}

@media (max-width: 767px) {
  .wd-products .wd-product .wd-entities-title a {
    font-size: 13px !important;
  }
}

/* ============================================================
   6. VARIATIONS FORM inside card — CLEAN UP
   ============================================================ */

/* Hide the ugly variations table label column */
.wd-products .wd-product .variations_form .variations th.label {
  display: none !important;
}

/* Hide quantity box and ATC button inside loop card */
.wd-products .wd-product .variations_form .quantity,
.wd-products .wd-product .variations_form button.single_add_to_cart_button {
  display: none !important;
}

/* Hide variation description */
.wd-products .wd-product .woocommerce-variation.single_variation {
  display: none !important;
}

/* Variations table: borderless */
.wd-products .wd-product .variations_form .variations {
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

.wd-products .wd-product .variations_form .variations td,
.wd-products .wd-product .variations_form .variations th {
  border: none !important;
  padding: 0 !important;
}

/* Reset var link */
.wd-products .wd-product .wd-reset-var {
  display: none !important;
}

/* ============================================================
   7. SIZE SWATCHES (wd-text) in loop cards
   ============================================================ */
.wd-products .wd-product .wd-swatches-product.wd-swatches-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
  margin: 0 !important;
}

.wd-products .wd-product .wd-swatch.wd-text {
  min-width: 30px !important;
  height: 30px !important;
  border-radius: 6px !important;
  border: 1px solid var(--alv-sand) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  color: var(--alv-charcoal) !important;
  background: var(--alv-white) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.22s ease !important;
  padding: 0 6px !important;
}

.wd-products .wd-product .wd-swatch.wd-text:hover {
  border-color: var(--alv-gold) !important;
  color: var(--alv-gold-dark) !important;
  background: var(--alv-cream) !important;
}

.wd-products .wd-product .wd-swatch.wd-text.wd-selected,
.wd-products .wd-product .wd-swatch.wd-text[aria-checked="true"] {
  background: var(--alv-charcoal) !important;
  border-color: var(--alv-charcoal) !important;
  color: var(--alv-white) !important;
}

@media (max-width: 767px) {
  .wd-products .wd-product .wd-swatch.wd-text {
    min-width: 26px !important;
    height: 26px !important;
    font-size: 9px !important;
  }
}

/* ============================================================
   8. COLOR SWATCHES (wd-bg) in loop cards — as dots
   ============================================================ */
.wd-products .wd-product .wd-swatch.wd-bg {
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  border: 2px solid var(--alv-white) !important;
  box-shadow: 0 0 0 1.5px var(--alv-sand) !important;
  padding: 0 !important;
  transition: transform 0.22s ease, box-shadow 0.22s ease !important;
  cursor: pointer !important;
}

.wd-products .wd-product .wd-swatch.wd-bg:hover {
  transform: scale(1.2) !important;
  box-shadow: 0 0 0 2px var(--alv-gold) !important;
}

.wd-products .wd-product .wd-swatch.wd-bg.wd-selected,
.wd-products .wd-product .wd-swatch.wd-bg[aria-checked="true"] {
  box-shadow: 0 0 0 2.5px var(--alv-charcoal) !important;
  transform: scale(1.15) !important;
}

/* Hide swatch text label for color swatches */
.wd-products .wd-product .wd-swatch.wd-bg .wd-swatch-text {
  display: none !important;
}

/* ============================================================
   9. PRICE
   ============================================================ */
.wd-products .wd-product .product-element-bottom > .price,
.wd-products .wd-product .product-element-bottom span.price {
  display: block !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--alv-gold-dark) !important;
  letter-spacing: 0.02em !important;
  margin: 0 !important;
  line-height: 1 !important;
}

.wd-products .wd-product .product-element-bottom > .price .woocommerce-Price-currencySymbol {
  font-size: 11px !important;
  font-weight: 400 !important;
  color: var(--alv-mid) !important;
  vertical-align: super !important;
}

@media (max-width: 767px) {
  .wd-products .wd-product .product-element-bottom > .price,
  .wd-products .wd-product .product-element-bottom span.price {
    font-size: 13px !important;
  }
}

/* ============================================================
   10. EQUAL HEIGHT CARDS
   ============================================================ */

/* All cards same height — stretch to fill grid row */
.wd-products .wd-product.wd-col {
  display: flex !important;
  flex-direction: column !important;
  align-self: stretch !important;
}

.wd-products .wd-product .wd-product-wrapper {
  flex: 1 !important;
}

/* Info bottom stretches so price is always at same level */
.wd-products .wd-product .product-element-bottom {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}

/* ============================================================
   11. "NEW" / SALE BADGES
   ============================================================ */
.wd-products .wd-product .onsale,
.wd-products .wd-product .badge {
  font-family: 'Inter', sans-serif !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  background: var(--alv-gold) !important;
  color: var(--alv-white) !important;
  border-radius: 4px !important;
  padding: 4px 8px !important;
}

/* ============================================================
   12. SECTION TITLE (YOU MAY ALSO LIKE / RELATED)
   ============================================================ */
.wd-el-title.title,
.wd-products-element > .wd-el-title,
h2.related-title,
.related > h2,
.upsells > h2 {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: clamp(20px, 2.5vw, 30px) !important;
  font-weight: 500 !important;
  color: var(--alv-charcoal) !important;
  letter-spacing: 0.01em !important;
  margin-bottom: 28px !important;
  position: relative !important;
  display: inline-block !important;
}

.wd-el-title.title::after,
h2.related-title::after,
.related > h2::after,
.upsells > h2::after {
  content: '';
  position: absolute;
  bottom: -10px;
  left: 0;
  width: 30px;
  height: 2px;
  background: var(--alv-gold);
  border-radius: 2px;
}

/* ============================================================
   13. LOAD MORE / PAGINATION
   ============================================================ */
.wd-products ~ .wd-products-footer .wd-btn,
.woocommerce-pagination a,
.woocommerce-pagination span {
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  border-radius: var(--alv-radius) !important;
  transition: all var(--alv-t) !important;
}

/* ============================================================
   14. EMPTY GRID SLOTS (alignment fix)
   ============================================================ */
.wd-products .wd-product.wd-col:empty {
  display: none !important;
}

/* ============================================================
   15. SCROLL REVEAL ANIMATION
   ============================================================ */
@keyframes alv-card-in {
  from {
    opacity: 0;
    transform: translateY(28px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.wd-products .wd-product.wd-col {
  animation: alv-card-in 0.55s ease forwards;
}

.wd-products .wd-product.wd-col:nth-child(1) { animation-delay: 0ms; }
.wd-products .wd-product.wd-col:nth-child(2) { animation-delay: 80ms; }
.wd-products .wd-product.wd-col:nth-child(3) { animation-delay: 160ms; }
.wd-products .wd-product.wd-col:nth-child(4) { animation-delay: 240ms; }
.wd-products .wd-product.wd-col:nth-child(n+5) { animation-delay: 300ms; }

/* ============================================================
   16. CAROUSEL variant (YOU MAY ALSO LIKE uses carousel)
   ============================================================ */
.wd-carousel-container .wd-product.wd-hover-tiled .wd-product-thumb {
  aspect-ratio: 4 / 5 !important;
}

.wd-carousel-container .wd-product.wd-hover-tiled .wd-product-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
}

.wd-carousel-container .wd-product.wd-hover-tiled .wd-product-wrapper {
  border-radius: var(--alv-radius) !important;
  overflow: hidden !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important;
  transition: transform var(--alv-t), box-shadow var(--alv-t) !important;
}

.wd-carousel-container .wd-product.wd-hover-tiled:hover .wd-product-wrapper {
  transform: translateY(-5px) !important;
  box-shadow: var(--alv-shadow-lg) !important;
}/* End custom CSS */