.elementor-4259 .elementor-element.elementor-element-93d9c34{--display:flex;}.elementor-4259 .elementor-element.elementor-element-c312927{--display:flex;}.elementor-4259 .elementor-element.elementor-element-575244d{--display:flex;}.elementor-4259 .elementor-element.elementor-element-ea3d722{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;}.elementor-4259 .elementor-element.elementor-element-ea3d722.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-4259 .elementor-element.elementor-element-6fae2cd{--display:flex;}.elementor-4259 .elementor-element.elementor-element-d1e63d4{--display:flex;}.elementor-4259 .elementor-element.elementor-element-2923185{--display:flex;}.elementor-4259 .elementor-element.elementor-element-1b2a3c7{--display:flex;}.elementor-4259 .elementor-element.elementor-element-376e74c{--display:flex;}.elementor-4259 .elementor-element.elementor-element-000bd2a{--display:flex;}.elementor-4259 .elementor-element.elementor-element-0c796bf{--display:flex;}.elementor-4259 .elementor-element.elementor-element-ec9272f{--display:flex;}.elementor-4259 .elementor-element.elementor-element-5468bb4{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;}.elementor-4259 .elementor-element.elementor-element-d531999{--display:flex;}.elementor-4259 .elementor-element.elementor-element-dd9d6d6{--display:flex;}.elementor-4259 .elementor-element.elementor-element-2631064{--display:flex;}.elementor-4259 .elementor-element.elementor-element-eb650d5{--display:flex;}.elementor-4259 .elementor-element.elementor-element-5f27f7e{--display:flex;}.elementor-4259 .elementor-element.elementor-element-b6b85a0{--display:flex;}@media(min-width:768px){.elementor-4259 .elementor-element.elementor-element-93d9c34{--content-width:1600px;}.elementor-4259 .elementor-element.elementor-element-c312927{--content-width:1600px;}.elementor-4259 .elementor-element.elementor-element-575244d{--content-width:1600px;}.elementor-4259 .elementor-element.elementor-element-d1e63d4{--content-width:1600px;}.elementor-4259 .elementor-element.elementor-element-2923185{--content-width:1600px;}.elementor-4259 .elementor-element.elementor-element-1b2a3c7{--content-width:1600px;}.elementor-4259 .elementor-element.elementor-element-000bd2a{--content-width:1600px;}.elementor-4259 .elementor-element.elementor-element-0c796bf{--content-width:1600px;}.elementor-4259 .elementor-element.elementor-element-ec9272f{--content-width:1454px;}.elementor-4259 .elementor-element.elementor-element-d531999{--content-width:1600px;}.elementor-4259 .elementor-element.elementor-element-2631064{--content-width:1567px;}.elementor-4259 .elementor-element.elementor-element-eb650d5{--content-width:1600px;}}























/* ========== WooCommerce product card: visual polish to match screenshot ========== */
/* Paste into Appearance → Customize → Additional CSS */

/* Card shell: rounded white card with subtle shadow, keep existing layout */
.woocommerce ul.products li.product,
.woocommerce .products .product {
  background: #fff;
  border-radius: 12px;
  padding: 18px 16px 12px;
  border: 1px solid rgba(30,40,45,0.04);
  box-shadow: 0 6px 22px rgba(8,12,16,0.04);
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
}

/* Sale badge (top-left red pill) */
.woocommerce ul.products li.product .onsale,
.woocommerce .products .product .onsale,
.woocommerce ul.products li.product .badge.onsale {
  position: absolute !important;
  left: 14px !important;
  top: 14px !important;
  background: #ff3b30 !important;
  color: #fff !important;
  font-weight: 800 !important;
  font-size: 12px !important;
  padding: 6px 11px !important;
  border-radius: 8px !important;
  box-shadow: 0 6px 18px rgba(255,59,48,0.12) !important;
  z-index: 12 !important;
}

/* Optional "view" icon top-right if present (.view-btn or .quick-view). Style safely */
.woocommerce ul.products li.product .view-btn,
.woocommerce ul.products li.product .quick-view,
.woocommerce ul.products li.product .product-loop-view,
.woocommerce .products .product .view-btn {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(18,34,46,0.95);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 18px rgba(8,12,16,0.08);
  z-index: 11;
  font-size: 14px;
}

