/* MassageCo — блок «Мы в соцсетях» (.soc). Ленты строит assets/js/social.js из social.json. */
.soc,.soc-md{--soc-vk:#0077FF;--soc-ig1:#F9A03C;--soc-ig2:#E4405F;--soc-ig3:#7B3FE4;--soc-yt:#FF2D2D;--soc-igg:linear-gradient(45deg,var(--soc-ig1),var(--soc-ig2) 55%,var(--soc-ig3))}
.soc{--soc-cw:clamp(248px,23vw,320px);--soc-ch:calc(var(--soc-cw)*.65625);--soc-tm:clamp(34px,4.5vw,56px);position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(900px 500px at 15% 0%,#1B6B49 0,transparent 60%),radial-gradient(700px 500px at 100% 100%,#14523A 0,transparent 60%),var(--green-deep)}
.soc :focus-visible{outline:3px solid var(--amber);outline-offset:3px}
.soc .sub{color:#A9C4B6}
.soc .btn--white{background:#fff;color:var(--green-deep)}
.soc .btn--white:hover{background:var(--amber);color:var(--amber-ink)}
.soc>.wrap{position:relative;z-index:1}
.soc__bg{position:absolute;inset:-12% 0;pointer-events:none;z-index:0}
.soc-orb{position:absolute;width:640px;height:640px;margin:-110px;border-radius:50%;opacity:.3;background:radial-gradient(closest-side,var(--c),transparent)}
.soc-o1{--c:var(--soc-vk);left:0;top:14%}.soc-o2{--c:var(--soc-ig2);left:40%;top:42%}.soc-o3{--c:var(--soc-yt);right:0;top:4%}.soc-o4{--c:var(--amber);left:18%;bottom:4%;width:440px;height:440px;opacity:.14}
.soc__grid{position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.085) 1px,transparent 1.6px);background-size:26px 26px;mask-image:radial-gradient(ellipse 75% 60% at 50% 35%,#000,transparent)}
.soc__spot{position:absolute;left:0;top:0;width:760px;height:760px;margin:-380px 0 0 -380px;border-radius:50%;background:radial-gradient(closest-side,rgba(159,216,184,.17),rgba(242,162,58,.05) 55%,transparent);opacity:0;transition:opacity .6s}
.soc.is-hover .soc__spot{opacity:1}
@media (min-width:769px) and (prefers-reduced-motion:no-preference){
 .soc__bg{will-change:transform}
 .soc-orb{animation:soc-drift 18s ease-in-out infinite alternate;animation-play-state:paused}
 .soc--run .soc-orb{animation-play-state:running}
 .soc-o2{animation-delay:-6s}.soc-o3{animation-delay:-12s}.soc-o4{animation-delay:-3s}
}
@keyframes soc-drift{to{transform:translate(90px,60px) scale(1.2)}}
@media (max-width:768px),(hover:none){.soc__spot{display:none}}
.sn{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:14px;color:#fff;flex:none}
.soc svg,.soc-md svg{fill:currentColor}
.sn svg{width:22px;height:22px}
.sn--vk{background:var(--soc-vk)}.sn--yt{background:var(--soc-yt)}.sn--ig{background:var(--soc-igg)}
.soc--anim .soc-rv{opacity:0;transform:translateY(30px);transition:opacity .9s var(--ease) calc(var(--i,0)*90ms + 150ms),transform .9s var(--ease) calc(var(--i,0)*90ms + 150ms),translate .45s var(--ease),border-color .45s}
.soc--in .soc-rv{opacity:1;transform:none}
.soc-w,.soc-w>span{display:inline-block}.soc-w{overflow:hidden;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em}
.soc--anim .soc-w>span{transform:translateY(110%);transition:transform 1.1s var(--ease) calc(var(--i)*55ms + 120ms)}
.soc--in .soc-w>span{transform:none}
.soc__pause{display:inline-flex;align-items:center;gap:10px;min-height:40px;margin-right:4px;padding:0 18px 0 8px;border-radius:999px;border:1px solid rgba(255,255,255,.22);color:#fff;font-weight:700;font-size:14px;transition:background .25s,border-color .25s,translate .4s var(--ease)}
.soc__pause:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.4)}
.soc__pause i{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--amber);color:var(--amber-ink)}
.soc__pause svg{width:14px;height:14px}
.soc__sums{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px}
.soc-sum{--brand:#fff;position:relative;overflow:hidden;display:flex;align-items:center;gap:16px;padding:18px 20px;border-radius:var(--r-lg);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.13);transition:translate .45s var(--ease),border-color .45s}
.soc-sum[data-net=vk]{--brand:var(--soc-vk)}.soc-sum[data-net=ig]{--brand:var(--soc-ig2)}.soc-sum[data-net=yt]{--brand:var(--soc-yt)}
.soc-sum>div{min-width:0}
.soc-sum .sn{width:52px;height:52px;border-radius:16px;box-shadow:0 10px 26px -10px var(--brand)}.soc-sum .sn svg{width:26px;height:26px}
.soc-sum b{display:flex;white-space:pre;font:600 clamp(24px,2.6vw,34px)/1.1 var(--display);letter-spacing:-.04em;color:#fff}
.soc-sum small{display:block;color:#9FC2B0;font-weight:600;font-size:13px;line-height:1.35}
.soc-sum .btn{margin-left:auto;flex:none;min-height:40px;padding:0 14px;transition:background .25s,color .25s,translate .4s var(--ease)}
@media (hover:hover){.soc-sum:hover{translate:0 -4px;border-color:color-mix(in srgb,var(--brand) 55%,transparent)}}
.soc-od{display:block;height:1.1em;overflow:hidden}
.soc-od__c{display:flex;flex-direction:column;text-align:center;font-variant-numeric:tabular-nums;transform:translateY(calc(var(--n,0)*-1.1em));transition:transform 1.9s cubic-bezier(.16,1,.3,1)}
.soc-od__c span,.soc-od__s{display:block;height:1.1em;line-height:1.1}
.soc__rows{position:relative;z-index:1;margin-inline:calc(50% - 50vw)}
.soc--pending .soc__rows{min-height:calc(var(--soc-tm) + 60px + var(--soc-rows,3)*(108px + var(--soc-ch)))}
.soc--pending[data-variant=lane] .soc__rows{min-height:calc(clamp(20px,3vw,32px) + 94px + var(--soc-ch))}
.soc-tick{margin:var(--soc-tm) -2% 0;width:104%;height:44px;background:var(--amber);color:var(--amber-ink);transform:rotate(-1.4deg);box-shadow:0 22px 44px -22px rgba(0,0,0,.6);overflow:hidden}
.soc--anim .soc-tick{opacity:0;transform:rotate(-1.4deg) translateX(60px);transition:opacity 1s var(--ease) .55s,transform 1.2s var(--ease) .55s}
.soc--in .soc-tick{opacity:1;transform:rotate(-1.4deg)}
.soc-tick .soc-track,.soc-tick .soc-set{gap:0}
.soc-tick .soc-set{align-items:center;height:44px;font:600 clamp(13px,1.1vw,15px)/1 var(--display);letter-spacing:-.01em;white-space:nowrap}
.soc-tick__i{display:inline-flex;align-items:center;gap:10px;padding-right:22px}
.soc-tick__i svg{width:17px;height:17px}
.soc-tick__d{width:7px;height:7px;border-radius:50%;background:var(--green-deep);margin-right:22px;flex:none}
.soc-row{margin-top:14px}
.soc-tick+.soc-row{margin-top:30px}
.soc[data-variant=lane] .soc-row{margin-top:clamp(20px,3vw,32px)}
.soc-row__h{max-width:calc(var(--maxw) + var(--gut)*2);height:44px;margin-inline:auto;padding-inline:var(--gut);display:flex;align-items:center;gap:12px;color:#fff;font-weight:700;white-space:nowrap}
.soc-row__h .sn{width:34px;height:34px;border-radius:11px}.soc-row__h .sn svg{width:18px;height:18px}
.soc-row__n{min-width:0;overflow:hidden;text-overflow:ellipsis}
.soc-row__h small{color:#8FB3A0;font-weight:600;overflow:hidden;text-overflow:ellipsis}
.soc-row__ic{display:flex}.soc-row__ic .sn{width:28px;height:28px;border-radius:9px;box-shadow:0 0 0 2px var(--green-deep)}.soc-row__ic .sn+.sn{margin-left:-6px}.soc-row__ic svg{width:15px;height:15px}
.soc-row__ctl{margin-left:auto;display:flex;gap:8px;flex:none;align-items:center}
.soc-rb{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.2);color:#fff;transition:background .25s,border-color .25s,transform .2s}
.soc-rb:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.4)}.soc-rb:active{transform:scale(.92)}
.soc-rb svg{width:18px;height:18px}
.soc-row__all{color:var(--amber);font-size:14px;display:inline-flex;gap:6px;align-items:center;padding:8px 6px;transition:translate .4s var(--ease)}
.soc-row__all .soc-s{display:none}.soc-row__all svg{width:16px;height:16px;transition:transform .25s}.soc-row__all:hover svg{transform:translateX(4px)}
.soc-lane{overflow:hidden;padding:24px 0 26px;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);touch-action:pan-y;cursor:grab;-webkit-user-select:none;user-select:none}
.soc-lane.is-drag{cursor:grabbing}.soc-lane.is-drag .soc-pc{pointer-events:none}
.soc-track{display:flex;gap:18px;width:max-content;will-change:transform}
.soc-set{display:flex;gap:18px}
.soc-pc{--brand:#fff;--rx:0deg;--ry:0deg;--ly:0px;--sc:1;position:relative;flex:none;display:block;width:var(--soc-cw);height:var(--soc-ch);border-radius:var(--r-md);text-align:left;cursor:pointer;isolation:isolate;transform:perspective(800px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(var(--ly)) scale(var(--sc));transition:transform .55s var(--ease)}
.soc-pc--vk{--brand:var(--soc-vk)}.soc-pc--ig{--brand:var(--soc-ig2)}.soc-pc--yt{--brand:var(--soc-yt)}
.soc-pc.is-tilt{transition:transform .12s linear}
.soc-pc::before{content:"";position:absolute;inset:16px 10px -8px;border-radius:inherit;background:var(--brand);opacity:0;transition:opacity .45s;z-index:-1;box-shadow:0 0 40px 14px var(--brand)}
.soc-pc__in{position:absolute;inset:0;border-radius:inherit;overflow:hidden;background:#06140D;box-shadow:0 18px 40px -22px #000,inset 0 0 0 1px rgba(255,255,255,.08)}
.soc-pc__in img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease),opacity .6s;pointer-events:none;-webkit-user-drag:none}
.soc-pc__t{position:absolute;left:0;right:0;bottom:0;padding:44px 14px 14px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.88));transform:translateY(32px);transition:transform .55s var(--ease)}
.soc-pc__h{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font:700 14px/1.3 var(--font)}
.soc-pc__s{display:flex;gap:12px;margin-top:8px;opacity:0;transition:opacity .4s .05s}
.soc-st{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:13.5px;font-variant-numeric:tabular-nums}
.soc-st svg{width:16px;height:16px;opacity:.9}
.soc-pc__n{position:absolute;top:10px;left:10px;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;z-index:1}.soc-pc__n svg{width:16px;height:16px}
.soc-pc__v{position:absolute;top:10px;right:10px;background:rgba(0,0,0,.6);color:#fff;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:700;display:flex;gap:5px;align-items:center;z-index:1}
.soc-pc__v svg{width:13px;height:13px}
.soc-pc__p{color:#fff;position:absolute;left:50%;top:40%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.2);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.55);opacity:0;transform:scale(.5);transition:opacity .4s,transform .55s var(--ease);z-index:1}
.soc-pc__p svg{width:24px;height:24px;margin-left:3px}
.soc-pc:focus-visible{outline:3px solid var(--amber);outline-offset:4px}
@media (hover:hover){
 .soc-pc:is(:hover,:focus-visible){--ly:-6px;--sc:1.035}
 .soc-pc:is(:hover,:focus-visible)::before{opacity:.35}
 .soc-pc:is(:hover,:focus-visible) img{transform:scale(1.09);opacity:.5}
 .soc-pc:is(:hover,:focus-visible) .soc-pc__t{transform:none}
 .soc-pc:is(:hover,:focus-visible) :is(.soc-pc__s,.soc-pc__p){opacity:1;transform:none}
}
.soc-fx{position:absolute;left:var(--x);bottom:30%;width:22px;height:22px;pointer-events:none;z-index:3;animation:soc-fx 1.9s cubic-bezier(.2,.6,.3,1) var(--dl,0s) both}
.soc-fx svg{width:100%;height:100%;filter:drop-shadow(0 2px 6px rgba(0,0,0,.45))}
.soc-fx--heart{color:#FF5C7A}.soc-fx--eye{color:#fff;width:18px;height:18px}
@keyframes soc-fx{0%{opacity:0;transform:translate(0,14px) scale(.3)}14%{opacity:1;transform:none}100%{opacity:0;transform:translate(var(--dx),-120px) scale(.8) rotate(var(--r))}}
html.soc-lock{overflow:hidden}
.soc-md{padding:0;border:0;background:transparent;color:#D3E4DA;width:min(980px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;border-radius:var(--r-xl);scrollbar-width:none}
.soc-md :focus-visible{outline:3px solid var(--amber);outline-offset:3px}
.soc-md::backdrop{background:rgba(4,18,12,.82)}
.soc-md[open]::backdrop{animation:soc-bd .4s ease both}.soc-md.is-out::backdrop{animation:soc-bd .3s ease reverse both}
@keyframes soc-bd{from{opacity:0}}
.soc-md__p{--brand:#fff;position:relative;display:grid;grid-template-columns:1.25fr 1fr;border-radius:var(--r-xl)}
.soc-md--vk .soc-md__p{--brand:var(--soc-vk)}.soc-md--ig .soc-md__p{--brand:var(--soc-ig2)}.soc-md--yt .soc-md__p{--brand:var(--soc-yt)}
.soc-md__sh{position:absolute;inset:0;border-radius:inherit;background:radial-gradient(600px 400px at 100% 0%,color-mix(in srgb,var(--brand) 22%,transparent),transparent 65%),linear-gradient(160deg,#13492F,var(--green-deep) 60%);border:1px solid rgba(255,255,255,.12);box-shadow:0 50px 100px -30px rgba(0,0,0,.8)}
.soc-md__m{position:relative;margin:14px;border-radius:22px;overflow:hidden;background:#000;aspect-ratio:16/10.5;align-self:start}
.soc-md__m img{width:100%;height:100%;object-fit:cover}
.soc-md__play{color:#fff;position:absolute;left:50%;top:50%;width:76px;height:76px;margin:-38px 0 0 -38px;border-radius:50%;display:grid;place-items:center;background:var(--brand);box-shadow:0 0 0 10px color-mix(in srgb,var(--brand) 25%,transparent),0 20px 40px -10px rgba(0,0,0,.6);z-index:1;animation:soc-pulse 2.4s ease-in-out infinite}
.soc-md__play svg{width:32px;height:32px;margin-left:4px}
@keyframes soc-pulse{50%{box-shadow:0 0 0 20px color-mix(in srgb,var(--brand) 0%,transparent),0 20px 40px -10px rgba(0,0,0,.6)}}
.soc-md__m .sn{position:absolute;left:14px;bottom:14px;z-index:1}
.soc-md__b{position:relative;padding:30px 30px 26px 14px;display:flex;flex-direction:column;gap:16px}
.soc-md__meta{color:#9FC2B0;font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.soc-md__t{font:600 clamp(20px,2vw,26px)/1.15 var(--display);letter-spacing:-.03em;color:#fff;padding-right:40px}
.soc-md__st{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:10px}
.soc-md__st:empty{display:none}
.soc-md__st div{padding:12px 12px 10px;border-radius:var(--r-sm);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1)}
.soc-md__st svg{width:16px;height:16px;fill:var(--amber)}
.soc-md__st b{position:relative;display:flex;white-space:pre;margin-top:6px;font:600 clamp(17px,1.7vw,21px)/1.1 var(--display);letter-spacing:-.03em;color:#fff}
.soc-md__st small{color:#8FB3A0;font-size:12px;font-weight:600}
.soc-md__a{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.soc-md__cta{background:var(--brand);color:#fff;box-shadow:0 14px 30px -12px var(--brand);transition:filter .25s,translate .4s var(--ease)}
.soc-md--ig .soc-md__cta{background:var(--soc-igg)}
.soc-md__cta:hover{filter:brightness(1.1)}.soc-md__cta svg{width:18px;height:18px}
.soc-md__nav{margin-left:auto;display:flex;align-items:center;gap:8px;color:#9FC2B0;font-weight:700;font-size:13px;font-variant-numeric:tabular-nums}
.soc-md__x{position:absolute;top:14px;right:14px;z-index:3;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.45);color:#fff;border:1px solid rgba(255,255,255,.2);transition:background .25s,transform .3s var(--ease)}
.soc-md__x:hover{background:rgba(0,0,0,.7);transform:rotate(90deg)}
.soc-md .soc-md__x svg{width:18px;height:18px;stroke:currentColor;stroke-width:2.4;fill:none}
.soc-md.is-in .soc-md__b>*{animation:soc-up .65s var(--ease) both;animation-delay:calc(var(--i)*60ms + 160ms)}
@keyframes soc-up{from{opacity:0;transform:translateY(18px)}}
.soc-ghost{position:fixed;z-index:10;object-fit:cover;pointer-events:none;transform-origin:0 0;border-radius:22px}
.soc[data-variant=lane]{padding-block:clamp(44px,5.5vw,80px)}
.soc[data-variant=lane] .head{margin-bottom:clamp(20px,3vw,32px)}
.soc[data-variant=lane] .h2{font-size:clamp(24px,2.6vw,36px)}
@media (max-width:760px){
 .soc-md__p{grid-template-columns:1fr}.soc-md__m{margin:10px 10px 0}.soc-md__b{padding:18px 18px 20px}
 .soc-md__t{padding-right:0}
 .soc-md__x{position:fixed;top:20px;right:20px}
}
@media (max-width:600px){
 .soc-sum{padding:14px 16px}
 .soc-row__h small,.soc-row__all .soc-l{display:none}.soc-row__all .soc-s{display:inline}
 .soc__pause{padding:0 5px;margin:0}.soc__pause .soc-lb{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
 .soc-track,.soc-set{gap:14px}
 .soc-md{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);border-radius:var(--r-lg)}.soc-md__p{border-radius:var(--r-lg)}
 .soc-md__st{gap:6px}.soc-md__st div{padding:10px 8px 8px}
 .soc-md__nav{margin-left:0;width:100%;justify-content:space-between}.soc-md__cta{width:100%}
}
@media (prefers-reduced-motion:reduce){
 .soc-orb,.soc-md__play{animation:none}
 .soc-pc,.soc-od__c,.soc-pc__in img{transition:none}
}