/* Кольцо работ (орбита из стеклянных шаров) + просмотрщик фото */
.orbit-sec{padding:40px 0 64px;overflow:hidden}
.orbit{
  --n:8; --s:clamp(62px,18vw,150px); --r:clamp(110px,36vw,300px);
  --turn:60s;
  position:relative;width:calc(var(--r)*2 + var(--s));aspect-ratio:1;margin:0 auto;max-width:100%;
}
.orbit-ring{position:absolute;inset:0;animation:orbit-spin var(--turn) linear infinite}
.orbit-ball{
  position:absolute;left:50%;top:50%;width:var(--s);height:var(--s);margin:calc(var(--s)/-2) 0 0 calc(var(--s)/-2);
  transform:rotate(calc(var(--i)*360deg/var(--n))) translateY(calc(var(--r)*-1)) rotate(calc(var(--i)*-360deg/var(--n)));
}
/* держим шар «ровно», пока кольцо крутится */
.orbit-keep{width:100%;height:100%;animation:orbit-spin var(--turn) linear infinite reverse}
.orbit-pop{
  display:block;width:100%;height:100%;border:0;padding:0;background:none;cursor:pointer;border-radius:50%;
  opacity:0;transform:scale(.2);
  animation:orbit-pop .7s cubic-bezier(.2,1.4,.4,1) forwards;animation-delay:calc(var(--i)*.14s + .15s);
  animation-play-state:paused;
}
.orbit.in .orbit-pop{animation-play-state:running}
.sphere{
  position:relative;display:block;width:100%;height:100%;border-radius:50%;overflow:hidden;
  box-shadow:0 18px 30px -14px rgba(15,27,45,.45), inset 0 0 0 1px rgba(255,255,255,.35);
  transition:transform .35s cubic-bezier(.2,1.2,.4,1);
}
.orbit-pop:hover .sphere,.orbit-pop:focus-visible .sphere{transform:scale(1.08)}
.orbit-pop:focus-visible{outline:3px solid var(--blue,#1f8fff);outline-offset:4px}
.sphere img{
  position:absolute;inset:-12%;width:124%;height:124%;object-fit:cover;transform:scale(var(--z,1));
  animation:sphere-roll 14s ease-in-out infinite alternate;animation-delay:calc(var(--i)*-1.7s)
}
/* блик и затемнение по краю — эффект стеклянного шара */
.sphere::before{content:"";position:absolute;inset:0;border-radius:50%;z-index:1;
  background:radial-gradient(circle at 50% 50%,transparent 55%,rgba(10,20,35,.42) 100%)}
.sphere::after{content:"";position:absolute;inset:0;border-radius:50%;z-index:2;
  background:radial-gradient(ellipse 46% 28% at 38% 20%,rgba(255,255,255,.75),rgba(255,255,255,0) 70%),
             radial-gradient(circle at 70% 85%,rgba(255,255,255,.18),transparent 40%)}

.orbit-center{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:calc(var(--r)*2 - var(--s) - 24px);text-align:center;
  opacity:0;animation:orbit-fade .9s ease forwards;animation-delay:.2s;animation-play-state:paused
}
.orbit.in .orbit-center{animation-play-state:running}
.orbit-title{font-family:"Marck Script",cursive;font-weight:400;font-size:clamp(26px,6vw,64px);line-height:1;color:var(--ink,#0f1b2d);margin-bottom:12px;white-space:nowrap}
.orbit-text{color:var(--muted,#5b6b80);font-size:clamp(12px,2vw,19px);line-height:1.45}
@media(max-width:600px){.orbit-title{margin-bottom:6px}.orbit-link{margin-top:8px}}
.orbit-link{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-weight:700;color:var(--blue,#1f8fff);font-size:clamp(13px,1.8vw,16px)}
.orbit-link:hover{text-decoration:underline}

@keyframes orbit-spin{to{transform:rotate(360deg)}}
@keyframes orbit-pop{to{opacity:1;transform:scale(1)}}
@keyframes orbit-fade{to{opacity:1}}
@keyframes sphere-roll{
  0%{transform:scale(var(--z,1)) translate(-5%,-3%) rotate(-8deg)}
  100%{transform:scale(var(--z,1)) translate(5%,3%) rotate(8deg)}
}

/* Просмотрщик: кольцо продолжает крутиться за размытым фоном */
.lb{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:24px 64px;
  background:rgba(246,249,253,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.lb.open{opacity:1;visibility:visible}
.lb figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:12px;transform:scale(.92);transition:transform .35s cubic-bezier(.2,1.2,.4,1)}
.lb.open figure{transform:scale(1)}
.lb img{max-width:min(92vw,900px);max-height:78vh;border-radius:18px;box-shadow:0 30px 70px -25px rgba(15,27,45,.6);background:#fff}
.lb figcaption{font-weight:700;background:#fff;border-radius:999px;padding:8px 18px;box-shadow:0 8px 20px -10px rgba(15,27,45,.35)}
.lb button{position:absolute;border:0;cursor:pointer;width:48px;height:48px;border-radius:50%;background:#fff;color:#0f1b2d;font-size:24px;line-height:1;box-shadow:0 8px 20px -8px rgba(15,27,45,.4)}
.lb .lb-x{top:16px;right:16px}
.lb .lb-prev{left:12px;top:50%;transform:translateY(-50%)}
.lb .lb-next{right:12px;top:50%;transform:translateY(-50%)}
@media(max-width:600px){.lb{padding:70px 12px 90px}.lb img{max-width:78vw;max-height:58vh}.lb .lb-prev,.lb .lb-next{top:auto;bottom:20px;transform:none}.lb .lb-prev{left:calc(50% - 60px)}.lb .lb-next{right:calc(50% - 60px)}}
body.lb-lock{overflow:hidden}

@media(prefers-reduced-motion:reduce){
  .orbit-ring,.orbit-keep,.sphere img{animation:none}
  .orbit-pop,.orbit-center{animation:none;opacity:1;transform:none}
}