/* Страница «Контакты»: шапка, тёмная карта со свечением, «Как добраться», синяя панель кассы, отделы, соцсети.
   Язык — как у «Гостям»: ч/б карта с синим свечением, панель-«занавес», синие прямоугольники со свечением, мягкие синие пятна, номера и тонкие линии.
   Цвета, шрифты, капсулы (.menu__item, .outline-button), фокус и reduced-motion — из common/site.css. */

.contacts {
  --c-gap: clamp(72px, 9vw, 140px);
  --c-line: rgba(255,255,255,.22);
  --c-line-strong: rgba(255,255,255,.3);
  --c-radius: 16px;
  --c-hover: 160ms;
  position: relative;
  isolation: isolate;
}
.contacts p, .contacts li { overflow-wrap: break-word; }
.contacts :focus-visible { outline: 2px solid var(--paper); outline-offset: 3px; }
.contacts [id] { scroll-margin-top: 24px; }

/* == Шапка страницы == */

.contacts-head { text-align: center; }
.contacts .contacts-head__title { margin: 0; }
.contacts-head__address { max-width: 620px; margin: var(--page-title-gap) auto 0; font-size: clamp(18px, 2vw, 26px); line-height: 1.35; text-wrap: balance; }
.contacts-head__button { min-height: 40px; margin-top: clamp(20px, 2.4vw, 32px); padding: 8px 22px; }

/* == Карта: тёмная рамка, ч/б фильтр, синее свечение, карточка адреса == */

.contacts-map { position: relative; margin-top: var(--page-content-gap); }
.contacts-map__frame { position: relative; height: clamp(320px, 34vw, 480px); overflow: hidden; border-radius: var(--c-radius); background: #1a1a1a; }
.contacts-map__iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: grayscale(1) invert(1) contrast(.92) brightness(.95); }
.contacts-map__glow { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(52% 64% at 4% 100%, rgba(0,0,253,.85), transparent 72%), radial-gradient(38% 50% at 96% 6%, rgba(0,0,253,.4), transparent 72%); mix-blend-mode: lighten; }
/* Карточка в левом верхнем углу, чтобы не закрывать кнопку Яндекса внизу карты */
.contacts-map__card { position: absolute; z-index: 2; left: clamp(16px, 2.4vw, 32px); top: clamp(16px, 2.4vw, 32px); max-width: min(360px, calc(100% - 32px)); padding: clamp(18px, 2vw, 28px); border: 1px solid var(--c-line-strong); border-radius: var(--c-radius); background: rgba(33,33,33,.92); }
.contacts-map__name { margin: 0; font-family: "Benzin", sans-serif; font-weight: 800; font-size: clamp(22px, 2.4vw, 34px); line-height: 1.05; }
.contacts-map__address { margin: 8px 0 0; color: var(--muted); font-size: clamp(15px, 1.2vw, 17px); line-height: 1.4; }
.contacts-map__links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: clamp(16px, 1.8vw, 24px); }

/* == Как добраться: три колонки «номер — термин — текст» == */

.contacts-route { margin-top: var(--c-gap); }
.contacts .contacts-route__title { margin: 0 0 var(--page-content-gap); text-align: center; font-size: clamp(22px, 3vw, 34px); line-height: 1.05; }
.contacts-route__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 48px); margin: 0; padding: 0; list-style: none; }
.contacts-route__item { display: grid; grid-template-rows: auto auto 1fr; row-gap: 12px; padding-top: clamp(16px, 1.8vw, 24px); border-top: 1px solid var(--c-line-strong); }
.contacts-route__num { color: rgba(255,255,255,.55); font-size: 12px; }
.contacts .contacts-route__term { margin: 0; font-size: clamp(16px, 1.5vw, 20px); line-height: 1.15; overflow-wrap: break-word; }
.contacts-route__text { margin: 0; color: var(--muted); font-size: clamp(15px, 1.2vw, 17px); line-height: 1.6; }

/* == Касса клуба: синяя панель-«занавес» == */

