.hero-banner{position:relative;overflow:hidden;padding:4rem 0}@media screen and (min-width: 750px){.hero-banner{padding:6rem 0}}@media screen and (min-width: 990px){.hero-banner{padding:8rem 0}}.hero-banner__content{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;min-height:50vh}@media screen and (max-width: 989px){.hero-banner__content{grid-template-columns:1fr}.hero-banner__image-wrapper{order:-1;margin-bottom:3rem}}.hero-banner__image-wrapper{position:relative;border-radius:1rem;overflow:hidden}.hero-banner__image-wrapper img{width:100%;height:auto;object-fit:cover;border-radius:1rem}.hero-banner.hero--small .hero-banner__content{min-height:30vh}.hero-banner.hero--medium .hero-banner__content{min-height:40vh}.hero-banner__text{max-width:65rem}.hero-banner__heading{font-size:3.5rem;font-weight:700;line-height:1.2;margin:0 0 2rem;color:rgb(var(--color-foreground))}@media screen and (min-width: 750px){.hero-banner__heading{font-size:4.5rem}}@media screen and (min-width: 990px){.hero-banner__heading{font-size:5.5rem}}.hero-banner__heading-primary{display:block}.hero-banner__heading-accent{display:block;color:rgb(var(--color-button));font-weight:800}.hero-banner__description{font-size:1.8rem;line-height:1.6;margin-bottom:3rem;color:rgba(var(--color-foreground),.8)}@media screen and (min-width: 750px){.hero-banner__description{font-size:2rem}}.hero-banner__buttons{display:flex;flex-wrap:wrap;gap:1.5rem;margin-top:2rem}.hero-banner__button{display:inline-flex;align-items:center;justify-content:center;padding:1.5rem 3rem;font-size:1.6rem;font-weight:600;text-decoration:none;text-align:center;white-space:nowrap;cursor:pointer;border:2px solid rgb(var(--color-button));background-color:rgb(var(--color-button));color:rgb(var(--color-button-text));border-radius:.4rem;transition:all .3s ease}.hero-banner__button:hover{background-color:rgba(var(--color-button),.9);transform:translateY(-2px);box-shadow:0 10px 25px rgba(var(--color-button),.3)}.hero-banner__button--secondary{background-color:transparent;color:rgb(var(--color-button))}.hero-banner__button--secondary:hover{background-color:rgb(var(--color-button));color:rgb(var(--color-button-text))}.hero-banner__overlay{position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(var(--color-overlay),.4);pointer-events:none}@media screen and (max-width: 749px){.hero-banner__heading{font-size:2.8rem}.hero-banner__description{font-size:1.6rem}.hero-banner__button{padding:1.2rem 2.4rem;font-size:1.4rem}}
/*# sourceMappingURL=/cdn/shop/t/4/assets/section-hero-banner.css.map */
