.strips__row{display:flex;gap:clamp(8px,1vw,16px);height:clamp(460px,66vh,720px)}.strip{position:relative;flex:1 1 0;min-width:0;overflow:hidden;color:var(--c-cloud);clip-path:var(--slope);transition:flex-grow .9s cubic-bezier(.3,.8,.2,1)}.strip.is-active{flex-grow:3.4}.strip__media{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;border-radius:0 0 var(--r-lg) var(--r-lg);background:var(--c-fog);clip-path:inset(0 0 0 0);transition:clip-path 1.3s var(--ease-wipe) calc(.16s + var(--i) * .14s)}.motion .strips[data-reveal]:not(.is-on) .strip__media{clip-path:inset(100% 0 0 0)}.strip__media img,.strip__media svg{width:100%;height:100%;object-fit:cover;filter:brightness(.82);transition:filter .9s var(--ease-out),scale 1.8s var(--ease-slow)}.strip.is-active .strip__media img{filter:none}.strip__media:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom,transparent 45%,color-mix(in srgb,var(--c-night) 70%,transparent))}.strip__num{position:absolute;top:clamp(74px,18%,130px);left:14px;z-index:1;display:grid;place-items:center;min-width:38px;height:28px;padding:0 8px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--c-cloud) 22%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.strip__vtitle{position:absolute;bottom:22px;left:18px;z-index:1;font-family:var(--font-display);font-weight:var(--font-display-weight);font-size:clamp(22px,2vw,32px);line-height:1;white-space:nowrap;writing-mode:vertical-rl;rotate:180deg;transition:opacity .5s var(--ease-out)}.strip.is-active .strip__vtitle{opacity:0}.strip__content{position:absolute;right:24px;bottom:24px;left:24px;z-index:1;display:grid;gap:10px;max-width:480px;opacity:0;translate:0 18px;transition:opacity .5s var(--ease-out),translate .7s var(--ease-out)}.strip.is-active .strip__content,.no-js .strip__content{opacity:1;translate:0 0;transition-delay:.35s}.strip__title{font-family:var(--font-display);font-weight:var(--font-display-weight);font-size:calc(clamp(28px,3vw,50px) * var(--h-scale));line-height:1.02;letter-spacing:calc(-.03em * var(--track-k))}.strip__text{max-width:42ch;font-size:15px;line-height:1.55;opacity:.9}.strip__btn{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;cursor:pointer}.strip.is-active .strip__btn{cursor:default}.strip__btn:focus-visible{outline:2.5px solid var(--c-cloud);outline-offset:-6px}@media(max-width:809px){.strips__row{flex-direction:column;height:auto}.strip{flex:none;height:120px;clip-path:polygon(0 12px,100% 0,100% 100%,0 100%);transition:height .8s cubic-bezier(.3,.8,.2,1)}.strip:nth-child(2n){clip-path:polygon(0 0,100% 12px,100% 100%,0 100%)}.strip.is-active{height:340px}.strip__vtitle{bottom:20px;left:70px;writing-mode:horizontal-tb;rotate:none}.strip__num{top:auto;bottom:18px}.strip.is-active .strip__num{top:30px;bottom:auto}}.no-js .strips__row{flex-direction:column;height:auto}.no-js .strip{flex:none;height:340px}
/*# sourceMappingURL=/cdn/shop/t/5/assets/section-material-strips.css.map */