.hero-banner{position:relative;width:100%;min-height:var(--hero-min-height, 450px);overflow:hidden;display:flex;align-items:center}.hero-banner__background{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;z-index:1}.hero-banner__picture{display:block;width:100%;height:100%}.hero-banner__image{width:100%;height:100%;object-fit:cover;object-position:var(--bg-position-mobile, center center);display:block}.hero-banner__placeholder{width:100%;height:100%;background-color:#1f2937;display:flex;align-items:center;justify-content:center}.hero-banner__placeholder .placeholder-svg{width:50%;max-width:400px;height:auto;fill:#4b5563}.hero-banner__overlay{position:absolute;top:0;left:0;right:0;bottom:0;background-color:var(--overlay-color, #000000);opacity:var(--overlay-opacity, .3);z-index:2;pointer-events:none}.hero-banner__content{position:relative;z-index:10;width:100%;padding:20px;display:flex;box-sizing:border-box}.hero-banner--card-left .hero-banner__content{justify-content:flex-start}.hero-banner--card-center .hero-banner__content{justify-content:center}.hero-banner--card-right .hero-banner__content{justify-content:flex-end}.hero-banner__card{background-color:var(--card-bg-color, #ffffff);padding:var(--card-padding, 25px);border-radius:var(--card-border-radius, 0);max-width:var(--card-max-width, 90%);width:var(--card-width, 380px);box-sizing:border-box}.hero-banner__card{background-color:rgba(from var(--card-bg-color, #ffffff) r g b / var(--card-bg-opacity, 1))}@supports not (background-color: rgba(from #fff r g b / 1)){.hero-banner__card{background-color:var(--card-bg-color, #ffffff)}}.hero-banner__card--shadow{box-shadow:0 10px 40px #00000026,0 4px 12px #0000001a}.hero-banner__subtitle{color:var(--subtitle-color, #dc2626);font-size:var(--subtitle-size, 11px);font-weight:600;margin:0 0 12px;line-height:1.4}.hero-banner__subtitle--uppercase{text-transform:uppercase}.hero-banner__heading{color:var(--heading-color, #000000);font-size:var(--heading-size, 28px);font-weight:900;line-height:1.1;margin:0 0 16px}.hero-banner__heading--uppercase{text-transform:uppercase}.hero-banner__description{color:var(--description-color, #374151);font-size:var(--description-size, 14px);line-height:1.6;margin:0 0 24px}.hero-banner__description p{margin:0}.hero-banner__description p+p{margin-top:12px}.hero-banner__button-wrapper{margin-top:8px}.hero-banner__button{display:inline-block;background-color:var(--button-bg-color, #c8f542);color:var(--button-text-color, #000000);font-size:var(--button-font-size, 12px);font-weight:700;padding:var(--button-padding-y, 14px) var(--button-padding-x, 24px);border-radius:var(--button-border-radius, 4px);text-decoration:none;transition:background-color .3s ease,color .3s ease,transform .2s ease;border:none;cursor:pointer;text-align:center}.hero-banner__button:hover{background-color:var(--button-hover-bg-color, #b8e532);color:var(--button-hover-text-color, #000000);transform:translateY(-2px)}.hero-banner__button:active{transform:translateY(0)}.hero-banner__button--uppercase{text-transform:uppercase}.hero-banner__button--full-mobile{width:100%;display:block}@media screen and (min-width: 768px){.hero-banner__content{padding:30px}.hero-banner__button--full-mobile{width:auto;display:inline-block}}@media screen and (min-width: 1024px){.hero-banner{min-height:var(--hero-min-height-desktop, 550px)}.hero-banner__image{object-position:var(--bg-position, center center)}.hero-banner__content{padding:40px}.hero-banner--card-left .hero-banner__content{padding-left:var(--card-margin-left, 60px)}.hero-banner--card-right .hero-banner__content{padding-right:var(--card-margin-right, 60px)}.hero-banner__card{padding:var(--card-padding-desktop, 40px)}.hero-banner__subtitle{font-size:var(--subtitle-size-desktop, 13px);margin-bottom:16px}.hero-banner__heading{font-size:var(--heading-size-desktop, 42px);margin-bottom:20px}.hero-banner__description{font-size:var(--description-size-desktop, 15px);margin-bottom:28px}.hero-banner__button{font-size:var(--button-font-size-desktop, 13px)}}@media screen and (min-width: 1400px){.hero-banner--card-left .hero-banner__content{padding-left:calc(var(--card-margin-left, 60px) + 20px)}.hero-banner--card-right .hero-banner__content{padding-right:calc(var(--card-margin-right, 60px) + 20px)}}@media (prefers-reduced-motion: reduce){.hero-banner__button{transition:none}.hero-banner__button:hover{transform:none}}@media print{.hero-banner{min-height:auto}.hero-banner__background{display:none}.hero-banner__card{box-shadow:none;border:1px solid #000}}.hero-banner-section{position:relative;z-index:1}
/*# sourceMappingURL=/cdn/shop/t/6/assets/hero-collage-banner.css.map */