.contacts-cash { position: relative; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 80px); margin-top: var(--c-gap); padding: clamp(24px, 4.5vw, 72px); overflow: hidden; border-radius: var(--c-radius); background: var(--blue) url("assets/route-curtain.jpg") center / cover no-repeat; }
.contacts-cash::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,253,.55), rgba(0,0,253,.12)); pointer-events: none; }
.contacts-cash > * { position: relative; }
.contacts .contacts-cash__main h2 { margin: 0; font-size: clamp(24px, 3vw, 40px); line-height: 1.05; overflow-wrap: normal; }
.contacts-cash__label { margin: clamp(20px, 2.4vw, 32px) 0 0; color: rgba(255,255,255,.85); font-size: 13px; letter-spacing: .04em; text-transform: uppercase; }
.contacts-cash__phone { display: inline-block; margin-top: 6px; font-family: "Benzin", sans-serif; font-weight: 800; font-size: clamp(22px, 2.6vw, 38px); line-height: 1.1; white-space: nowrap; border-radius: 4px; transition: color var(--c-hover) var(--ease-out), background-color var(--c-hover) var(--ease-out), box-shadow var(--c-hover) var(--ease-out); }
.contacts-cash__phone:is(:hover, :focus-visible) { background: var(--paper); color: var(--blue); box-shadow: 0 0 0 4px var(--paper); }
.contacts-cash__list { align-self: center; margin: 0; padding: 0; list-style: none; }
.contacts-cash__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; column-gap: clamp(12px, 2vw, 28px); padding: clamp(16px, 2vw, 26px) 0; border-top: 1px solid rgba(255,255,255,.4); }
.contacts-cash__row:last-child { border-bottom: 1px solid rgba(255,255,255,.4); }
.contacts-cash__key { font-size: clamp(15px, 1.35vw, 19px); line-height: 1.3; }
.contacts-cash__value { font-family: "Benzin", sans-serif; font-weight: 800; font-size: clamp(17px, 1.75vw, 24px); line-height: 1.2; text-align: right; }

/* == Отделы: сетка карточек на мягких синих пятнах == */

.contacts-depts { position: relative; isolation: isolate; margin-top: var(--c-gap); }
/* Пятна — эллипсы внутри границ секции, без жёстких краёв */
.contacts-depts::before { content: ""; position: absolute; z-index: -1; inset: 0; pointer-events: none; background: radial-gradient(ellipse 30% 22% at 30% 22%, rgba(0,0,253,.5), rgba(0,0,253,.16) 55%, transparent 100%), radial-gradient(ellipse 24% 20% at 74% 30%, rgba(0,0,253,.42), rgba(0,0,253,.14) 55%, transparent 100%), radial-gradient(ellipse 30% 20% at 50% 78%, rgba(0,0,253,.45), rgba(0,0,253,.15) 55%, transparent 100%); }
.contacts-depts__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(20px, 3vw, 48px); row-gap: clamp(32px, 4vw, 56px); }
.contacts-dept { min-width: 0; padding-top: clamp(16px, 1.8vw, 24px); border-top: 1px solid var(--c-line-strong); }
.contacts-dept__num { color: rgba(255,255,255,.55); font-size: 12px; }
.contacts .contacts-dept__title { margin: 10px 0 0; font-size: clamp(16px, 1.5vw, 20px); line-height: 1.15; }
.contacts-dept__people { display: grid; gap: clamp(20px, 2.4vw, 32px); margin-top: clamp(16px, 2vw, 24px); }
.contacts-dept--events .contacts-dept__people { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(16px, 2vw, 28px); }
.contacts-person__name { margin: 0; font-size: clamp(17px, 1.4vw, 20px); line-height: 1.25; font-weight: 500; }
.contacts-person__role { margin: 4px 0 0; color: var(--muted); font-size: 14px; line-height: 1.35; }
.contacts-person__links { display: grid; gap: 6px; margin: 12px 0 0; padding: 0; list-style: none; }
.contacts-person > .contacts-person__links:first-child { margin-top: 0; }
.contacts-person__links a { color: var(--paper); text-decoration: underline; text-decoration-color: rgba(255,255,255,.5); text-underline-offset: 3px; overflow-wrap: anywhere; }
.contacts-person__chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 14px 0 0; }
.contacts-chip { min-height: 32px; }
/* Иконка в капсуле синеет на светлом hover, как в шапке */
.contacts-chip img { display: block; width: 18px; height: 18px; }
.contacts-chip:hover img { filter: brightness(0) saturate(100%) invert(9%) sepia(100%) saturate(7499%) hue-rotate(247deg) brightness(94%) contrast(145%); }

