.banner{width:100%;padding:var(--spacing-4);display:flex;flex-direction:column;gap:var(--spacing-4);transition:all .25s ease-out}.banner img{width:100%;height:auto;min-height:10rem;background:var(--color-black)}.banner-primary{background:var(--color-keylime)}.banner-black{background:var(--color-black);color:var(--color-off-white)}.banner-white{background:var(--color-off-white)}.banner-content{display:flex;flex-direction:column;gap:var(--spacing-4);margin-bottom:var(--spacing-8)}.banner-content h3{font-size:var(--font-size-5);width:100%}.banner-content h3 sup{vertical-align:top;font-size:var(--font-size-4)}.banner-btns span{display:block}.banner-btns a.btn-primary,.banner-btns a.btn-secondary{display:inline-block;width:calc(50% - var(--spacing-3));margin:0 var(--spacing-3) var(--spacing-3) 0}.banner-btns a.btn-secondary{margin:0}@media(min-width:768px){.banner{display:grid;padding:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:repeat(6,1fr);grid-template-areas:"image image content content content content" "image image btns btns btns ."}.banner.banner-right{grid-template-columns:repeat(6,1fr);grid-template-areas:"content content content content image image" ". btns btns btns image image"}.banner.banner-right .banner-content{justify-content:flex-end}.banner.banner-right .banner-btns{text-align:right}.banner img{grid-area:image;width:100%;object-fit:cover}.banner-content{grid-area:content;display:flex;flex-direction:row;gap:var(--spacing-6)}.banner-content h3{font-size:var(--font-size-5);width:fit-content}.banner-btns{grid-area:btns;align-self:self-end}.banner-btns a.btn-primary{max-width:24rem}.banner-btns a.btn-secondary{width:fit-content}}@media(min-width:1024px){.banner{padding:var(--spacing-8);gap:var(--spacing-6);grid-template-columns:repeat(12,1fr);grid-template-rows:1fr 1fr;grid-template-areas:"image image image content content content content content content . . ." "image image image btns btns btns btns . . . . ."}.banner.banner-right{grid-template-columns:repeat(12,1fr);grid-template-areas:" . . .  content content content content content content image image image " " . . . . .  btns btns btns btns image image image"}.banner-btns{grid-area:btns}}@media(min-width:1600px){.banner{gap:var(--spacing-6);grid-template-columns:repeat(12,1fr);grid-template-rows:1fr 1fr;grid-template-areas:"image image content content content content content content content . . ." "image image btns btns btns btns btns . . . . ."}.banner.banner-right{grid-template-columns:repeat(12,1fr);grid-template-areas:" . . .  content content content content content content content image image " " . . . . .  btns btns btns btns btns image image"}}@media(min-width:2000px){.banner{padding:var(--spacing-8) var(--spacing-10);gap:var(--spacing-6)}}
/*# sourceMappingURL=/cdn/shop/t/18/assets/section-banner.css.map */