:root{
  /* палітра від логотипа «Статус»: зелений #088830, блакитний #28A8E0 */
  /* colors */
  --color-bg:#FFFFFF; --color-bg-soft:#ECF6EF; --color-surface:#FFFFFF;
  --color-primary:#0A8536; --color-primary-hover:#066229; --color-primary-dark:#066229;
  --color-accent:#28A8E0; --color-blue:#1C8FC4;
  /* тональна шкала для наскрізного переходу секцій */
  --tone-cream:#FFFFFF; --tone-soft:#FFFFFF; --tone-soft-2:#F1F8F3; --tone-white:#FFFFFF;
  --green-mid:#087A33; --green-deep:#055A26;
  --ease-flow:cubic-bezier(.22,1,.36,1);
  --color-text:#17211C; --color-text-secondary:#566159; --color-border:#E4EAE7;
  /* typography */
  --font-heading:"Onest",system-ui,sans-serif; --font-body:"Manrope",system-ui,sans-serif;
  /* radius */
  --radius-sm:8px; --radius-md:12px; --radius-lg:16px;
  /* spacing */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px;
  --space-6:32px; --space-7:48px; --space-8:64px; --space-9:80px; --space-10:104px;
  /* elevation */
  --shadow-soft:0 1px 2px rgba(23,33,28,.05);
  /* layout */
  --container:1200px;

  /* === legacy-аліаси: старі імена ведуть на токени DS.
     Розмітка нередизайнених секцій не змінюється, але вже отримує затверджену палітру. === */
  --green:var(--color-primary); --green-deep:var(--color-primary-hover); --green-ink:var(--color-primary-dark);
  --mint:var(--color-bg-soft); --mint-2:var(--color-bg-soft);
  --ink:var(--color-text); --body:var(--color-text); --muted:var(--color-text-secondary);
  --line:var(--color-border); --line-2:var(--color-border);
  --page:var(--color-bg);
  --r:var(--radius-md); --r-sm:var(--radius-sm);
  --maxw:var(--container);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;}
