/* Раскладка страниц сайта. Дополняет tokens.css и components.css дизайн-системы
   (сетки и отступы перенесены из ui_kits/website/index.html). */

[hidden]{display:none!important}
html{scroll-behavior:smooth}
#moods,#lead{scroll-margin-top:var(--header-h)}

/* Ссылка «к содержанию» для клавиатуры */
.site-skip{position:absolute;left:16px;top:-120px;z-index:100;padding:14px 20px;border-radius:var(--radius-control);background:var(--color-cream);color:var(--color-ink);font-weight:var(--fw-medium);text-decoration:none}
.site-skip:focus{top:16px;color:var(--color-ink)}

/* Сетки */
.site-grid{display:grid;gap:var(--grid-gap)}
.site-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.site-sh-text{display:flex;flex-direction:column;gap:16px}

/* Главная: секции */
.site-atmo{padding-bottom:64px}
.site-moods{padding:40px 0 var(--section-y)}
.site-moods__title{margin-bottom:24px}
.site-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.site-empty{margin:0;padding:32px;border:1px solid var(--border-default);border-radius:var(--radius-card);color:var(--text-muted)}
.site-masters-grid{margin-top:96px}
.site-rooms{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:64px;align-items:start}
.site-note{margin:-4px 0 0;font-size:var(--fs-caption);line-height:1.45;color:var(--text-muted)}

/* Внутренние страницы: шапка с h1 и широким фото */
.site-page-head{padding-bottom:64px}
.site-page-head .rai-sh{margin-bottom:48px}
.site-page-head .rai-sh:last-child{margin-bottom:0}
.site-request{padding-top:0}
.site-narrow{max-width:760px}

/* Формы заявок */
.site-form,.rai-lead-sec__right form.site-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 16px;align-items:start}
.site-span{grid-column:1/-1}
.site-form__actions{display:flex;align-items:center;flex-wrap:wrap;gap:16px 24px;margin-top:4px}
.site-form__summary{display:flex;flex-wrap:wrap;gap:8px;margin:0}
.site-form .rai-check{padding:4px 0}
.site-status__action{margin-top:16px}
.rai-upload{position:relative}
.rai-file img{transition:none}

/* Переключатель на radio (визуально — SegmentedControl DS) */
.site-seg__item{flex:1 1 0;display:flex;min-width:0;cursor:pointer}
.site-seg__input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.site-seg .rai-seg__opt{display:flex;align-items:center;justify-content:center;text-align:center;padding:0 12px}
.site-seg__input:checked+.rai-seg__opt{background:var(--action-fill);color:var(--action-text)}
.site-seg__input:focus-visible+.rai-seg__opt{outline:2px solid var(--focus-ring);outline-offset:1px}
.rai-field--error .rai-seg{border-color:var(--color-error)}

/* «Ещё параметры» — необязательные поля формы визита */
.site-more{border-top:1px solid var(--border-default);border-bottom:1px solid var(--border-default)}
.site-more__toggle{display:flex;align-items:center;gap:8px;min-height:56px;cursor:pointer;list-style:none;font-size:var(--fs-ui);font-weight:var(--fw-medium);color:var(--text-body);transition:color var(--dur) var(--ease-out)}
.site-more__toggle::-webkit-details-marker{display:none}
@media (hover:hover){.site-more__toggle:hover{color:var(--color-amber)}}
.site-more__toggle .rai-label__opt{font-size:var(--fs-small)}
.site-more__chevron{margin-left:auto;transition:transform var(--dur) var(--ease-out)}
.site-more[open] .site-more__chevron{transform:rotate(180deg)}
.site-more__body{padding:4px 0 24px}

/* Окно записи на визит (native <dialog>: фокус внутри окна, Esc закрывает) */
.site-modal{width:min(720px,calc(100% - 32px));max-width:none;max-height:calc(100dvh - 48px);padding:0;border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-surface-1);color:var(--text-body);box-shadow:var(--shadow-overlay);overflow:hidden}
.site-modal[open]{display:flex;flex-direction:column;animation:site-modal-in var(--dur-slow) var(--ease-out)}
.site-modal::backdrop{background:rgba(15,13,11,.82)}
.site-modal__head{flex:none;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:24px 32px 20px;border-bottom:1px solid var(--color-border)}
.site-modal__titles{display:flex;flex-direction:column;gap:6px}
.site-modal__titles .rai-caption{margin:0}
.site-modal__close{display:inline-flex;flex:none;margin:-4px -8px 0 0}
/* min-height:0 — иначе тело не сжимается до высоты окна и прокручивается весь диалог вместе с заголовком */
.site-modal__body{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;padding:28px 32px 32px}
body.is-modal-open{overflow:hidden}
@keyframes site-modal-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* Ссылки-заголовки карточек и «назад к списку» */
.site-title-link{color:inherit;text-decoration:none}
@media (hover:hover){.site-title-link:hover{color:var(--color-amber)}}
.site-master-photos{text-decoration:none}
.site-back{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin:0 0 32px;color:var(--text-muted);font-size:var(--fs-small);text-decoration:none}
.site-back:hover{color:var(--color-amber)}
.site-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px}

