/* ==========================================================================
   Story.Eventhome — дополнения к прототипу story-eventhome-ny-v1 (20.10.2026).
   Здесь только то, чего в css/style.css прототипа нет:
   1) лайтбокс галереи «Пространство» (у ссылок data-lightbox, обработчика в прототипе нет);
   2) блоки, оставленные по договорённости с клиентом: «Из чего складывается
      стоимость» (#pricing) и FAQ (#faq) — оформлены сценами прототипа (.sc);
   3) cookie-баннер сайта.
   ========================================================================== */

/* ---------- 1. Лайтбокс галереи ---------- */
.ny-lb{
  position:fixed; inset:0; z-index:9000;
  display:none; align-items:center; justify-content:center;
  background:rgba(0,0,0,.9);
  opacity:0; transition:opacity .2s var(--ease);
}
.ny-lb.is-open{ display:flex; opacity:1; }
.ny-lb img{
  max-height:90vh; max-width:90vw;
  border-radius:16px; box-shadow:0 25px 50px -12px rgba(0,0,0,.3);
  -webkit-user-select:none; user-select:none;
}
.ny-lb button{
  position:absolute; z-index:1;
  display:flex; align-items:center; justify-content:center;
  background:transparent; border:none; padding:0; cursor:pointer;
  color:rgba(255,255,255,.7); transition:color .2s var(--ease);
  -webkit-tap-highlight-color:transparent;
}
.ny-lb button:hover{ color:#fff; }
.ny-lb-close{ top:10px; right:10px; width:48px; height:48px; }
.ny-lb-close svg{ width:28px; height:28px; }
.ny-lb-prev,
.ny-lb-next{ top:50%; transform:translateY(-50%); width:52px; height:52px; }
.ny-lb-prev{ left:4px; }
.ny-lb-next{ right:4px; }
.ny-lb-prev svg,
.ny-lb-next svg{ width:32px; height:32px; }
@media (min-width:768px){
  .ny-lb-close{ top:24px; right:24px; }
  .ny-lb-prev{ left:24px; }
  .ny-lb-next{ right:24px; }
}
/* Фон страницы не должен прокручиваться под открытым лайтбоксом */
body.ny-lb-open{ overflow:hidden; }

/* ---------- 2. Блок «Формула цены» (#pricing) ---------- */
.price-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:24px;
}
.price-item h3{ font-size:19px; font-weight:400; }
.price-note{
  margin-top:6px; font-size:12.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--ink-50);
}
.price-value{
  margin-top:16px; padding:22px 24px;
  border:1px solid rgba(45,43,44,.18); border-radius:var(--radius);
  background:var(--white);
  font-family:var(--font-display); font-size:26px; font-weight:300;
}
.price-panel{
  margin-top:34px; padding:30px 32px;
  border:1px solid rgba(45,43,44,.14); border-radius:var(--radius);
  background:var(--white);
  display:grid; grid-template-columns:1fr auto; gap:32px; align-items:center;
}
.price-panel h3{ font-size:18px; font-weight:400; }
.price-factors{ margin-top:18px; display:grid; gap:12px; }
.price-factors li{
  position:relative; padding-left:22px;
  font-size:15px; line-height:1.55; color:var(--ink-70);
}
.price-factors li::before{
  content:"—"; position:absolute; left:0; color:var(--taupe-dark);
}
.price-panel-cta{
  display:flex; flex-direction:column; align-items:center; gap:12px;
}
.price-panel-cta .btn{ white-space:normal; text-align:center; max-width:260px; }
.price-contact{
  font-size:14px; color:var(--ink-70);
  text-decoration:underline; text-underline-offset:3px;
}
.price-contact:hover{ color:var(--ink); }
@media (max-width:899px){
  .price-grid{ grid-template-columns:1fr; gap:22px; }
  .price-panel{ grid-template-columns:1fr; gap:24px; padding:26px 22px; }
  .price-panel-cta{ align-items:stretch; }
  .price-panel-cta .btn{ max-width:none; }
}

