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

   Макет goldline-anticellulite пришёл со своей шапкой и подвалом, Georgia и Arial,
   золотыми кнопками, парными карточками 1120 px. Приведён к сайту так же, как лимфодренаж:
   Jost, оливковое действие, тёплые панели, блоки во всю ширину контейнера,
   точки — сайтовые 1100 / 850 / 600.
   ===================================================================== */

/* ---- Первый экран: кадр 1672×941, слева проекция города, справа мастер у ног гостьи ----
   Ступни — с 43 % ширины кадра, мастер — 66–95 %. Кадр прижат вправо (100 %): при обрезке по бокам
   уходит проекция, а не мастер; остаток проекции ложится под растяжку — после оценщика (15.09.2026)
   яркая полоса города между текстом и кабинетом спорила с H1. Слово «Антицеллюлитный» в H1 64 px
   шире «Лимфодренажного» — текстовая колонка на 20 px шире. */
.gla-hero {--gll-copy:540px;--gll-fade:340px}
.gla-hero .gll-hero__photo {object-position:100% 45%}
@media(max-width:1320px){.gla-hero{--gll-copy:470px;--gll-fade:250px}}
@media(max-width:1100px){.gla-hero .gll-hero__photo{object-position:66% 50%}}
@media(max-width:600px){.gla-hero .gll-hero__photo{object-position:80% 50%}}

/* ---- Фото между «в фокусе» и «не обещаем»: руки мастера на бедре ---- */
.gla-expect__photo img {object-position:50% 55%}

/* ---- Зоны: три колонки на тёплой панели ---- */
.gla-zones {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;padding:0;list-style:none;border-radius:18px;background:var(--glm-warm)}
.gla-zone {display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:28px 30px 26px}
.gla-zone+.gla-zone {border-left:1px solid #eadcc8}
.gla-zone h3 {font:350 24px/1.2 var(--display);letter-spacing:-.008em}
.gla-zone p {margin-top:10px;color:var(--glm-text);font-size:15px;line-height:1.55}
.gla-zone .text-link {margin-top:auto;padding-top:18px;white-space:normal;text-align:left}

/* ---- Сравнение: таблица, как в макете; колонка этой страницы подсвечена ---- */
.gla-table-wrap {overflow-x:auto;border:1px solid var(--glm-line);border-radius:18px;background:#fff;overscroll-behavior-x:contain}
.gla-table {width:100%;min-width:720px;border-collapse:collapse;font-size:15px;line-height:1.45}
.gla-table th,.gla-table td {padding:16px 20px;border-bottom:1px solid var(--glm-line);text-align:left;vertical-align:top}
.gla-table thead th {padding-block:20px 16px;color:var(--ink);font:350 20px/1.25 var(--display);letter-spacing:-.006em}
.gla-table tbody th {width:20%;color:#6a675f;font-weight:400}
.gla-table td {color:var(--ink)}
.gla-table thead th {width:26.66%}
.gla-table tbody tr:last-child>* {border-bottom:0}
.gla-table .is-current {background:#f5f7f0}
.gla-table thead .is-current {border-top:3px solid var(--olive)}
.gla-table__tag {display:block;width:max-content;margin-top:8px;padding:3px 10px;border-radius:40px;background:var(--olive-dark);color:#fff;font-size:12px;font-weight:400;line-height:1.4}
.gla-table__clinic strong {font-weight:500;white-space:nowrap}
.gla-table__clinic .inline-link {display:inline-block;margin-top:4px}

/* ---- Шаги: шесть — по три в ряд ---- */
.gla-steps {grid-template-columns:repeat(3,minmax(0,1fr))}

/* ---- Больно ли и когда нужен врач — рядом ---- */
.gla-care {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:stretch}
.gla-care__title {font:350 30px/1.15 var(--display);letter-spacing:-.01em;text-wrap:balance}
.gla-comfort {padding:30px}
.gla-comfort__list {display:grid;gap:16px;margin:22px 0 0;padding:0;list-style:none}
.gla-comfort__list li {display:flex;align-items:center;gap:14px;color:var(--ink);font-size:16px;line-height:1.5}
.gla-comfort__list .gll-round {flex-shrink:0;margin:0}
.gla-safety {padding:30px}
.gla-safety .gla-care__title {display:flex;align-items:center;gap:12px}
.gla-safety .gla-care__title .icon {flex-shrink:0;width:26px;height:26px;color:#9a5238}
.gla-safety__list {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 20px;margin:16px 0 0;padding:0;list-style:none}
.gla-safety__list li {position:relative;padding-left:16px;color:var(--ink);font-size:15px;line-height:1.45}
.gla-safety__list li::before {content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;border-radius:50%;background:#b0765d}
.gla-safety .gll-safety__note {margin-top:18px;padding-top:14px;border-top:1px solid #efdcd2}

/* ---- Под отзывами — ссылка на карточку клиники в Яндекс Картах ---- */
.gla-reviews__more {margin-top:18px;color:var(--glm-text);font-size:15px}

/* ===================================================================== */
@media(max-width:1100px){
 .gla-zone{padding:24px 22px 22px}
 .gla-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
 .gla-care{grid-template-columns:minmax(0,1fr)}
 .gla-comfort,.gla-safety{padding:22px}
}
@media(max-width:850px){
 .gla-zones{grid-template-columns:minmax(0,1fr)}
 .gla-zone+.gla-zone{border-left:0;border-top:1px solid #eadcc8}
 .gla-zone .text-link{padding-top:12px}
}
@media(max-width:600px){
 .gla-zones,.gla-table-wrap{border-radius:14px}
 .gla-zone{padding:18px 16px}.gla-zone h3{font-size:21px}
 .gla-table{min-width:640px;font-size:14px}.gla-table th,.gla-table td{padding:12px 14px}.gla-table thead th{font-size:17px}
 .gla-steps{grid-template-columns:minmax(0,1fr)}
 .gla-care__title{font-size:25px}
 .gla-comfort,.gla-safety{padding:20px 16px;border-radius:14px}
 .gla-comfort__list li{font-size:15px}
 .gla-safety__list{grid-template-columns:minmax(0,1fr)}
 /* Три документа по два в ряд оставляли третий одиноким — на телефоне столбцом. */
 .gla .gll-docs{grid-template-columns:minmax(0,1fr)}.gla .gll-doc__image{height:220px}
}