/* Карточка программы кликабельна целиком: ссылка заголовка растянута на всю карточку */
.site-program-card{position:relative}
.site-card-link{color:inherit;text-decoration:none}
.site-card-link::after{content:"";position:absolute;inset:0;z-index:1;border-radius:var(--radius-card)}
.site-card-link:focus-visible{outline:none}
.site-program-card:has(.site-card-link:focus-visible){outline:2px solid var(--focus-ring);outline-offset:3px}
.site-program-card:hover .site-card-btn{border-color:var(--text-body);background:rgba(243,233,218,.06)}
.site-card-btn{pointer-events:none}
.rai-program__foot .site-note{margin:-8px 0 0}

/* Выбор длительности на странице программы: в каждом варианте — длительность и точная цена */
.site-seg--tall .rai-seg__opt{flex-direction:column;gap:2px;min-height:68px;padding:8px 12px;line-height:1.25}
.site-seg__price{font-size:var(--fs-ui);font-weight:var(--fw-semibold)}
.site-duration{min-width:0}

/* Чип-ссылка (фильтр каталога без JS) выглядит как выбранный Chip DS */
a.rai-chip{text-decoration:none}
.rai-chip[aria-current="true"]{background:var(--action-fill);border-color:var(--action-fill);color:var(--action-text)}
.rai-chip[aria-current="true"] .rai-icon{display:block}

/* Каталог программ */
.site-catalog{padding-top:0}
.site-filters{display:flex;flex-direction:column;gap:12px;margin-bottom:40px}
.site-filters .site-chips{margin-bottom:0;align-items:center}
.site-filters__extra{margin-left:12px}
.site-mood-note{margin:12px 0 0;color:var(--text-muted)}
.site-empty-card{height:auto;gap:12px}
.site-empty-card .rai-body{margin:0}

/* Страницы программы, мастера, комнаты */
.site-detail{padding-top:40px}
.site-detail__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:64px;align-items:start}
.site-detail__body{display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.site-detail__body>p{margin:0}
.site-detail__body--sticky{position:sticky;top:calc(var(--header-h) + 32px)}
.site-detail__block{display:flex;flex-direction:column;gap:12px;width:100%;padding-top:20px;border-top:1px solid var(--border-default)}
.site-list{margin:0;padding:0 0 0 22px;display:flex;flex-direction:column;gap:6px}
.site-facts{display:flex;flex-wrap:wrap;gap:12px 40px;width:100%;margin:0;padding-top:20px;border-top:1px solid var(--border-default)}
.site-facts dd{margin:0}
.site-master-gallery{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.site-masters-list,.site-masters-grid{row-gap:56px}
.site-room-card{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.site-room-card__media{display:block;width:100%}
.site-room-card .rai-room__name{margin:6px 0 0}
.site-room-card .rai-room__desc{margin:0}
.site-room-card__action{margin-top:auto;padding-top:10px}
.site-rooms-list{row-gap:48px}
.site-rooms-note{margin:40px 0 0}
.site-room-head{margin-bottom:48px}
.site-room-head .rai-sh__right{padding-top:44px}
.site-room-head .rai-sh__right p{margin:0}
.site-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--grid-gap)}
.site-gallery.site-gallery--single{grid-template-columns:1fr}

/* Контакты */
.site-contacts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding-bottom:48px;border-bottom:1px solid var(--border-default)}
.site-contacts__item{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.site-contacts__text{display:flex;flex-direction:column;gap:16px;max-width:64ch;padding-top:40px}
.site-contacts__text p{margin:0}

/* Юридические документы */
.site-doc__head{display:flex;flex-direction:column;align-items:flex-start;gap:16px;max-width:900px}
.site-doc__head p{margin:0}
.site-doc{max-width:760px;font-size:var(--fs-body);line-height:1.65;color:var(--text-body)}
.site-doc h2{margin:40px 0 12px;font-size:var(--fs-h4);font-weight:var(--fw-medium);line-height:1.3}
.site-doc h2:first-child{margin-top:0}
.site-doc h3{margin:24px 0 8px;font-size:var(--fs-ui);font-weight:var(--fw-medium)}
.site-doc p{margin:0 0 12px}
.site-doc ul{margin:0 0 12px;padding-left:22px;display:flex;flex-direction:column;gap:6px}
.site-doc code{font-size:.92em;padding:1px 6px;border-radius:3px;background:var(--color-surface-2)}
.site-doc__todo{padding:0 4px;border-radius:3px;background:var(--color-wine);color:var(--color-wine-text)}

/* Подвал: реквизиты и документы */
.site-footer-legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 32px;padding:0 0 32px;font-size:var(--fs-caption);line-height:1.5;color:var(--color-text-2)}
.site-footer-legal__text{display:flex;flex-direction:column;gap:4px}
.site-footer-legal__links{display:flex;flex-wrap:wrap;gap:8px 24px;align-items:center}
.site-footer-legal a,.site-footer-legal button{color:var(--color-text-2);text-decoration:none;min-height:32px;display:inline-flex;align-items:center}
.site-footer-legal button{padding:0;border:0;background:none;font:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.site-footer-legal a:hover,.site-footer-legal button:hover{color:var(--color-text)}
.site-contacts__legal{display:flex;flex-direction:column;gap:6px;max-width:64ch;padding-top:32px;margin-top:32px;border-top:1px solid var(--border-default)}
.site-contacts__legal p{margin:0}

/* Окно о cookie: аналитика включается только после «Принять» */
.site-cookie{position:fixed;left:20px;bottom:20px;z-index:60;width:min(560px,calc(100% - 40px));display:flex;flex-direction:column;gap:16px;padding:20px 24px;background:var(--color-surface-2);border:1px solid var(--color-border-strong);border-radius:var(--radius-card);box-shadow:var(--shadow-overlay);color:var(--text-body)}
.site-cookie__text{margin:0;font-size:var(--fs-small);line-height:1.55}
.site-cookie__actions{display:flex;flex-wrap:wrap;gap:10px}
.site-cookie__actions .rai-btn{flex:1 1 160px}

/* Временные страницы разделов */
.site-stub{display:flex;flex-direction:column;align-items:flex-start;gap:24px;min-height:50vh}
.site-stub__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}