/* ---------- 2b. FAQ (#faq) ---------- */
.faq-list{ max-width:820px; }
.faq-item{ border-bottom:1px solid rgba(45,43,44,.14); }
.faq-item summary{
  list-style:none; display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:20px 4px; font-size:16px; font-weight:600; cursor:pointer;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary .plus{ flex-shrink:0; width:22px; height:22px; position:relative; }
.faq-item summary .plus::before,.faq-item summary .plus::after{
  content:""; position:absolute; background:var(--ink); transition:transform .25s var(--ease);
}
.faq-item summary .plus::before{ width:100%; height:1px; top:50%; left:0; }
.faq-item summary .plus::after{ width:1px; height:100%; left:50%; top:0; }
.faq-item[open] summary .plus::after{ transform:scaleY(0); }
.faq-item .faq-a{ padding:0 4px 20px; font-size:15px; line-height:1.65; color:var(--ink-70); max-width:680px; }
.faq-a .flag{ display:inline-block; margin-top:8px; font-size:12px; color:var(--taupe-dark); }

/* ---------- 3. Cookie-баннер ---------- */
/* Структура намеренно повторяет остальные страницы сайта
   (#cookie-banner > обёртка > карточка), чтобы к ней применились общие
   доработки из functions.php: крестик, зона нажатия 48px, отступ под
   home-индикатор и сокращённый текст на мобильных. */
#cookie-banner{
  position:fixed; left:0; right:0; bottom:0; z-index:10050;
}
.ny-cookie-wrap{
  max-width:var(--container); margin:0 auto; padding:14px var(--gutter);
}
.ny-cookie-card{
  background:var(--cream); border:1px solid var(--ink); border-radius:12px;
  box-shadow:0 18px 40px rgba(45,43,44,.18);
  padding:20px 22px;
  display:flex; flex-direction:column; align-items:flex-start; gap:16px;
}
.ny-cookie-text{ font-size:13.5px; line-height:1.6; color:var(--ink); }
.ny-cookie-text a{
  text-decoration:underline; text-underline-offset:2px; font-weight:600;
}
@media (min-width:900px){
  .ny-cookie-card{
    flex-direction:row; align-items:center; gap:28px; padding:20px 26px;
  }
  .ny-cookie-text{ flex:1; }
}
/* Пока баннер висит, нижняя липкая панель не спорит с ним за низ экрана.
   Класс на body ставит общий скрипт сайта из functions.php. */
body.story-cookie-open .sticky-cta{ display:none !important; }

/* ---------- 4. Лента фото «Пространство»: перетаскивание мышью (20.10.2026) ----------
   В прототипе ленту можно листать только свайпом/тачпадом. Только для мыши
   (hover + точный указатель) — на телефонах и планшетах ничего не меняется. */
.ny-gtrack{ position:relative; }
.ny-gtrack .gallery-track{ cursor:grab; }
.ny-gtrack .gallery-track.is-dragging{ cursor:grabbing; scroll-snap-type:none; user-select:none; }
.ny-gtrack .gallery-track.is-dragging a{ pointer-events:none; }

/* ---------- 5. Отступы между блоками — как на /conference/ (20.10.2026) ----------
   В прототипе блоки-«сцены» сжаты под высоту окна (30–56px); на сайте ритм
   страницы конференций: 96px на компьютере, 60px на телефоне. */
.sc{ --sc-pad:96px; }
.sc--final{ padding:var(--sc-pad) 0; }
@media (max-width:760px){
  .sc{ --sc-pad:60px; }
}

/* ---------- 6. Подвал — как на главной (front-page.php, 20.10.2026) ----------
   Там он на Tailwind, которого на этом шаблоне нет, — те же размеры и цвета обычным CSS. */
