/* ==========================================================================
   Filtersock 2026 light refresh
   Scoped to Divi shop grids, the homepage hero, buttons and footer.
   Fully reversible: remove the `filtersock-refresh` enqueue in functions.php.
   ========================================================================== */

:root{
  --fs-aqua:#00a9e0;
  --fs-aqua-dark:#0b7fb0;
  --fs-navy:#123a4a;
  --fs-ink:#2c3e46;
  --fs-line:#e5edf1;
  --fs-well:#eef4f8;
}

/* ---------- Product cards ---------------------------------------------- */
/* Generic `ul.products li.product` so the treatment reaches both the Divi
   homepage shop modules and the native WooCommerce category/shop archives. */
ul.products li.product{
  background:#fff;
  border:1px solid var(--fs-line);
  border-radius:12px;
  padding:14px 14px 18px;
  box-shadow:0 1px 2px rgba(18,58,74,.05);
  transition:box-shadow .2s ease, transform .2s ease, border-color .2s ease;
  display:flex;
  flex-direction:column;
  margin-bottom:26px;
}
ul.products li.product:hover{
  box-shadow:0 12px 26px rgba(18,58,74,.13);
  transform:translateY(-3px);
  border-color:#cfe4ee;
}

/* Tinted image well: makes the transparent white-sock PNGs visible and
   keeps every tile the same height regardless of image. */
.et_pb_shop ul.products li.product .et_shop_image{
  position:relative;
  display:block;
  background:var(--fs-well);
  border-radius:8px;
  overflow:hidden;
}
.et_pb_shop ul.products li.product .et_shop_image > img,
.et_pb_shop ul.products li.product .et_shop_image > .et_overlay + img{
  aspect-ratio:1 / 1;
  width:100%;
  height:auto;
  object-fit:contain;
  padding:12px;
  box-sizing:border-box;
}

/* Title + price */
ul.products li.product h2.woocommerce-loop-product__title,
ul.products li.product h2,
ul.products li.product h3{
  font-size:15px;
  line-height:1.35;
  font-weight:600;
  color:var(--fs-ink);
  margin:14px 4px 8px;
  min-height:2.7em;               /* aligns 1- and 2-line titles */
}
ul.products li.product .price,
ul.products li.product .et_pb_shop_price{
  color:var(--fs-navy) !important;
  margin:0 4px auto;
}

/* ---------- Add to basket button on the grid --------------------------- */
ul.products li.product a.add_to_cart_button,
ul.products li.product a.button{
  display:block;
  width:100%;
  text-align:center;
  margin-top:14px;
  background:var(--fs-aqua) !important;
  color:#fff !important;
  border:0 !important;
  border-radius:8px;
  padding:11px 14px !important;
  font-weight:600;
  letter-spacing:.2px;
  transition:background .2s ease, transform .1s ease;
}
ul.products li.product a.add_to_cart_button:hover,
ul.products li.product a.button:hover{
  background:var(--fs-aqua-dark) !important;
  transform:translateY(-1px);
}
ul.products li.product a.added_to_cart{
  display:block;
  width:100%;
  text-align:center;
  margin-top:8px;
  color:var(--fs-aqua-dark);
  font-weight:600;
}

/* ---------- Homepage hero ---------------------------------------------- */
.fs-hero{
  background:linear-gradient(135deg,#00a9e0 0%,#0b7fb0 55%,#12708f 100%);
  color:#fff;
  padding:58px 20px;
  text-align:center;
}
.fs-hero__inner{max-width:820px;margin:0 auto;}
.fs-hero__kicker{
  text-transform:uppercase;letter-spacing:2px;font-size:12px;font-weight:700;
  opacity:.9;margin:0 0 10px;
}
.fs-hero__title{color:#fff;font-size:38px;line-height:1.15;font-weight:800;margin:0 0 12px;}
.fs-hero__sub{font-size:17px;line-height:1.55;opacity:.95;margin:0 auto 26px;max-width:640px;}
.fs-hero__cta{margin:0;}
.fs-btn{
  display:inline-block;background:#fff;color:#0b7fb0;font-weight:700;
  padding:13px 26px;border-radius:999px;margin:6px;
  box-shadow:0 6px 16px rgba(0,0,0,.14);
  transition:transform .15s ease;
}
.fs-btn:hover{transform:translateY(-2px);color:#0b7fb0;}
.fs-btn--ghost{background:transparent;color:#fff;box-shadow:inset 0 0 0 2px rgba(255,255,255,.7);}
.fs-btn--ghost:hover{color:#fff;background:rgba(255,255,255,.12);}
#fs-shop{display:block;position:relative;top:-90px;visibility:hidden;}

@media (max-width:980px){
  .fs-hero{padding:42px 18px;}
  .fs-hero__title{font-size:28px;}
  .fs-hero__sub{font-size:15px;}
}