.cn-hero-carousel{display:block;position:relative;min-width:0}.cn-hero-carousel .cn-hero-track{display:grid;overflow:hidden;border-radius:24px;isolation:isolate;touch-action:pan-y pinch-zoom}.cn-hero-carousel .cn-hero-slide{grid-area:1/1;min-width:0;width:100%}.cn-hero-carousel.is-ready .cn-hero-slide[hidden]{display:block!important;visibility:hidden;pointer-events:none}.cn-hero-carousel .cn-hero-slide.is-active{z-index:2;visibility:visible}.cn-hero-carousel .cn-hero-slide.is-exiting{z-index:1;visibility:visible;pointer-events:none}.cn-hero-carousel .cn-hero.hero{height:100%;border-radius:24px;min-height:505px}.cn-hero-carousel .cn-hero.hero :is(h1,h2){font-family:inherit;font-size:clamp(40px,4.7vw,68px);font-weight:800;line-height:1.08;letter-spacing:-.045em;color:var(--cn-hero-ink);margin:24px 0 21px;overflow-wrap:anywhere}.cn-hero-carousel .cn-hero.hero.cn-hero--editorial :is(h1,h2){font-size:clamp(39px,4.3vw,62px)}.cn-hero-carousel .cn-hero.hero :is(h1,h2)>span,.cn-hero-carousel .cn-hero.hero :is(h1,h2)>em{display:block}.cn-hero-carousel .cn-hero.hero :is(h1,h2)>em{font-style:normal;color:var(--cn-hero-accent)}.cn-hero-carousel .cn-hero.hero.cn-hero--studio.cn-hero-campaign--hp{--cn-hero-line:#dce6eb;--cn-hero-accent:#0079ad;background:#f0f7fa}.cn-hero-carousel .cn-hero.hero.cn-hero--studio.cn-hero-campaign--hp .hero-media{background:linear-gradient(140deg,#f9fdff,#e7f0f4)}.cn-hero-carousel .cn-hero.hero.cn-hero--studio.cn-hero-campaign--lenovo{--cn-hero-line:#e9dfde;--cn-hero-accent:#bc3128;background:#faf3f1}.cn-hero-carousel .cn-hero.hero.cn-hero--studio.cn-hero-campaign--lenovo .hero-media{background:linear-gradient(140deg,#fffaf8,#f0e7e3)}.cn-hero-carousel .cn-hero.hero.cn-hero--studio.cn-hero-campaign--offers{--cn-hero-line:#eddfcd;--cn-hero-accent:#c85013;background:#fff4e8}.cn-hero-carousel .cn-hero.hero.cn-hero--studio.cn-hero-campaign--offers .hero-media{background:linear-gradient(140deg,#fffaf2,#f3e8d6)}.cn-hero-carousel .cn-hero-controls{position:relative;display:flex;align-items:center;gap:14px;padding:16px 6px 0;min-height:60px;color:#686155}.cn-hero-carousel .cn-hero-controls[hidden]{display:none}.cn-hero-carousel .cn-hero-announcement{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cn-hero-carousel .cn-hero-progress{width:clamp(75px,12vw,155px);height:3px;background:#e9e4dc;border-radius:5px;overflow:hidden;flex-shrink:0;order:0}.cn-hero-carousel .cn-hero-progress>span{display:block;width:100%;height:100%;background:#fc5000;transform-origin:left center;will-change:transform}.cn-hero-carousel .cn-hero-count{font-size:10px;line-height:1.5;letter-spacing:1px;font-weight:700;color:#8f867a;white-space:nowrap;order:1}.cn-hero-carousel .cn-hero-count>span{color:#3f392f}.cn-hero-carousel .cn-hero-dots{position:absolute;left:50%;transform:translate(-50%);display:flex;align-self:center;align-items:center;justify-content:center;gap:1px;margin:0;order:2}.cn-hero-carousel .cn-hero-dots button{display:grid;place-items:center;width:35px;min-height:44px;border:0;padding:0;background:transparent;border-radius:6px;cursor:pointer}.cn-hero-carousel .cn-hero-dots button>span{display:block;width:7px;height:7px;border-radius:8px;background:#d4cec3;transition:width .2s,background .2s}.cn-hero-carousel .cn-hero-dots button[aria-current=true]>span{width:24px;background:#fd4f00}.cn-hero-carousel .cn-hero-toggle,.cn-hero-carousel .cn-hero-arrows button{width:44px;min-width:44px;height:44px;display:grid;place-items:center;padding:0;background:#fff;border:1px solid #e7e0d6;border-radius:50%;color:#534a3e;cursor:pointer}.cn-hero-carousel .cn-hero-toggle{order:3;margin-left:auto}.cn-hero-carousel .cn-hero-arrows{display:flex;gap:8px;order:4}.cn-hero-carousel .cn-hero-toggle svg,.cn-hero-carousel .cn-hero-arrows svg{width:18px;height:18px}.cn-hero-carousel .cn-hero-toggle [hidden]{display:none}.cn-hero-carousel .cn-hero-controls button:hover{border-color:#e0af8f;background:#fff6ee;color:#b34d1e}.cn-hero-carousel .cn-hero-controls button:focus-visible{outline:2px solid #c44e1a;outline-offset:3px}.cn-hero-carousel.is-animated[data-direction=next] .cn-hero-slide.is-active{animation:cn-hero-enter-left .65s cubic-bezier(.25,.8,.25,1) both}.cn-hero-carousel.is-animated[data-direction=next] .cn-hero-slide.is-exiting{animation:cn-hero-exit-left .65s cubic-bezier(.25,.8,.25,1) both}.cn-hero-carousel.is-animated[data-direction=previous] .cn-hero-slide.is-active{animation:cn-hero-enter-right .65s cubic-bezier(.25,.8,.25,1) both}.cn-hero-carousel.is-animated[data-direction=previous] .cn-hero-slide.is-exiting{animation:cn-hero-exit-right .65s cubic-bezier(.25,.8,.25,1) both}@keyframes cn-hero-enter-right{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes cn-hero-exit-right{0%{transform:translate(0)}to{transform:translate(100%)}}@keyframes cn-hero-enter-left{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes cn-hero-exit-left{0%{transform:translate(0)}to{transform:translate(-100%)}}@media(max-width:749px){.cn-hero-carousel .cn-hero-track,.cn-hero-carousel .cn-hero.hero{border-radius:18px}.cn-hero-carousel .cn-hero.hero{min-height:0}.cn-hero-carousel .cn-hero.hero :is(h1,h2),.cn-hero-carousel .cn-hero.hero.cn-hero--editorial :is(h1,h2){font-size:clamp(38px,9.3vw,58px);margin:22px 0 17px}.cn-hero-carousel .cn-hero-controls{display:grid;grid-template-columns:minmax(0,1fr) auto 44px auto;gap:6px;padding:12px 0 0}.cn-hero-carousel .cn-hero-progress{grid-area:2/1;width:100%;min-width:0}.cn-hero-carousel .cn-hero-count{grid-area:2/2;width:auto;text-align:right}.cn-hero-carousel .cn-hero-dots{position:static;transform:none;grid-area:1/1/2/-1;justify-self:center;margin:0}.cn-hero-carousel .cn-hero-toggle{grid-area:2/3;margin:0}.cn-hero-carousel .cn-hero-arrows{grid-area:2/4;gap:6px}.cn-hero-carousel .cn-hero-dots button{width:31px}.cn-hero-carousel .cn-hero.hero .hero-product-stage{height:clamp(200px,55vw,300px)}}@media(prefers-reduced-motion:reduce){.cn-hero-carousel .cn-hero-slide{animation:none!important}.cn-hero-carousel .cn-hero-slide.is-exiting{visibility:hidden}.cn-hero-carousel .cn-hero-dots button>span{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/27/assets/cn-hero-carousel.css.map */
