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

   Макет goldline-wrap пришёл со своей шапкой и подвалом, контейнером 1120 px, Jost и Caveat,
   четырьмя карточками «видов обёртываний» и блоком подарочных сертификатов. Приведён к сайту
   так же, как соседние страницы: сайтовый контейнер, оливковое действие, тёплые панели,
   точки — 1100 / 850 / 600.
   ===================================================================== */

/* ---- Первый экран: кадр съёмки клиники 2400×1340 во всю ширину, текст на светлой растяжке слева ----
   С 16.09.2026 клиника прислала съёмку обёртывания, кадры уже 16:9 — раскладка стала такой же,
   как на главной и соседних страницах услуг. До этого фото стояло карточкой справа: единственный
   материал по процедуре был шириной 1043 px, и растягивать его было нельзя.
   В кадре слева тумба и столик, мастер и процедура — 45–85 % ширины. */
.glw-hero {--gll-copy:540px;--gll-fade:330px}
.glw-hero .gll-hero__photo {object-position:64% 50%}
.glw-hero__phone {white-space:nowrap}
.glw-hero__phone .icon {width:18px;height:18px}
@media(min-width:1600px){.glw-hero{--gll-fade:430px}}
@media(max-width:1320px){.glw-hero{--gll-copy:470px;--gll-fade:250px}}
@media(max-width:1100px){.glw-hero .gll-hero__photo{object-position:58% 50%}}
@media(max-width:600px){.glw-hero .gll-hero__photo{object-position:60% 50%}}

/* ---- Как устроено: кабинет и список «ключ — значение» ---- */
.glw-how {display:grid;grid-template-columns:minmax(0,460px) minmax(0,1fr);gap:48px;align-items:center}
.glw-how__photo {margin:0}
.glw-how__photo img {display:block;width:100%;height:auto;border-radius:18px}
.glw-how__photo figcaption {margin-top:12px;color:var(--glm-text);font-size:14px;line-height:1.5}
.glw-how__copy .section__lead {margin-top:14px}
.glw-how__list {display:grid;margin:22px 0 0;border-top:1px solid var(--glm-line)}
.glw-how__list>div {padding:14px 0;border-bottom:1px solid var(--glm-line)}
.glw-how__list dt {color:var(--ink);font:350 20px/1.25 var(--display);letter-spacing:-.008em}
.glw-how__list dd {margin:6px 0 0;color:var(--glm-text);font-size:16px;line-height:1.55}
.glw-how__copy>.text-link {margin-top:18px}

