/* ==========================================================
   CSS Cable — premium motion layer
   Включается классом .cssc-motion на <html> (ставится скриптом в <head>).
   Без JS / при prefers-reduced-motion контент виден сразу.
   ========================================================== */
:root{
	--ease-out:cubic-bezier(.16,1,.3,1);      /* expo-out — основное */
	--ease-soft:cubic-bezier(.22,.61,.36,1);
	--ease-io:cubic-bezier(.65,0,.35,1);
	--d-1:.7s; --d-2:1.1s; --d-3:1.6s;
}
html.lenis,html.lenis body{height:auto}
html.cssc-motion body{overflow-x:clip}
.site-header,.topbar{overflow-x:clip}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}

/* ---------- базовые reveal ---------- */
.cssc-motion [data-a]{transition:opacity var(--d-2) var(--ease-out),transform var(--d-2) var(--ease-out),clip-path var(--d-3) var(--ease-out),filter var(--d-2) var(--ease-out);transition-delay:var(--dl,0s);will-change:opacity,transform}
.cssc-motion [data-a="up"]:not(.in){opacity:0;transform:translate3d(0,42px,0)}
.cssc-motion [data-a="fade"]:not(.in){opacity:0}
.cssc-motion [data-a="left"]:not(.in){opacity:0;transform:translate3d(-60px,0,0)}
.cssc-motion [data-a="right"]:not(.in){opacity:0;transform:translate3d(80px,0,0)}
.cssc-motion [data-a="scale"]:not(.in){opacity:0;transform:scale(.94) translate3d(0,30px,0)}
.cssc-motion [data-a="blur"]:not(.in){opacity:0;filter:blur(12px);transform:translate3d(0,20px,0)}
.cssc-motion [data-a="card"]{transition-duration:1.4s}
.cssc-motion [data-a="card"]:not(.in){opacity:0;transform:translate3d(0,70px,0) scale(.97);clip-path:inset(12% 4% 0 4% round 40px)}
.cssc-motion [data-a="card"].in{clip-path:inset(0 0 0 0 round 40px)}
.cssc-motion [data-a].done{will-change:auto}

/* ---------- текст по словам ---------- */
.w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.w>i{display:inline-block;font-style:normal;transition:transform 1.25s var(--ease-out),opacity 1.25s var(--ease-out);transition-delay:calc(var(--dl,0s) + var(--wi,0) * 55ms)}
.cssc-motion [data-a="words"]:not(.in) .w>i{transform:translate3d(0,105%,0) rotate(4deg);opacity:0}

