/* Сгенерировано build_green.py. Правки — в build_green.py, не здесь. */

/* Цвета плагина Momence заданы инлайном на самой странице расписания
   (MOMENCE_COLORS в build_green.py): из внешнего файла они могут не успеть. */
/* Плагин рисует своё содержимое рядом с #ribbon-schedule, а не внутри него,
   поэтому место под расписание держим на секции: без этого страница прыгает.
   Якорь «записаться» — на той же секции, с отступом от верха экрана. */
#book{min-height:600px;scroll-margin-top:24px}
/* У плагина жёсткий min-width:320px. На узком экране поля секции его не
   вмещают, и страница уезжает вбок, поэтому на телефоне поля срезаем:
   до 400px расписание идёт от края до края, у самого плагина поля свои. */
@media (max-width:560px){
  #book>div{padding-left:16px!important;padding-right:16px!important}
}
@media (max-width:400px){
  #book>div{padding-left:0!important;padding-right:0!important}
}

/* Вид расписания. Плагин рисует занятия белыми карточками с рамкой и радиусом:
   на кремовом фоне сайта они читаются как разбросанные блоки, а цена висит
   в углу отдельно от кнопки. У Frame, 305 Fitness, The Ness и SaltDrop
   расписание — один список: строки разделены волосяной линией, фото прижато
   к тексту, кнопка справа. Приводим к тому же виду.
   Имена классов momence-* плагин ставит специально под свои же стили; если он
   их переименует, вид просто вернётся к исходному, ничего не сломается. */
#momence-plugin-host-schedule .momence-host-schedule-layout{max-width:100%!important;width:100%!important}

#momence-plugin-host-schedule .momence-host_schedule-session_list-item{
  background:transparent!important;border:0!important;border-radius:0!important;
  border-bottom:1px solid rgba(27,35,30,.13)!important}
/* Описание плагин обрезает фиксированной высотой 32px под свой шрифт 12px.
   На нашем кегле две строки в неё не влезают и режутся посередине букв:
   высоту отпускаем, обрезку оставляем на max-height в правилах ниже. */
#momence-plugin-host-schedule .momence-host_schedule-session_list-item-description{
  line-height:1.5!important;height:auto!important;max-height:36px!important}

@media (min-width:701px){
  #momence-plugin-host-schedule .momence-host_schedule-session_list-item{padding:20px 2px!important}
  /* строка: фото — текст — кнопка, все три колонки одной высоты */
  #momence-plugin-host-schedule .momence-host_schedule-session_list-item>div{
    gap:24px!important;align-items:stretch!important}
  /* фото было 150x150 в блоке высотой 242 и висело в пустоте: тянем по высоте строки */
  #momence-plugin-host-schedule .momence-host_schedule-session_list-image_container{
    width:164px!important;flex:0 0 164px!important}
  #momence-plugin-host-schedule .momence-host_schedule-session_list-item-image{
    width:100%!important;height:100%!important;min-height:118px!important;
    object-fit:cover!important;border-radius:12px!important}

  #momence-plugin-host-schedule .momence-host_schedule-session_list-second-section{gap:7px!important}
  #momence-plugin-host-schedule .momence-host_schedule-session_list-section-header{gap:12px!important}
  #momence-plugin-host-schedule .momence-host_schedule-session_list-item-title{
    font-size:26px!important;line-height:1.14!important;letter-spacing:-.02em!important}
  #momence-plugin-host-schedule .momence-host_schedule-session_list-item-type{
    font-size:10.5px!important;letter-spacing:.16em!important;opacity:.55!important}
  #momence-plugin-host-schedule .momence-host_schedule-session_list-item-description,
  #momence-plugin-host-schedule .momence-host_schedule-session_list-expand-button{font-size:15px!important}
  #momence-plugin-host-schedule .momence-host_schedule-session_list-item-description{max-height:45px!important}
  /* дата, время и зал — строки, по которым выбирают занятие */
  #momence-plugin-host-schedule .momence-host_schedule-session_list-item-info{font-size:15.5px!important}
  #momence-plugin-host-schedule .momence-host_schedule-session_list-item-info-icon{
    width:18px!important;height:18px!important}
  /* эти три строки стоят с общим отступом 12px и рассыпаются по высоте —
     сдвигаем их друг к другу, чтобы читались как одна подпись */
  #momence-plugin-host-schedule .momence-session-duration,
  #momence-plugin-host-schedule .momence-session-in_person{margin-top:-4px!important}

  /* правая колонка: кнопка по центру строки. Цена разового занятия из плагина
     убрана — разовые занятия не продаются, цифра была бы неправдой. */
  #momence-plugin-host-schedule .momence-host_schedule-session-list-item-wrapper{
    display:flex!important;flex-direction:column!important;justify-content:center!important;
    align-items:stretch!important;gap:0!important;width:172px!important;min-width:172px!important}
  #momence-plugin-host-schedule .momence-host_schedule-session_list-item-price{display:none!important}
  #momence-plugin-host-schedule .momence-host_schedule-session-list-item-wrapper a{
    font-size:14px!important;padding:14px 24px!important;width:100%!important;white-space:nowrap!important}

  /* заголовок дня над группой занятий */
  #momence-plugin-host-schedule .momence-host_schedule-session_list-date_label{
    font-size:12px!important;letter-spacing:.14em!important;opacity:.62!important}

  /* полоса дней: цифры крупнее. Высота ячейки в макете плагина рассчитана
     под 14px, поэтому день недели налезает на число — снимаем фиксированную
     высоту и разводим строки отступом. */
  #momence-plugin-host-schedule .momence-day_selection-item{
    height:auto!important;min-height:0!important;padding:8px 0 10px!important;
    display:flex!important;flex-direction:column!important;align-items:center!important;gap:4px!important}
  #momence-plugin-host-schedule .momence-day_selection-item_highlight{
    font-size:22px!important;line-height:1.1!important;height:auto!important}
  #momence-plugin-host-schedule .momence-day_selection-item_day{
    font-size:12px!important;letter-spacing:.1em!important;line-height:1.1!important}
  #momence-plugin-host-schedule .momence-select-button,
  #momence-plugin-host-schedule .momence-quick_filters-all,
  #momence-plugin-host-schedule .momence-quick_filters-today,
  #momence-plugin-host-schedule .momence-view-toggle-list,
  #momence-plugin-host-schedule .momence-view-toggle-calendar{font-size:14px!important}
}

