/* UdaLit — ПРЕМИУМ. Поверх styles.css + motion.css.
   Те же тексты, цвета и фирменные шрифты; дороже подача:
   прелоадер, плавный скролл, курсор, сцена-манифест, тёмные «занавесы», крупная типографика. */
:root{--navy-deep:#06172e;--hair:rgba(9,21,43,.08)}

/* зерно — «печатная» фактура, как у дорогих брендов */
body::after{content:"";position:fixed;inset:0;z-index:70;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---------- прелоадер ---------- */
.p-loader{position:fixed;inset:0;z-index:100;display:grid;place-items:center;pointer-events:none}
.p-loader-water,.p-loader-paper{position:absolute;inset:0;border-radius:0 0 50% 50% / 0 0 0 0;transition:transform 1.1s var(--e-io),border-radius 1.1s var(--e-io)}
.p-loader-water{background:linear-gradient(130deg,#04ccf6,#0473e1 70%,#0445ae)}
.p-loader-paper{background:radial-gradient(ellipse at 50% 40%,#fff 10%,#eef7fd 70%,#e6f1fa)}
.p-loader-in{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:26px;transition:opacity .5s,transform .8s var(--e-io)}
.p-loader-in img{width:min(240px,52vw);height:auto;animation:p-logo 1.4s var(--e-out) both}
.p-loader-line{width:min(260px,60vw);height:2px;border-radius:2px;background:#d9e7f2;overflow:hidden}
.p-loader-line i{display:block;height:100%;width:100%;transform-origin:0 50%;transform:scaleX(var(--lp,0));background:linear-gradient(90deg,#06c4f1,#0878d8);transition:transform .3s}
.p-loader-num{font-family:var(--heavy);font-weight:800;font-size:13px;letter-spacing:.2em;color:#326993;font-variant-numeric:tabular-nums}
.p-loader.is-out .p-loader-in{opacity:0;transform:translateY(-40px)}
.p-loader.is-out .p-loader-paper{transform:translateY(-100%);border-radius:0 0 50% 50% / 0 0 18% 18%}
.p-loader.is-out .p-loader-water{transform:translateY(-100%);border-radius:0 0 50% 50% / 0 0 18% 18%;transition-delay:.12s}
.p-loader.is-gone{display:none}
html.p-wait,html.p-wait body{overflow:hidden}
@keyframes p-logo{from{opacity:0;transform:translateY(16px) scale(.96);filter:blur(8px)}}

/* ---------- курсор ---------- */
.p-cursor-on,.p-cursor-on a,.p-cursor-on button{cursor:none}
.p-cursor-on :is(input,select,textarea,label){cursor:auto}
.p-dot,.p-ring{position:fixed;z-index:90;left:0;top:0;pointer-events:none;border-radius:50%;translate:-50% -50%}
.p-dot{width:7px;height:7px;background:#06c4f1}
.p-ring{width:40px;height:40px;border:1.5px solid rgba(8,120,216,.55);display:grid;place-items:center;font-family:var(--heavy);font-weight:800;font-size:0;color:#fff;transition:width .45s var(--e-out),height .45s var(--e-out),background .35s,border-color .35s,font-size .3s,opacity .3s}
.p-ring.is-link{width:58px;height:58px;background:rgba(6,196,241,.14);border-color:rgba(6,196,241,.7)}
.p-ring.is-card{width:88px;height:88px;background:linear-gradient(130deg,#04ccf6,#0473e1 90%);border-color:transparent;font-size:24px;box-shadow:0 12px 30px rgba(0,119,221,.35)}
.p-ring.is-field,.p-dot.is-field{opacity:0}
.p-ring.on-dark{border-color:rgba(127,227,255,.6)}

/* ---------- первый экран ---------- */
.hero-frame{box-shadow:0 40px 100px rgba(2,19,43,.14)}
.m-go .hero-title>.liquid,.m-go .hero-title>.subline{animation-name:p-line-blur,m-glare}
@keyframes p-line-blur{from{opacity:0;clip-path:inset(0 0 100% 0);transform:translateY(45%);filter:blur(14px)}to{opacity:1;clip-path:inset(-15% -5% -25% -5%);transform:none;filter:blur(0)}}
.hero-frame::after{content:"";position:absolute;z-index:0;inset:0;pointer-events:none;background:radial-gradient(520px circle at var(--sx,50%) var(--sy,40%),rgba(255,255,255,.55),transparent 60%);mix-blend-mode:soft-light;opacity:.9}

/* ---------- сцена-манифест: «ОДИН БРЕНД. РАЗНЫЕ ЗАДАЧИ.» ---------- */
.p-intro{padding:0!important;height:240vh}
.p-intro::before{display:none}
.p-stage{position:sticky;top:0;height:100vh;overflow:hidden;display:grid;place-items:center}
.p-stage .intro-flex{display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;z-index:3;gap:0}
.p-stage .intro-flex>div{display:flex;flex-direction:column;align-items:center}
.p-stage .eyebrow{padding:0 0 26px;opacity:calc(1 - var(--pp,0)*1.6)}
.p-stage .huge-title{font-size:clamp(70px,11.5vw,200px);line-height:.86;position:relative;z-index:1}
.p-l1,.p-l2{display:block;white-space:nowrap;will-change:transform}
.p-l1{transform:translateX(calc((1 - var(--pb,0)) * -42vw));opacity:calc(var(--pb,0) * 2)}
.p-l2{transform:translateX(calc((1 - var(--pb,0)) * 42vw));opacity:calc(var(--pb,0) * 2)}
.p-stage .huge-title em{display:inline-block}
.p-stage .intro-flex>div>p{margin-top:34px!important;max-width:600px!important;opacity:var(--pc,0);transform:translateY(calc((1 - var(--pc,0)) * 30px))}
.p-bottle{position:absolute;z-index:4;left:50%;top:50%;height:min(80vh,780px);width:auto;pointer-events:none;translate:-50% -50%;transform:translateY(calc((1 - var(--pa,0)) * 55vh - var(--pb,0) * 45vh)) rotate(calc((1 - var(--pa,0)) * 16deg - var(--pb,0) * 8deg)) scale(calc(.8 + var(--pa,0) * .2 - var(--pb,0) * .45));opacity:calc(var(--pa,0) - var(--pb,0) * 1.25);filter:drop-shadow(0 30px 40px rgba(1,28,52,.25))}
.p-glow{position:absolute;z-index:0;left:50%;top:50%;width:90vmin;height:90vmin;border-radius:50%;translate:-50% -50%;scale:calc(.3 + var(--pa,0) * .7 + var(--pb,0) * .4);background:radial-gradient(closest-side,rgba(6,196,241,.22),rgba(8,120,216,.08) 60%,transparent);pointer-events:none}
.p-rings{position:absolute;z-index:0;left:50%;top:50%;width:120vmin;height:120vmin;translate:-50% -50%;rotate:calc(var(--pp,0) * 90deg);pointer-events:none;opacity:.7}
.p-rings i{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(8,120,216,.13)}
.p-rings i:nth-child(2){inset:12%;border-color:rgba(6,196,241,.16)}
.p-rings i:nth-child(3){inset:26%;border-style:dashed;border-color:rgba(8,120,216,.12)}
.p-scrollhint{position:absolute;bottom:34px;left:50%;translate:-50% 0;display:flex;flex-direction:column;align-items:center;gap:10px;font-size:10px;font-weight:800;letter-spacing:.2em;color:#6b8aa6;opacity:calc(1 - var(--pp,0)*4)}
.p-scrollhint i{width:1px;height:46px;background:linear-gradient(#0878d8,transparent);animation:p-hint 1.8s var(--e-io) infinite;transform-origin:top}
@keyframes p-hint{0%{transform:scaleY(0)}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ---------- заголовки секций ---------- */
.eyebrow{display:inline-flex;align-items:center;gap:12px}
.eyebrow::before{content:"";width:34px;height:1px;background:currentColor;opacity:.6;transform-origin:0 50%;transition:transform 1s .2s var(--e-out)}
.eyebrow.r:not(.in)::before{transform:scaleX(0)}
.section-header h2{font-size:clamp(64px,7.2vw,124px)}
.section{padding-top:130px;padding-bottom:130px}

/* ---------- продукция ---------- */
.product-grid{gap:18px}
.product-card{border-radius:30px;border-color:#e4edf4}
.product-image{height:400px}
.product-info{padding:28px 24px 26px}
.product-info h3{font-size:40px}
.product-button{border-radius:15px;padding:16px 18px}

/* ---------- тёмный занавес (преимущества, отзывы) ---------- */
.p-dark{position:relative;background:var(--navy-deep);color:#fff;clip-path:inset(0 calc(var(--c,0) * 4vw) round calc(var(--c,0) * 56px));isolation:isolate;overflow:hidden;margin-top:30px}
.p-dark::before{content:"";position:absolute;z-index:-1;width:900px;height:900px;left:-300px;top:-380px;border-radius:50%;background:radial-gradient(closest-side,rgba(8,120,216,.33),transparent);animation:m-drift 16s ease-in-out infinite alternate}
.p-dark::after{content:"";position:absolute;z-index:-1;width:700px;height:700px;right:-240px;bottom:-200px;border-radius:50%;background:radial-gradient(closest-side,rgba(6,196,241,.18),transparent);animation:m-drift 12s ease-in-out infinite alternate-reverse}
.p-dark .section-benefits{padding-top:130px}
.p-dark .eyebrow{color:#78d4ff}
.p-dark .section-header h2{color:#fff}
.p-dark .section-header p{color:#9fb3c8}
.p-dark .benefit{background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.015));border-color:rgba(120,190,240,.16);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.p-dark .benefit h3{color:#fff}
.p-dark .benefit p{color:#a9bccf}
.p-dark .benefit>span{color:#6f8aa5}
.p-dark .benefit-icon{color:#4fd0ff}
.p-dark .benefit:hover{border-color:rgba(79,208,255,.45);box-shadow:0 30px 70px rgba(0,0,0,.35),0 0 40px rgba(6,196,241,.10)}
.p-dark .benefit:hover>span{color:#7fe3ff}
.p-dark .benefits-banner{box-shadow:0 40px 90px rgba(0,0,0,.35)}
.reviews-section{clip-path:inset(0 calc(var(--c,0) * 4vw) round calc(var(--c,0) * 56px));margin-top:40px;padding-top:150px;padding-bottom:150px}
.review-layout h2{font-size:clamp(80px,9.5vw,160px)}

/* ---------- где использовать: раскрывающиеся панели ---------- */
@media(min-width:1081px){
 .use-grid{display:flex;gap:15px}
 .use-card{flex:1 1 0;min-width:0;transition:flex-grow .9s var(--e-out),transform .5s var(--e-out),box-shadow .5s var(--e-out),border-color .4s}
 .use-grid:hover .use-card{flex-grow:.85}
 .use-grid .use-card:hover{flex-grow:1.7;transform:none}
 .use-image{height:330px}
 .use-copy{min-width:260px}
}

/* ---------- контакты ---------- */
.contact-visual{min-height:620px}
.form-panel{padding:40px 42px}

/* ---------- большой знак в подвале ---------- */
.p-wordmark{position:relative;overflow:hidden;height:clamp(110px,22vw,360px);margin-top:10px;pointer-events:none}
.p-wordmark span{position:absolute;left:50%;bottom:-.14em;translate:-50% calc((1 - var(--wm,0)) * 60%);font-family:var(--heavy);font-weight:900;font-size:clamp(130px,27vw,440px);line-height:1;letter-spacing:-.06em;white-space:nowrap;background:var(--liquid);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:calc(.25 + var(--wm,0) * .75)}

@media(max-width:800px){
 .section{padding-top:90px;padding-bottom:90px}
 .p-intro{height:200vh}
 .p-stage .huge-title{font-size:clamp(46px,13vw,90px)}
 .p-l1{transform:translateX(calc((1 - var(--pb,0)) * -70vw))}
 .p-l2{transform:translateX(calc((1 - var(--pb,0)) * 70vw))}
 .p-stage .huge-title em{white-space:nowrap}
 .p-bottle{height:62vh}
 .p-stage .intro-flex>div>p{font-size:15px!important;padding:0 6px}
 .p-dark,.reviews-section{clip-path:inset(0 calc(var(--c,0) * 3vw) round calc(var(--c,0) * 32px))}
 .product-image{height:360px}
}
@media(max-width:540px){
 .section-header h2{font-size:clamp(46px,11vw,67px)}
 .review-layout h2{font-size:68px}
 .form-panel{padding:26px 18px}
}
@media(prefers-reduced-motion:reduce){
 .p-intro{height:auto}.p-stage{position:relative;height:auto;padding:110px 0}
 .p-l1,.p-l2,.p-bottle,.p-stage .intro-flex>div>p{transform:none!important;opacity:1!important}
 .p-bottle,.p-rings,.p-scrollhint{display:none}
 .p-dark,.reviews-section{clip-path:none}
}