/* Product image: centered, generous size */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link,
.woocommerce .products .product a.woocommerce-LoopProduct-link {
  display: block;
  width: 100%;
  text-align: center;
}

.woocommerce ul.products li.product a img,
.woocommerce .products .product a img {
  margin: 6px auto 12px;
  width: auto;
  max-width: 88%;
  max-height: 300px;
  object-fit: contain;
  transition: transform .28s cubic-bezier(.2,.8,.2,1);
  border-radius: 6px;
}

/* gentle image scale on hover */
.woocommerce ul.products li.product:hover a img,
.woocommerce .products .product:hover a img {
  transform: scale(1.03);
}

/* Title: centered, bold, dark blue */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce .products .product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2.product_title,
.woocommerce .products .product h2.product_title {
  text-align: center;
  font-weight: 800;
  color: #0f2740;
  font-size: 16px;
  line-height: 1.18;
  margin: 4px 8px 8px;
  padding: 0;
  white-space: normal;
  letter-spacing: 0;
}

/* Price block: struck original price + red sale price */
.woocommerce ul.products li.product .price,
.woocommerce .products .product .price {
  text-align: center;
  margin: 4px 0 6px;
  font-weight: 800;
  color: #e53935;
  font-size: 15px;
}

/* crossed/old price */
.woocommerce ul.products li.product .price del,
.woocommerce .products .product .price del {
  color: #c9c9c9;
  text-decoration: line-through;
  margin-right: 8px;
  font-weight: 700;
}

/* sale amount style (strong red) */
.woocommerce ul.products li.product .price ins,
.woocommerce .products .product .price ins,
.woocommerce ul.products li.product .price .amount,
.woocommerce .products .product .price .amount {
  color: #e53935 !important;
  font-weight: 900;
}

/* Stock left text (small bold, centered, red-ish) */
.woocommerce ul.products li.product p.stock,
.woocommerce .products .product p.stock,
.woocommerce ul.products li.product .stock,
.woocommerce .products .product .stock {
  text-align: center;
  color: #d33b30;
  font-weight: 700;
  font-size: 13px;
  margin-top: 6px;
}

/* ---------- Stock progress (slim pink track + red handle) ---------- */
/* Ensure wrapper exists in HTML with class .stock-progress */
.woocommerce ul.products li.product .stock-progress,
.woocommerce .products .product .stock-progress {
  margin: 10px 12px;
  height: 10px;
  background: rgba(255,120,140,0.12); /* pale pink track */
  border-radius: 10px;
  position: relative;
  overflow: visible;
}

