.materials-story{padding-block:clamp(48px,8vw,120px)}.materials-story__inner{max-width:var(--page-width, 1200px);margin-inline:auto;padding-inline:24px}.materials-story__intro{max-width:640px;margin-bottom:clamp(32px,6vw,64px)}.materials-story__eyebrow{text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;opacity:.65;margin:0 0 .5em}.materials-story__heading :is(h1,h2,h3){margin:0 0 .3em;font-size:clamp(1.75rem,3vw,2.75rem)}.materials-story__subheading{opacity:.75}.materials-story__grid{display:grid;grid-template-columns:minmax(240px,380px) 1fr;gap:clamp(24px,5vw,72px);align-items:start}.materials-story__sticky{position:sticky;top:100px;align-self:start}.materials-story__panel{position:relative;min-height:clamp(360px,42vw,480px)}.materials-story__panel-item{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .5s ease;pointer-events:none}.materials-story__panel-item.is-active{opacity:1;transform:none;pointer-events:auto}.materials-story__panel-media{border-radius:16px;overflow:hidden;margin-bottom:20px;background:color-mix(in srgb,var(--accent) 15%,transparent);box-shadow:0 20px 45px -25px #0009}.materials-story__panel-media img{display:block;width:100%;height:auto;aspect-ratio:1 / 1;object-fit:cover;transform:scale(1.06);transition:transform 1.2s ease}.materials-story__panel-item.is-active .materials-story__panel-media img{transform:scale(1)}.materials-story__panel-media--placeholder{aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;font-size:3rem;font-weight:700;color:var(--accent)}.materials-story__panel-tag{text-transform:uppercase;letter-spacing:.06em;font-size:.75rem;color:var(--accent);font-weight:600;margin:0 0 .25em}.materials-story__panel-name{margin:0;font-size:clamp(1.5rem,2.5vw,2rem)}.materials-story__progress{display:flex;gap:10px;margin:24px 0 0;padding:0;list-style:none}.materials-story__progress-dot{width:10px;height:10px;border-radius:50%;border:none;background:color-mix(in srgb,var(--accent) 30%,transparent);cursor:pointer;padding:0;transition:background .3s ease,transform .3s ease}.materials-story__progress-dot.is-active{background:var(--accent);transform:scale(1.3)}.materials-story__steps{display:flex;flex-direction:column}.materials-story__step{padding-block:14vh;border-top:1px solid color-mix(in srgb,currentColor 10%,transparent);display:flex;flex-direction:column;gap:10px;opacity:.35;transition:opacity .4s ease}.materials-story__step:first-child{border-top:none;padding-top:0}.materials-story__step.is-active{opacity:1}.materials-story__step-visual{display:none}.materials-story__step-tag{text-transform:uppercase;letter-spacing:.06em;font-size:.75rem;color:var(--accent);font-weight:600;margin:0}.materials-story__step-name{margin:0;font-size:clamp(1.4rem,2.2vw,1.85rem)}.materials-story__step-description{max-width:46ch;opacity:.85}@media(max-width:989px),(prefers-reduced-motion:reduce){.materials-story__grid{grid-template-columns:1fr}.materials-story__sticky{display:none}.materials-story__step{padding-block:28px;opacity:1;flex-direction:row;align-items:flex-start;flex-wrap:wrap}.materials-story__step-visual{display:flex;align-items:center;justify-content:center;width:56px;height:56px;flex:0 0 auto;border-radius:12px;background:color-mix(in srgb,var(--accent) 15%,transparent);color:var(--accent);font-weight:700;overflow:hidden;margin-right:16px}.materials-story__step-visual img{width:100%;height:100%;object-fit:cover}.materials-story__step-tag,.materials-story__step-name,.materials-story__step-description{flex:1 1 calc(100% - 72px)}}@media(prefers-reduced-motion:reduce){.materials-story__sticky{position:static}.materials-story__panel-item,.materials-story__step{transition:none}}@media(prefers-reduced-motion:reduce){.materials-story__panel-media img{transition:none;transform:none}html:has(.materials-story){scroll-behavior:auto}}#ContactForm-name{scroll-margin-top:140px}.engineering-quote-link{display:inline-flex}.section a[href="#ContactForm-name"]{display:inline-flex;align-items:center;min-height:48px;padding:12px 24px;background:#ff2a00;color:#fff;font-weight:700;text-decoration:none;border-radius:4px}.section a[href="#ContactForm-name"]:focus-visible{outline:2px solid currentColor;outline-offset:4px}
/*# sourceMappingURL=/cdn/shop/t/11/assets/section-materials-scroll-story.css.map */