/* A real screen carousel, presented as a layered desktop workspace. */
.hero-product{position:relative;isolation:isolate;transform:none;filter:none;padding:34px 0 0;min-width:0}
.hero-slideshow{position:relative;isolation:isolate;perspective:1400px;padding:0 0 16px}
.hero-slideshow:before{content:"";position:absolute;z-index:-2;inset:4% -9% 8%;background:radial-gradient(ellipse at 65% 50%,#9edb3652,transparent 64%);filter:blur(32px);pointer-events:none}
.hero-screen{position:relative;z-index:2;overflow:hidden;border:1px solid #6a989b!important;border-radius:14px!important;padding:37px 0 0!important;background:#e7f2ef!important;box-shadow:0 36px 65px -30px #002f43a1,0 2px 4px #002f431a;transform:rotate(-1.3deg);transition:transform .7s cubic-bezier(.2,.7,.2,1),box-shadow .7s}
.hero-screen:hover{transform:rotate(0deg) translateY(-5px);box-shadow:0 42px 70px -28px #002f43ad}
.hero-screen:before{content:"";position:absolute;top:15px;left:16px;width:7px;height:7px;border-radius:50%;background:#6e9a98;box-shadow:12px 0 #9db8b0,24px 0 #bbccc4;z-index:5}
.hero-screen:after{content:"Открыть экран ↗";position:absolute;bottom:14px;right:14px;background:#043d4eea;color:white;padding:7px 12px;border:1px solid #ffffff40;border-radius:30px;font-size:10px;letter-spacing:.02em;opacity:0;transform:translateY(5px);transition:opacity .2s,transform .2s;z-index:5;pointer-events:none}
.hero-screen:hover:after,.hero-screen:focus-visible:after{opacity:1;transform:none}
.hero-screen>img{border:0!important;border-top:1px solid #aac4c0!important;border-radius:0!important;width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.hero-screen>img.hero-slide-outgoing{position:absolute;inset:37px 0 0;width:100%;height:calc(100% - 37px);pointer-events:none;animation:hero-screen-exit .65s cubic-bezier(.2,.7,.2,1) both;z-index:3}
.screen-tab{position:absolute;z-index:4;top:9px;right:16px;font-size:10px;font-weight:800;color:#335d63;letter-spacing:.04em;max-width:calc(100% - 80px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.screen-ghost{position:absolute;z-index:-1;inset:14px -13px 70px 13px;border:1px solid #6d9e9b73;border-radius:14px;background:linear-gradient(145deg,#c8e4d2ef,#bddcdbbd);box-shadow:0 15px 38px -20px #003c4c4d;pointer-events:none;transition:transform .8s}
.ghost-one{transform:rotate(3deg) translate(5px,-24px)}
.ghost-two{z-index:-2;transform:rotate(7deg) translate(14px,-40px);background:linear-gradient(140deg,#4c8e896b,#a0ce9b8a);border-color:#548b8752}
.hero-slideshow:hover .ghost-one{transform:rotate(4deg) translate(7px,-28px)}
.hero-slideshow:hover .ghost-two{transform:rotate(8deg) translate(18px,-46px)}
.hero-slide-controls{position:relative;z-index:3;display:flex;align-items:center;gap:8px;width:max-content;max-width:100%;margin:22px auto 0;padding:7px 9px;border:1px solid #91b0aa70;border-radius:40px;background:#f5faf4d9;box-shadow:0 7px 18px #063e4110;backdrop-filter:blur(12px)}
.hero-slide-controls>button{display:grid;place-items:center;width:31px;height:31px;padding:0;background:transparent;border:0;border-radius:50%;color:#1c525a;font-size:17px;line-height:1;transition:background .2s,transform .2s}
.hero-slide-controls>button:hover{background:#d8e8d6;transform:scale(1.07)}
.hero-slide-controls #hero-slide-pause{border-left:1px solid #a8c3b3;border-radius:0;width:36px;font-size:13px;margin-left:3px;padding-left:5px}
#hero-slide-dots{display:flex;gap:8px;align-items:center;padding:0 5px}
.hero-slide-dot{position:relative;width:9px;height:9px;min-width:9px;padding:0;border:0;border-radius:10px;background:#a6bdb2;transition:width .35s,background .35s;overflow:hidden}
.hero-slide-dot[aria-pressed=true]{width:33px;background:#1d5d5c}
.hero-slide-dot[aria-pressed=true]:after{content:"";position:absolute;inset:0;background:#badf54;transform-origin:left;animation:hero-slide-progress 2.8s linear both}
.hero-slideshow.is-paused .hero-slide-dot[aria-pressed=true]:after{animation-play-state:paused}
.hero-product .product-caption{text-align:center;font-size:11px;margin:8px auto 0;color:#487278;max-width:100%;min-height:2em}
.hero-product .product-caption b{font-weight:800;color:#194b52}
@keyframes hero-screen-exit{to{opacity:0;transform:translateX(-28px) scale(.98)}}
@keyframes hero-slide-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(min-width:1101px){.hero-product{margin-left:-14px;margin-right:-32px}}
@media(max-width:800px){.hero-product{padding-top:30px;margin:0 5px}.hero-screen{transform:rotate(-.7deg)}.screen-ghost{inset:14px -8px 70px 8px}.ghost-two{transform:rotate(5deg) translate(3px,-30px)}.hero-slide-controls{margin-top:18px}.hero-product .product-caption{font-size:10px}}
@media(prefers-reduced-motion:reduce){.hero-screen,.screen-ghost,.hero-slide-dot{transition:none}.hero-slide-dot[aria-pressed=true]:after{animation:none;transform:none}.hero-screen>img.hero-slide-outgoing{display:none}.hero-screen:hover{transform:none}}