@media (max-width:700px){
  #momence-plugin-host-schedule .momence-host_schedule-session_list-item{padding:18px 0!important}
  #momence-plugin-host-schedule .momence-host_schedule-session_list-item-price{display:none!important}
}

/* Выпадающий список классов в шапке главной: в макете им управлял DCLogic. */
.fbb-drop{position:relative}
.fbb-drop:hover .fbb-drop-menu,.fbb-drop:focus-within .fbb-drop-menu{display:block!important}
/* Меню отбито от пункта на 14px. Прозрачный мостик закрывает этот зазор,
   иначе по пути к пунктам курсор выходит из .fbb-drop и меню схлопывается.
   Мостик на самом пункте, а не на меню: у меню overflow:hidden, оно бы его обрезало. */
.fbb-drop::after{content:"";position:absolute;left:-16px;top:100%;width:212px;height:18px}

/* Шапка на телефоне (правка Михаила 20.08.2026).
   На главной её нет совсем: сразу бегущая строка и фотография.
   На остальных страницах — компактная строка без кнопки брони;
   в макете шапка в один ряд с white-space:nowrap и на 390px уезжает за экран. */
@media (max-width:900px){
  body.home header{display:none}
  header>div{flex-wrap:wrap!important;justify-content:center!important;
             gap:8px 16px!important;padding:10px 16px!important;min-height:0!important}
  header>div>a:last-of-type{display:none!important}
  header>div>a:first-of-type{font-size:20px!important}
  header nav{gap:14px!important;row-gap:6px!important;justify-content:center!important}
  header nav a{font-size:11px!important;letter-spacing:.1em!important}
}

/* Первый экран главной на телефоне (правка Михаила 20.08.2026).
   В макете 90vh: снизу выглядывал кусок следующего блока. Теперь фотография
   занимает экран целиком за вычетом бегущей строки (её высота 39px).
   svh — высота экрана с показанными панелями браузера, чтобы на телефоне
   ничего не выглядывало из-под адресной строки. */
@media (max-width:900px){
  body.home #top{min-height:calc(100vh - 40px)!important}
  body.home #top{min-height:calc(100svh - 40px)!important}
  /* кадр смещён вправо: лицо и улыбка у правого края фотографии */
  body.home #top>img{object-position:78% center!important}
  body.home #top>div:last-of-type{padding:100px 20px 52px!important}
  body.home #top h1{font-size:min(15.4vw,72px)!important;margin:0 0 20px!important}
  body.home #top>div:last-of-type p{font-size:19px!important;line-height:1.34!important;
                                    margin:0 0 30px!important;max-width:15ch}
}

/* Блок «почему это работает» на телефоне.
   Сетка складывается в одну колонку, и в макете пары шли вразнобой:
   то фотография сверху, то карточка. Плюс они соприкасались без отступа.
   Единый ритм: текст, под ним своя фотография, между парами воздух. */
@media (max-width:900px){
  .fbb-pillar{gap:14px!important;margin-top:0!important}
  .fbb-pillar+.fbb-pillar{margin-top:52px!important}
  .fbb-pillar-text{order:1!important;margin:0!important}
  .fbb-pillar-photo{order:2!important;height:clamp(230px,64vw,300px)!important}
}

