.newsletter-banner{--newsletter-banner-gap: 8px;--newsletter-banner-panel-padding: 18px;--newsletter-banner-panel-padding-x: 18px;--newsletter-banner-input-height: 49px;--newsletter-banner-button-height: 50px;--newsletter-banner-orange: #fd7e22;--newsletter-banner-orange-hover: #e8690d;--newsletter-banner-ink: #7c2d04;--newsletter-banner-cream: #fff4ea;--newsletter-banner-error: #b42318;position:relative;overflow:hidden;isolation:isolate;background-color:#f26f27;color:#fff}.newsletter-banner__bg{position:absolute;z-index:-1;left:0;bottom:0;width:100%;aspect-ratio:var(--newsletter-banner-desktop-ratio);transform:none;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 12%);mask-image:linear-gradient(to bottom,transparent,#000 12%);pointer-events:none}.newsletter-banner__bg img{display:block;width:100%;height:100%;object-fit:fill;object-position:left bottom}.newsletter-banner__inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;align-content:center;gap:24px;max-width:1440px;min-height:388px;margin:0 auto;padding:24px clamp(min(11vw,200px),calc((100vw - 1040px)/2),200px)}.newsletter-banner__content{display:flex;flex-direction:column;gap:12px;letter-spacing:.6px;overflow-wrap:break-word}.newsletter-banner .newsletter-banner__heading{margin:0;color:#fff;font-size:32px;font-weight:400;line-height:normal;letter-spacing:.6px}.newsletter-banner .newsletter-banner__text{margin:0;color:#fff;font-size:24px;font-weight:400;line-height:34px;letter-spacing:.6px}.newsletter-banner__form{position:relative;display:flex;flex-direction:column;justify-content:center;min-height:calc(var(--newsletter-banner-input-height) * 2 + var(--newsletter-banner-button-height) + var(--newsletter-banner-gap) * 2 + var(--newsletter-banner-panel-padding) * 2);padding:var(--newsletter-banner-panel-padding) var(--newsletter-banner-panel-padding-x);border-radius:12px;background-color:#fff6;color:#1a1a1a}.newsletter-banner__skeleton{display:none}@supports selector(:has(*)){.newsletter-banner__skeleton{position:absolute;inset:var(--newsletter-banner-panel-padding) var(--newsletter-banner-panel-padding-x);display:flex;flex-direction:column;gap:var(--newsletter-banner-gap);pointer-events:none;animation:newsletter-banner-pulse 1.4s ease-in-out 10}.newsletter-banner__form:has(.klaviyo-form-XSXkde>*) .newsletter-banner__skeleton{display:none}}.newsletter-banner__skeleton-field,.newsletter-banner__skeleton-button{display:block;border-radius:100px}.newsletter-banner__skeleton-field{height:var(--newsletter-banner-input-height);background-color:#ffffffbf}.newsletter-banner__skeleton-button{height:var(--newsletter-banner-button-height);background-color:#fd7e228c}@keyframes newsletter-banner-pulse{50%{opacity:.55}}@media(prefers-reduced-motion:reduce){.newsletter-banner__skeleton{animation:none}}.newsletter-banner__form:has(.klaviyo-form-XSXkde>*):not(:has(input[type=email])){align-items:center;gap:12px;text-align:center}.newsletter-banner__form:has(.klaviyo-form-XSXkde>*):not(:has(input[type=email])):before{content:"";flex:none;width:48px;height:48px;border-radius:50%;background:var(--newsletter-banner-orange) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 24px no-repeat}.newsletter-banner__form:has(.klaviyo-form-XSXkde>*):not(:has(input[type=email]))>*{width:100%}.newsletter-banner__form:has(.klaviyo-form-XSXkde>*):not(:has(input[type=email])) .klaviyo-form-XSXkde :is(p,span,h1,h2,h3,h4,a,strong,em){margin:0!important;color:var(--newsletter-banner-ink)!important;font-family:Marcellus,serif!important;font-size:28px!important;font-weight:500!important;line-height:1.3!important;letter-spacing:.4px!important;text-align:center!important}@media screen and (min-width:990px){.newsletter-banner__form:has(.klaviyo-form-XSXkde>*):not(:has(input[type=email])){min-height:0;padding:32px 24px}}@media screen and (max-width:989px){.newsletter-banner__inner{min-height:0;padding:48px 11vw}.newsletter-banner .newsletter-banner__heading{font-size:28px}.newsletter-banner .newsletter-banner__text{font-size:20px;line-height:30px}}@media screen and (max-width:749px){.newsletter-banner{--newsletter-banner-gap: 10px;--newsletter-banner-panel-padding: 12px;--newsletter-banner-panel-padding-x: 8px}.newsletter-banner__bg{top:0;bottom:0;height:100%;aspect-ratio:auto;transform:none;-webkit-mask-image:none;mask-image:none}.newsletter-banner__bg img{height:100%;object-fit:fill}.newsletter-banner__inner{grid-template-columns:minmax(0,500px);justify-content:center;gap:10px;padding:48px 16px}.newsletter-banner__content{text-align:center}.newsletter-banner .newsletter-banner__heading{font-size:26px}.newsletter-banner .newsletter-banner__text{font-size:20px;font-weight:500;line-height:34px}.newsletter-banner__form:has(.klaviyo-form-XSXkde>*):not(:has(input[type=email])) .klaviyo-form-XSXkde :is(p,span,h1,h2,h3,h4,a,strong,em){font-size:24px!important}}.newsletter-banner .klaviyo-form-XSXkde form.klaviyo-form{max-width:none!important;margin:0!important;padding:0!important;background:transparent!important}.newsletter-banner .klaviyo-form-XSXkde form.klaviyo-form>div{gap:var(--newsletter-banner-gap);min-height:0!important}.newsletter-banner .klaviyo-form-XSXkde [data-testid=form-row]{flex-direction:column!important;gap:var(--newsletter-banner-gap)}.newsletter-banner .klaviyo-form-XSXkde [data-testid=form-component]{flex:none!important;width:100%!important;padding:0!important}.newsletter-banner .klaviyo-form-XSXkde input[type=text],.newsletter-banner .klaviyo-form-XSXkde input[type=email]{box-sizing:border-box!important;width:100%!important;height:var(--newsletter-banner-input-height)!important;margin:0!important;padding:16px!important;border:0!important;border-radius:100px!important;background:#fff!important;box-shadow:none!important;color:#1a1a1a!important;font-family:Arial,Helvetica,sans-serif!important;font-size:14px!important;line-height:17px!important}.newsletter-banner .klaviyo-form-XSXkde input::placeholder{color:#767676!important;opacity:1}.newsletter-banner .klaviyo-form-XSXkde input:focus-visible{outline:2px solid var(--newsletter-banner-orange)!important;outline-offset:0!important;box-shadow:none!important}.newsletter-banner .klaviyo-form-XSXkde input[aria-invalid=true]{box-shadow:inset 0 0 0 1.5px var(--newsletter-banner-error)!important}.newsletter-banner .klaviyo-form-XSXkde input[aria-invalid=true]:focus-visible{outline:2px solid var(--newsletter-banner-error)!important;outline-offset:0!important;box-shadow:none!important}.newsletter-banner .klaviyo-form-XSXkde [role=alert][id^=klaviyo_ariaid]{color:var(--newsletter-banner-error)!important;font-family:Mulish,sans-serif!important;font-size:13px!important;font-weight:500!important;line-height:18px!important;letter-spacing:0!important}.newsletter-banner .klaviyo-form-XSXkde button.klaviyo-form-button{box-sizing:border-box!important;width:100%!important;height:auto!important;min-height:var(--newsletter-banner-button-height)!important;margin:0!important;padding:16px 24px!important;border:0!important;border-radius:100px!important;background:var(--newsletter-banner-orange)!important;color:#fff!important;font-family:Mulish Newsletter Banner,Mulish,sans-serif!important;font-size:16px!important;font-weight:700!important;line-height:18px!important;letter-spacing:0!important;cursor:pointer;transition:background-color .2s ease}.newsletter-banner .klaviyo-form-XSXkde button.klaviyo-form-button:hover{background:var(--newsletter-banner-orange-hover)!important}.newsletter-banner .klaviyo-form-XSXkde button.klaviyo-form-button:focus-visible{outline:2px solid transparent!important;outline-offset:2px!important;box-shadow:0 0 0 2px var(--newsletter-banner-cream),0 0 0 3.5px var(--newsletter-banner-ink)!important}.newsletter-banner .klaviyo-form-XSXkde button.klaviyo-form-button:disabled,.newsletter-banner .klaviyo-form-XSXkde button.klaviyo-form-button.klaviyo-spinner{background:var(--newsletter-banner-orange)!important;cursor:progress}.newsletter-banner .klaviyo-form-XSXkde button.klaviyo-form-button.klaviyo-spinner{position:relative!important;color:transparent!important}.newsletter-banner .klaviyo-form-XSXkde button.klaviyo-form-button.klaviyo-spinner:after{width:20px!important;height:20px!important;margin:-10px 0 0 -10px!important;border:2.5px solid rgba(255,255,255,.35)!important;border-top-color:#fff!important;filter:none!important}
/*# sourceMappingURL=/cdn/shop/t/36/assets/section-klaviyo-newsletter-banner.css.map */
