/* Карточка тура card2 — попап гида (tour-card.js). Подключается из chunks/tours/card2-assets.tpl. */

/* значок гида — кнопка; в открытом состоянии крестик */
.tc2-guide-badge[data-guide] { cursor: pointer; }
.tc2-guide-badge[data-guide]:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.tc2-guide-badge .tcg-x { display: none; width: 36px; height: 36px; border-radius: 50%; background: #fff; color: #1c1c1c; font: 400 26px/36px Montserrat, system-ui, sans-serif; text-align: center; box-shadow: 0 2px 8px rgba(0,0,0,.25); }
.tc2-guide-badge.is-x .tc2-guide-avatar, .tc2-guide-badge.is-x .tc2-guide-tooltip, .tc2-guide-badge.is-x svg { display: none; }
.tc2-guide-badge.is-x .tcg-x { display: block; }

/* затемнение (кладётся в секцию карточки) и поднятая карточка */
.tcg-overlay { position: fixed; inset: 0; background: rgba(13,27,30,.6); opacity: 0; pointer-events: none; transition: opacity .25s; z-index: 1000; }
.tcg-open .tcg-overlay { opacity: 1; pointer-events: auto; }
.tcg-lifted { position: relative; z-index: 1001; }

/* попап — вертикальная карточка гида как в блоке «Гиды»: белая часть вровень с карточкой тура, голова выступает */
.tcg-pop { position: absolute; z-index: 1002; width: 290px; padding-top: 64px; opacity: 0; transform: translateX(-8px) scale(.96); transform-origin: left top; transition: opacity .22s, transform .3s cubic-bezier(.3,1.3,.5,1); pointer-events: none; }
.tcg-pop.is-left { transform: translateX(8px) scale(.96); transform-origin: right top; }
.tcg-pop.is-on { opacity: 1; transform: none; pointer-events: auto; }
.tcg-pop .guide { display: flex; flex-direction: column; gap: 6px; background: #fff; border: 1px solid #ECEBE7; border-radius: 18px; box-sizing: border-box; padding: 0 26px 26px; box-shadow: 0 16px 40px rgba(0,0,0,.25); font-family: Montserrat, system-ui, sans-serif; color: #1c1c1c; text-align: left; }
.tcg-pop .guide img { height: 190px; width: auto; max-width: 92%; object-fit: contain; display: block; margin: -64px auto 14px; filter: drop-shadow(0 10px 16px rgba(0,0,0,.14)); }
/* нет вырезки — круглый аватар */
.tcg-pop .guide--avatar img { width: 128px; height: 128px; max-width: none; object-fit: cover; border-radius: 50%; border: 4px solid #fff; margin: -64px auto 14px; filter: drop-shadow(0 8px 14px rgba(0,0,0,.16)); }
.tcg-pop .guide b { font-size: 1.3rem; line-height: 1.15; letter-spacing: -.01em; font-weight: 700; }
.tcg-pop .guide .role { font-size: 12px; color: #00b987; font-weight: 700; }
.tcg-pop .guide p { font-size: 12.5px; line-height: 1.5; color: #8a8880; margin: 2px 0 0; }
.tcg-pop .guide a { align-self: flex-start; margin-top: 6px; font-size: 13px; font-weight: 700; color: #007456; text-decoration: none; }
.tcg-pop .guide a:hover { color: #00b987; }
.tcg-pop .tcg-close { display: none; }

@media (max-width: 767px) {
    .tcg-pop { position: fixed; left: 50% !important; top: 50% !important; width: min(320px, calc(100vw - 32px)); transform: translate(-50%,-46%) scale(.96); }
    .tcg-pop.is-left { transform: translate(-50%,-46%) scale(.96); }
    .tcg-pop.is-on { transform: translate(-50%,-50%); }
    .tcg-pop .tcg-close { display: block; position: absolute; top: 76px; right: 12px; width: 36px; height: 36px; border-radius: 50%; border: 0; background: #f1f0ec; color: #1c1c1c; font: 400 24px/36px Montserrat, system-ui, sans-serif; cursor: pointer; }
    .tcg-lifted { z-index: auto; }
}
@media (prefers-reduced-motion: reduce) { .tcg-overlay, .tcg-pop { transition: none; } }