/* ---- Программы с обёртыванием ---- */
.glw-prices .glm-note {margin-top:18px}
/* Подсказка выбора: шесть строк отличались только составом (оценщик, 16.09.2026). */
.glw-hint {grid-column:1;color:#6a675f;font-size:14px;line-height:1.4}
/* Что уточнить при записи — вместо полутора десятков «уточните» по всей странице. */
.glw-ask {margin-top:16px;padding:24px 26px;border:1px dashed #d6c7b1;border-radius:18px;background:var(--glm-warm)}
.glw-ask h3 {font:350 23px/1.25 var(--display);letter-spacing:-.008em}
.glw-ask ul {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 32px;margin:14px 0 0;padding:0;list-style:none}
.glw-ask li {position:relative;padding-left:16px;color:var(--glm-text);font-size:15px;line-height:1.5}
.glw-ask li::before {content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;border-radius:50%;background:var(--glm-gold)}
.glw-ask .text-link {margin-top:16px}

/* ---- Что даёт и чего не даёт ---- */
.glw-gives {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:stretch}
.glw-card--no {background:#fbf8f4}
.glw-nolist {display:grid;gap:12px;margin:16px 0 0;padding:0;list-style:none}
.glw-nolist li {position:relative;padding-left:26px;color:var(--glm-text);font-size:16px;line-height:1.5}
.glw-nolist li::before {content:"";position:absolute;left:0;top:.62em;width:14px;height:2px;border-radius:2px;background:#c4a888}

/* ---- Как проходит: тёплая полоса посреди страницы ----
   Своя нижняя отбивка: у секции её нет, и заливка обрезалась ровно по краю карточек (оценщик, 16.09.2026). */
.glw-steps-section {padding-bottom:72px;background:var(--glm-warm)}
.glw-steps-section .visit-step {background:#fff}

/* ---- Кадр под шагами: третий снимок съёмки ---- */
.glw-step-photo {margin:26px 0 0}
/* Кадр идёт полосой: во всю высоту он перебивал карточки шагов над собой. */
.glw-step-photo img {display:block;width:100%;height:auto;max-height:420px;object-fit:cover;object-position:50% 62%;border-radius:18px}
.glw-step-photo figcaption {margin-top:12px;color:var(--glm-text);font-size:14px;line-height:1.5}

/* ---- Противопоказания и процедуры косметологии ---- */
.glw-safety h3 .icon {color:#9a5238}
.glw-safety__list {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 32px;margin:14px 0 0;padding:0;list-style:none}
.glw-safety__list li {position:relative;padding-left:16px;color:var(--ink);font-size:15px;line-height:1.45}
.glw-safety__list li::before {content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;border-radius:50%;background:#b0765d}
.glw-safety .gll-safety__note {margin-top:16px;padding-top:14px;border-top:1px solid #efdcd2}
.glw-devices {display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:22px 40px;align-items:center;margin-top:16px;padding:26px 30px;border-radius:18px;background:var(--glm-warm)}
.glw-devices h3 {font:350 23px/1.25 var(--display);letter-spacing:-.008em}
.glw-devices p {margin-top:10px;color:var(--glm-text);font-size:16px;line-height:1.6}
.glw-devices__note {color:#6a675f;font-size:15px}
.glw-devices__actions {display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}

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

/* ---- Вопросы: в боковой карточке отзывы с площадок ---- */
.glw-help__reviews {margin-top:20px;padding-top:16px;border-top:1px solid #e6d9c7;color:var(--glm-text);font-size:14px;line-height:1.5}
.gll-help .text-link+.text-link {margin-top:8px}
.gll-help .text-link {display:flex;margin-top:10px}

/* ---- Что ещё есть в клинике ---- */
.glw-related {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.glw-related a {display:flex;flex-direction:column;height:100%;padding:24px;border:1px solid var(--glm-line);border-radius:18px;background:#fff;transition:border-color .2s,transform .2s}
.glw-related a:hover {border-color:#cdbfa9;transform:translateY(-2px)}
.glw-related h3 {margin:0;color:var(--ink);font:350 21px/1.25 var(--display);letter-spacing:-.008em}
.glw-related p {margin:8px 0 0;color:var(--glm-text);font-size:15px;line-height:1.5}
.glw-related__more {display:inline-flex;align-items:center;gap:8px;margin-top:auto;padding-top:16px;color:var(--olive-dark);font-size:15px}
.glw-related__more .icon {width:16px;height:16px}

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

/* ===================================================================== */
@media(max-width:1100px){
 .glw-how{grid-template-columns:minmax(0,1fr);gap:28px}
 .glw-how__photo img{max-height:380px;object-fit:cover}
 .glw-gives{grid-template-columns:minmax(0,1fr)}
 .glw-devices{grid-template-columns:minmax(0,1fr);padding:24px}
 .glw-related{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:600px){
 .glw-how__photo img{border-radius:14px;max-height:300px}
 .glw-step-photo img{border-radius:14px}
 .glw-how__list dt{font-size:19px}.glw-how__list dd{font-size:15px}
 .glw-safety__list{grid-template-columns:minmax(0,1fr)}
 .glw-devices{padding:18px 16px;border-radius:14px}.glw-devices h3{font-size:21px}.glw-devices p{font-size:15px}
 .glw-devices__actions .button{width:100%}
 .glw-docs__title{margin-top:28px;font-size:21px}
 .glw .gll-docs{grid-template-columns:minmax(0,1fr)}.glw .gll-doc__image{height:220px}
 .glw-related a{padding:18px 16px;border-radius:14px}.glw-related h3{font-size:19px}
 .glw-ask{padding:18px 16px;border-radius:14px}.glw-ask h3{font-size:21px}.glw-ask ul{grid-template-columns:minmax(0,1fr)}
 .glw-steps-section{padding-bottom:48px}
 /* На телефоне у строки прайса остаётся одна стрелка, и не видно, что вся карточка кликабельна (оценщик, 16.09.2026). */
 .glw-list .glm-price__book-label{position:static;width:auto;height:auto;overflow:visible;clip:auto;color:var(--olive-dark);font-size:13px}
 .glw-list .glm-price__book{flex-direction:column;align-items:flex-end;gap:2px}
}