.ny-sfooter{ background:#2D2B2C; color:#fff; font-size:14px; line-height:20px; }
.ny-sfooter__in{ max-width:1280px; margin:0 auto; padding:64px 24px; }
.ny-sfooter__grid{ display:grid; grid-template-columns:1fr; gap:48px; }
.ny-sfooter__logo{ display:block; height:96px; width:auto; margin-bottom:24px; }
.ny-sfooter__tag{ margin:0; color:rgba(255,255,255,.5); line-height:1.625; }
.ny-sfooter__h{ margin:0 0 24px; font-size:12px; line-height:16px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.4); }
.ny-sfooter__nav{ list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.ny-sfooter a{ color:rgba(255,255,255,.6); text-decoration:none; transition:color .15s; }
.ny-sfooter a:hover{ color:#fff; }
.ny-sfooter__contacts{ display:grid; gap:16px; }
.ny-sfooter__contacts a,
.ny-sfooter__addr{ display:flex; align-items:center; gap:12px; }
.ny-sfooter__addr{ align-items:flex-start; color:#fff; }
.ny-sfooter__contacts svg{ width:16px; height:16px; flex-shrink:0; color:#fff; }
.ny-sfooter__addr svg{ margin-top:2px; }
.ny-sfooter__bot{ margin-top:56px; padding-top:32px; border-top:1px solid rgba(255,255,255,.1); display:flex; flex-direction:column; gap:16px; }
.ny-sfooter__bot span{ color:rgba(255,255,255,.3); }
.ny-sfooter__cta{ align-self:flex-start; padding:0; background:none; border:0; font:inherit; color:#A0958C; cursor:pointer; transition:color .15s; }
.ny-sfooter__cta:hover{ color:#fff; }
@media (min-width:640px){
  .ny-sfooter__bot{ flex-direction:row; align-items:center; justify-content:space-between; }
  .ny-sfooter__cta{ align-self:auto; }
}
@media (min-width:768px){
  .ny-sfooter__grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .ny-sfooter__logo{ height:112px; }
}
@media (min-width:1024px){
  .ny-sfooter__in{ padding:80px 56px; }
  .ny-sfooter__grid{ gap:64px; }
}
/* на телефоне внизу висит панель «Позвонить / Записаться» — подвал не прячется под ней */
@media (max-width:899px){
  .ny-sfooter__in{ padding-bottom:calc(64px + 76px + env(safe-area-inset-bottom,0px)); }
}

/* ---------- 7. Боковые виджеты «Связаться» и «Наверх» (как на главной) ----------
   На телефоне поднимаем их над нижней панелью .sticky-cta. */
@media (max-width:899px){
  body #contact-widget{ bottom:calc(84px + env(safe-area-inset-bottom,0px)) !important; }
  body #scroll-top-widget{ bottom:calc(158px + env(safe-area-inset-bottom,0px)) !important; }
}

/* ---------- 8. Стык первого экрана и «Форматов» — как на /conference/ (20.10.2026) ----------
   Блок «Форматы» наезжает «листом» на первый экран (−72px, на невысоких
   экранах −40px, на телефоне −30px) и съедал отступ под кнопкой. Отступ под
   кнопкой = видимые 64px (48px на телефоне) + величина наезда. Верхний отступ
   «Форматов» — 56px, как у первого блока после hero на конференции (40px на телефоне). */
.hero-content{ padding-bottom:calc(64px + 72px); }
.sc--sheet{ padding-top:56px; }
@media (max-height:820px) and (min-width:900px){
  .hero-content{ padding-bottom:calc(56px + 40px); }
}
@media (max-width:899px){
  .hero-content{ padding-bottom:calc(48px + 30px); }
  .sc--sheet{ padding-top:40px; }
}

/* ---------- 9. Единые отступы блоков — как у «Форматов» (20.10.2026) ----------
   По просьбе: у всех блоков сверху 56px, снизу 96px (на телефоне 40 / 60). */
.sc, .sc--final{ padding:56px 0 96px; }
@media (max-width:760px){
  .sc, .sc--final{ padding:40px 0 60px; }
}

/* ---------- 10. Нижний отступ блоков = верхнему (20.10.2026) ----------
   56px сверху и снизу, на телефоне 40 / 40. */
.sc, .sc--final{ padding-bottom:56px; }
@media (max-width:760px){
  .sc, .sc--final{ padding-bottom:40px; }
}