.before-after{position:relative;padding-top:var(--ba-pt, 80px);padding-bottom:var(--ba-pb, 80px);background:var(--ba-bg, #e6b4cc);color:var(--ba-accent, #ff3b14);overflow:hidden;isolation:isolate}.before-after--patterned:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-2;background-color:var(--ba-pattern-color, #d75a2c);-webkit-mask-image:var(--ba-pattern-url);mask-image:var(--ba-pattern-url);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:var(--ba-pattern-size, 1600px);mask-size:var(--ba-pattern-size, 1600px);opacity:var(--ba-pattern-opacity, 1);pointer-events:none}.before-after--textured:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;background-image:var(--ba-texture-url);background-size:cover;background-position:center;background-repeat:no-repeat;mix-blend-mode:var(--ba-texture-blend, multiply);opacity:var(--ba-texture-opacity, .4);pointer-events:none}.before-after__header{text-align:center;margin:0 auto 3rem;padding:0 1.5rem;max-width:800px}.before-after__eyebrow{display:inline-block;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;font-weight:700;color:var(--ba-accent, #ff3b14);margin:0 0 1rem;opacity:.9}.before-after__heading{font-family:var(--font-heading-family);font-weight:800;font-size:clamp(2.5rem,6.5vw,5rem);line-height:1;letter-spacing:.02em;text-transform:uppercase;margin:0 0 .75rem;color:var(--ba-heading-color, #ffffff)}.before-after__subheading{font-size:clamp(.95rem,1.3vw,1.1rem);line-height:1.55;margin:0;color:var(--ba-heading-color, #ffffff);opacity:.85}.before-after__subheading>*{margin:0}.before-after__subheading>*+*{margin-top:.6rem}.before-after__buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:2.5rem;padding:0 1.5rem}.before-after__button{display:inline-block;padding:.8rem 1.6rem;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;transition:opacity .2s ease,transform .2s ease;cursor:pointer;border-radius:0}.before-after__button--solid{background:var(--ba-accent, #ff3b14);color:#fff;border:1.5px solid var(--ba-accent, #ff3b14)}.before-after__button--outline{background:transparent;color:var(--ba-heading-color, #ffffff);border:1.5px solid var(--ba-heading-color, #ffffff)}.before-after__button:hover{opacity:.85;transform:translateY(-1px)}.before-after__layout{display:grid;gap:12px;max-width:1320px;margin:0 auto;padding:0 1.5rem}.before-after__layout{grid-template-columns:1fr 1fr;grid-auto-flow:dense}.before-after__hero{grid-column:1 / -1;display:flex;flex-direction:column}.before-after__product{grid-column:span 1}@media(min-width:990px){.before-after__layout{grid-template-columns:1fr 2.4fr 1fr;grid-template-rows:1fr 1fr;grid-template-areas:"l1 hero r1" "l2 hero r2";gap:14px}.before-after__hero{grid-area:hero;grid-column:auto}.before-after__product--1{grid-area:l1}.before-after__product--2{grid-area:l2}.before-after__product--3{grid-area:r1}.before-after__product--4{grid-area:r2}.before-after__product--5,.before-after__product--6,.before-after__product--7,.before-after__product--8{grid-column:1 / -1}.before-after__hero .ba-card__compare{flex:1}.before-after__hero .ba-card__compare--single .ba-card__half,.before-after__hero .ba-card__compare--single .ba-card__half img{height:100%}.before-after__hero .ba-card__compare--single .ba-card__half img{object-fit:cover;aspect-ratio:auto}}.before-after__product{position:relative;overflow:hidden;display:block;background:#0000000a;aspect-ratio:1 / 1;text-decoration:none}.before-after__product img{width:100%;height:100%;object-fit:cover;display:block}.before-after__product-caption{position:absolute;bottom:.6rem;left:.6rem;right:.6rem;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.4);text-align:center}.ba-card{position:relative;display:flex;flex-direction:column;gap:1.25rem;padding:1.25rem;max-width:540px;margin:0 auto;width:100%;border-radius:0;color:var(--ba-accent, #ff3b14);text-align:center;background:linear-gradient(135deg,color-mix(in srgb,var(--ba-card-bg, #ffffff) 82%,transparent),color-mix(in srgb,var(--ba-card-bg, #ffffff) 62%,transparent));-webkit-backdrop-filter:blur(32px) saturate(115%) brightness(1.05);backdrop-filter:blur(32px) saturate(115%) brightness(1.05);border:1px solid color-mix(in srgb,var(--ba-card-bg, #ffffff) 70%,transparent);box-shadow:0 10px 40px #0000001a,0 2px 6px #0000000f,inset 0 1px color-mix(in srgb,var(--ba-card-bg, #ffffff) 70%,transparent),inset 0 -1px #0000000d}@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){.ba-card{background:color-mix(in srgb,var(--ba-card-bg, #ffffff) 88%,transparent)}}.ba-card__compare{display:grid;grid-template-columns:1fr;gap:.75rem;border-radius:0;overflow:hidden}@media(min-width:600px){.ba-card__compare--split{grid-template-columns:1fr 1fr}}.ba-card__half{position:relative;overflow:hidden;border-radius:0;background:#0000000a}.ba-card__half img{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:1 / 1.05}.ba-card__compare--single{grid-template-columns:1fr}.ba-card__compare--single .ba-card__half{position:relative}.ba-card__compare--single .ba-card__half img{aspect-ratio:auto;height:auto}.ba-card__overlay-label{position:absolute;bottom:clamp(.75rem,3vw,1.75rem);z-index:3;font-family:var(--font-heading-family);font-weight:600;font-size:clamp(1.6rem,4vw,2.75rem);line-height:1;color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.45);pointer-events:none;-webkit-user-select:none;user-select:none;letter-spacing:.01em;transform:translate(-50%)}.ba-card__overlay-label--before{left:25%}.ba-card__overlay-label--after{left:75%}.ba-card__label{position:absolute;top:.85rem;left:.85rem;z-index:2;display:inline-block;padding:.3rem .7rem;background:#ffffffd9;color:var(--ba-accent, #ff3b14);font-size:.65rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700;border-radius:0;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.ba-card__caption{font-size:1.1rem;line-height:1.5;font-weight:500;margin:0;color:var(--ba-accent, #ff3b14)}.ba-card__caption>*{margin:0}.ba-card__caption>*+*{margin-top:.4rem}.ba-card__caption p:before{content:"\201c"}.ba-card__caption p:last-child:after{content:"\201d"}.ba-card__attribution{font-style:italic;font-size:.95rem;font-weight:400;color:var(--ba-attribution, #8a8580)}.ba-card__attribution:before{content:"\2014  "}.ba-card__product-link{display:inline-block;margin-top:.4rem;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--ba-accent, #ff3b14);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:1px;transition:opacity .2s ease}.ba-card__product-link:hover{opacity:.7}
/*# sourceMappingURL=/cdn/shop/t/21/assets/section-before-after.css.map */