.blog-banner{position:relative;overflow:hidden}.blog-banner__content{position:relative;z-index:2;padding:3rem 0;width:100%;height:100%}.blog-banner--background{position:relative;min-height:60vh;display:flex;align-items:center;height:auto}.blog-banner--background .blog-banner__content{padding:0;height:100%;display:flex;width:100%;min-height:inherit}.blog-banner--background.blog-banner--top-left,.blog-banner--background.blog-banner--top-center,.blog-banner--background.blog-banner--top-right{align-items:flex-start}.blog-banner--background.blog-banner--center-left,.blog-banner--background.blog-banner--center,.blog-banner--background.blog-banner--center-right{align-items:center}.blog-banner--background.blog-banner--bottom-left,.blog-banner--background.blog-banner--bottom-center,.blog-banner--background.blog-banner--bottom-right{align-items:flex-end}.blog-banner__background{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.blog-banner__background-image{width:100%;height:100%;object-fit:cover;object-position:center}.blog-banner__overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:2;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background-color:#8b5cf64d;opacity:1}.blog-banner__wrapper{display:flex;align-items:center;gap:3rem;max-width:1200px;margin:0 auto;padding:0 2rem;position:relative;z-index:3;width:100%;height:100%}.blog-banner--background .blog-banner__wrapper{flex-direction:column;gap:2rem;width:100%;max-width:none;height:auto;padding:6rem 2rem;justify-content:center;min-height:inherit}.blog-banner--background.blog-banner--top-left .blog-banner__wrapper,.blog-banner--background.blog-banner--center-left .blog-banner__wrapper,.blog-banner--background.blog-banner--bottom-left .blog-banner__wrapper{align-items:flex-start;text-align:left;padding-left:4rem}.blog-banner--background.blog-banner--top-center .blog-banner__wrapper,.blog-banner--background.blog-banner--center .blog-banner__wrapper,.blog-banner--background.blog-banner--bottom-center .blog-banner__wrapper{align-items:center;text-align:center}.blog-banner--background.blog-banner--top-right .blog-banner__wrapper,.blog-banner--background.blog-banner--center-right .blog-banner__wrapper,.blog-banner--background.blog-banner--bottom-right .blog-banner__wrapper{align-items:flex-end;text-align:right;padding-right:4rem}.blog-banner__media{flex:1;order:2}.blog-banner__content-inner{flex:1;order:1;text-align:center;display:flex;flex-direction:column;align-items:center;width:100%}.blog-banner--background .blog-banner__content-inner{max-width:800px;align-items:inherit;text-align:inherit}.blog-banner--background.blog-banner--top-left .blog-banner__content-inner,.blog-banner--background.blog-banner--center-left .blog-banner__content-inner,.blog-banner--background.blog-banner--bottom-left .blog-banner__content-inner{align-items:flex-start}.blog-banner--background.blog-banner--top-right .blog-banner__content-inner,.blog-banner--background.blog-banner--center-right .blog-banner__content-inner,.blog-banner--background.blog-banner--bottom-right .blog-banner__content-inner{align-items:flex-end}.blog-banner__media .card-wrapper{background:transparent}.blog-banner__media .media{border-radius:.5rem;overflow:hidden;aspect-ratio:16/9}.blog-banner__media .media--landscape{aspect-ratio:16/9}.blog-banner__media .media--portrait{aspect-ratio:3/4}.blog-banner__media .media--square{aspect-ratio:1}.blog-banner__media .media img{object-fit:cover;width:100%;height:100%;transition:transform .3s ease}@media screen and (max-width:749px){.blog-banner__wrapper{flex-direction:column;gap:2rem;padding:0 1rem}.blog-banner--background{min-height:50vh}.blog-banner--background .blog-banner__wrapper{padding:3rem 1rem;align-items:center!important;text-align:center!important}.blog-banner--background .blog-banner__content-inner{text-align:center!important;align-items:center!important}.blog-banner__media,.blog-banner__content-inner{order:unset}}.blog-banner__tag{display:inline-block;padding:.5rem 1rem;background-color:rgb(var(--color-primary));color:rgb(var(--color-background));border-radius:2rem;font-size:.875rem;font-weight:500;text-transform:uppercase;letter-spacing:.1em;margin-bottom:1rem}.blog-banner__heading{margin-bottom:1rem;color:rgb(var(--color-foreground));text-align:inherit}.blog-banner--background .blog-banner__heading{color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.5)}.blog-banner__subtext{margin-bottom:1.5rem;font-size:1.5rem;letter-spacing:.06rem;line-height:calc(1 + .8 / var(--font-body-scale));font-family:var(--font-body-family);font-style:var(--font-body-style);font-weight:var(--font-body-weight);color:rgba(var(--color-foreground),.8);text-align:inherit;max-width:600px}.blog-banner--background .blog-banner__subtext{color:#ffffffe6;text-shadow:0 1px 2px rgba(0,0,0,.5)}.blog-banner--background.blog-banner--top-left .blog-banner__subtext,.blog-banner--background.blog-banner--center-left .blog-banner__subtext,.blog-banner--background.blog-banner--bottom-left .blog-banner__subtext{margin-left:0;margin-right:auto}.blog-banner--background.blog-banner--top-right .blog-banner__subtext,.blog-banner--background.blog-banner--center-right .blog-banner__subtext,.blog-banner--background.blog-banner--bottom-right .blog-banner__subtext{margin-left:auto;margin-right:0}.blog-banner__meta{display:flex;gap:1rem;margin-bottom:1.5rem;font-size:1.2rem;letter-spacing:.07rem;line-height:calc(1 + .7 / var(--font-body-scale));color:rgba(var(--color-foreground),.7);justify-content:center;align-items:center}.blog-banner--background .blog-banner__meta{color:#fffc;text-shadow:0 1px 2px rgba(0,0,0,.5)}.blog-banner--background.blog-banner--top-left .blog-banner__meta,.blog-banner--background.blog-banner--center-left .blog-banner__meta,.blog-banner--background.blog-banner--bottom-left .blog-banner__meta{justify-content:flex-start}.blog-banner--background.blog-banner--top-right .blog-banner__meta,.blog-banner--background.blog-banner--center-right .blog-banner__meta,.blog-banner--background.blog-banner--bottom-right .blog-banner__meta{justify-content:flex-end}.blog-banner__meta time{font-weight:500}.blog-banner__author:before{content:"\2022";margin-right:.5rem}.blog-banner__content-inner .button{display:inline-flex!important;align-items:center;justify-content:center;text-align:center;margin:0 auto;align-self:center;min-width:calc(12rem + var(--buttons-border-width) * 2);min-height:calc(4.5rem + var(--buttons-border-width) * 2);padding:0 3rem;padding-top:4px;font-size:1.5rem;letter-spacing:.1rem;line-height:calc(1 + .2 / var(--font-body-scale));font-weight:inherit;text-decoration:none;color:rgb(var(--color-button-text));background-color:rgba(var(--color-button),var(--alpha-button-background));border-radius:var(--buttons-radius-outset);border:0;cursor:pointer;-webkit-appearance:none;appearance:none;transition:box-shadow var(--duration-short) ease}.blog-banner--background.blog-banner--top-left .blog-banner__content-inner .button,.blog-banner--background.blog-banner--center-left .blog-banner__content-inner .button,.blog-banner--background.blog-banner--bottom-left .blog-banner__content-inner .button{margin:0;align-self:flex-start}.blog-banner--background.blog-banner--top-right .blog-banner__content-inner .button,.blog-banner--background.blog-banner--center-right .blog-banner__content-inner .button,.blog-banner--background.blog-banner--bottom-right .blog-banner__content-inner .button{margin:0;align-self:flex-end}.blog-banner--background .blog-banner__content-inner .button{box-shadow:0 4px 8px #0003}.blog-banner .button{--animation-delay: .4s}@media(prefers-reduced-motion:no-preference){.blog-banner .scroll-trigger{opacity:0;transform:translateY(2rem);transition:opacity .8s ease-out,transform .8s ease-out;transition-delay:var(--animation-delay, 0s)}.blog-banner .scroll-trigger.animate--slide-in{opacity:1;transform:translateY(0)}}.blog-banner__content{padding-top:4rem;padding-bottom:4rem}@media screen and (max-width:749px){.blog-banner__content{padding-top:2rem;padding-bottom:2rem}}@media screen and (max-width:749px){.blog-banner__subtext{font-size:1.3rem}.blog-banner__meta{font-size:1rem}}.blog-banner .card-wrapper,.blog-banner .card{box-shadow:none;background:transparent}.blog-banner .media-wrapper{border:none}.blog-banner--background .blog-banner__media,.blog-banner--background .blog-banner__tag{display:none}@media screen and (max-width:990px){.blog-banner--background .blog-banner__wrapper{gap:1.5rem}}@supports not (backdrop-filter: blur(8px)) and not (-webkit-backdrop-filter: blur(8px)){.blog-banner__overlay{background-color:#8b5cf680}}
/*# sourceMappingURL=/cdn/shop/t/68/assets/section-blog-banner.css.map */