/* == Соцсети: центрированный заголовок и синие пилюли == */

.contacts-social { margin: var(--c-gap) -4px 0; padding: 0 4px; overflow-x: clip; }
.contacts .contacts-social__title { margin: 0 0 var(--page-content-gap); text-align: center; font-size: clamp(22px, 3vw, 34px); line-height: 1.05; }
.contacts-social__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); justify-items: center; gap: clamp(14px, 2.5vw, 36px); margin: 0; padding: 0; list-style: none; }
.contacts-social__list li { display: flex; justify-content: center; width: 100%; }
/* Плашка-ссылка: текст без фона, размытое синее пятно — в ::before. */
.contacts-social__link { position: relative; isolation: isolate; display: grid; place-content: center; width: min(300px, 100%); height: clamp(96px, 8.4vw, 118px); padding: 10px 18px; border-radius: 16px; color: var(--paper); font-family: "Benzin", sans-serif; font-weight: 800; font-size: clamp(16px, 1.7vw, 24px); line-height: 1; text-align: center; transition: transform var(--c-hover) var(--ease-out); }
/* Размытая плашка шире текста, как у Priority Pass (.priority__light); по ховеру расширяется. */
.contacts-social__link::before { content: ""; position: absolute; z-index: -1; top: 9px; bottom: 9px; left: -10%; right: -10%; border-radius: 16px; background: #0a0aba; filter: blur(15px); pointer-events: none; transition: left 360ms cubic-bezier(.2,.7,.25,1), right 360ms cubic-bezier(.2,.7,.25,1); }
.contacts-social__link:is(:hover, :focus-visible) { transform: translateY(-1px); }
.contacts-social__link:is(:hover, :focus-visible)::before { left: -18%; right: -18%; }
.contacts-social__link:active { transform: none; }

/* == Узкие десктопы и планшет: отделы в две колонки == */

@media (max-width: 1200px) {
  .contacts-depts__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contacts-dept--tickets, .contacts-dept--tech, .contacts-dept--bar, .contacts-dept--pr { grid-column: span 1; }
  .contacts-dept--events, .contacts-dept--director { grid-column: span 2; }
}

/* == Планшет и телефон == */

@media (max-width: 900px) {
  .contacts-head__button { min-height: 44px; }
  .contacts-map__frame { height: clamp(300px, 70vw, 420px); }
  .contacts-map__card { position: static; max-width: none; margin-top: 16px; padding: 0; border: 0; background: transparent; }
  .contacts-map__card .outline-button { min-height: 44px; }
  .contacts-route__list { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .contacts-route__item { grid-template-columns: 30px minmax(0, 1fr); grid-template-rows: none; column-gap: clamp(10px, 1.5vw, 22px); row-gap: 8px; padding: 18px 0; }
  .contacts-route__num { grid-row: 1 / span 2; }
  .contacts-route__item:last-child { border-bottom: 1px solid var(--c-line-strong); }
  .contacts-cash { grid-template-columns: minmax(0, 1fr); }
  .contacts-chip { min-height: 44px; }
}

@media (max-width: 520px) {
  .contacts-cash__row { grid-template-columns: minmax(0, 1fr); }
  .contacts-cash__value { margin-top: 6px; text-align: left; }
  .contacts-cash__phone { font-size: clamp(18px, 5.8vw, 24px); }
  .contacts-depts__grid { grid-template-columns: minmax(0, 1fr); }
  .contacts-dept--events, .contacts-dept--director { grid-column: span 1; }
  .contacts-dept--events .contacts-dept__people { grid-template-columns: minmax(0, 1fr); }
  .contacts-social__link { height: 88px; padding: 10px 8px; font-size: clamp(14px, 4vw, 16px); }
}

/* Соцсети в одну колонку: ссылки min(320px, 100%) по центру */
@media (max-width: 700px) {
  .contacts-social__list { grid-template-columns: minmax(0, 1fr); row-gap: 18px; }
  .contacts-social__link { width: min(320px, 100%); }
}