/* Карточки классов на главной: на телефоне кнопка уезжала вправо и висела
   в стороне от названия. Ставим её слева под строкой с минутами. */
@media (max-width:900px){
  .fbb-card>div:last-child{padding:34px 24px 34px!important}
  .fbb-card .cta-pill{align-self:flex-start!important;margin-top:18px!important}
}

/* Блок на две колонки (подписка в подвале и такой же на главной):
   на узком экране колонка остаётся одна, span 2 уводил блок за экран. */
@media (max-width:560px){
  .fbb-span2{grid-column:auto!important}
}

/* Полоса цифр на странице класса: четыре значения в столбик занимали
   пол-экрана. На телефоне — две колонки. */
@media (max-width:640px){
  .fbb-stats{grid-template-columns:1fr 1fr!important}
  .fbb-stats>div{padding:22px 16px!important;border-left:0!important}
  .fbb-stats>div:nth-child(2n){border-left:1px solid var(--line)!important}
  .fbb-stats>div:nth-child(n+3){border-top:1px solid var(--line)!important}
  .fbb-stats>div>div:first-child{font-size:30px!important}
}

@keyframes fbb-marquee{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

.fh1:hover{color:var(--pink-deep)!important}
.fh2:hover{background:var(--pink-soft)!important;color:var(--pink-deep)!important}
.fh3:hover{background:#1B231E!important;border-color:#1B231E!important;color:#F4EFEC!important;transform:translateY(-1px)!important}
.fh4:active{transform:scale(.96)!important}
.fh5:hover{background:var(--green-deep)!important;border-color:var(--pink)!important;color:var(--pink)!important;transform:translateY(-2px)!important}
.fh6:hover{background:#1B231E!important;border-color:#1B231E!important;color:#F4EFEC!important;transform:translateY(-2px)!important}
.fh7:hover{color:var(--pink-deep)!important;border-color:var(--pink-deep)!important}
.fh8:hover{color:#F9F6FA!important}
.fh9:hover{background:var(--ink)!important;border-color:var(--ink)!important;color:#F9F6FA!important}
.fh10:hover{opacity:.88!important;color:var(--band-btn-ink)!important;transform:translateY(-2px)!important}
.fh11:hover{transform:scale(1.05)!important}
.fh12:hover{background:#F4EFEC!important;border-color:#F4EFEC!important;color:var(--green-deep)!important;transform:translateY(-2px)!important}
.fh13:hover{background:var(--green-deep)!important;border-color:var(--green-deep)!important;color:var(--pink)!important;transform:translateY(-2px)!important}
.fh14:hover{background:var(--pink-mid)!important;border-color:var(--pink-mid)!important;color:var(--ink)!important;transform:translateY(-2px)!important}
.fh15:hover{background:rgba(244,239,236,.14)!important}
.fh16:hover{color:#F4EFEC!important}
.fh17:hover{background:rgba(244,239,236,.14)!important;color:#F4EFEC!important}
.fh18:hover{background:var(--green-deep)!important;color:#F4EFEC!important;transform:translateY(-2px)!important}
.fh19:hover{background:#1B231E!important;border-color:#BEA9CA!important;color:#BEA9CA!important;transform:translateY(-1px)!important}
.fh20:hover{background:var(--green-darkest)!important;border-color:var(--pink)!important;color:var(--pink)!important;transform:translateY(-2px)!important}
.fh21:hover{opacity:.9!important;color:var(--pink)!important;transform:translateY(-2px)!important}
.fh22:hover{background:var(--green-darkest)!important;border-color:var(--green-darkest)!important;color:var(--pink)!important;transform:translateY(-2px)!important}
.fh23:hover{background:var(--pink-mid)!important;border-color:var(--pink-mid)!important;color:var(--green-darkest)!important;transform:translateY(-2px)!important}
.fh24:hover{background:#D6CADD!important;border-color:#D6CADD!important;color:#2A211E!important;transform:translateY(-2px)!important}
.fh25:hover{background:var(--green-darkest)!important;color:#F4EFEC!important;transform:translateY(-2px)!important}
.fh26:hover{background:var(--green-deep)!important;border-color:var(--green-deep)!important;color:var(--pink)!important;transform:translateY(-1px)!important}
.fh27:hover{background:rgba(251,246,245,.2)!important;color:#F9F6FA!important;transform:translateY(-2px)!important}
.fh28:hover{background:var(--pink-soft)!important;border-color:var(--pink)!important;color:var(--ink)!important}
.fh29:hover{background:#F9F6FA!important;border-color:#F9F6FA!important;color:var(--ink)!important;transform:translateY(-2px)!important}