/* Full-bleed hero: escape Divi's centered content column without altering checkout markup. */
body.wim-hero-active .wim-page-hero {
 box-sizing:border-box;position:relative;left:50%;transform:translateX(-50%);
 width:100vw;width:100dvw;max-width:none;margin:0 0 40px;
 padding:42px max(24px,calc((100vw - 1140px)/2));
 display:flex;align-items:center;background-color:#333;background-size:cover;
 background-position:center;border-radius:0;overflow:hidden;
}
body.wim-hero-active .wim-page-hero__inner{width:100%;max-width:1140px;margin:auto;}
body.wim-hero-active .wim-page-hero h1{color:inherit!important;font-size:clamp(30px,4vw,50px);font-weight:600;line-height:1.2;margin:0 0 12px;padding:0;}
body.wim-hero-active .wim-page-hero h1:last-child{margin-bottom:0;}
body.wim-hero-active .wim-page-hero p{color:inherit!important;font-size:clamp(15px,1.7vw,19px);line-height:1.5;margin:0;}
/* Keep WooCommerce block cart content inside narrow screens. */
@media(max-width:767px){
 body.wim-hero-active .wim-page-hero{min-height:210px!important;padding:35px 20px;margin-bottom:24px;}
 body.woocommerce-cart .wp-block-woocommerce-cart,
 body.woocommerce-cart .wc-block-cart,
 body.woocommerce-cart .wc-block-components-main,
 body.woocommerce-cart .wc-block-cart__main,
 body.woocommerce-cart .wc-block-cart-items,
 body.woocommerce-cart .wc-block-cart-items__row {min-width:0;max-width:100%;box-sizing:border-box;}
 body.woocommerce-cart .wc-block-cart-items{width:100%;table-layout:fixed;}
 body.woocommerce-cart .wc-block-cart-items__row{display:grid!important;grid-template-columns:minmax(72px,92px) minmax(0,1fr)!important;gap:12px;padding:18px 0!important;}
 body.woocommerce-cart .wc-block-cart-items__row>td{display:block!important;width:auto!important;min-width:0!important;max-width:100%!important;padding:0!important;box-sizing:border-box;}
 body.woocommerce-cart .wc-block-cart-items__row>.wc-block-cart-item__image{grid-column:1;grid-row:1 / span 2;}
 body.woocommerce-cart .wc-block-cart-items__row>.wc-block-cart-item__product{grid-column:2;grid-row:1;overflow-wrap:anywhere;}
 body.woocommerce-cart .wc-block-cart-items__row>.wc-block-cart-item__total{grid-column:2;grid-row:2;text-align:left!important;}
 body.woocommerce-cart .wc-block-cart-item__image img{max-width:100%;height:auto;}
 body.woocommerce-cart .wc-block-cart-item__product .wc-block-components-product-name{overflow-wrap:anywhere;}
 body.woocommerce-cart .wc-block-cart-item__prices,
 body.woocommerce-cart .wc-block-cart-item__total-price-and-sale-badge{white-space:normal;overflow-wrap:anywhere;}
 body.woocommerce-cart .wc-block-cart__submit-container{max-width:100%;box-sizing:border-box;}
}

/* Beta 18: Divi's standard page template reserves a top gutter above
   the article. Remove it only when the WIM hero is enabled. The hero
   remains in normal document flow, directly after the existing header. */
body.wim-hero-active.et_right_sidebar #main-content .container,
body.wim-hero-active.et_left_sidebar #main-content .container,
body.wim-hero-active.et_full_width_page #main-content .container,
body.wim-hero-active #main-content > .container {
 padding-top:0!important;
}
body.wim-hero-active #main-content #content-area,
body.wim-hero-active #main-content #left-area,
body.wim-hero-active #main-content article.page,
body.wim-hero-active #main-content article.page .entry-content {
 margin-top:0!important;
 padding-top:0!important;
}
/* Divi can add top space to the page title wrapper, even if its title is hidden. */
body.wim-hero-active #main-content .et_post_meta_wrapper:has(> h1.entry-title) {
 margin-top:0!important;
 padding-top:0!important;
}
/* Prevent the hero itself from inheriting a paragraph/block top margin. */
body.wim-hero-active .entry-content > .wim-page-hero:first-child,
body.wim-hero-active .entry-content > .wp-block-woocommerce-cart:first-child > .wim-page-hero:first-child,
body.wim-hero-active .entry-content > .wp-block-woocommerce-checkout:first-child > .wim-page-hero:first-child {
 margin-top:0!important;
}

/* Beta 20: pull the hero behind Divi's existing transparent global header.
   The header retains its own Divi-configured background and transparency.
   This is purely a visual overlap; WooCommerce blocks are untouched. */
body.wim-hero-active .wim-header-above-hero {
 position:relative;
 z-index:100;
}
body.wim-hero-active .wim-page-hero.wim-page-hero--overlap {
 margin-top:calc(-1 * var(--wim-header-overlap, 0px))!important;
 min-height:calc(var(--wim-hero-base-height, 260px) + var(--wim-header-overlap, 0px))!important;
 padding-top:calc(42px + var(--wim-header-overlap, 0px));
}
@media(max-width:767px){
 body.wim-hero-active .wim-page-hero.wim-page-hero--overlap {
  min-height:calc(max(210px, var(--wim-hero-base-height, 260px)) + var(--wim-header-overlap, 0px))!important;
  padding-top:calc(35px + var(--wim-header-overlap, 0px));
 }
}