.b7-explode{position:relative;height:var(--b7-explode-length, 550vh);background:#0c0b08;color:#fff;font-family:var(--font-body-family);scroll-margin-top:-56px}@media(max-width:520px){.b7-explode{scroll-margin-top:-52px}}.b7-explode__stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:grid;grid-template-columns:minmax(280px,34%) 1fr;align-items:center;padding:0 clamp(20px,5vw,80px);gap:clamp(16px,3vw,48px);background:radial-gradient(60% 70% at 66% 50%,#1b1915,#0c0b08 70%)}.b7-explode__canvas{display:block;width:100%;height:78%}.b7-explode__copy{display:grid}.b7-explode__step{grid-area:1 / 1;max-width:420px;opacity:0;transform:translateY(18px);transition:opacity .5s ease,transform .7s cubic-bezier(.16,1,.3,1);pointer-events:none}.b7-explode__step.is-active{opacity:1;transform:none;pointer-events:auto}.b7-explode .b7-explode__eyebrow{margin:0 0 14px;font-size:12px;font-weight:500;line-height:1;letter-spacing:.08em;text-transform:uppercase;color:#dd000d}.b7-explode .b7-explode__title{margin:0 0 16px;color:#fff;font-family:var(--font-h2-family);font-size:clamp(28px,3.2vw,46px);line-height:1.1;letter-spacing:normal;text-transform:uppercase}.b7-explode .b7-explode__body{margin:0;font-size:16px;line-height:1.55;color:#b9b7b0}.b7-explode__body p{margin:0 0 .8em}.b7-explode__body p:last-child{margin-bottom:0}.b7-explode .b7-explode__progress{display:block;position:absolute;left:clamp(20px,5vw,80px);right:clamp(20px,5vw,80px);bottom:28px;height:2px;background:#ffffff1f}.b7-explode__progress span{display:block;height:100%;background:#dd000d;transform-origin:left;transform:scaleX(0)}@media(max-width:760px),(max-width:1100px)and (orientation:portrait){.b7-explode__stage{grid-template-columns:1fr;grid-template-rows:1fr auto;align-items:start;padding:72px 20px 64px;background:radial-gradient(90% 50% at 50% 35%,#1b1915,#0c0b08 70%)}.b7-explode__canvas{grid-row:1;height:100%;min-height:0}.b7-explode__copy{grid-row:2}.b7-explode__step{max-width:none}.b7-explode .b7-explode__title{font-size:26px}.b7-explode .b7-explode__body{font-size:15px}}@media(min-width:761px)and (max-width:1100px)and (orientation:portrait){.b7-explode__stage{padding:88px 48px 72px}.b7-explode__step{max-width:640px}.b7-explode .b7-explode__title{font-size:36px}.b7-explode .b7-explode__body{font-size:16px}}@media(prefers-reduced-motion:reduce){.b7-explode__step{transition:opacity .2s;transform:none}}
/*# sourceMappingURL=/cdn/shop/t/77/assets/custom-blade7-explode.css.map */