/* =====================================================================
   Страница «Массаж спины» — шаблон page-spiny.php.
   Подключается только на ней, после massage.css и lymph.css (inc/back.php):
   первый экран, цены, шаги, мастера, документы, отзывы, вопросы и запись — компоненты
   «Массажа» (glm-*) и «Лимфодренажа» (gll-*). Здесь — свои блоки (glb-) и подстройка первого экрана.

   Макет goldline-back пришёл со своей шапкой и подвалом, контейнером 1120 px, переключателем
   «По прайсу / Первый визит −15%» и тремя плашками скидки. Приведён к сайту так же, как соседние
   страницы массажа: сайтовый контейнер, Jost, оливковое действие, тёплые панели, точки — 1100 / 850 / 600.
   ===================================================================== */

/* ---- Первый экран: приближённый кадр 2052×1155 (отражён) — слева проекция под растяжку,
   мастер около 55–85 % ширины, спина гостя по низу кадра. Кадр прижат вправо: при обрезке
   уходит проекция, а не люди. ---- */
.glb-hero {--gll-copy:540px;--gll-fade:330px}
.glb-hero .gll-hero__photo {object-position:78% 45%}
.glb-hero__phone {white-space:nowrap}
.glb-hero__phone .icon {width:18px;height:18px}
@media(min-width:1600px){.glb-hero{--gll-fade:430px}}
@media(max-width:1320px){.glb-hero{--gll-copy:470px;--gll-fade:250px}}
@media(max-width:1100px){.glb-hero .gll-hero__photo{object-position:66% 48%}}
@media(max-width:600px){.glb-hero .gll-hero__photo{object-position:70% 48%}}

/* ---- Что входит в час: кадр кабинета и список зон ----
   Вместо схемы спины с поминутной раскладкой из макета: минут по зонам клиника не подтверждала. */
.glb-zones {display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:48px;align-items:center}
.glb-zones__photo {margin:0;overflow:hidden;border-radius:18px;background:var(--glm-warm)}
.glb-zones__photo img {display:block;width:100%;height:100%;max-height:520px;object-fit:cover;object-position:50% 45%}
.glb-zones__copy .section__lead {margin-top:14px}
.glb-zones__list {display:grid;margin:22px 0 0;padding:0;list-style:none;border-top:1px solid var(--glm-line)}
.glb-zones__list li {padding:14px 0;border-bottom:1px solid var(--glm-line)}
.glb-zones__list h3 {margin:0;color:var(--ink);font:350 21px/1.25 var(--display);letter-spacing:-.008em}
.glb-zones__list p {margin:6px 0 0;color:var(--glm-text);font-size:16px;line-height:1.55}
.glb-zones__copy>.text-link {margin-top:18px}

/* ---- Цены: сеанс, классический и две подсказки ---- */
.glb-prices__grid {grid-template-columns:repeat(4,minmax(0,1fr))}
.glb-price__note {margin-top:10px;color:var(--glm-text);font-size:15px;line-height:1.45}
.glb-pair>.icon {width:26px;height:26px;margin-bottom:12px;color:var(--glm-gold)}

/* ---- Кому подходит: один широкий список в две колонки ---- */
.glb-who .checklist {columns:2;column-gap:40px}
.glb-who .checklist li {break-inside:avoid}