/* fill: width should be set inline (style="width:XX%") or via plugin output */
.woocommerce ul.products li.product .stock-progress .progress-fill,
.woocommerce .products .product .stock-progress .progress-fill {
  height: 100%;
  background: linear-gradient(90deg,#ff3b30,#ff7a80);
  border-radius: 10px;
  width: 18%; /* fallback - plugin/inline style should override */
  transition: width .45s cubic-bezier(.2,.9,.25,1);
}

/* small red circular handle centered on the end of the fill */
.woocommerce ul.products li.product .stock-progress .handle,
.woocommerce .products .product .stock-progress .handle {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: calc(0% - 7px); /* plugin should set left inline like left:calc(30% - 7px) */
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #ff3b30;
  border: 3px solid #fff;
  box-shadow: 0 6px 18px rgba(255,59,48,0.18);
}

/* "Limited Time Offer" label: centered, bluish, underlined */
.woocommerce ul.products li.product .limited-time,
.woocommerce .products .product .limited-time {
  text-align: center;
  color: #2f6bb3;
  font-weight: 700;
  margin-top: 12px;
  margin-bottom: 8px;
  font-size: 13px;
  text-decoration: underline;
}

/* ---------- Countdown boxes ---------- */
/* Target common plugin outputs: .deal-countdown, .product-countdown, .countdown-box, .yith-countdown */
.woocommerce ul.products li.product .deal-countdown,
.woocommerce ul.products li.product .product-countdown,
.woocommerce ul.products li.product .countdown-box,
.woocommerce ul.products li.product .yith-countdown,
.woocommerce .products .product .deal-countdown,
.woocommerce .products .product .product-countdown,
.woocommerce .products .product .countdown-box,
.woocommerce .products .product .yith-countdown {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin: 6px 8px 10px;
  flex-wrap: nowrap;
}

/* individual box */
.woocommerce ul.products li.product .deal-countdown .time,
.woocommerce ul.products li.product .product-countdown .time,
.woocommerce ul.products li.product .countdown-box .time,
.woocommerce ul.products li.product .yith-countdown .time,
.woocommerce .products .product .deal-countdown .time,
.woocommerce .products .product .product-countdown .time,
.woocommerce .products .product .countdown-box .time {
  width: 74px;
  background: #fff;
  border: 1px solid rgba(20,30,36,0.06);
  border-radius: 4px;
  padding: 10px 6px;
  text-align: center;
  box-shadow: 0 6px 18px rgba(12,20,25,0.02);
}

/* big number (days/hours/minutes/seconds) - bold red */
.woocommerce ul.products li.product .deal-countdown .time .num,
.woocommerce ul.products li.product .product-countdown .time .num,
.woocommerce ul.products li.product .countdown-box .time .num,
.woocommerce .products .product .deal-countdown .time .num,
.woocommerce .products .product .product-countdown .time .num {
  font-size: 20px;
  font-weight: 900;
  color: #e53935;
  line-height: 1;
  display: block;
}

/* small label under number (uppercase, muted) */
.woocommerce ul.products li.product .deal-countdown .time .label,
.woocommerce ul.products li.product .product-countdown .time .label,
.woocommerce ul.products li.product .countdown-box .time .label,
.woocommerce .products .product .deal-countdown .time .label,
.woocommerce .products .product .product-countdown .time .label {
  font-size: 11px;
  font-weight: 800;
  color: #6b7884;
  margin-top: 6px;
  letter-spacing: .8px;
  text-transform: uppercase;
}

/* ---------- Bottom controls row ---------- */
.woocommerce ul.products li.product .product-controls,
.woocommerce .products .product .product-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid rgba(21,30,33,0.04);
}

/* small square icon buttons */
.woocommerce ul.products li.product .icon-btn,
.woocommerce .products .product .icon-btn,
.woocommerce ul.products li.product .product-controls button,
.woocommerce .products .product .product-controls button {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border: 1px solid rgba(21,30,33,0.06);
  background: #fff;
  box-shadow: 0 6px 18px rgba(8,12,16,0.03);
  cursor: pointer;
}

/* Add to cart center: flat white button with bold text */
.woocommerce ul.products li.product .add-to-cart-wrap,
.woocommerce .products .product .add-to-cart-wrap {
  flex: 1 1 auto;
  display:flex;
  justify-content:center;
  padding: 6px 10px;
}

.woocommerce ul.products li.product .add-to-cart-wrap .button,
.woocommerce .products .product .add-to-cart-wrap .button,
.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce .products .product .button.add_to_cart_button {
  min-width: 180px;
  padding: 10px 18px;
  border-radius: 8px;
  border: 1px solid rgba(21,30,33,0.06);
  background: #fff;
  font-weight: 800;
  color: #1f2d36;
  box-shadow: 0 6px 18px rgba(8,12,16,0.03);
}

/* Favorite/heart on right */
.woocommerce ul.products li.product .product-controls .fav,
.woocommerce .products .product .product-controls .fav {
  width:36px;
  height:36px;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border: 1px solid rgba(21,30,33,0.06);
  background: #fff;
  box-shadow: 0 6px 18px rgba(8,12,16,0.03);
}

/* ---------- Small responsive tweaks (do not change layout behavior) ---------- */
@media (max-width: 900px) {
  .woocommerce ul.products li.product a img,
  .woocommerce .products .product a img { max-height: 260px; }
  .woocommerce ul.products li.product .stock-progress { margin-left: 10px; margin-right: 10px; }
}

@media (max-width: 520px) {
  .woocommerce ul.products li.product .deal-countdown .time,
  .woocommerce .products .product .deal-countdown .time { width: 62px; padding: 8px 6px; }
  .woocommerce ul.products li.product .add-to-cart-wrap .button,
  .woocommerce .products .product .add-to-cart-wrap .button { min-width: 150px; }
}

