/* =====================================================================
   team-carousel.css — команда 3D-каруселью (порт VengeanceUI perspective-carousel, MIT).
   Общий для главной (#teamGrid, данные из data/team.json через fetch) и /komanda
   (пререндер в маркерах zvk:team, admin/lib/team-prerender.php). Логика — assets/js/team-carousel.js.
   Цвета — переменные главной с запасными значениями (на /komanda их нет).
   ===================================================================== */
.pc { position: relative; margin-top: 8px; }
.pc__viewport { position: relative; height: 470px; perspective: 1400px; outline: none; touch-action: pan-y; user-select: none; }
.pc__viewport:focus-visible { outline: 3px solid var(--accent, #00E5A4); outline-offset: 6px; border-radius: 20px; }
.pc__slide { position: absolute; left: 50%; top: 0; width: 320px; margin-left: -160px; aspect-ratio: 3 / 4; padding: 0; border: 0; border-radius: 28px; overflow: hidden;
    background: #e6eaee; cursor: pointer; transform-style: preserve-3d;
    transition: transform .9s cubic-bezier(.22,1.1,.36,1), opacity .5s, box-shadow .6s; box-shadow: 0 20px 40px -24px rgba(10,10,10,.35); }
.pc__slide img { width: 100%; height: 100%; object-fit: cover; object-position: center 18%; display: block; filter: grayscale(1) brightness(.92); transition: filter .7s; pointer-events: none; }
.pc__slide::after { content: ""; position: absolute; inset: 0; background: rgba(248,249,252,.28); transition: opacity .6s; }
.pc__slide.is-on { cursor: default; box-shadow: 0 50px 80px -40px rgba(10,10,10,.5), 0 0 0 1px rgba(0,229,164,.35); }
.pc__slide.is-on img { filter: none; }
.pc__slide.is-on::after { opacity: 0; }
/* пререндер до запуска скрипта: виден только активный слайд, остальные выезжают из-за него */
.pc:not(.is-live) .pc__slide:not(.is-on) { opacity: 0; }
.pc__badge { position: absolute; left: 14px; right: 14px; bottom: 14px; z-index: 1; padding: 8px 12px; border-radius: 14px; background: rgba(10,10,10,.6);
    color: #fff; font-size: 14px; font-weight: 700; text-align: left; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: opacity .4s; }
.pc__slide.is-on .pc__badge { opacity: 0; }
.pc__info { max-width: 640px; margin: 22px auto 0; text-align: center; min-height: 168px; }
.pc__info.is-in { animation: pcIn .5s ease both; }
@keyframes pcIn { from { opacity: 0; transform: translateY(10px); } }
.pc__name { font-size: clamp(24px, 2.6vw, 32px); font-weight: 800; letter-spacing: -.02em; line-height: 1.15; }
.pc__role { display: inline-block; margin-top: 10px; font-size: 13.5px; font-weight: 700; color: var(--black, #0a0a0a); background: var(--accent, #00E5A4); padding: 6px 14px; border-radius: 30px; }
.pc__desc { margin-top: 14px; font-size: 16px; line-height: 1.65; color: var(--ink-2, #3b4754); }
.pc__link { display: inline-block; margin-top: 12px; font-weight: 700; font-size: 15px; color: var(--black, #0a0a0a); text-decoration: none; border-bottom: 2px solid var(--accent, #00E5A4); padding-bottom: 2px; }
.pc__link[hidden] { display: none !important; } /* класс с display перебивал атрибут hidden */
.pc__link::after { content: " →"; white-space: pre; }
.pc__link:hover { color: var(--accent-dark, #00B884); }
.pc__controls { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 20px; }
.pc__nav { width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--line, #e6eaf0); background: #fff; font-size: 26px; line-height: 1; color: var(--black, #0a0a0a); cursor: pointer; transition: background .25s, border-color .25s, transform .2s; }
.pc__nav:hover { background: var(--accent, #00E5A4); border-color: var(--accent, #00E5A4); transform: scale(1.06); }
.pc__dots { display: flex; gap: 8px; }
.pc__dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 8px; background: var(--black, #0a0a0a); opacity: .25; cursor: pointer; transition: width .35s, opacity .35s, background .35s; }
.pc__dot.is-on { width: 28px; opacity: 1; background: var(--accent-dark, #00B884); }
@media (max-width: 700px) {
    .pc__viewport { height: 340px; }
    .pc__slide { width: 230px; margin-left: -115px; border-radius: 22px; }
    .pc__info { min-height: 0; }
    .pc__desc { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) { .pc__slide { transition: opacity .3s; } .pc__info.is-in { animation: none; } }