h1,h2,h3{font-family:var(--font-heading);color:var(--color-text);font-weight:600;line-height:1.2;letter-spacing:-.01em;margin:0 0 .5em;}
h1{font-size:clamp(34px,4.4vw,52px);line-height:1.15;letter-spacing:-.015em;}
h2{font-size:clamp(28px,3.2vw,38px);}
h3{font-size:21px;font-weight:600;line-height:1.25;}
p{margin:0 0 1rem;}
a{color:var(--green-deep);text-decoration:none;}
a:hover{text-decoration:underline;}
img{max-width:100%;display:block;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;position:relative;z-index:1;}
section{padding:64px 0;}
/* підпис секції — мʼята плашка, звичайний регістр (капс у плашці читається як бейдж) */
.eyebrow{display:inline-flex;align-items:center;font-size:14px;font-weight:600;
  letter-spacing:0;text-transform:none;color:var(--color-primary-dark);
  background:#E5F3E9;border-radius:999px;padding:7px 17px;margin:0 0 18px;}
/* на мʼятній секції плашка зливалася з фоном, на зеленій — з ним же */
.relatives .eyebrow{background:#FFFFFF;color:var(--color-primary-dark);}
.final .eyebrow{background:rgba(255,255,255,.15);color:#FFFFFF;}
:focus-visible{outline:3px solid var(--green);outline-offset:2px;border-radius:3px;}

/* ── motion ──────────────────────────────────────────────
   reveal: IntersectionObserver + CSS transitions, stagger через --rv-d */
[data-rv]{transition:opacity var(--rv-t,600ms) var(--ease-flow) var(--rv-d,0ms),
                     transform var(--rv-t,600ms) var(--ease-flow) var(--rv-d,0ms);}
[data-rv]:not(.is-in){opacity:0;transform:translateY(var(--rv-y,18px));will-change:opacity,transform;}
[data-rv].is-in{opacity:1;transform:none;}
[data-rv="soft"]{--rv-y:14px;--rv-t:550ms;}
[data-rv="img"]{--rv-y:34px;--rv-t:880ms;}
/* lift — без зміни opacity: не гальмує LCP на першому екрані */
[data-rv="lift"]:not(.is-in){opacity:1;transform:translateY(22px);}
[data-rv="lift"]{--rv-t:820ms;}

/* фонові форми: атмосфера, не декор */
.flow-shape{position:absolute;pointer-events:none;z-index:0;}
.flow-blob{border-radius:50%;}
.flow-sprig{color:var(--color-primary);opacity:.032;}
/* сяйво позиціоноване, тому за правилами відмальовки лягало ПОВЕРХ тексту.
   Робимо контент теж позиціонованим — тоді він малюється після сяйва (порядок DOM). */
.hero-cream .wrap > h1,.hero-cream .wrap > p,.hero-cream .wrap > ul,
.hero-cream .wrap > div,.hero-cream .wrap > button,.hero-cream .wrap > figure{position:relative;}
.hero-glow{position:absolute;z-index:0;pointer-events:none;border-radius:50%;
  background:radial-gradient(closest-side,rgba(205,232,214,.85),rgba(205,232,214,.34) 58%,rgba(205,232,214,0) 100%);}
.hero-green .flow-sprig,.final .flow-sprig{color:#fff;opacity:.05;}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:16px;border-radius:var(--r-sm);padding:13px 22px;cursor:pointer;border:1.5px solid transparent;transition:transform .12s,background .15s;font-family:inherit;text-decoration:none;}
.btn:hover{text-decoration:none;transform:translateY(-1px);}
.btn-primary{background:var(--green);color:#fff;}
.btn-primary:hover{background:var(--green-deep);}
.btn-ghost{background:transparent;color:var(--green-deep);border-color:var(--line);}
.btn-ghost:hover{border-color:var(--green);background:var(--mint-2);}

/* messenger buttons */
.msgs{display:inline-flex;gap:8px;}
.msg{width:36px;height:36px;border-radius:50%;background:transparent;color:var(--color-primary-dark);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;border:1px solid var(--color-border);transition:background .15s,border-color .15s;text-decoration:none;}
.msg:hover{background:var(--color-bg-soft);border-color:var(--color-primary);text-decoration:none;}
.msg svg{width:18px;height:18px;}
/* Іконки месенджерів — посилання, тож на них тепер діють .navlinks a (0,1,1)
   і .navlinks a:hover (0,2,1): у мобільному меню вони ставали сірими.
   Подвійний клас дає (0,2,0) і (0,3,0) — виграє й не залежить від обгортки
   (їх дві: .msgs у шапці й секціях, .rel-msgs у блоці для родичів). */
.msg.msg-viber,.msg.msg-viber:hover{color:#7360F2;}
.msg.msg-tg,.msg.msg-tg:hover{color:#229ED9;}
.msg.msg-viber:hover,.msg.msg-tg:hover{text-decoration:none;}

/* placeholder media */

/* header */
header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--color-border);}
.nav{display:flex;align-items:center;gap:24px;height:80px;}
.brand{display:flex;align-items:center;gap:11px;flex:none;font-family:var(--font-heading);font-weight:600;font-size:19px;letter-spacing:-.01em;color:var(--color-text);}
.brand:hover{text-decoration:none;color:var(--color-primary-dark);}
.brand img.logo-img{width:46px;height:46px;object-fit:contain;display:block;flex:none;}
.navlinks{display:flex;gap:22px;margin-left:12px;font-size:15px;font-weight:500;}
.navlinks a{color:var(--color-text-secondary);text-decoration:none;}
.navlinks a:hover{color:var(--color-primary-dark);text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1.5px;}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:16px;}
.nav-phone{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:16px;color:var(--color-text);white-space:nowrap;}
.nav-phone:hover{color:var(--color-primary-hover);text-decoration:none;}
.nav-phone svg{width:17px;height:17px;flex:none;color:var(--color-primary);}
.menu-toggle{display:none;background:none;border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:8px;cursor:pointer;color:var(--color-text);}
.menu-toggle .ic-close{display:none;}
.nav-extra{display:none;}
body.menu-open .menu-toggle .ic-burger{display:none;}
body.menu-open .menu-toggle .ic-close{display:block;}

/* hero — реальне фото + композиція навколо нього */
.hero{position:relative;padding:0;}
.hero-cream{position:relative;overflow-x:clip;}
.hero-cream .wrap{position:relative;display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;padding-top:52px;padding-bottom:48px;}

/* делікатний botanical-мотив — фактура, не декор */

.hero h1{grid-column:1 / 8;grid-row:1;font-size:clamp(34px,3.5vw,48px);line-height:1.13;margin:0 0 20px;}
.hero h1 span{color:var(--color-primary);}
.hero-sub{grid-column:1 / 8;grid-row:2;font-size:20px;line-height:1.55;color:var(--color-text);margin:0 0 32px;}

/* три trust-маркери — вбудовані в композицію, без чипів і карток */
.hero-markers{grid-column:1 / 8;grid-row:3;display:flex;flex-wrap:wrap;list-style:none;margin:0 0 32px;padding:16px 0 0;border-top:1px solid var(--color-border);}
.hero-markers li{display:flex;align-items:center;gap:9px;font-size:15px;font-weight:500;color:var(--color-text-secondary);white-space:nowrap;}
.hero-markers li + li{margin-left:20px;padding-left:20px;border-left:1px solid var(--color-border);}
.hero-markers svg{width:17px;height:17px;flex:none;color:var(--color-primary);}

/* форма — горизонтальний рядок композиції, не картка */
.hero-form-head{grid-column:1 / 8;grid-row:4;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;margin:0 0 16px;}
.hero-form-head h3{font-size:20px;margin:0;}
.hero-form-head .hint{font-size:14.5px;line-height:1.45;color:var(--color-text-secondary);margin:0;}
.hero-form-row{grid-column:1 / 8;grid-row:5;display:flex;align-items:flex-end;gap:14px;}
.hero-form-row .fld{flex:1 1 0;min-width:0;}
.hero-cta{flex:0 0 auto;min-width:232px;height:52px;justify-content:center;}
.hero-consent{grid-column:1 / 8;grid-row:6;margin:14px 0 0;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
.fld .field{margin-bottom:0;}
.field{width:100%;height:52px;border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:0 14px;font-size:16px;font-family:inherit;color:var(--color-text);background:var(--color-surface);margin-bottom:10px;transition:border-color .15s,box-shadow .15s;}
.field::placeholder{color:#68746C;}
.field:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(40,168,224,.25);}
.consent{font-size:14px;line-height:1.5;color:var(--color-text-secondary);margin:14px 0 0;text-align:left;}

/* ── стани форми заявки ── */
/* пастка для ботів: реальна людина цього поля не бачить і не заповнює */
.lead-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none;}
.field.is-bad{border-color:#C0392B;box-shadow:0 0 0 3px rgba(192,57,43,.16);}
.form-err{display:none;font-size:14px;line-height:1.45;color:#C0392B;margin:10px 0 0;text-align:left;}
.form-err.is-on{display:block;}
.form-err a{color:inherit;font-weight:600;text-decoration:underline;}
/* на зеленому тлі червоний нечитний — світлий відтінок тримає той самий сигнал */
.final .form-err{color:#FFD5CC;text-align:center;max-width:800px;margin:12px auto 0;}
.final .field.is-bad{box-shadow:0 0 0 3px rgba(255,213,204,.5);}
.btn.is-busy{opacity:.72;pointer-events:none;}

/* фото — ~40% ширини hero, кроп 4:5, без картки навколо */
.hero-photo{grid-column:8 / 13;grid-row:1 / 7;align-self:start;margin:0 0 -94px;position:relative;z-index:2;aspect-ratio:4/5;overflow:hidden;border-radius:16px;}
/* кремова вуаль тільки на тінях — фото зближується зі сторінкою, обличчя не вигоряє */
.hero-photo::after{content:"";position:absolute;inset:0;background:#FFFFFF;mix-blend-mode:screen;opacity:.22;pointer-events:none;}
.hero-photo img{width:100%;height:calc(100% + 48px);margin-top:-8px;object-fit:cover;object-position:50% 40%;display:block;filter:brightness(1.04) contrast(.96) saturate(.93);}

/* deep-green proof-смуга: факти + телефон в одній композиції */
.hero-green{color:#fff;}
.strip-d1{background:transparent;color:#fff;}
/* факти тримаються лівих колонок — праворуч на зелене звисає фото */
.strip-d1 .wrap{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;}
.strip-d1 .item:nth-child(1){grid-column:1 / 3;}
.strip-d1 .item:nth-child(2){grid-column:3 / 5;}
.strip-d1 .item:nth-child(3){grid-column:5 / 8;}
.strip-d1 .item{display:flex;flex-direction:column;justify-content:center;gap:3px;padding:20px 14px 16px;border-left:1px solid rgba(255,255,255,.14);}
.strip-d1 .item:first-child{border-left:none;padding-left:0;}
.strip-d1 .item:last-child{padding-right:0;}
.strip-d1 .val{font-family:var(--font-heading);font-size:23px;font-weight:600;line-height:1.1;letter-spacing:-.01em;color:#fff;}
.strip-d1 .cap{font-size:13px;line-height:1.35;color:rgba(255,255,255,.68);}

/* ── біла база: секції не фарбуються, колір живе локально (сяйва, блоби, зелені блоки) ── */
.hero-cream{background:#FFFFFF;}
.hero-green{background:linear-gradient(180deg,var(--green-mid) 0%,var(--green-deep) 100%);}
#services,.sec-path,#doctors,.sec-adv,#stationary,.reviews,#locations,.sec-faq{background:#FFFFFF;}
.sec-prices{background:#FFFFFF;}
.sec-path{background:linear-gradient(180deg,#FFFFFF 0%,#FFFFFF 80%,#F1F8F3 100%);}
.relatives{background:linear-gradient(180deg,#F1F8F3 0%,#E5F3E9 12%,#E5F3E9 86%,#F4FAF5 100%);}
#doctors{background:linear-gradient(180deg,#F4FAF5 0%,#FFFFFF 14%,#FFFFFF 100%);}
/* мʼякий вхід у зелене — короткий тональний розгін замість різу */
.sec-adv{background:linear-gradient(180deg,#FFFFFF 0%,#FFFFFF 72%,var(--tone-soft-2) 100%);}
.sec-faq{background:linear-gradient(180deg,#FFFFFF 0%,#FFFFFF 72%,var(--tone-soft-2) 100%);}
#services{background:linear-gradient(180deg,var(--tone-soft-2) 0%,#FFFFFF 14%,#FFFFFF 100%);}
#stationary{background:linear-gradient(180deg,var(--tone-soft-2) 0%,#FFFFFF 16%,#FFFFFF 100%);}
.final{background:linear-gradient(180deg,var(--green-mid) 0%,var(--green-deep) 100%);}
footer{background:var(--green-deep);}
#services,.sec-path,.relatives,#doctors,.sec-adv,#stationary,.reviews,#locations,.sec-faq,.final{position:relative;}
#services,#doctors{overflow:hidden;}

/* services */
/* послуги: замість стіни карток — одна панель з колонками через вертикальні лінійки */
.svc-panel{display:grid;grid-template-columns:repeat(4,1fr);margin-top:38px;text-align:left;
  background:#E5F3E9;border:1px solid #C6E1CD;border-radius:18px;overflow:hidden;}
.svc-col{padding:36px 24px 34px;border-left:1px solid #C6E1CD;}
.svc-col:first-child{border-left:none;}
.svc-col h3{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:600;color:var(--color-primary-dark);margin:0 0 18px;}
.svc-col h3 svg{width:20px;height:20px;flex:none;color:var(--color-primary);}
.svc-col ul{list-style:none;margin:0;padding:0;}
.svc-col li{padding:10px 0;font-size:15px;line-height:1.45;color:var(--color-text);
  border-bottom:1px solid rgba(5,90,38,.11);}
.svc-col li:last-child{border-bottom:none;padding-bottom:0;}
@media(max-width:1080px){
  /* нижче 1080 чотири колонки стають завузькими і пункти переносяться — переходимо на 2×2 */
  .svc-panel{grid-template-columns:repeat(2,1fr);}
  .svc-col:nth-child(odd){border-left:none;}
  .svc-col:nth-child(n+3){border-top:1px solid #C6E1CD;}
}
#services .wrap{text-align:center;}
#services .eyebrow{justify-content:center;}

/* ── ціни ── */
.sec-prices .wrap{text-align:center;}
.sec-prices .eyebrow{justify-content:center;}
/* :not() обовʼязковий — інакше правило ловить і примітку під таблицею,
   стискає її до 56ch і центрує замість вирівнювання по таблиці */
.sec-prices > .wrap > p:not(.price-note){max-width:56ch;margin-left:auto;margin-right:auto;}
.price-wrap{max-width:820px;margin:38px auto 0;overflow-x:auto;}
.price-table{width:100%;border-collapse:collapse;text-align:left;font-size:17px;}
.price-table th{font-family:var(--font-body);font-size:14px;font-weight:600;
  color:var(--color-text-secondary);padding:0 0 14px;border-bottom:1px solid var(--color-border);}
.price-table th:last-child{text-align:right;}
.price-table td{padding:17px 0;border-bottom:1px solid var(--color-border);vertical-align:baseline;}
.price-table tr:last-child td{border-bottom:none;}
.price-table tbody tr:hover td{background:var(--tone-soft-2);}
.price-table .svc{color:var(--color-text);padding-right:20px;}
.price-table .val{text-align:right;white-space:nowrap;font-family:var(--font-heading);
  font-size:19px;font-weight:600;color:var(--color-primary-dark);
  font-variant-numeric:tabular-nums;letter-spacing:-.01em;}
.price-table .unit{font-family:var(--font-body);font-size:14.5px;font-weight:500;color:var(--color-text-secondary);}
.price-note{max-width:820px;margin:22px auto 0;font-size:15px;line-height:1.5;
  color:var(--color-text-secondary);text-align:left;}
.price-cta{margin:30px auto 0;height:54px;padding:0 30px;}

/* ── квіз розрахунку ── */
.quiz{position:fixed;inset:0;z-index:100;background:rgba(5,90,38,.88);
  display:flex;align-items:center;justify-content:center;padding:24px;
  opacity:0;pointer-events:none;transition:opacity .22s var(--ease-flow);}
.quiz.is-open{opacity:1;pointer-events:auto;}
.quiz-card{position:relative;background:#fff;border-radius:18px;padding:34px 34px 30px;
  width:min(540px,100%);max-height:90vh;overflow-y:auto;text-align:left;
  transform:translateY(14px);transition:transform .28s var(--ease-flow);}
.quiz.is-open .quiz-card{transform:none;}
.quiz-close{position:absolute;top:14px;right:16px;width:38px;height:38px;border-radius:50%;
  border:none;background:transparent;color:var(--color-text-secondary);font-size:26px;
  line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.quiz-close:hover{background:var(--tone-soft-2);color:var(--color-text);}
/* відступ праворуч під хрестик: він висить поверх картки й інакше
   накриває останній сегмент смуги — і на десктопі теж */
.quiz-bar{display:flex;gap:6px;margin-bottom:22px;padding-right:44px;}
.quiz-bar i{flex:1;height:4px;border-radius:2px;background:var(--color-border);transition:background .25s;}
.quiz-bar i.on{background:var(--color-primary);}
.quiz-step h3{font-size:21px;margin:0 0 6px;}
/* фокус на заголовок переводимо для скрінрідерів; заголовок не інтерактивний,
   тому видима обводка на ньому лише заважає */
.quiz-step h3:focus{outline:none;}
.quiz-sub{font-size:15px;color:var(--color-text-secondary);margin:0 0 18px;}
/* [hidden] у браузерних стилях — це display:none з нульовою специфічністю,
   і будь-який display у класі його перебиває. Без цього рядка на другому
   кроці показувались обидва набори послуг одразу. */
.quiz-opts[hidden],.quiz-step[hidden]{display:none;}
.quiz-opts{display:flex;flex-direction:column;gap:9px;}
.quiz-opts button{text-align:left;font:500 16px/1.35 var(--font-body);color:var(--color-text);
  background:#fff;border:1px solid var(--color-border);border-radius:10px;
  padding:14px 16px;cursor:pointer;transition:border-color .15s,background .15s;}
.quiz-opts button:hover{border-color:var(--color-primary);background:var(--tone-soft-2);}
.quiz-back{margin-top:16px;background:none;border:none;padding:0;cursor:pointer;
  font:500 14.5px var(--font-body);color:var(--color-text-secondary);text-decoration:underline;}
.quiz-back:hover{color:var(--color-primary-dark);}
.quiz-form{display:flex;flex-direction:column;gap:10px;margin-top:20px;}
.quiz-form .field{margin-bottom:0;}
.quiz-form .btn{justify-content:center;height:52px;}
.quiz .consent{margin-top:12px;}
body.quiz-open{overflow:hidden;}
body.quiz-open .mbar{display:none;}

@media(max-width:560px){
  .quiz{padding:0;align-items:flex-end;}
  .quiz-card{border-radius:18px 18px 0 0;max-height:94vh;padding:28px 20px 24px;width:100%;}
  .price-cta{width:100%;justify-content:center;}
}

@media(max-width:560px){
  .price-table{font-size:16px;}
  .price-table td{padding:14px 0;}
  .price-table .svc{padding-right:14px;}
  .price-table .val{font-size:17px;}
  .price-note{font-size:14px;}
}

/* patient path */
/* шлях пацієнта: замість карток — послідовність на лінії, що прокреслюється при скролі */
.path{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:30px;margin-top:46px;}
.path-line{position:absolute;left:12.5%;right:12.5%;top:23px;height:1px;
  background:var(--color-border);transform-origin:left;z-index:0;}
.step{position:relative;z-index:1;text-align:center;}
.step .num{font-family:var(--font-heading);font-size:15px;font-weight:600;color:#fff;
  background:var(--color-primary);width:46px;height:46px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;margin:0 auto 20px;
  box-shadow:0 0 0 7px #FFFFFF;}
.step h3{font-size:18px;margin:0 0 8px;}
.step p{font-size:14.5px;line-height:1.5;color:var(--color-text-secondary);margin:0;}
.sec-path .wrap{text-align:center;}
.sec-path .eyebrow{justify-content:center;}
/* лінія має свій тип появи — масштаб, а не зсув */
[data-rv="line"]{--rv-t:1000ms;}
[data-rv="line"]:not(.is-in){opacity:1;transform:scaleX(0);}

/* relatives */

/* для рідних: форма без картки — секція сама є поверхнею */
.rel-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;}
.rel-grid > div:first-child p:not(.eyebrow){font-size:17px;line-height:1.6;color:var(--color-text-secondary);}
.rel-form{background:none;border:none;border-radius:0;padding:0;}
.rel-form h3{font-size:20px;margin:0 0 18px;}
.rel-form .row{display:flex;gap:12px;margin-bottom:12px;}
.rel-form .row .field{margin-bottom:0;background:#FFFFFF;}
.rel-form .btn-primary{width:100%;justify-content:center;height:52px;}
.rel-msgs{display:flex;gap:10px;justify-content:center;margin-top:18px;}
.rel-msgs .msg{width:40px;height:40px;background:#FFFFFF;border-color:transparent;}
.rel-msgs .msg svg{width:19px;height:19px;}
.anon-note{display:inline-block;font-size:14.5px;font-weight:500;color:var(--color-primary-dark);
  background:none;border:none;border-left:2px solid var(--color-primary);
  padding:2px 0 2px 14px;border-radius:0;margin-top:24px;}

/* doctors */
/* лікарі: без карток — портрети 4:5, підписи прямо на фоні секції */
.docs{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;margin-top:46px;align-items:start;text-align:left;}
.doc{background:none;border:none;border-radius:0;overflow:visible;}
.doc .photo{aspect-ratio:4/5;border-radius:12px;overflow:hidden;margin:0 0 20px;background:#EEF5F0;}
.doc .photo img{width:100%;height:calc(100% + 34px);margin-top:-17px;object-fit:cover;
  display:block;filter:saturate(.94) brightness(1.03);}
.doc .info{padding:0;}
.doc h3{font-size:19px;line-height:1.3;margin:0 0 7px;}
.doc .role{font-size:14.5px;font-weight:500;color:var(--color-primary-hover);margin:0 0 8px;}
.doc .exp{font-size:14px;line-height:1.5;color:var(--color-text-secondary);margin:0;}
#doctors .wrap{text-align:center;}
#doctors .eyebrow{justify-content:center;}

/* advantages */
/* переваги: замість шести боксів — editorial-сітка 3×2 на розділювачах */
.adv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:44px;text-align:left;}
.adv{background:none;border:none;border-radius:0;display:block;padding:32px 32px 34px;
  border-left:1px solid var(--color-border);border-top:1px solid var(--color-border);}
.adv:nth-child(3n+1){border-left:none;padding-left:0;}
.adv:nth-child(3n){padding-right:0;}
.adv:nth-child(-n+3){border-top:none;padding-top:0;}
.adv .ic{width:auto;height:auto;background:none;border-radius:0;display:block;
  color:var(--color-primary);margin:0 0 16px;}
.adv .ic svg{width:24px;height:24px;stroke-width:1.75;}
.adv h3{font-size:17.5px;margin:0 0 8px;}
.adv p{font-size:14.5px;line-height:1.5;color:var(--color-text-secondary);margin:0;}
.sec-adv .wrap{text-align:center;}


/* стаціонар: реальні інтерʼєри 2×2 замість чотирьох заглушок */
/* галерея стаціонару — масонрі за натуральними пропорціями.
   8 із 13 фото вертикальні: кроп у 3:2 зрізав у них майже половину кадру,
   палати переставали читатися. Тому фото не кропимо — як і скріни відгуків. */
/* стрічка однакової висоти: ширина в кожного кадру своя, за натуральними
   пропорціями. Сітка тут не працювала — 8 вертикальних із 13 давали рваний
   низ і стрибаючі підписи, а кроп у 3:2 зрізав у палат половину кадру.
   При спільній висоті верх і низ вирівнюються самі, кроп не потрібен. */
.gallery{align-items:flex-start;gap:16px;margin-top:26px;text-align:left;}
.g-item{flex:0 0 auto;margin:0;cursor:zoom-in;scroll-snap-align:start;}
.g-photo{height:340px;border-radius:14px;overflow:hidden;background:#EEF5F0;}
.g-photo img{height:100%;width:auto;}
.g-photo img{display:block;object-fit:cover;filter:saturate(.94) brightness(1.04);
  transition:transform .55s var(--ease-flow);}
.g-item:hover .g-photo img{transform:scale(1.035);}
.g-item:focus-visible{outline:3px solid var(--green);outline-offset:4px;border-radius:16px;}
.gal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:34px;}
.gal-head .hint{font-size:15px;font-weight:600;color:var(--color-text-secondary);margin:0;}
/* правило мусить стояти ПІСЛЯ базового: у медіазапиті вище по файлу
   однакова специфічність програвала б базовому */

#stationary .wrap{text-align:center;}
#stationary .wrap > p{margin-left:auto;margin-right:auto;}

/* reviews */

/* відгуки: реальні скріни з натуральною висотою замість скелетонів */
.rev-badges{display:flex;flex-wrap:wrap;margin-top:36px;}
.rev-badge{background:none;border:none;border-radius:0;padding:0 34px;display:flex;align-items:center;gap:14px;
  flex:0 0 auto;min-width:0;border-left:1px solid var(--color-border);}
.rev-badge:first-child{border-left:none;padding-left:0;}
.stars{color:#E2A93B;font-size:19px;letter-spacing:1px;}
.rev-badge b{font-size:16px;}
.rev-badge .city{font-size:14px;color:var(--color-text-secondary);}
.rev-row{margin-top:34px;}
.rev-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;}
.rev-head h3{font-family:var(--font-body);font-size:15px;font-weight:600;color:var(--color-text-secondary);margin:0;display:flex;align-items:center;gap:8px;}
.sl-btns{display:flex;gap:8px;}
.sl-btns button{width:38px;height:38px;border-radius:50%;border:1px solid var(--color-border);background:#fff;cursor:pointer;color:var(--color-primary-dark);display:flex;align-items:center;justify-content:center;transition:background .15s,border-color .15s;}
.sl-btns button:hover{background:#E5F3E9;border-color:var(--color-primary);}
/* overflow-y треба задати явно: при overflow-x:auto браузер обчислює
   overflow-y як auto, а не visible, і смуга з'їжджає у вертикальний скрол */
.slider{display:flex;align-items:flex-start;gap:18px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;padding-bottom:10px;scrollbar-width:thin;}
/* карткам у стрічці вертикальний зсув не потрібен: він додавав 24px
   до scrollHeight, поки картки ще не проявились. Проявлення — лише прозорість. */
.slider [data-rv]{--rv-y:0px;}
.slider::-webkit-scrollbar{height:6px;}
.slider::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:20px;}
.rev-shot{flex:0 0 366px;cursor:zoom-in;scroll-snap-align:start;border:1px solid var(--color-border);border-radius:12px;overflow:hidden;background:#fff;}
.rev-shot img{width:100%;height:auto;display:block;}
.rev-link{display:inline-block;margin-top:7px;font-size:14px;font-weight:600;
  color:var(--color-primary-hover);white-space:nowrap;}
/* лайтбокс для скрінів відгуків */
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(5,90,38,.9);
  display:flex;align-items:center;justify-content:center;padding:28px;
  opacity:0;pointer-events:none;transition:opacity .25s var(--ease-flow);}
.lightbox.is-open{opacity:1;pointer-events:auto;}
.lightbox img{max-width:min(620px,94vw);max-height:92vh;width:auto;height:auto;
  border-radius:12px;background:#fff;box-shadow:0 28px 70px rgba(0,0,0,.34);}
.lightbox-close{position:absolute;top:18px;right:20px;width:46px;height:46px;border-radius:50%;
  border:1px solid rgba(255,255,255,.34);background:rgba(255,255,255,.12);color:#fff;
  font-size:26px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;
  font-family:inherit;transition:background .15s;}
.lightbox-close:hover{background:rgba(255,255,255,.24);}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;
  border:1px solid rgba(255,255,255,.34);background:rgba(255,255,255,.12);color:#fff;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:background .15s;}
.lb-nav:hover{background:rgba(255,255,255,.24);}
.lb-nav svg{width:24px;height:24px;}
.lb-prev{left:26px;} .lb-next{right:26px;}
/* поки відкрито перегляд — ховаємо наскрізні елементи, вони заважають кнопкам гортання */
body.lb-open .mbar{display:none;}
.lb-count{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);
  color:rgba(255,255,255,.78);font-size:14px;font-weight:600;letter-spacing:.05em;}
@media(max-width:640px){
  .lightbox{padding:64px 14px 96px;}
  .lb-nav{top:auto;bottom:24px;transform:none;width:46px;height:46px;}
  .lb-prev{left:calc(50% - 88px);} .lb-next{right:calc(50% - 88px);}
  .lb-count{bottom:38px;}
  .lightbox-close{top:14px;right:14px;}
}

/* locations */
/* локації: функціональні адресні блоки + справжні мапи */
.loc-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:44px;}
.loc{background:none;border:none;border-radius:0;overflow:visible;}
.loc .map{aspect-ratio:16/10;border-radius:14px;overflow:hidden;background:#EEF5F0;border:1px solid var(--color-border);}
.loc .map img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.96) brightness(1.02);}
.loc .loc-info{padding:18px 0 0;}
.loc h3{font-size:20px;margin:0 0 5px;}
.loc .addr{font-size:16px;color:var(--color-text-secondary);margin:0 0 12px;}
.loc-links{display:flex;flex-wrap:wrap;gap:16px;font-size:14.5px;font-weight:600;}
.visit-note{display:flex;align-items:center;gap:14px;margin-top:34px;background:#E5F3E9;
  border:none;border-radius:14px;padding:20px 24px;font-size:16px;color:var(--color-text);}
.visit-note svg{width:24px;height:24px;flex:none;color:var(--color-primary);}
.visit-note a{font-weight:600;white-space:nowrap;}

/* faq: заголовок лишається на місці, поки прокручуються питання */
.faq-grid{display:grid;grid-template-columns:4fr 7fr;gap:56px;align-items:start;}
.faq-aside{position:sticky;top:112px;}
.faq-list{margin:0;border-top:1px solid var(--color-border);}
.faq-item{border-bottom:1px solid var(--color-border);}
.faq-q{width:100%;text-align:left;background:none;border:none;padding:22px 0;font-family:var(--font-heading);
  font-size:18.5px;font-weight:600;color:var(--color-text);cursor:pointer;display:flex;
  justify-content:space-between;align-items:center;gap:16px;}
.faq-q svg{width:22px;height:22px;flex:none;transition:transform .25s var(--ease-flow);color:var(--color-primary);}
.faq-item.open .faq-q svg{transform:rotate(45deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .28s ease;}
.faq-a p{padding:0 0 22px;color:var(--color-text-secondary);font-size:15.5px;line-height:1.6;margin:0;max-width:62ch;}

/* final cta */
.final{text-align:center;}
.final .wrap{padding-top:82px;padding-bottom:86px;}
.final h2{color:#fff;max-width:22ch;margin:0 auto 14px;}
.final-lead{color:rgba(255,255,255,.82);font-size:17px;margin:0 auto 32px;max-width:46ch;}
.final-form{display:flex;flex-wrap:wrap;gap:14px;max-width:800px;margin:0 auto;}
.final-form .field{flex:1 1 200px;margin-bottom:0;background:#fff;}
.final-form .btn-primary{flex:0 0 auto;min-width:240px;height:52px;justify-content:center;
  background:#fff;color:var(--color-primary-dark);}
.final-form .btn-primary:hover{background:#E5F3E9;color:var(--color-primary-dark);}
.final .consent{color:rgba(255,255,255,.62);text-align:center;max-width:800px;margin:16px auto 0;}
.final .consent a{color:inherit;}
.final-contact{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 26px;
  margin-top:40px;padding-top:34px;border-top:1px solid rgba(255,255,255,.16);}
.final-phone{font-family:var(--font-heading);font-size:29px;font-weight:600;color:#fff;
  letter-spacing:-.01em;margin:0;display:inline-block;}
.final-phone:hover{color:#fff;text-decoration:underline;text-underline-offset:6px;}
.final-contact .msg{width:42px;height:42px;background:#fff;border-color:transparent;}
.final-contact .msg svg{width:20px;height:20px;}

/* footer */
footer{color:rgba(255,255,255,.8);padding:48px 0 28px;font-size:15px;}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px;}
.socials{display:flex;gap:10px;margin-top:18px;}
.socials a{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;color:#fff;padding:0;}
.socials a:hover{background:var(--green);border-color:var(--green);}
.socials svg{width:19px;height:19px;}
footer h4{color:#fff;font-family:var(--font-heading);font-size:17px;margin:0 0 14px;}
footer a{color:rgba(255,255,255,.8);display:block;padding:4px 0;}
footer a:hover{color:#fff;}
.foot-lic{border-top:1px solid rgba(255,255,255,.15);margin-top:28px;padding-top:18px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:13.5px;color:rgba(255,255,255,.6);}

/* mobile sticky bar */
.mbar{display:none;position:fixed;bottom:0;left:0;right:0;z-index:60;background:#fff;border-top:1px solid var(--line);padding:8px 12px;gap:8px;box-shadow:0 -4px 20px rgba(0,0,0,.06);}
.mbar .btn{flex:1;justify-content:center;padding:12px;font-size:17px;letter-spacing:.01em;}

/* spec code badges */

@media(max-width:920px){
  .faq-grid{grid-template-columns:1fr;gap:24px;}
  .faq-aside{position:static;}
  .loc-grid{grid-template-columns:1fr;}
  .final-form .btn-primary{flex:1 1 100%;min-width:0;}
  .rev-badge{padding:0 20px;}
  .rev-shot{flex:0 0 300px;}
  .nav{height:64px;gap:14px;}
  .rel-grid{grid-template-columns:1fr;gap:34px;}
  .hero-cream .wrap{grid-template-columns:1fr;padding-top:32px;padding-bottom:34px;}
  .hero-glow{display:none;}
  .hero h1,.hero-sub,.hero-photo,.hero-markers,.hero-form-head,.hero-form-row,.hero-consent{grid-column:1;grid-row:auto;}
  /* порядок: H1 → фото → форма → підзаголовок → маркери.
     Підзаголовок нижче форми навмисно: інакше CTA опускається під sticky-бар. */
  .hero h1{order:1;margin-bottom:16px;}
  .hero-photo{order:2;margin:0 0 22px;aspect-ratio:16/10;border-radius:12px;}
  .hero-photo img{height:100%;margin-top:0;}
  .hero-photo img{object-position:50% 24%;}
  .hero-form-head{order:3;margin-bottom:14px;}
  .hero-form-row{order:4;flex-direction:column;align-items:stretch;gap:12px;}
  .hero-cta{order:6;min-width:0;width:100%;}
  .hero-consent{order:5;}
  .hero-sub{order:6;font-size:18px;color:var(--color-text);margin:26px 0 0;}
  .hero-markers{order:7;display:block;margin:22px 0 0;padding-top:0;}
  .hero-markers li + li{margin-left:0;padding-left:0;border-left:none;}
  .hero-markers li{border-bottom:1px solid var(--color-border);white-space:normal;}
  .hero-markers li{padding:14px 0;font-size:16px;}
  .strip-d1 .wrap{grid-template-columns:repeat(2,1fr);column-gap:20px;}
  .strip-d1 .item:nth-child(1),.strip-d1 .item:nth-child(2),.strip-d1 .item:nth-child(3){grid-column:auto;}
  .strip-d1 .item{border-left:none;border-top:1px solid rgba(255,255,255,.14);padding:14px 0;}
  .strip-d1 .item:nth-child(-n+2){border-top:none;}
  .strip-d1 .val{font-size:21px;}
  .svc-panel{grid-template-columns:repeat(2,1fr);}
  .svc-col{border-left:none;border-top:1px solid #C6E1CD;}
  .svc-col:nth-child(2){border-left:1px solid #C6E1CD;}
  .svc-col:nth-child(-n+2){border-top:none;}
  .svc-col:nth-child(4){border-left:1px solid #C6E1CD;}
  .adv-grid,.docs{grid-template-columns:repeat(2,1fr);}
  .adv{border-left:1px solid var(--color-border);border-top:1px solid var(--color-border);padding:28px 26px 30px;}
  .adv:nth-child(3n+1){border-left:1px solid var(--color-border);padding-left:26px;}
  .adv:nth-child(3n){padding-right:26px;}
  .adv:nth-child(-n+3){border-top:1px solid var(--color-border);padding-top:28px;}
  .adv:nth-child(2n+1){border-left:none;padding-left:0;}
  .adv:nth-child(2n){padding-right:0;}
  .adv:nth-child(-n+2){border-top:none;padding-top:0;}
  .path{grid-template-columns:1fr;gap:0;margin-top:34px;}
  .step{display:grid;grid-template-columns:46px 1fr;column-gap:18px;row-gap:5px;
    text-align:left;padding-bottom:30px;}
  .step .num{grid-column:1;grid-row:1 / 3;align-self:start;margin:0;}
  .step h3{grid-column:2;grid-row:1;align-self:center;min-height:46px;display:flex;align-items:center;}
  .step p{grid-column:2;grid-row:2;}
  .step:last-child{padding-bottom:0;}
  .path-line{left:22px;right:auto;top:23px;bottom:53px;width:1px;height:auto;transform-origin:top;}
  [data-rv="line"]:not(.is-in){transform:scaleY(0);}
  .loc-grid,.foot-grid{grid-template-columns:1fr;}
  .gallery{gap:12px;}
  .g-photo{height:250px;}
  .navlinks,header .msgs{display:none;}
  /* мобільне меню: панель під шапкою */
  body.menu-open .navlinks{display:flex;flex-direction:column;gap:0;margin:0;
    position:fixed;top:64px;left:0;right:0;z-index:49;
    background:#fff;border-bottom:1px solid var(--color-border);
    padding:4px 20px 14px;box-shadow:0 18px 40px rgba(10,60,30,.12);}
  /* тільки пункти меню, інакше рамка тягнеться на телефон і адреси */
  body.menu-open .navlinks > a{padding:13px 0;font-size:17px;line-height:1.35;color:var(--color-text);
    border-bottom:1px solid var(--color-border);}
  body.menu-open .navlinks > a:hover{text-decoration:none;color:var(--color-primary-hover);}
  body.menu-open .navlinks{max-height:calc(100vh - 64px);overflow-y:auto;}
  body.menu-open .nav-extra{display:block;padding-top:26px;}
  body.menu-open .nav-extra .msgs{display:inline-flex;gap:10px;margin-top:14px;}
  .nav-x-tel{display:block;font-family:var(--font-heading);font-size:24px;font-weight:600;
    letter-spacing:-.01em;color:var(--color-text);}
  .nav-extra .hours{display:block;font-size:13.5px;color:var(--color-text-secondary);margin-top:4px;}
  .nav-extra .msg{width:42px;height:42px;}
  .nav-locs{list-style:none;margin:20px 0 0;padding:16px 0 0;border-top:1px solid var(--color-border);}
  .nav-locs li + li{margin-top:12px;}
  .nav-locs a,.nav-locs span{display:flex;align-items:center;gap:10px;font-size:15px;
    color:var(--color-text-secondary);font-weight:500;}
  .nav-locs a:hover{color:var(--color-primary-hover);text-decoration:none;}
  .nav-locs svg{width:18px;height:18px;flex:none;color:var(--color-primary);}
  .brand{white-space:nowrap;}
  .menu-toggle{display:block;}
  .mbar{display:flex;}
  .mbar{transition:transform .22s ease,opacity .22s ease;}
  body.hero-form-in-view .mbar{transform:translateY(125%);pointer-events:none;}
  body{padding-bottom:76px;}
}
@media(max-width:560px){
  .g-photo{height:200px;}
  .gal-head .hint{font-size:14px;}
  .svc-panel{grid-template-columns:1fr;}
  .svc-col{border-left:none!important;padding:20px;}
  .svc-col li{padding:8px 0;}
  .svc-col h3{margin-bottom:14px;}
  /* :nth-child(-n+2) з планшетного брейкпоінта б'є .svc-col за специфічністю — знімаємо явно */
  .svc-col,.svc-col:nth-child(-n+2){border-top:1px solid #C6E1CD;}
  .svc-col:first-child{border-top:none;}
  .adv-grid,.docs,.path{grid-template-columns:1fr;}
  /* на мобільному іконка йде в рядок із заголовком — окремий рядок з’їдав ~40px на пункт */
  .adv{display:flex;gap:14px;align-items:flex-start;border-left:none;padding:18px 0 20px;}
  .adv:nth-child(n){border-left:none;border-top:1px solid var(--color-border);padding-top:18px;padding-left:0;padding-right:0;}
  .adv:first-child{border-top:none;padding-top:0;}
  .adv .ic{margin:2px 0 0;flex:none;}
  .adv .ic svg{width:21px;height:21px;}
  .adv h3{font-size:16.5px;margin:0 0 5px;}
  .adv p{font-size:14px;}
  .docs{gap:40px;}
  .nav{gap:10px;}
  .brand{font-size:16px;gap:9px;}
  .brand img.logo-img{width:41px;height:41px;}
  .nav-phone .num{display:none;}
  /* телефон — головна дія в мобільній шапці, тому заливка, а не контур */
  .nav-phone{width:44px;height:44px;justify-content:center;background:var(--color-primary);
    border:none;border-radius:50%;flex:none;box-shadow:0 2px 8px rgba(10,133,54,.28);}
  .nav-phone svg{width:20px;height:20px;color:#fff;}
  .nav-phone:hover,.nav-phone:active{background:var(--color-primary-hover);}
  .hero h1{font-size:clamp(32px,8.2vw,37px);}
  /* плашки рейтингу: при переносі друга з'їжджала і тягла вертикальну лінію — ставимо в стовпчик */
  .rev-badges{display:block;margin-top:26px;}
  .rev-badge{display:flex;align-items:flex-start;gap:12px;padding:16px 0;
    border-left:none;border-top:1px solid var(--color-border);}
  .rev-badge:first-child{border-top:none;padding-top:0;}
  .stars{font-size:17px;line-height:1.5;}
  .rev-badge b{font-size:15.5px;}
  .rev-badge span > br + br,.rev-badge span > br:last-of-type{display:none;}
  .rev-link{display:inline;margin:0 0 0 12px;font-size:13.5px;}
  .rev-row{margin-top:26px;}
  .rev-shot{flex:0 0 286px;}
  .strip-d1 .wrap{grid-template-columns:1fr;}
  .strip-d1 .item{padding:13px 0;}
  .strip-d1 .item:nth-child(2){border-top:1px solid rgba(255,255,255,.14);}
  .strip-d1 .item:first-child{border-top:none;}
  section{padding:44px 0;}
}
@media(max-width:375px){
  .hero-photo{aspect-ratio:2/1;}
}
@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;transition:none!important;animation:none!important;}
  [data-rv]:not(.is-in){opacity:1!important;transform:none!important;}
  .flow-shape{transform:none!important;}
}
/* ── W3: центрована композиція без фото ── */
.hero-photo{display:none;}
.hero-cream .wrap{display:flow-root;text-align:center;padding-top:58px;padding-bottom:0;max-width:1000px;}
.hero h1{max-width:24ch;margin:0 auto 22px;font-size:clamp(34px,4.3vw,58px);}
.hero-sub{max-width:52ch;margin:0 auto 34px;font-size:20px;}
.hero-markers{display:inline-flex;justify-content:center;margin:0 0 40px;padding:16px 0 0;border-top:1px solid var(--color-border);}
.hero-form-head{display:flex;flex-direction:column;align-items:center;gap:6px;margin:0 0 18px;}
.hero-form-panel{max-width:880px;margin:0 auto -46px;background:#E5F3E9;
  border:1px solid #C6E1CD;border-radius:18px;padding:32px 36px 28px;
  position:relative;z-index:3;box-shadow:0 20px 44px rgba(10,60,30,.15);}
.hero-form-row{max-width:none;margin:0;}
.hero-form-panel .field{background:#FFFFFF;}
.hero-cta{min-width:250px;}
.hero-consent{text-align:center;margin:16px 0 0;}
.hero-cream .flow-sprig{display:none;} /* асиметричний декор конфліктує з центруванням */
.strip-d1 .wrap{grid-template-columns:repeat(3,auto);justify-content:center;column-gap:0;}
.strip-d1 .item:nth-child(1),.strip-d1 .item:nth-child(2),.strip-d1 .item:nth-child(3){grid-column:auto;}
.strip-d1 .item{padding:64px 40px 20px;}
.strip-d1 .item:first-child{padding-left:0;}
.strip-d1 .item:last-child{padding-right:0;}
@media(max-width:920px){
  /* .wrap на десктопі flow-root, тому order не працював і форма падала за екран.
     На мобільному робимо flex-колонку і ставимо форму одразу після підзаголовка. */
  .hero-cream .wrap{display:flex;flex-direction:column;text-align:left;padding-top:28px;padding-bottom:34px;}
  .hero h1{order:1;font-size:clamp(29px,8vw,34px);line-height:1.15;max-width:none;margin:0 0 18px;}
  .hero-sub{order:2;max-width:none;margin:0 0 28px;}
  .hero-form-panel{order:3;margin:0;padding:24px 22px 22px;}
  .hero-markers{order:4;display:block;margin:30px 0 0;}
  .hero-markers li{padding:13px 0;}
  .hero-form-head{align-items:flex-start;}
  .hero-consent{text-align:left;}
  /* смуга: один стовпчик, без падінгу під нахлест (його на мобільному немає) */
  .strip-d1 .wrap{grid-template-columns:1fr;justify-content:stretch;}
  .strip-d1 .item{padding:15px 0;border-left:none;
    border-top:1px solid rgba(255,255,255,.14);}
  .strip-d1 .item:first-child{border-top:none;}
  .strip-d1 .val{font-size:21px;}
  .strip-d1 .cap{font-size:13.5px;}
}

/* ══ «Статус»: доповнення до каркаса «Вільне Життя» ══════════════════ */

/* логотип — повний знак із написом, окремий текст бренду не потрібен */
.brand img.logo-full{height:42px;width:auto;display:block;}

/* перший екран: фото ресепшену фоном — текст і форма лежать по центру,
   тож кадр без людей: обличчя опинилися б під заголовком.
   Вуаль не рівна, а плямою під текстом: рівна 80–88% вибілювала фото
   до невпізнанності, а краї кадру тексту не заважають і лишаються чистими.
   Сяйво вимкнено — на фото воно лише каламутить. */
.hero-cream{background:
  radial-gradient(ellipse 52% 60% at 50% 38%,rgba(255,255,255,.86),rgba(255,255,255,.55) 60%,rgba(255,255,255,.12) 100%),
  url(/images/clinic/resepshen.webp) 50% 45%/cover no-repeat;}
.hero-cream .hero-glow{display:none;}
@media(max-width:920px){
  /* на мобільному текст займає всю ширину — пляма не працює, рівна вуаль із просвітом посередині */
  .hero-cream{background:
    linear-gradient(180deg,rgba(255,255,255,.80) 0%,rgba(255,255,255,.62) 45%,rgba(255,255,255,.80) 100%),
    url(/images/clinic/resepshen.webp) 50% 45%/cover no-repeat;}
}

/* перемикач мови UA / RU */
.lang{display:inline-flex;align-items:center;border:1px solid var(--color-border);border-radius:999px;
  font-size:13.5px;font-weight:600;line-height:1;overflow:hidden;flex:none;}
.lang a,.lang span{padding:7px 10px;}
.lang a{color:var(--color-text-secondary);}
.lang a:hover{color:var(--color-primary-dark);text-decoration:none;background:var(--tone-soft-2);}
.lang span{background:#E5F3E9;color:var(--color-primary-dark);}

/* друга лінія телефону поруч із основною */
.tel-2{display:block;font-size:14.5px;font-weight:600;color:rgba(255,255,255,.8);margin-top:4px;}
.tel-2:hover{color:#fff;}

/* команда: троє лікарів — три колонки по центру */
.docs{grid-template-columns:repeat(3,1fr);max-width:960px;margin-left:auto;margin-right:auto;}

/* відгуки: заглушки, поки немає скрінів */
.rev-ph{flex:0 0 366px;height:320px;border:1px dashed #C6E1CD;border-radius:12px;background:var(--tone-soft-2);
  display:flex;align-items:center;justify-content:center;text-align:center;padding:20px;
  font-size:14px;font-weight:500;color:var(--color-text-secondary);scroll-snap-align:start;}

/* одна локація: фото фасаду + картка контактів */
.loc-one{display:grid;grid-template-columns:1.15fr 1fr;gap:44px;margin-top:44px;align-items:center;text-align:left;}
.loc-one .map{aspect-ratio:3/2;border-radius:14px;overflow:hidden;background:#EEF5F0;border:1px solid var(--color-border);}
.loc-one .map img{width:100%;height:100%;object-fit:cover;display:block;}
.loc-card h3{font-size:22px;margin:0 0 6px;}
.loc-card .addr{font-size:17px;color:var(--color-text);margin:0 0 22px;}
.loc-rows{list-style:none;margin:0 0 22px;padding:0;border-top:1px solid var(--color-border);}
.loc-rows li{display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--color-border);font-size:16px;}
.loc-rows svg{width:21px;height:21px;flex:none;color:var(--color-primary);margin-top:2px;}
.loc-rows a{font-weight:600;color:var(--color-text);}
.loc-rows a:hover{color:var(--color-primary-hover);}
.loc-rows small{display:block;font-size:14px;color:var(--color-text-secondary);}
.loc-card .msgs{gap:10px;}
.loc-card .msg{width:42px;height:42px;}

/* фінальний блок: два номери */
.final-phones{display:flex;flex-direction:column;align-items:center;gap:2px;}
.final-phones .final-phone + .final-phone{font-size:21px;color:rgba(255,255,255,.82);}

@media(max-width:920px){
  .docs{grid-template-columns:repeat(3,1fr);gap:18px;}
  .loc-one{grid-template-columns:1fr;gap:26px;}
  .rev-ph{flex:0 0 300px;height:280px;}
  .nav-right{gap:10px;}
}
@media(max-width:560px){
  .docs{grid-template-columns:1fr;gap:40px;max-width:420px;}
  .rev-ph{flex:0 0 286px;height:260px;}
  .brand img.logo-full{height:30px;}
  .lang a,.lang span{padding:6px 8px;}
}
@media(max-width:360px){
  .brand img.logo-full{height:26px;}
}

/* ══ сторінка подяки (dyakuyemo.html, ru/spasibo.html) ══ */
/* ── сторінка подяки ── */
.ty{padding:72px 0 0;position:relative;overflow-x:clip;}
.ty-glow{position:absolute;z-index:0;pointer-events:none;border-radius:50%;
  left:50%;top:-190px;width:min(940px,124vw);aspect-ratio:1;transform:translateX(-50%);
  background:radial-gradient(closest-side,rgba(205,232,214,.85),rgba(205,232,214,.34) 58%,rgba(205,232,214,0) 100%);}
.ty-panel{position:relative;max-width:760px;margin:0 auto;text-align:center;
  background:#E5F3E9;border-radius:var(--radius-lg);padding:46px 40px 40px;}
.ty-mark{width:76px;height:76px;border-radius:50%;background:var(--color-primary);color:#fff;
  display:flex;align-items:center;justify-content:center;margin:0 auto 24px;
  box-shadow:0 10px 28px rgba(10,133,54,.28);}
.ty-mark svg{width:38px;height:38px;}
.ty-panel h1{margin:0 0 16px;}
.ty-lead{font-size:19px;line-height:1.55;color:var(--color-text);margin:0 auto 16px;max-width:560px;}
.ty-hours{font-size:15px;color:var(--color-text-secondary);margin:0 auto;max-width:520px;}

.ty-next{position:relative;max-width:940px;margin:0 auto;padding:64px 0 0;}
.ty-next h2{text-align:center;margin:0 0 36px;}
.ty-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);}
.ty-steps li{padding:0 28px;border-left:1px solid var(--color-border);}
.ty-steps li:first-child{border-left:none;padding-left:0;}
.ty-steps li:last-child{padding-right:0;}
.ty-steps .num{display:flex;width:46px;height:46px;border-radius:50%;border:1px solid var(--color-border);
  align-items:center;justify-content:center;font-family:var(--font-heading);font-size:18px;font-weight:600;
  color:var(--color-primary-dark);background:#fff;margin:0 0 16px;}
.ty-steps h3{margin:0 0 8px;}
/* заголовок кроку 2 переноситься на два рядки — без цього абзаци в колонках
   стають на різній висоті й ряд читається рваним */
@media(min-width:921px){.ty-steps h3{min-height:52px;}}
.ty-steps p{margin:0;font-size:16px;color:var(--color-text-secondary);}

.ty-cta{background:linear-gradient(180deg,var(--green-mid) 0%,var(--green-deep) 100%);
  color:#fff;margin-top:76px;text-align:center;}
.ty-cta h2{color:#fff;margin:0 0 12px;}
.ty-cta .eyebrow{background:rgba(255,255,255,.15);color:#fff;}
.ty-cta-lead{color:rgba(255,255,255,.78);max-width:620px;margin:0 auto 28px;}
.ty-contact{display:flex;align-items:center;justify-content:center;gap:24px;flex-wrap:wrap;}
.ty-phone{font-family:var(--font-heading);font-size:clamp(28px,3.6vw,40px);font-weight:600;
  letter-spacing:-.01em;color:#fff;line-height:1.1;}
.ty-phone:hover{text-decoration:none;color:#fff;opacity:.86;}
.ty-cta .msg{border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.08);color:#fff;width:44px;height:44px;}
.ty-cta .msg:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.5);}
.ty-cta .msg svg{width:21px;height:21px;}
.ty-facts{display:grid;grid-template-columns:repeat(3,1fr);margin-top:48px;
  border-top:1px solid rgba(255,255,255,.15);text-align:left;}
.ty-facts .item{padding:24px 22px 0;border-left:1px solid rgba(255,255,255,.14);}
.ty-facts .item:first-child{border-left:none;padding-left:0;}
.ty-facts .val{display:block;font-family:var(--font-heading);font-size:24px;font-weight:600;color:#fff;line-height:1.2;}
.ty-facts .cap{font-size:14.5px;color:rgba(255,255,255,.7);}

.ty-back{padding:36px 0 68px;text-align:center;}
.ty-back .btn-ghost{color:var(--color-primary-dark);}

@media(max-width:920px){
  .ty{padding-top:40px;}
  .ty-panel{padding:34px 22px 30px;border-radius:14px;}
  .ty-mark{width:64px;height:64px;margin-bottom:18px;}
  .ty-mark svg{width:32px;height:32px;}
  .ty-lead{font-size:17px;}
  .ty-next{padding-top:48px;}
  .ty-next h2{margin-bottom:26px;}
  .ty-steps{grid-template-columns:1fr;}
  .ty-steps li{padding:22px 0 0;border-left:none;border-top:1px solid var(--color-border);}
  .ty-steps li:first-child{padding-top:0;border-top:none;}
  .ty-steps .num{margin-bottom:12px;}
  .ty-cta{margin-top:54px;}
  .ty-facts{grid-template-columns:1fr;margin-top:36px;}
  .ty-facts .item{border-left:none;border-top:1px solid rgba(255,255,255,.14);padding:16px 0 0;}
  .ty-facts .item:first-child{border-top:none;padding-top:24px;}
  .ty-back{padding:28px 0 48px;}
}

/* ══ юридичні сторінки (політика конфіденційності) ══ */
.legal{padding:60px 0 76px;position:relative;overflow-x:clip;}
.legal-glow{position:absolute;z-index:0;pointer-events:none;border-radius:50%;
  left:50%;top:-240px;width:min(820px,120vw);aspect-ratio:1;transform:translateX(-50%);
  background:radial-gradient(closest-side,rgba(205,232,214,.7),rgba(205,232,214,.26) 58%,rgba(205,232,214,0) 100%);}
.legal-col{position:relative;max-width:768px;margin:0 auto;}
.legal-col h1{font-size:clamp(30px,3.6vw,42px);margin:0 0 14px;}
.legal-meta{font-size:15px;color:var(--color-text-secondary);margin:0;}
.legal-toc{background:#E5F3E9;border-radius:var(--radius-lg);padding:26px 28px;margin:34px 0 8px;}
.legal-toc h2{font-family:var(--font-heading);font-size:16px;font-weight:600;margin:0 0 14px;color:var(--color-primary-dark);}
.legal-toc ol{margin:0;padding:0 0 0 20px;columns:2;column-gap:32px;font-size:15.5px;}
.legal-toc li{margin:0 0 7px;break-inside:avoid;}
.legal-toc a{color:var(--color-text-secondary);}
.legal-toc a:hover{color:var(--color-primary-dark);}
.legal-body{position:relative;}
.legal-body h2{font-size:23px;line-height:1.3;margin:46px 0 14px;scroll-margin-top:96px;}
.legal-body p{margin:0 0 14px;}
.legal-body ul{margin:0 0 16px;padding:0;list-style:none;}
.legal-body li{position:relative;padding-left:22px;margin:0 0 9px;}
.legal-body li::before{content:"";position:absolute;left:2px;top:11px;width:6px;height:6px;
  border-radius:50%;background:var(--color-primary);}
.legal-body a{text-decoration:underline;}
.legal-note{background:#E5F3E9;border-radius:var(--radius-md);padding:22px 24px;margin:26px 0;}
.legal-note p:last-child{margin:0;}
.legal-back{margin-top:48px;padding-top:26px;border-top:1px solid var(--color-border);}

@media(max-width:920px){
  .legal{padding:36px 0 56px;}
  .legal-toc{padding:22px 20px;border-radius:14px;}
  .legal-toc ol{columns:1;}
  .legal-body h2{font-size:21px;margin:36px 0 12px;scroll-margin-top:80px;}
}

/* ══ послуги: три ключові напрями + формати допомоги (2026-10-18) ══ */
.svc-panel.svc-3{grid-template-columns:repeat(3,1fr);}
.svc-panel.svc-3 .svc-col{border-top:none;border-left:1px solid #C6E1CD;}
.svc-panel.svc-3 .svc-col:first-child{border-left:none;}

.fmt-head{font-size:22px;margin:52px 0 0;text-align:center;}
.fmt-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:24px;text-align:left;}
.fmt{display:flex;flex-direction:column;gap:10px;background:#fff;border:1px solid var(--color-border);
  border-radius:16px;padding:26px 24px 24px;transition:border-color .15s,box-shadow .2s;}
.fmt:hover{border-color:#C6E1CD;box-shadow:0 12px 30px rgba(10,60,30,.08);}
.fmt .ic{width:48px;height:48px;border-radius:50%;background:#E5F3E9;color:var(--color-primary);
  display:flex;align-items:center;justify-content:center;flex:none;}
.fmt .ic svg{width:24px;height:24px;}
.fmt h3{font-size:19px;margin:6px 0 0;}
.fmt p{font-size:15px;line-height:1.55;color:var(--color-text-secondary);margin:0;}
.fmt .more{margin-top:auto;padding-top:6px;font-size:14.5px;font-weight:600;color:var(--color-primary-hover);}

@media(max-width:920px){
  .svc-panel.svc-3{grid-template-columns:1fr;}
  .svc-panel.svc-3 .svc-col,.svc-panel.svc-3 .svc-col:nth-child(n){border-left:none;border-top:1px solid #C6E1CD;}
  .svc-panel.svc-3 .svc-col:first-child{border-top:none;}
  .fmt-grid{grid-template-columns:1fr;gap:14px;}
  .fmt{display:grid;grid-template-columns:48px 1fr;column-gap:16px;row-gap:6px;padding:20px;}
  .fmt .ic{grid-row:1 / 4;}
  .fmt h3{margin:0;align-self:center;}
  .fmt-head{margin-top:40px;font-size:20px;}
}