/* Чип: галочка только у выбранного (в DS галочка рендерится условно) */
.rai-chip .rai-icon{display:none}
.rai-chip[aria-pressed="true"] .rai-icon{display:block}

/* Чекбокс согласия: галочка видна только когда отмечен */
.rai-check__box .rai-icon{opacity:0;transition:opacity var(--dur-fast) var(--ease-out)}
.rai-check input:checked+.rai-check__box .rai-icon{opacity:1}

/* Ловушка для ботов — невидима для людей и скринридеров */
.site-hp{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}

/* Мобильное меню: иконка «меню» ↔ «закрыть» */
.site-icon-close{display:none}
[data-menu-toggle][aria-expanded="true"] .site-icon-open{display:none}
[data-menu-toggle][aria-expanded="true"] .site-icon-close{display:block}
body.is-menu-open{overflow:hidden}

/* Появление при прокрутке (DS: fade + подъём 8px). Класс ставит site.js — без JS всё видно сразу */
[data-reveal]{transition:opacity var(--dur-slow) var(--ease-out),transform var(--dur-slow) var(--ease-out)}
.reveal-ready [data-reveal]:not(.is-visible){opacity:0;transform:translateY(8px)}

@media (max-width:900px){
  .site-detail__grid{grid-template-columns:1fr;gap:32px}
  .site-detail__body--sticky{position:static}
  .site-detail__media.rai-photo{--ratio:16/10!important}
  .site-room-head .rai-sh__right{padding-top:0}
}
/* Шапка на узких десктопах: с пунктами «Главная» и «Комнаты» меню плотнее, чтобы не вылезать за экран
   (ниже 1181px DS переключает шапку на мобильное меню) */
@media (min-width:1181px) and (max-width:1320px){
  .rai-header__inner{gap:20px}
  .rai-header__right{gap:20px}
  .rai-nav__link{padding:0 10px}
}
/* Поправка к DS: когда правая колонка заголовка секции складывается в столбец,
   flex-basis 260px из components.css превращается в высоту и даёт пустой зазор над ссылкой «Все …» */
@media (max-width:1240px){
  .rai-sh__right--split>div:first-child{flex:0 0 auto}
}
@media (max-width:1100px){
  .site-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .site-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
  .site-rooms{grid-template-columns:1fr;gap:32px}
  .site-rooms>.rai-photo{--ratio:16/10!important}
}
@media (max-width:760px){
  .site-grid--3{grid-template-columns:1fr}
  /* В ките DS чипы на телефоне прокручиваются вбок; здесь переносим строки — так все варианты видны сразу */
  .site-chips{gap:8px 6px}
  .site-masters-grid{margin-top:56px}
  .site-masters-list,.site-masters-grid,.site-rooms-list{row-gap:40px}
  .site-stub__actions .rai-btn{width:100%}
  .site-page-head{padding-bottom:40px}
  .site-page-head .rai-sh{margin-bottom:32px}
  .site-page-head .rai-photo{--ratio:4/3!important}
  .site-form,.rai-lead-sec__right form.site-form{grid-template-columns:1fr}
  .site-gallery{grid-template-columns:1fr}
  .site-contacts{grid-template-columns:1fr;gap:28px}
  .site-actions .rai-btn{width:100%}
  .site-filters__extra{margin-left:4px}
  .site-detail{padding-top:24px}
  .site-cookie{left:12px;right:12px;bottom:12px;width:auto;padding:16px}
  .site-form__actions .rai-btn{width:100%}
  /* На телефоне окно — на весь экран, без «окна в окне» */
  .site-modal{width:100%;height:100dvh;max-height:100dvh;margin:0;border:0;border-radius:0}
  .site-modal__head{padding:14px 20px 14px}
  .site-modal__titles .rai-h3{font-size:var(--fs-h4)}
  .site-modal__body{padding:20px 20px 32px}
}
