/* =======================
   SHOP HERO (namespaced)
   ======================= */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');

:root{
  --mjblue:#0355ae;
  --ink:#111;
  --ink2:#333;
}

/* Make hero bleed full width even inside Storefront containers */
.shop-hero{
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  width:100vw;
}

.shop-hero{
  position:relative;
  height:68vh;                 /* same feel as live site */
  min-height:360px;
  overflow:hidden;
  color:#fff;
  text-align:center;
  font-family:'Poppins',system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
}
.shop-hero__slide{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  opacity:0; transition:opacity 1s;
}
.shop-hero__slide.is-active{ opacity:1; }

/* dark overlay for text readability (matches live tone) */
.shop-hero::after{
  content:""; position:absolute; inset:0;
  background:rgba(0,27,66,.65);
}

.shop-hero__inner{
  position:relative; z-index:2; height:100%;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:0 20px; max-width:900px; margin:0 auto;
}
.shop-hero__title{
  font-size:2.6rem; line-height:1.12; margin:0 0 10px; font-weight:700;
  text-shadow:0 2px 6px rgba(0,0,0,.6);
}
.shop-hero__sub{
  font-size:1.12rem; margin:0; color:#f3f7ff;
  text-shadow:0 1px 4px rgba(0,0,0,.55);
}

/* some breathing room before products start */
.shop-hero + .woocommerce{ margin-top:24px; }

@media (max-width:768px){
  .shop-hero{ height:55vh; }
  .shop-hero__title{ font-size:2.1rem; }
  .shop-hero__sub{ font-size:1rem; }
}
/* Hide Woo's default header block on archives (title/desc wrapper) */
.woocommerce-products-header { display:none !important; }

/* Ensure our hero breaks out of Storefront's content container */
.woocommerce .shop-hero{
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  width:100vw !important;
}

/* Force white text in the hero (some themes style h1 dark) */
.shop-hero__title,
.shop-hero__sub { color:#fff !important; }
/* =======================
   MJ Woldow — Shop page tweaks
   ======================= */

/* Hide Storefront header ONLY on Shop page (logo/black strip) */
.mw-shop .site-header { display: none !important; }

/* Hide Woo's default archive header wrapper on Shop */
.mw-shop .woocommerce-products-header { display: none !important; }

/* Remove any top spacing Storefront adds on Shop */
.mw-shop .site-main,
.mw-shop .content-area,
.mw-shop .col-full { margin-top: 0 !important; padding-top: 0 !important; }

/* Make our hero truly full-bleed on Shop */
.mw-shop .shop-hero{
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  width: 100vw !important;
}

/* Ensure hero text is white even if theme sets h1 dark */
.mw-shop .shop-hero__title,
.mw-shop .shop-hero__sub { color:#fff !important; }

/* If you're logged in (admin bar), give the hero a little offset */
.mw-shop.admin-bar .shop-hero { margin-top: 32px; }
/* Slim down hero banner */
.mw-hero {
  min-height: 100px !important;   /* reduce height */
  padding: 30px 0 !important;     /* less top/bottom padding */
  background-position: center center;
}

.mw-hero h1 {
  font-size: 26px !important;     /* smaller title */
  margin: 0;
}

.mw-hero p {
  font-size: 14px !important;     /* smaller subtitle */
  margin: 4px 0 0;
  opacity: 0.9;
}

/* Breadcrumbs closer + smaller */
.mw-breadcrumbs {
  font-size: 12px !important;
  padding: 5px 18px 0 !important;
  margin-bottom: 8px !important;
}
.mw-breadcrumbs a {
  font-weight: 500;
}
/* ---- Remove default Storefront / WooCommerce banner header ---- */
.woocommerce-products-header,
.storefront-page-header,
.page-header,
header.page-header,
.storefront-archive-header {
  display: none !important;
  height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
}