/* ---------- шапка / интро ---------- */
.site-header__video{scale:1.12;translate:0 var(--py,0px);transform-origin:50% 40%;transition:opacity 1.8s var(--ease-soft),scale 3s var(--ease-out);will-change:translate}
.cssc-motion .site-header__video:not(.is-ready){opacity:0}
.cssc-motion body:not(.is-loaded) .site-header__video{scale:1.3}
.site-header__shade{transition:opacity 2s var(--ease-soft)}
.cssc-motion body:not(.is-loaded) .site-header__shade{opacity:.4}
.cssc-motion body:not(.is-loaded) .topbar__logo,
.cssc-motion body:not(.is-loaded) .topbar__tagline,
.cssc-motion body:not(.is-loaded) .topbar__item{opacity:0;transform:translate3d(0,-18px,0)}
.topbar__logo,.topbar__tagline,.topbar__item{transition:opacity 1s var(--ease-out),transform 1s var(--ease-out),color .3s}
.topbar__tagline{transition-delay:.12s}
.topbar__item:nth-child(1){transition-delay:.22s}.topbar__item:nth-child(2){transition-delay:.3s}.topbar__item:nth-child(3){transition-delay:.38s}
.topbar__burger{transition:background-color .4s var(--ease-soft)}
.topbar__burger:hover{filter:none;background-color:#a93b45}
.cssc-motion body:not(.is-loaded) .topbar{border-bottom-color:transparent}
.topbar{transition:border-color 1.4s var(--ease-soft) .5s}
.cssc-motion body:not(.is-loaded) .main-nav{transform:translate3d(-104%,0,0)}
.main-nav{transition:transform 1.4s var(--ease-out) .35s,box-shadow .4s}
.cssc-motion body:not(.is-loaded) .main-nav__menu li,.cssc-motion body:not(.is-loaded) .main-nav__tools{opacity:0;transform:translate3d(-14px,0,0)}
.main-nav__menu li,.main-nav__tools{transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
.main-nav__menu li:nth-child(1){transition-delay:.75s}.main-nav__menu li:nth-child(2){transition-delay:.82s}.main-nav__menu li:nth-child(3){transition-delay:.89s}.main-nav__menu li:nth-child(4){transition-delay:.96s}.main-nav__menu li:nth-child(5){transition-delay:1.03s}.main-nav__tools{transition-delay:1.1s}
.cssc-motion body:not(.is-loaded) .video-play{opacity:0;transform:scale(.6)}
.video-play{transition:opacity 1.2s var(--ease-out) .6s,transform 1.4s var(--ease-out) .6s}

/* подчёркивание пунктов меню */
.main-nav__menu .menu>li>a{position:relative;padding:6px 0}
.main-nav__menu .menu>li>a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .6s var(--ease-out)}
.main-nav__menu .menu>li>a:hover::after,.main-nav__menu .menu>li.current-menu-item>a::after{transform:scaleX(1);transform-origin:left}
.main-nav__menu .menu a:hover{color:#fff}

/* кнопка play: пульс кольца */
.video-play__ring{animation:csscRing 3.2s var(--ease-io) infinite}
@keyframes csscRing{0%,100%{border-color:rgba(192,72,82,.45)}50%{border-color:rgba(192,72,82,.95)}}
.video-play .ico{transition:transform .7s var(--ease-out),color .4s}

 

/* ---------- кнопки ---------- */
.btn{position:relative;overflow:hidden;isolation:isolate;transition:background-color .5s var(--ease-out),transform .6s var(--ease-out),box-shadow .6s var(--ease-out)}
.btn::before{content:none}
.btn--accent:hover{transform:none;box-shadow:none}
.btn-ico {
	position: relative;
	overflow: hidden;
}

.btn-ico > .ico {
	position: relative;
	z-index: 2;
	transition: transform 0.55s var(--ease-out);
}

.btn:hover .btn-ico > .ico {
	animation: csscArrow 0.6s var(--ease-out);
}

@keyframes csscArrow{0%{transform:none}45%{transform:translate(120%,-120%)}46%{transform:translate(-120%,120%)}100%{transform:none}}
.sq-btn{transition:background-color .45s var(--ease-out),color .45s var(--ease-out),transform .45s var(--ease-out)}
.sq-btn:hover{transform:scale(1.06)}
.sq-btn:active{transform:scale(.94)}

/* ---------- hero ---------- */
.cssc-hero__main{position:relative}
.cssc-motion .cssc-hero__main::after{content:"";position:absolute;right:-1px;top:0;width:1px;height:100%;background:var(--c-line);transform-origin:top;transform:scaleY(var(--line,1));transition:transform 1.6s var(--ease-out) .3s}
.cssc-motion .cssc-hero__main{border-right-color:transparent}
.cssc-motion .cssc-hero:not(.in) .cssc-hero__main::after{--line:0}
.cssc-hero__badge{animation:csscFloat 7s var(--ease-io) infinite}
@keyframes csscFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-7px,0)}}