/* ---- Когда сначала к врачу: главный блок отстройки, поэтому во всю ширину ---- */
.glb-doctor h3 .icon {color:#9a5238}
.glb-doctor__list {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 32px;margin:14px 0 0;padding:0;list-style:none}
.glb-doctor__list li {position:relative;padding-left:16px;color:var(--ink);font-size:15px;line-height:1.45}
.glb-doctor__list li::before {content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;border-radius:50%;background:#b0765d}
.glb-doctor .gll-safety__note {margin-top:16px;padding-top:14px;border-top:1px solid #efdcd2}

/* ---- Как проходит сеанс: тёплая полоса во всю ширину ----
   Тональная пауза посреди длинной страницы: до неё шло около 6 000 px белого (оценщик, 16.09.2026).
   Карточки шагов и панель «первых суток» внутри остаются белыми — они и дают контраст. */
.glb-process {background:var(--glm-warm)}
.glb-process .visit-step {background:#fff}

/* ---- Первые сутки после: одна панель «ключ — значение» ---- */
.glb-after__title {margin:44px 0 16px;font:350 27px/1.2 var(--display);letter-spacing:-.01em}
.glb-after {margin:0;border:1px solid var(--glm-line);border-radius:18px;background:#fff;overflow:hidden}
.glb-after__row {display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:8px 32px;padding:20px 26px}
.glb-after__row+.glb-after__row {border-top:1px solid var(--glm-line)}
.glb-after dt {display:flex;align-items:center;gap:12px;color:var(--ink);font:350 21px/1.25 var(--display);letter-spacing:-.008em}
.glb-after dd {margin:0;color:var(--glm-text);font-size:16px;line-height:1.6}
.glb-after__mark {display:grid;place-items:center;flex-shrink:0;width:32px;height:32px;border-radius:50%;background:#eef2e8;color:var(--olive-dark)}
.glb-after__row--care .glb-after__mark {background:#f8e8e0;color:#9a5238}
.glb-after__row--info .glb-after__mark {background:var(--glm-warm);color:var(--glm-gold)}
.glb-after__mark .icon {width:17px;height:17px}
.glb-after .inline-link {white-space:nowrap}

/* ---- Документы под мастерами ---- */
.glb-docs__title {margin:36px 0 16px;font:350 24px/1.25 var(--display);letter-spacing:-.008em}
.glb-docs__note {margin-top:14px;color:#6a675f;font-size:13px;line-height:1.5}

/* ---- Массаж и косметология: тёплая панель в одну строку ---- */
.glb-cosm {display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:22px 40px;align-items:center;padding:30px 34px;border-radius:18px;background:var(--glm-warm)}
/* Размер H2 не переопределяем: он был 27 px против 46 px у остальных секций и ломал шкалу
   заголовков (оценщик, 16.09.2026) — наследуем общий стиль темы. */
.glb-cosm p {margin-top:12px;color:var(--glm-text);font-size:16px;line-height:1.6}
.glb-cosm__note {color:#6a675f;font-size:15px}
.glb-cosm__actions {display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}

/* ---- Отзывы: два скриншота и карточка площадок ---- */
.glb-reviews__more {justify-content:flex-start;gap:6px;background:var(--glm-warm);border-color:#eadcc8}
.glb-reviews__more strong {color:var(--ink);font:350 23px/1.25 var(--display)}
.glb-reviews__more p {margin:6px 0 8px;color:var(--glm-text);font-size:15px;line-height:1.55}
.glb-reviews__more .text-link {align-self:flex-start}

/* ---- Другие виды массажа: перелинковка «дочка → мать → сёстры» ---- */
.glb-related {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.glb-related a {display:flex;flex-direction:column;height:100%;padding:22px;border:1px solid var(--glm-line);border-radius:18px;background:#fff;transition:border-color .2s,transform .2s}
.glb-related a:hover {border-color:#cdbfa9;transform:translateY(-2px)}
.glb-related h3 {margin:0;color:var(--ink);font:350 20px/1.25 var(--display);letter-spacing:-.008em}
.glb-related p {margin:8px 0 0;color:var(--glm-text);font-size:15px;line-height:1.5}
.glb-related__price {margin-top:10px;color:var(--olive-dark);font-size:15px}
.glb-related__more {display:inline-flex;align-items:center;gap:8px;margin-top:auto;padding-top:14px;color:var(--olive-dark);font-size:15px}
.glb-related__more .icon {width:16px;height:16px}

/* ---- Адрес в карточке записи ---- */
.glb-booking__address {display:flex;gap:10px;margin-top:10px;color:var(--glm-text);font-size:15px;line-height:1.5}
.glb-booking__address .icon {flex-shrink:0;width:18px;height:18px;margin-top:2px;color:var(--olive-dark)}

/* ===================================================================== */
@media(max-width:1100px){
 .glb-zones{grid-template-columns:minmax(0,1fr);gap:28px}
 .glb-zones__photo img{max-height:380px}
 .glb-prices__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .glb-after__row{grid-template-columns:minmax(0,200px) minmax(0,1fr);padding:18px 20px}
 .glb-cosm{grid-template-columns:minmax(0,1fr);padding:24px}
 .glb-related{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:850px){
 .glb-prices__grid .gll-course{grid-column:auto}
}
@media(max-width:600px){
 .glb-prices__grid{grid-template-columns:minmax(0,1fr)}
 /* На телефоне карточка цены — строка в три колонки (massage.css), но состав часа скрывать нельзя:
    это единственное объяснение, что входит в сеанс (оценщик, 16.09.2026). Ставим третьей строкой
    в первой колонке, цену и стрелку растягиваем на все три ряда. */
 .glb-price__note{grid-column:1;grid-row:3;margin-top:6px;font-size:13px;line-height:1.4}
 .glb-prices__grid .glm-price__amount,.glb-prices__grid .glm-price__book{grid-row:1 / 4}
 .glb-zones__photo{border-radius:14px}.glb-zones__photo img{max-height:300px}
 .glb-zones__list h3{font-size:19px}.glb-zones__list p{font-size:15px}
 .glb-who .checklist{columns:1}
 .glb-doctor__list{grid-template-columns:minmax(0,1fr)}
 .glb-after__title{margin-top:32px;font-size:23px}
 .glb-after{border-radius:14px}
 .glb-after__row{grid-template-columns:minmax(0,1fr);padding:16px}.glb-after dt{font-size:19px}.glb-after dd{font-size:15px}
 .glb-docs__title{margin-top:28px;font-size:21px}
 .glb .gll-docs{grid-template-columns:minmax(0,1fr)}.glb .gll-doc__image{height:220px}
 .glb-cosm{padding:18px 16px;border-radius:14px}.glb-cosm p{font-size:15px}
 .glb-cosm__actions .button{width:100%}
 .glb-related{grid-template-columns:minmax(0,1fr)}.glb-related a{padding:18px 16px;border-radius:14px}
}