/* Hide Shop page title on mobile only */
@media (max-width: 767px) {
  body.woocommerce-shop .entry-header {
    display: none;
  }
}
/* Consistent product cards */
.woocommerce ul.products li.product,
.wc-block-grid__product {
  display: flex;
  flex-direction: column;
}

.woocommerce ul.products li.product a img,
.wc-block-grid__product-image img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

/* Keep buttons aligned at bottom */
.woocommerce ul.products li.product .button,
.wc-block-grid__product .wp-block-button__link {
  margin-top: auto;
}

/* === Single product: remove the big gap between top summary and the tabs/Description === */

/* 1) Reduce space under the top summary (title/bullets/quote button area) */
.single-product div.product .summary {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* 2) Reduce space above the tabs wrapper (this is usually the culprit) */
.single-product div.product .woocommerce-tabs,
.single-product div.product .wc-tabs-wrapper {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* 3) Reduce space between the tab buttons row and the Description content */
.single-product div.product .woocommerce-tabs ul.tabs {
  margin: 0 0 8px !important;
  padding: 0 !important;
}

/* 4) Reduce padding/margin at the top of the Description panel itself */
.single-product div.product .woocommerce-tabs .woocommerce-Tabs-panel,
.single-product div.product .woocommerce-tabs .panel {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* 5) If there’s still a stubborn gap, gently pull the tabs upward */
.single-product div.product .woocommerce-tabs {
  position: relative;
  top: -10px; /* change to -6px or -14px as needed */
}
/* Global product price styling */
.woocommerce .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce-Price-amount {
    color: #3E3E3C !important;
    font-weight: 600;
}
.woocommerce .price {
    font-size: 1.15em;
    letter-spacing: 0.3px;
}