/* ---------- продукция ---------- */
.cssc-products__card{background-size:160% 100%;background-position:0% 50%;animation:csscGrad 14s var(--ease-io) infinite alternate}
@keyframes csscGrad{to{background-position:100% 50%}}
.cssc-products__card::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(520px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.10),transparent 60%);opacity:0;transition:opacity .8s var(--ease-soft)}
.cssc-products__card:hover::before{opacity:1}
.cssc-product{perspective:900px}
.cssc-product__img{transition:transform 1.1s var(--ease-out)!important;transform-style:preserve-3d}
.cssc-product__img img{transition:filter .9s var(--ease-out),transform 1.1s var(--ease-out)}
.cssc-product:hover .cssc-product__img{transform:translate3d(0,-14px,0)!important}
.cssc-product:hover .cssc-product__img img{filter:drop-shadow(0 30px 26px rgba(0,0,0,.5)) brightness(1.06);transform:rotate(-3deg) scale(1.04)}
.cssc-product__title{position:relative;transition:letter-spacing .8s var(--ease-out)}
.cssc-product__title::after{content:"";position:absolute;left:15%;right:15%;bottom:-8px;height:2px;background:#fff;transform:scaleX(0);transition:transform .7s var(--ease-out)}
.cssc-product:hover .cssc-product__title::after{transform:scaleX(1)}

/* ---------- поставки ---------- */
.cssc-slider__track{transition:transform 1.15s var(--ease-out)!important;cursor:grab;touch-action:pan-y}
.cssc-slider__track.is-drag{transition:none!important;cursor:grabbing}
.cssc-slide{overflow:hidden}
.cssc-slide__img{scale:1.16;translate:var(--px,0px) 0;transition:scale 1.6s var(--ease-out);will-change:translate}
.cssc-slide:hover .cssc-slide__img{scale:1.22}
.cssc-slide__cap{transition:transform .8s var(--ease-out)}
.cssc-slide:hover .cssc-slide__cap{transform:translate3d(0,-6px,0)}
.cssc-slide__link{transition:background-color .4s,transform .6s var(--ease-out)}
.cssc-slide:hover .cssc-slide__link{transform:rotate(45deg)}
.cssc-motion .cssc-slider__viewport[data-a]{transition-duration:1.6s}
.cssc-counter__num sup{animation:csscPlus 2.6s var(--ease-io) infinite}
@keyframes csscPlus{0%,100%{transform:none}50%{transform:translate3d(2px,-4px,0)}}
.cssc-slider__progress{position:absolute;left:max(24px,calc((100vw - var(--container))/2 + 24px));bottom:-26px;width:90px;height:2px;background:rgba(255,255,255,.15);overflow:hidden}
.cssc-slider__progress i{position:absolute;inset:0;background:var(--c-accent);transform-origin:left;transform:scaleX(var(--p,0));transition:transform 1.15s var(--ease-out)}

/* ---------- новости ---------- */
.news-card__media{overflow:hidden}
.news-card__media img{transition:transform 1.6s var(--ease-out)!important}
.news-card:hover .news-card__media img{transform:scale(1.07)!important}
.cssc-motion .news-card[data-a] .news-card__media::after{content:"";position:absolute;inset:0;background:var(--c-accent);transform-origin:top;transform:scaleY(0);transition:transform 1.2s var(--ease-io);transition-delay:var(--dl,0s);z-index:2}
.cssc-motion .news-card[data-a]:not(.in) .news-card__media::after{transform:scaleY(1);transform-origin:bottom}
.cssc-motion .news-card[data-a]:not(.in) .news-card__media img{transform:scale(1.25)!important}
.cssc-motion .news-card[data-a]{transform:none!important;opacity:1!important}
.cssc-motion .news-card[data-a] .news-card__media img{transition:transform 1.8s var(--ease-out)!important;transition-delay:var(--dl,0s)!important}
.cssc-motion .news-card[data-a] .date-badge{transition:transform 1s var(--ease-out),opacity 1s;transition-delay:calc(var(--dl,0s) + .7s)}
.cssc-motion .news-card[data-a]:not(.in) .date-badge{transform:translate3d(-100%,0,0);opacity:0}
.cssc-motion .news-card[data-a] .news-card__title,.cssc-motion .news-card[data-a] .news-card__excerpt{transition:opacity 1s var(--ease-out),transform 1s var(--ease-out);transition-delay:calc(var(--dl,0s) + .5s)}
.cssc-motion .news-card[data-a]:not(.in) .news-card__title,.cssc-motion .news-card[data-a]:not(.in) .news-card__excerpt{opacity:0;transform:translate3d(0,20px,0)}
.news-card__title a{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .7s var(--ease-out),color .4s}
.news-card:hover .news-card__title a{background-size:100% 1px}

/* ---------- WooCommerce карточки ---------- */
.cssc-pcard{transition:box-shadow .8s var(--ease-out),transform .8s var(--ease-out)!important}
.cssc-pcard__media img{transition:transform 1.2s var(--ease-out),filter 1s}
.cssc-pcard:hover .cssc-pcard__media img{transform:translate3d(0,-8px,0) rotate(-3deg) scale(1.04)}

/* ---------- модалки / drawer ---------- */
.modal{display:flex!important;opacity:0;visibility:hidden;transition:opacity .6s var(--ease-soft),visibility 0s .6s}
.modal.is-open{opacity:1;visibility:visible;transition:opacity .6s var(--ease-soft)}
.modal__box{transform:translate3d(0,40px,0) scale(.97);transition:transform .9s var(--ease-out)}
.modal.is-open .modal__box{transform:none}
.drawer{transition:opacity .7s var(--ease-soft),visibility 0s .7s}
.drawer.is-open{transition:opacity .7s var(--ease-soft)}
.drawer__box{transition:transform 1s var(--ease-out)!important}
.drawer__box>*{transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
.drawer:not(.is-open) .drawer__box>*{opacity:0;transform:translate3d(40px,0,0)}
.drawer.is-open .drawer__box>:nth-child(2){transition-delay:.15s}.drawer.is-open .drawer__box>:nth-child(3){transition-delay:.22s}.drawer.is-open .drawer__box>:nth-child(4){transition-delay:.29s}.drawer.is-open .drawer__box>:nth-child(5){transition-delay:.36s}
.drawer__menu a{display:inline-block;transition:transform .5s var(--ease-out),color .3s}
.drawer__menu a:hover{transform:translate3d(8px,0,0);color:#ff9aa3}
.video-modal{display:flex!important;opacity:0;visibility:hidden;transition:opacity .6s var(--ease-soft),visibility 0s .6s}
.video-modal.is-open{opacity:1;visibility:visible;transition:opacity .6s var(--ease-soft)}
.video-modal__frame{transform:scale(.92);transition:transform 1s var(--ease-out)}
.video-modal.is-open .video-modal__frame{transform:none}

/* ---------- курсор-кольцо (только мышь) ---------- */
.cssc-cursor{position:fixed;left:0;top:0;width:38px;height:38px;margin:-19px 0 0 -19px;border:1.5px solid rgba(192,72,82,.8);border-radius:50%;pointer-events:none;z-index:2000;opacity:0;transition:opacity .4s,width .5s var(--ease-out),height .5s var(--ease-out),margin .5s var(--ease-out),background-color .5s,border-color .5s;mix-blend-mode:normal}
.cssc-cursor.on{opacity:1}
.cssc-cursor.hover{width:64px;height:64px;margin:-32px 0 0 -32px;background:rgba(192,72,82,.12);border-color:rgba(192,72,82,.4)}
.cssc-cursor.drag{width:84px;height:84px;margin:-42px 0 0 -42px;background:rgba(192,72,82,.9);border-color:transparent}
.cssc-cursor.drag::after{content:"⟷";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:20px}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
	*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important}
	.cssc-cursor{display:none}
}
/* редактор Elementor: ничего не прячем */
.elementor-editor-active [data-a]{opacity:1!important;transform:none!important;clip-path:none!important;filter:none!important}
.elementor-editor-active .w>i{transform:none!important;opacity:1!important}