/* Home page (page-id-13, body.home): 1:1 match of the Weebly "dusk" home page. */

/* Weebly sets -webkit-font-smoothing:antialiased on its body (thinner text on macOS). */
body.home{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

/* ----- Hero banner ----- */
/* Weebly .banner has min-width:65% of the 1170px (viewport-40 when <=1024) container, so the h2/button column is that wide. */
body.home .wp-block-cover.prefab-reveal{container-type:inline-size}
body.home .wp-block-post-content>.wp-block-cover.prefab-reveal .wp-block-cover__inner-container>h2.wp-block-heading{width:fit-content;max-width:100%;min-width:min(100%,calc(min(1170px,100cqw)*.65))}
@media(min-width:767px) and (max-width:781px){
 body.home .wp-block-post-content>.wp-block-cover.prefab-reveal{min-height:764px!important}
 body.home .wp-block-post-content>.wp-block-cover.has-parallax{min-height:456px!important}
}

/* ----- Last callout section follows the parallax band, so it is a normal 30px (<=1024) section, not the first-after-banner 70px one ----- */
@media(max-width:1024px){
 body.home .wp-block-post-content>.wp-block-cover.has-parallax+.wp-block-group{padding-top:30px!important}
}

/* ----- Stockists parallax band ----- */
body.home .wp-block-post-content>.wp-block-cover.has-parallax{padding:0}
body.home .wp-block-cover.has-parallax .wp-block-cover__image-background.has-parallax{background-position:0% 0%!important}
body.home .wp-block-cover.has-parallax .wp-block-cover__inner-container{box-sizing:border-box;width:100%;max-width:1070px;margin:0 auto;padding:50px 0}
@media(max-width:1024px){
 body.home .wp-block-cover.has-parallax .wp-block-cover__inner-container{max-width:none;padding:30px 20px}
}

/* ----- Video column: retain the 306px player height and 318px line box.
   Fit the player to its column so controls are fully visible at tablet widths. */
body.home .wp-block-post-content .prefab-native-video{box-sizing:border-box;width:100%;height:318px;margin:0;overflow:hidden}
body.home .wp-block-post-content .prefab-native-video video{display:block;width:100%;height:306px;max-width:none;object-fit:contain;background:#fff}

/* ----- Gallery: Weebly images with text-align:right lose that alignment in the converted markup (only the figures without .aligncenter); matters when the stacked column is wider than the image (~420-766px). */
body.home .wp-block-post-content .wp-block-columns figure.wp-block-image:not(.aligncenter){text-align:right}
