.jkl-hero-banner{position:relative;width:100%;display:flex;justify-content:center;overflow:hidden;background-color:#1a1a1a;color:#fff}.jkl-hero-banner--valign-top{align-items:flex-start}.jkl-hero-banner--valign-center{align-items:center}.jkl-hero-banner--valign-bottom{align-items:flex-end}.jkl-hero-banner--small{min-height:480px}.jkl-hero-banner--medium{min-height:720px}.jkl-hero-banner--large{min-height:100vh;aspect-ratio:1440/1024}.jkl-hero-banner__image{position:absolute;top:0;right:0;bottom:0;left:0}.jkl-hero-banner__image img{width:100%;height:100%;object-fit:cover;display:block}.jkl-hero-banner__overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.jkl-hero-banner__content{position:relative;z-index:2;max-width:min(720px,90%);padding:clamp(24px,5vw,80px);display:flex;flex-direction:column;gap:clamp(12px,2vw,24px)}.jkl-hero-banner--align-left .jkl-hero-banner__content{margin-right:auto;text-align:left;align-items:flex-start}.jkl-hero-banner--align-center .jkl-hero-banner__content{margin:0 auto;text-align:center;align-items:center}.jkl-hero-banner--align-right .jkl-hero-banner__content{margin-left:auto;text-align:right;align-items:flex-end}.jkl-hero-banner__eyebrow{font-size:.875rem;text-transform:uppercase;letter-spacing:.15em;opacity:.85}.jkl-hero-banner__heading{font-family:var(--jkl-font-display);font-size:clamp(2.5rem,6vw,4.5rem);font-weight:400;line-height:1.05;margin:0}.jkl-hero-banner__subheading{font-family:var(--jkl-font-body);font-size:clamp(1rem,1.5vw,1.25rem);line-height:1.5;max-width:60ch}.jkl-hero-banner__button{margin-top:8px;max-width:220px;text-decoration:none}.jkl-hero-banner__button--link{display:inline-flex;align-items:center;gap:8px;padding:0 0 4px;background:none;border:0;border-bottom:1px solid currentColor;font-family:var(--jkl-font-body);font-size:1rem;letter-spacing:.02em;transition:gap .2s ease}.jkl-hero-banner__button--link:hover{gap:14px}.jkl-hero-banner .custom-btn{width:auto;display:inline-flex;align-items:center;justify-content:center}.jkl-hero-banner .custom-btn.jkl-hero-banner__button--outline{border-style:solid;border-width:max(1px,var(--btn-border-width))!important}@media(max-width:749px){.jkl-hero-banner--large{aspect-ratio:390/844;min-height:480px}}
/*# sourceMappingURL=/cdn/shop/t/4/assets/jkl-hero-banner.css.map */