/* ========== NOTES ==========
- This CSS expects the stock/progress markup like:
  
    
    
  
  If your plugin doesn't output that, add the small wrapper in your template or tell me the plugin markup.

- Common countdown classnames targeted: .deal-countdown, .product-countdown, .countdown-box, .yith-countdown.
  If your countdown plugin uses other .elementor-4259 .elementor-element.elementor-element-efdf9b4s, give me one product's HTML and I will adapt.

- Paste the whole block into Additional CSS, clear any CSS cache, then refresh.
========================================== */







.blog-carousel-wrapper {
  position: relative;
  padding: 0;
  max-width: 100%;
  overflow: hidden;
}

.blog-carousel {
  display: flex;
  overflow-x: auto;
  gap: 20px;
  padding: 10px 40px;
  scroll-behavior: smooth;
  scrollbar-width: none;
}
.blog-carousel::-webkit-scrollbar {
  display: none;
}

.blog-card {
  flex: 0 0 auto;
  width: 450px;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
  transition: transform 0.3s ease;
  font-family: 'Inter', 'Poppins', sans-serif;
}
.blog-card:hover {
  transform: translateY(-4px);
}
.blog-card img {
  width: 100%;
  height: 240px;
  object-fit: cover;
  border-top-left-radius: 14px;
  border-top-right-radius: 14px;
}

.blog-content {
  padding: 18px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
  min-height: 60px;
}

.blog-date {
  font-size: 15px;
  color: #666;
}

.blog-card .blog-title {
  font-size: 20px;
  font-weight: 700;
  color: #000 !important;
  line-height: 1.4;
}

.read-more {
  font-weight: 600;
  font-size: 14px;
  color: #000;
  text-decoration: none;
  border: 1px solid #ddd;
  padding: 10px 16px;
  border-radius: 50px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  transition: all 0.3s ease;
}
.read-more:hover {
  background-color: #000;
  color: #fff;
}

/* ===== FIXED SCROLL BUTTONS ===== */
.scroll-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: #000;
  color: #fff;
  border: none;
  font-size: 22px;
  padding: 12px 16px;
  cursor: pointer;
  border-radius: 50%;
  z-index: 5; /* ✅ raised so button is clickable */
  opacity: 0.85;
  transition: opacity 0.3s;
}
.scroll-btn:hover { opacity: 1; }
.scroll-btn.left { left: 5px; }
.scroll-btn.right { right: 5px; }

/* ===== MOBILE STYLES ===== */
@media (max-width: 768px) {
  .blog-carousel-wrapper {
    padding: 0 12px;
    overflow: hidden;
  }

  .blog-carousel {
    padding: 10px 0;
    gap: 14px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }

  .blog-card {
    scroll-snap-align: start;
    flex: 0 0 auto;
    width: 85vw;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    overflow: hidden;
  }
  .blog-card img {
    width: 100%;
    height: 200px;
    object-fit: cover;
  }

  .blog-content { padding: 16px 18px; gap: 10px; }
  .blog-date { font-size: 14px; color: #777; }
  .blog-card .blog-title { font-size: 18px; font-weight: 700; line-height: 1.4; }

  .read-more {
    font-size: 14px;
    padding: 8px 14px;
    border-radius: 50px;
    border: 1px solid #ddd;
  }
  .read-more:hover { background-color: #000; color: #fff; }

  /* hide buttons on mobile */
  .scroll-btn { display: none; }
}

/* ===== COMING SOON OVERLAY ===== */
.coming-soon-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  backdrop-filter: blur(8px);
  background: rgba(10, 10, 10, 0.55);
  z-index: 10; /* ✅ raised so overlay sits above cards */
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  animation: fadeInOverlay 1s ease-in-out forwards;
}
@keyframes fadeInOverlay {
  0% { opacity: 0; transform: scale(0.98); }
  100% { opacity: 1; transform: scale(1); }
}
.coming-soon-text h2 {
  font-size: 3.2rem;
  font-weight: 900;
  text-transform: uppercase;
  text-align: center;
  background: linear-gradient(90deg, #00f2ff, #6c63ff, #ff48c4);
  background-size: 300% 300%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: shimmer 6s infinite linear;
  letter-spacing: 3px;
  filter: drop-shadow(0 2px 8px rgba(0, 255, 255, 0.3));
}
@keyframes shimmer {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}