/* ============ tokens ============ */
:root{
  --ink:            #0F1D17;
  --ink-70:         #3C4E45;
  --ink-50:         #61736A;
  /* фирменные цвета «Доктор Боева» — бирюзовая палитра с drboeva.ru */
  --brand:          #058494;
  --brand-dark:     #03616d;
  --brand-light:    #38a8b5;
  --brand-tint:     #E3F1F4;
  --blue-tint:      #E6F1F8;
  /* алиасы под старые имена — чтобы не ломать остальную CSS */
  --green:          var(--brand);
  --green-dark:     var(--brand-dark);
  --green-light:    var(--brand-light);
  --green-tint:     var(--brand-tint);
  --white:          #FFFFFF;
  --line:           rgba(15,29,23,.10);

  --container:      1280px;
  --gutter:         32px;
  --radius:         18px;

  --shadow-card:    0 10px 30px -18px rgba(5,132,148,.30);
  --shadow-btn:     0 14px 32px -12px rgba(5,132,148,.55);
}

/* ============ base ============ */
*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  color:var(--ink);
  background:var(--white);
  font-size:16px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img{ max-width:100%; display:block; }
h1,h3,p,ul{ margin:0; }
ul{ padding:0; list-style:none; }
a{ text-decoration:none; color:inherit; }

.container{
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:var(--gutter);
}

.accent{ color:var(--green); }

/* ============ header ============ */
.header{
  position:fixed;
  top:10px;
  left:10px;
  right:10px;
  z-index:50;
  padding:10px 0;
  background:rgba(255,255,255,.62);
  backdrop-filter:saturate(180%) blur(22px);
  -webkit-backdrop-filter:saturate(180%) blur(22px);
  border:1px solid rgba(255,255,255,.55);
  border-radius:18px;
  box-shadow:0 10px 40px -12px rgba(15,29,23,.22);
  transition:background .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.header.is-scrolled{
  background:rgba(255,255,255,.82);
  box-shadow:0 14px 50px -14px rgba(15,29,23,.30);
  border-color:rgba(255,255,255,.70);
}

.header__inner{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:24px;
}

.header__logo{ justify-self:start; flex:none; }

.header__logo img{
  height:46px;
  width:auto;
  max-width:none;
  filter:brightness(0) saturate(100%) invert(34%) sepia(95%) saturate(7497%) hue-rotate(167deg) brightness(94%) contrast(101%);
}

/* --- меню по центру --- */
.nav__list{
  display:flex;
  align-items:center;
  gap:28px;
}

.nav__link{
  font-size:15px;
  font-weight:600;
  letter-spacing:-.01em;
  color:var(--ink-70);
  white-space:nowrap;
  transition:color .18s ease;
}

.nav__link:hover{ color:var(--green); }

/* --- правый блок: адреса, телефоны, кнопка --- */
.header__right{
  justify-self:end;
  display:flex;
  align-items:center;
  gap:22px;
}

.header__addr,
.header__phones{
  display:flex;
  flex-direction:column;
  line-height:1.32;
  white-space:nowrap;
}

.header__addr span{
  font-size:13px;
  color:var(--ink-50);
}

.header__phones a{
  font-size:14.5px;
  font-weight:700;
  letter-spacing:-.01em;
  color:var(--ink);
  transition:color .18s ease;
}

.header__phones a:hover{ color:var(--green); }

.header__cta.btn--primary{
  margin-top:0;
  padding:13px 26px;
  font-size:15px;
}

/* --- бургер (только мобильные) --- */
.burger{
  display:none;
  justify-self:end;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:44px;
  height:44px;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
}

.burger span{
  display:block;
  width:24px;
  height:2px;
  margin:0 auto;
  border-radius:2px;
  background:var(--ink);
  transition:transform .25s ease, opacity .2s ease;
}

.header.is-open .burger span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.header.is-open .burger span:nth-child(2){ opacity:0; }
.header.is-open .burger span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* --- выпадающее мобильное меню --- */
.mobile-nav{
  position:absolute;
  top:100%;
  left:0;
  right:0;
  margin-top:8px;
  padding:14px var(--gutter) 22px;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border-top:1px solid var(--line);
  box-shadow:var(--shadow-card);
  max-height:calc(100vh - 90px);
  overflow-y:auto;
}

.mobile-nav[hidden]{ display:none; }

.mobile-nav__list{
  display:flex;
  flex-direction:column;
}

.mobile-nav__list > li > a{
  display:block;
  padding:13px 2px;
  font-size:17px;
  font-weight:600;
  color:var(--ink);
  border-bottom:1px solid var(--line);
}

.mobile-nav__list > li > a:hover{ color:var(--green); }

/* раскрывающийся пункт (Услуги) */
.mobile-nav__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  padding:13px 2px;
  font-size:17px;
  font-weight:600;
  color:var(--ink);
  background:transparent;
  border:0;
  border-bottom:1px solid var(--line);
  text-align:left;
  cursor:pointer;
}

.mobile-nav__caret{
  transition:transform .25s ease;
  color:currentColor;
  flex:none;
}

.mobile-nav__item--dd.is-open .mobile-nav__caret,
.mobile-nav__sub-item--dd.is-open .mobile-nav__caret{
  transform:rotate(180deg);
}

/* подменю 2-го уровня (Терапия/Хирургия/Ортопедия) */
.mobile-nav__sub{
  margin:0;
  padding:4px 0 6px 12px;
  list-style:none;
  background:rgba(30,122,32,.04);
  border-bottom:1px solid var(--line);
}

.mobile-nav__sub[hidden]{ display:none; }

.mobile-nav__sub > li > a{
  display:block;
  padding:12px 2px;
  font-size:16px;
  font-weight:600;
  color:var(--ink-70);
  border-bottom:1px solid var(--line);
}

.mobile-nav__sub > li:last-child > a{ border-bottom:0; }

.mobile-nav__sub > li > a:hover{ color:var(--green); }

/* кнопка под-подменю (Терапия → раскрыть) */
.mobile-nav__sub-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  padding:12px 2px;
  font-size:16px;
  font-weight:600;
  color:var(--ink-70);
  background:transparent;
  border:0;
  border-bottom:1px solid var(--line);
  text-align:left;
  cursor:pointer;
}

.mobile-nav__sub-top:hover{ color:var(--green); }

/* подменю 3-го уровня */
.mobile-nav__sub-sub{
  margin:0;
  padding:4px 0 6px 14px;
  list-style:none;
}

.mobile-nav__sub-sub[hidden]{ display:none; }

.mobile-nav__sub-sub a{
  display:block;
  padding:11px 2px;
  font-size:15px;
  font-weight:500;
  color:var(--ink-50);
  border-bottom:1px solid var(--line);
}

.mobile-nav__sub-sub a:last-child{ border-bottom:0; }

.mobile-nav__sub-sub a:hover{ color:var(--green); }

.mobile-nav__contacts{
  display:flex;
  flex-direction:column;
  gap:5px;
  margin-top:16px;
}

.mobile-nav__contacts a{
  font-size:16px;
  font-weight:700;
  color:var(--ink);
}

.mobile-nav__contacts span{
  font-size:14px;
  color:var(--ink-50);
}

.mobile-nav__cta.btn--primary{
  margin-top:18px;
  width:100%;
  justify-content:center;
  padding:15px;
}

/* на десктопе мобильное меню не показываем никогда */
@media (min-width:961px){
  .mobile-nav{ display:none !important; }
}

/* ============ hero eyebrow ============ */
.hero__eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:18px;
  padding:8px 16px 8px 12px;
  border:1px solid rgba(5,132,148,.22);
  border-radius:999px;
  background:rgba(255,255,255,.7);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  font-size:13px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--green-dark);
  box-shadow:0 6px 18px -10px rgba(5,132,148,.25);
}
.hero__eyebrow-dot{
  width:8px; height:8px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--green-light),var(--green-dark));
  box-shadow:0 0 0 4px rgba(5,132,148,.12);
  animation:eyebrow-pulse 2.2s ease-in-out infinite;
}

/* ============ десктоп-дропдаун: Услуги → подменю ============ */

.nav__item--dd{ position:relative; }

.nav__link{ display:inline-flex; align-items:center; gap:5px; }

/* пункты меню «Услуги» — только для вида, без перехода,
   но курсор оставляем «палец», чтобы выглядели кликабельно */
.nav__item--dd > .nav__link,
.nav__dd-link,
.nav__sub a,
.mobile-nav__sub-sub a{ cursor:pointer; }

.nav__caret{
  transition:transform .25s ease;
  color:currentColor;
}

.nav__item--dd.is-open .nav__caret,
.nav__item--dd:hover .nav__caret{
  transform:rotate(180deg);
}

/* уровень 2 — выпадает вниз */
.nav__dd{
  position:absolute;
  top:calc(100% + 16px);
  left:-12px;
  min-width:240px;
  padding:10px;
  border-radius:18px;
  background:rgba(255,255,255,.81);
  backdrop-filter:saturate(180%) blur(22px);
  -webkit-backdrop-filter:saturate(180%) blur(22px);
  border:1px solid rgba(255,255,255,.7);
  box-shadow:0 18px 50px -16px rgba(15,29,23,.30);
  opacity:0;
  visibility:hidden;
  transform:translateY(-6px) scale(.98);
  transform-origin:top left;
  transition:opacity .22s ease, transform .22s ease, visibility .22s;
  z-index:60;
}

.nav__dd::before{
  content:"";
  position:absolute;
  top:-16px;
  left:0;
  right:0;
  height:16px;
}

.nav__item--dd:hover > .nav__dd,
.nav__item--dd:focus-within > .nav__dd,
.nav__item--dd.is-open > .nav__dd{
  opacity:1;
  visibility:visible;
  transform:translateY(0) scale(1);
}

.nav__dd-list{ display:flex; flex-direction:column; gap:2px; }

.nav__dd-item{ position:relative; }

.nav__dd-link{
  display:flex;
  align-items:center;
  gap:12px;
  padding:11px 14px;
  border-radius:12px;
  font-size:15px;
  font-weight:600;
  color:var(--ink);
  text-decoration:none;
  transition:background .18s ease, color .18s ease, transform .18s ease;
}

.nav__dd-link:hover,
.nav__dd-link:focus-visible{
  background:rgba(30,122,32,.10);
  color:var(--green);
  transform:translateX(2px);
}

.nav__dd-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  flex:none;
  border-radius:9px;
  background:rgba(30,122,32,.10);
  color:var(--green);
  transition:transform .25s cubic-bezier(.2,.7,.2,1), background .25s ease, color .25s ease;
}

.nav__dd-link:hover .nav__dd-icon{
  transform:rotate(-6deg) scale(1.06);
  background:var(--green);
  color:#fff;
}

.nav__dd-label{ flex:1 1 auto; }

.nav__dd-arrow{
  font-size:18px;
  line-height:1;
  color:var(--ink-50);
  transition:transform .25s ease, color .25s ease;
}

.nav__dd-link:hover .nav__dd-arrow{
  transform:translateX(3px);
  color:var(--green);
}

/* уровень 3 — выезжает вправо */
.nav__sub{
  position:absolute;
  top:-10px;
  left:calc(100% + 12px);
  min-width:240px;
  padding:10px;
  border-radius:18px;
  background:rgba(255,255,255,.87);
  backdrop-filter:saturate(180%) blur(22px);
  -webkit-backdrop-filter:saturate(180%) blur(22px);
  border:1px solid rgba(255,255,255,.7);
  box-shadow:0 18px 50px -16px rgba(15,29,23,.30);
  opacity:0;
  visibility:hidden;
  transform:translateX(-8px);
  transition:opacity .22s ease, transform .22s ease, visibility .22s;
  z-index:61;
}

.nav__sub::before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:-12px;
  width:12px;
}

.nav__dd-item:hover > .nav__sub,
.nav__dd-item:focus-within > .nav__sub{
  opacity:1;
  visibility:visible;
  transform:translateX(0);
}

.nav__sub li{ list-style:none; }

.nav__sub a{
  display:flex;
  align-items:center;
  gap:11px;
  padding:10px 14px;
  border-radius:11px;
  font-size:14.5px;
  font-weight:500;
  color:var(--ink);
  text-decoration:none;
  transition:background .18s ease, color .18s ease, transform .18s ease;
}

.nav__sub a:hover,
.nav__sub a:focus-visible{
  background:rgba(30,122,32,.10);
  color:var(--green);
  transform:translateX(2px);
}

.nav__sub-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  flex:none;
  border-radius:8px;
  background:rgba(30,122,32,.08);
  color:var(--green);
  transition:transform .25s cubic-bezier(.2,.7,.2,1), background .25s ease, color .25s ease;
}

.nav__sub a:hover .nav__sub-icon{
  transform:rotate(-8deg) scale(1.08);
  background:var(--green);
  color:#fff;
}

/* ============ hero ============ */
.hero{
  position:relative;
  isolation:isolate;
  min-height:min(920px,100vh);
  display:flex;
  overflow:hidden;
}

.hero__bg{
  position:absolute;
  inset:0;
  z-index:-2;
}

.hero__bg img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:58% 30%;
  transform:scale(1.04);
  filter:saturate(1.05);
}

/* световая вуаль: слева — читаемо, справа — виден интерьер клиники */
.hero__bg::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(115% 100% at 6% 50%,
      rgba(255,255,255,.985) 0%,
      rgba(255,255,255,.965) 40%,
      rgba(255,255,255,.86) 62%,
      rgba(255,255,255,.34) 85%,
      rgba(255,255,255,.2) 100%),
    linear-gradient(180deg,
      rgba(255,255,255,.5) 0%,
      rgba(255,255,255,.12) 38%,
      rgba(255,255,255,.42) 88%,
      rgba(255,255,255,.72) 100%);
}

.hero__inner{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1.14fr) minmax(0,.86fr);
  align-items:end;
  column-gap:20px;
  padding-top:150px;
  transform:translateY(-200px);
}

/* --- левая колонка --- */
.hero__content{
  position:relative;
  z-index:2;
  min-width:0;
  padding-bottom:76px;
  max-width:700px;
  transform:translateY(35px);
}

.hero__title{
  font-size:clamp(34px,3.35vw,50px);
  font-weight:800;
  line-height:1.08;
  letter-spacing:-.025em;
}

.hero__subtitle{
  margin-top:22px;
  max-width:560px;
  font-size:clamp(16px,1.25vw,18.5px);
  line-height:1.6;
  color:var(--ink-70);
}

/* --- кнопка --- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:12px;
  font:inherit;
  font-weight:700;
  font-size:17px;
  letter-spacing:-.01em;
  border:0;
  cursor:pointer;
  transition:transform .22s ease, box-shadow .22s ease, background-color .22s ease;
}

.btn--primary{
  margin-top:34px;
  padding:21px 36px;
  border-radius:999px;
  color:var(--white);
  background:linear-gradient(180deg,var(--green-light) 0%,var(--green) 55%,var(--green-dark) 100%);
  box-shadow:var(--shadow-btn);
}

.btn--primary:hover{
  transform:translateY(-2px);
  box-shadow:0 20px 40px -12px rgba(30,122,32,.6);
}

.btn--primary:active{ transform:translateY(0); }

.btn__icon{
  position:relative;
  flex:none;
  width:26px;
  height:26px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  border:2px solid transparent;
  transition:border-color .25s ease, background-color .25s ease;
}

.btn__icon svg{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
}

.btn__icon-arrow{
  opacity:1;
  transition:opacity .18s ease, transform .25s ease;
}

.btn__icon-check{
  opacity:0;
}

.btn__icon-check path{
  stroke-dasharray:16;
  stroke-dashoffset:16;
}

/* Наведение: рисуем кружок и белую галочку — как отмеченный чекпоинт */
.btn--primary:hover .btn__icon,
.btn--primary:focus-visible .btn__icon{
  border-color:currentColor;
}

.btn--primary:hover .btn__icon-arrow,
.btn--primary:focus-visible .btn__icon-arrow{
  opacity:0;
  transform:translate(-50%,-50%) scale(.6);
}

.btn--primary:hover .btn__icon-check,
.btn--primary:focus-visible .btn__icon-check{
  opacity:1;
  transition:opacity .1s ease .12s;
}

.btn--primary:hover .btn__icon-check path,
.btn--primary:focus-visible .btn__icon-check path{
  animation:btn-check-draw .35s ease .14s forwards;
}

@keyframes btn-check-draw{
  to{ stroke-dashoffset:0; }
}

@media (prefers-reduced-motion:reduce){
  .btn__icon,
  .btn__icon-arrow,
  .btn__icon-check,
  .btn__icon-check path{ transition:none; animation:none; }
  .btn--primary:hover .btn__icon-check path,
  .btn--primary:focus-visible .btn__icon-check path{ stroke-dashoffset:0; animation:none; }
}

/* --- 3 плашки --- */
.usp{
  margin-top:46px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}

.usp__item{
  padding:20px 20px 22px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  box-shadow:var(--shadow-card);
  transition:transform .22s ease, border-color .22s ease, background-color .22s ease;
}

.usp__item:hover{
  transform:translateY(-3px);
  border-color:rgba(30,122,32,.28);
  background:rgba(255,255,255,.86);
}

.usp__icon{
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  margin-bottom:14px;
  border-radius:12px;
  color:var(--green);
  background:var(--green-tint);
}

.usp__title{
  font-size:15.5px;
  font-weight:700;
  line-height:1.25;
  letter-spacing:-.015em;
}

.usp__text{
  margin-top:7px;
  font-size:13.5px;
  line-height:1.45;
  color:var(--ink-50);
}

/* --- фото врачей --- */
.hero__media{
  position:relative;
  z-index:1;
  min-width:0;
  align-self:end;
  display:flex;
  align-items:flex-end;
  justify-content:flex-end;
  overflow:visible;
  transform:translate(235px,200px);
}

/* picture-обёртка не должна ломать flex-раскладку */
.hero__media picture{ display:contents; }

/* контейнер под фото + подписи врачей */
.hero__figure{
  position:relative;
  flex:none;
  width:min(917px,166vw);
}

/* стеклянные плашки-подписи над врачами */
.doc-badge{
  position:absolute;
  z-index:3;
  max-width:220px;
  padding:12px 16px 14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(255,255,255,.60);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  box-shadow:var(--shadow-card);
}

.doc-badge__name{
  display:block;
  font-size:14.5px;
  font-weight:700;
  line-height:1.2;
  letter-spacing:-.015em;
  color:var(--ink);
}

.doc-badge__role{
  display:block;
  margin-top:5px;
  font-size:12.5px;
  font-weight:600;
  color:var(--green);
}

.doc-badge__exp{
  display:block;
  margin-top:2px;
  font-size:12.5px;
  color:var(--ink-50);
}

.doc-badge--left{  left:1%;   bottom:26%; }
.doc-badge--right{ right:2%;  bottom:7%;  }
@media (min-width:1360px){
  .doc-badge--left{  left:3%;   bottom:14%; }
  .doc-badge--right{ right:18%; bottom:11%; }
}

/* мягкая тень-подложка под врачами */
.hero__media::before{
  content:"";
  position:absolute;
  left:50%;
  bottom:-6px;
  width:78%;
  height:90px;
  transform:translateX(-50%);
  background:radial-gradient(50% 50% at 50% 50%,rgba(15,29,23,.22) 0%,rgba(15,29,23,0) 72%);
  filter:blur(4px);
}

.hero__doctors{
  display:block;
  width:100%;
  height:auto;
  filter:drop-shadow(0 24px 44px rgba(15,29,23,.18));
}

/* ============ адаптив ============ */
@media (max-width:1180px){
  :root{ --gutter:24px; }

  .nav__list{ gap:20px; }
  .nav__link{ font-size:14px; }
  .header__right{ gap:16px; }

  .hero__inner{
    column-gap:8px;
    padding-top:132px;
  }

  .hero__content{ padding-bottom:62px; }
  .usp{ gap:12px; }
  .usp__item{ padding:18px 16px 20px; }
  .usp__text{ font-size:13.5px; }
  .hero__doctors{ max-width:520px; }
}

@media (max-width:960px){
  .header__inner{
    display:flex;
    justify-content:space-between;
  }
  .nav{ display:none; }
  .header__right{ display:none; }
  .burger{ display:flex; }

  /* сбрасываем десктопные сдвиги/масштаб hero, чтобы на мобильном
     контент не налезал на шапку и врачи не уезжали за экран */
  .hero__inner{ transform:none; }
  .hero__content{ transform:none; }
  .hero__media{ transform:none; }
  .hero__figure{ width:100%; }
  .doc-badge{ display:none; }

  .hero{ min-height:0; }

  .hero__inner{
    grid-template-columns:minmax(0,1fr);
    row-gap:0;
    padding-top:124px;
  }

  .hero__content{
    max-width:none;
    padding-bottom:36px;
  }

  .hero__title{ font-size:clamp(32px,5.4vw,44px); }
  .hero__subtitle{ max-width:640px; }

  .hero__media{ justify-content:center; }

  .hero__doctors{
    max-width:600px;
    max-height:none;
    margin-inline:auto;
  }

  .hero__bg img{ object-position:38% 45%; }

  .hero__bg::after{
    background:
      radial-gradient(150% 78% at 50% 12%,
        rgba(255,255,255,.985) 0%,
        rgba(255,255,255,.96) 52%,
        rgba(255,255,255,.7) 100%),
      linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.5) 48%,rgba(255,255,255,.28) 78%,rgba(255,255,255,.5) 100%);
  }
}

@media (max-width:760px){
  .usp{
    grid-template-columns:1fr;
    gap:10px;
    margin-top:34px;
  }

  .usp__item{
    display:grid;
    grid-template-columns:44px 1fr;
    column-gap:14px;
    align-items:center;
    padding:14px 16px;
  }

  .usp__icon{
    grid-row:span 2;
    margin-bottom:0;
    width:44px;
    height:44px;
  }

  .usp__text{ margin-top:3px; }
}

@media (max-width:560px){
  :root{ --gutter:18px; }

  .header{ padding:20px 0; }
  .header__logo img{ height:40px; }
  .header__phones{ display:none; }
  .header__cta.btn--primary{ padding:11px 18px; font-size:14px; }

  .hero__inner{ padding-top:96px; }

  .hero__title{ font-size:29px; letter-spacing:-.02em; }
  .hero__title br{ display:none; }

  .hero__subtitle{
    margin-top:16px;
    font-size:15.5px;
  }

  .btn--primary{
    margin-top:26px;
    width:100%;
    justify-content:center;
    padding:18px 24px;
    font-size:16px;
  }

  .hero__content{ padding-bottom:24px; }

  .hero__media{ margin-inline:calc(var(--gutter) * -1); }

  .hero__doctors{
    max-width:none;
    width:100%;
  }
}

@media (prefers-reduced-motion:reduce){
  *{ transition:none !important; }
}

/* ============ секция «Наши врачи» ============ */
.doctors{
  padding:110px 0 120px;
  background:var(--blue-tint);
}

.section-head{
  max-width:660px;
  margin-bottom:52px;
}

.section-title{
  margin:0;
  font-size:clamp(32px,3.4vw,46px);
  line-height:1.1;
  font-weight:800;
  letter-spacing:-.03em;
}

.section-subtitle{
  margin-top:16px;
  color:var(--ink-50);
  font-size:17px;
  line-height:1.6;
}

.doctors__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:28px;
}

/* --- карточка врача --- */
.doc-card{
  display:flex;
  flex-direction:column;
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--white);
  box-shadow:var(--shadow-card);
  transition:transform .28s ease, box-shadow .28s ease;
}

.doc-card:hover{
  transform:translateY(-4px);
  box-shadow:0 22px 44px -22px rgba(15,29,23,.45);
}

.doc-card__photo{
  aspect-ratio:4/5;
  background:var(--blue-tint);
  overflow:hidden;
}

.doc-card__photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .5s ease;
}

.doc-card:hover .doc-card__photo img{ transform:scale(1.03); }

.doc-card__body{
  display:flex;
  flex-direction:column;
  flex:1;
  padding:24px;
}

.doc-card__name{
  font-size:20px;
  font-weight:700;
  line-height:1.25;
  letter-spacing:-.02em;
}

.doc-card__spec{
  margin-top:8px;
  color:var(--green);
  font-size:15px;
  font-weight:600;
  line-height:1.4;
}

.doc-card__exp{
  margin-top:5px;
  color:var(--ink-50);
  font-size:14px;
}

.doc-card__actions{
  display:flex;
  gap:10px;
  margin-top:auto;
  padding-top:22px;
}

/* --- кнопки карточек --- */
.btn-ghost,
.btn-solid{
  flex:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:13px 18px;
  border-radius:999px;
  font:inherit;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
  transition:background-color .22s ease, color .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.btn-ghost{
  border:1.6px solid var(--line);
  background:transparent;
  color:var(--ink);
}

.btn-ghost:hover{
  border-color:var(--green);
  color:var(--green);
  background:var(--green-tint);
}

.btn-solid{
  border:1.6px solid transparent;
  color:var(--white);
  background:linear-gradient(180deg,var(--green-light) 0%,var(--green) 55%,var(--green-dark) 100%);
  box-shadow:0 10px 22px -12px rgba(30,122,32,.6);
}

.btn-solid:hover{ box-shadow:0 16px 30px -12px rgba(30,122,32,.7); }

/* ============ выдвижная панель врача ============ */
body.is-locked{ overflow:hidden; }

.drawer{
  position:fixed;
  inset:0;
  z-index:60;
}

.drawer__overlay{
  position:absolute;
  inset:0;
  background:rgba(15,29,23,.45);
  opacity:0;
  transition:opacity .35s ease;
}

.drawer.is-open .drawer__overlay{ opacity:1; }

.drawer__panel{
  position:absolute;
  top:0;
  right:0;
  height:100%;
  width:min(680px,92vw);
  background:var(--white);
  box-shadow:-30px 0 60px -30px rgba(15,29,23,.5);
  transform:translateX(100%);
  transition:transform .42s cubic-bezier(.22,.61,.36,1);
  outline:none;
}

.drawer.is-open .drawer__panel{ transform:translateX(0); }

.drawer__close{
  position:absolute;
  top:22px;
  right:22px;
  z-index:2;
  width:42px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:50%;
  cursor:pointer;
  color:var(--ink);
  background:rgba(15,29,23,.06);
  transition:background-color .22s ease, transform .22s ease;
}

.drawer__close:hover{
  background:rgba(15,29,23,.12);
  transform:rotate(90deg);
}

.drawer__scroll{
  height:100%;
  overflow-y:auto;
  padding:52px 48px 56px;
}

/* --- шапка панели: фото + кнопка «Записаться» рядом --- */
.drawer__top{
  display:grid;
  grid-template-columns:200px 1fr;
  gap:26px;
  align-items:start;
}

.drawer__photo{
  border-radius:14px;
  overflow:hidden;
  background:var(--green-tint);
  aspect-ratio:4/5;
}

.drawer__photo img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.drawer__name{
  margin:0;
  font-size:26px;
  font-weight:800;
  line-height:1.2;
  letter-spacing:-.025em;
}

.drawer__spec{
  margin-top:10px;
  color:var(--green);
  font-size:16px;
  font-weight:600;
}

.drawer__exp{
  margin-top:5px;
  color:var(--ink-50);
  font-size:15px;
}

.drawer__cta{
  display:inline-flex;
  flex:none;
  margin-top:22px;
  padding:15px 34px;
}

.drawer__about{
  margin-top:32px;
  padding-top:28px;
  border-top:1px solid var(--line);
  color:var(--ink-70);
  font-size:16px;
  line-height:1.65;
}

.drawer__reviews-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px;
  margin-top:38px;
  margin-bottom:18px;
}

.drawer__reviews-head h4{
  margin:0;
  font-size:19px;
  font-weight:700;
  letter-spacing:-.02em;
}

.drawer__rating{
  color:var(--ink-50);
  font-size:14px;
  font-weight:600;
}

.doc-detail__reviews{
  display:grid;
  gap:14px;
}

.review{
  padding:20px 22px;
  border-radius:14px;
  background:var(--green-tint);
}

.review__text{
  color:var(--ink);
  font-size:15px;
  line-height:1.6;
}

.review__meta{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:12px;
  font-size:13px;
  color:var(--ink-50);
}

.review__meta b{
  color:var(--ink);
  font-weight:700;
}

.review__meta span::before{
  content:'';
  display:inline-block;
  width:4px;
  height:4px;
  margin-right:10px;
  border-radius:50%;
  background:currentColor;
  vertical-align:middle;
}

/* ============ адаптив: врачи ============ */
@media (max-width:1100px){
  .doctors__grid{ grid-template-columns:repeat(2,1fr); }
}

@media (max-width:900px){
  .drawer__scroll{ padding:48px 30px 44px; }
  .drawer__top{ grid-template-columns:160px 1fr; gap:20px; }
  .drawer__name{ font-size:23px; }
}

@media (max-width:640px){
  .doctors{ padding:70px 0 76px; }
  .section-head{ margin-bottom:36px; }
  .doctors__grid{ grid-template-columns:1fr; gap:20px; }

  .drawer__panel{ width:100%; }
  .drawer__scroll{ padding:44px 20px 40px; }
  .drawer__top{ grid-template-columns:1fr; }
  .drawer__photo{ max-width:220px; }
  .drawer__cta{ width:100%; }
}

/* ============ секция «Клиника» ============ */
.clinic{
  padding:110px 0 120px;
  background:var(--white);
}

/* --- бегущая строка --- */
.marquee{
  --mq-h:340px;
  --mq-gap:16px;
  --mq-speed:140s;

  position:relative;
  margin-top:48px;
  overflow:hidden;
  /* мягкое затухание по краям */
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);
}

.marquee__track{
  display:flex;
  width:max-content;
  will-change:transform;
  animation:marquee-ltr var(--mq-speed) linear infinite;
}

/* лента идёт слева направо */
@keyframes marquee-ltr{
  from{ transform:translate3d(-50%,0,0); }
  to  { transform:translate3d(0,0,0); }
}

/* пауза: наведение на фото либо открытый лайтбокс */
.marquee.is-paused .marquee__track{ animation-play-state:paused; }

.marquee__item{
  position:relative;
  flex:none;
  height:var(--mq-h);
  /* отступ несёт сам кадр, а не gap на треке: тогда половина ленты
     строго равна одной копии и цикл смыкается без рывка */
  margin:0 var(--mq-gap) 0 0;
  border-radius:16px;
  overflow:hidden;
  background:var(--blue-tint);
  cursor:zoom-in;
  border:0;
  padding:0;
}

.marquee__item picture{ display:block; height:100%; }

.marquee__item img{
  display:block;
  height:100%;
  width:auto;
  max-width:none;
  object-fit:cover;
  transition:transform .6s cubic-bezier(.22,.61,.36,1);
}

.marquee__item::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(15,29,23,0) 45%,rgba(15,29,23,.72) 100%);
  opacity:0;
  transition:opacity .35s ease;
  pointer-events:none;
}

.marquee__item:hover::after,
.marquee__item:focus-visible::after{ opacity:1; }

.marquee__item:hover img,
.marquee__item:focus-visible img{ transform:scale(1.05); }

.marquee__cap{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  z-index:2;
  padding:20px 22px;
  color:var(--white);
  font-size:15px;
  font-weight:700;
  letter-spacing:-.01em;
  pointer-events:none;
}

.marquee__cap span{
  display:inline-block;
  transform:translateY(10px);
  opacity:0;
  transition:transform .38s cubic-bezier(.22,.61,.36,1), opacity .3s ease;
}

.marquee__item:hover .marquee__cap span,
.marquee__item:focus-visible .marquee__cap span{
  transform:translateY(0);
  opacity:1;
}

/* ============ лайтбокс ============ */
/* display:flex ниже перебивает браузерное [hidden]{display:none},
   поэтому скрытие задаём явно — иначе пустой оверлей висит
   поверх страницы и перехватывает все клики */
.lightbox[hidden]{ display:none; }
.drawer[hidden]{ display:none; }

.lightbox{
  position:fixed;
  inset:0;
  z-index:80;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:40px;
  background:rgba(9,18,14,.92);
  opacity:0;
  transition:opacity .3s ease;
}

.lightbox.is-open{ opacity:1; }

.lightbox__stage{
  margin:0;
  max-width:min(1100px,100%);
  max-height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
}

.lightbox__stage img{
  max-width:100%;
  max-height:78vh;
  width:auto;
  border-radius:12px;
  object-fit:contain;
}

.lightbox__stage figcaption{
  color:rgba(255,255,255,.82);
  font-size:15px;
  font-weight:600;
  text-align:center;
}

.lightbox__close,
.lightbox__nav{
  flex:none;
  width:48px;
  height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:50%;
  cursor:pointer;
  color:var(--white);
  background:rgba(255,255,255,.12);
  transition:background-color .22s ease, transform .22s ease;
}

.lightbox__close:hover,
.lightbox__nav:hover{ background:rgba(255,255,255,.24); }

.lightbox__close{
  position:absolute;
  top:24px;
  right:28px;
  z-index:2;
}

.lightbox__close:hover{ transform:rotate(90deg); }

/* ============ адаптив: клиника ============ */
@media (max-width:1100px){
  .marquee{ --mq-h:280px; }
}

@media (max-width:640px){
  .clinic{ padding:70px 0 76px; }

  .marquee{
    --mq-h:210px;
    --mq-gap:10px;
    --mq-speed:95s;
    margin-top:32px;
    /* края обрезаем слабее — экран узкий */
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 4%,#000 96%,transparent 100%);
            mask-image:linear-gradient(90deg,transparent 0,#000 4%,#000 96%,transparent 100%);
  }

  .marquee__item{ border-radius:12px; }

  /* на тач-экранах ховера нет — подпись видна всегда */
  .marquee__item::after{ opacity:1; }

  .marquee__cap{
    padding:14px 16px;
    font-size:13px;
  }

  .marquee__cap span{ transform:none; opacity:1; }

  .lightbox{ padding:16px; gap:4px; }
  .lightbox__nav{ width:40px; height:40px; }
  .lightbox__close{ top:14px; right:16px; }
  .lightbox__stage img{ max-height:70vh; }
}

/* при отключённой анимации лента не едет, а листается вручную */
@media (prefers-reduced-motion:reduce){
  .marquee{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
  .marquee__track{ animation:none; }
}


/* ============ секция «Отзывы» ============ */
.reviews{
  padding:110px 0 120px;
  background:linear-gradient(180deg,#058494 0%,#03616d 100%);
  color:#fff;
  position:relative;
  overflow:hidden;
}
.reviews::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(60% 50% at 100% 0%,rgba(56,168,181,.35) 0%,transparent 60%),
    radial-gradient(50% 40% at 0% 100%,rgba(255,210,122,.16) 0%,transparent 65%);
  pointer-events:none;
}
.reviews > *{ position:relative; z-index:1; }

.section-head--light .section-title{ color:var(--white); }
.section-head--light .section-subtitle{ color:rgba(255,255,255,.78); }

.rv{
  display:grid;
  grid-template-columns:330px minmax(0,1fr);
  gap:26px;
  align-items:start;
}

/* --- левая карточка-сводка --- */
.rv__summary{
  padding:30px 26px 26px;
  border-radius:var(--radius);
  background:var(--white);
  box-shadow:0 20px 44px -26px rgba(9,26,34,.6);
  text-align:center;
}

.rv__score{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
}

.rv__score-stars{
  color:#FFB020;
  font-size:17px;
  letter-spacing:3px;
}

.rv__score-num{
  font-size:52px;
  font-weight:800;
  line-height:1;
  letter-spacing:-.04em;
  color:var(--ink);
}

.rv__count{
  margin-top:6px;
  font-size:13px;
  color:var(--ink-50);
}

.rv__title{
  margin-top:16px;
  font-size:20px;
  font-weight:800;
  letter-spacing:-.02em;
}

.rv__lead{
  margin-top:8px;
  font-size:14px;
  line-height:1.5;
  color:var(--ink-50);
}

.rv__srclabel{
  margin-top:20px;
  font-size:13px;
  color:var(--ink-50);
}

.rv__sources{
  display:flex;
  justify-content:center;
  gap:8px;
  margin-top:10px;
}

.rv__src{
  width:30px;
  height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:var(--white);
  font-size:13px;
  font-weight:800;
}

.rv__src--ya{ background:#F53A3A; }
.rv__src--2gis{ background:#19AA1E; }
.rv__src--pd{ background:#2C7BE5; }
.rv__src--32{ background:#F0A017; font-size:11px; }

/* --- шкалы --- */
.rv__bars{
  display:grid;
  gap:9px;
  margin-top:22px;
  text-align:left;
}

.rv__bar{
  display:grid;
  grid-template-columns:1fr 76px 26px;
  align-items:center;
  gap:9px;
  font-size:12.5px;
  color:var(--ink-70);
}

.rv__bar-track{
  height:6px;
  border-radius:99px;
  background:rgba(15,29,23,.09);
  overflow:hidden;
}

.rv__bar-track i{
  display:block;
  height:100%;
  border-radius:99px;
  background:linear-gradient(90deg,var(--green-light),var(--green));
}

.rv__bar-val{
  text-align:right;
  color:var(--ink-50);
}

.rv__bars-note{
  margin-top:12px;
  font-size:11.5px;
  line-height:1.45;
  color:var(--ink-50);
  text-align:left;
}

.rv__cta{
  width:100%;
  margin-top:20px;
  padding:15px 20px;
}

/* --- лента --- */
.rv__feed{ min-width:0; }

.rv__filters{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:18px;
}

.rv__chip{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:9px 16px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:999px;
  background:rgba(255,255,255,.10);
  color:var(--white);
  font:inherit;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  transition:background-color .2s ease, color .2s ease, border-color .2s ease;
}

.rv__chip:hover{ background:rgba(255,255,255,.2); }

.rv__chip.is-active{
  background:var(--white);
  border-color:var(--white);
  color:var(--ink);
}

/* --- слайдер --- */
.rv__slider{ position:relative; }

.rv__track{
  display:flex;
  gap:18px;
  overflow-x:auto;
  scroll-behavior:smooth;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  padding-bottom:4px;
}

.rv__track::-webkit-scrollbar{ display:none; }

.rv__card{
  flex:none;
  width:calc((100% - 36px) / 3);
  scroll-snap-align:start;
  padding:22px 22px 24px;
  border-radius:var(--radius);
  background:var(--white);
  box-shadow:0 20px 44px -26px rgba(9,26,34,.6);
}

.rv__card[hidden]{ display:none; }

.rv__card-src{
  font-size:13px;
  font-weight:700;
  color:var(--ink-50);
}

.rv__who{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:14px;
}

.rv__ava{
  flex:none;
  width:42px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:var(--ava,#7C9CB4);
  color:var(--white);
  font-size:17px;
  font-weight:700;
}

.rv__name{
  display:block;
  font-size:16px;
  font-weight:700;
  letter-spacing:-.01em;
}

.rv__meta{
  margin-top:3px;
  font-size:12.5px;
  color:var(--ink-50);
}

.rv__stars{
  color:#FFB020;
  font-size:13px;
  letter-spacing:1px;
}

.rv__text{
  margin-top:14px;
  font-size:14.5px;
  line-height:1.6;
  color:var(--ink-70);
}

/* превью фотографий в отзыве (если они есть) */
.rv__shots{
  display:flex;
  gap:8px;
  margin-top:14px;
}

.rv__shots img{
  width:76px;
  height:64px;
  border-radius:10px;
  object-fit:cover;
}

/* --- стрелки --- */
.rv__nav{
  position:absolute;
  top:50%;
  z-index:3;
  transform:translateY(-50%);
  width:44px;
  height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:50%;
  cursor:pointer;
  color:var(--ink);
  background:#DDE6EB;
  transition:background-color .2s ease, opacity .2s ease;
}

.rv__nav:hover:not(:disabled){ background:#CBD8E0; }

.rv__nav--prev{ left:-16px; }
.rv__nav--next{ right:-16px; }

.rv__nav:disabled{
  opacity:.35;
  cursor:default;
}

/* --- точки --- */
.rv__dots{
  display:flex;
  justify-content:center;
  gap:8px;
  margin-top:22px;
}

.rv__dot{
  width:8px;
  height:8px;
  padding:0;
  border:0;
  border-radius:50%;
  cursor:pointer;
  background:rgba(255,255,255,.4);
  transition:background-color .2s ease, width .25s ease;
}

.rv__dot.is-active{
  width:22px;
  border-radius:99px;
  background:var(--green-light);
}

/* ============ форма отзыва ============ */
.rvform[hidden]{ display:none; }

.rvform{
  position:fixed;
  inset:0;
  z-index:90;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
}

.rvform__overlay{
  position:absolute;
  inset:0;
  background:rgba(9,26,34,.55);
  opacity:0;
  transition:opacity .3s ease;
}

.rvform.is-open .rvform__overlay{ opacity:1; }

.rvform__panel{
  position:relative;
  width:min(520px,100%);
  max-height:100%;
  overflow-y:auto;
  padding:34px 34px 30px;
  border-radius:20px;
  background:var(--white);
  box-shadow:0 40px 80px -40px rgba(9,26,34,.8);
  transform:translateY(16px) scale(.98);
  opacity:0;
  transition:transform .32s cubic-bezier(.22,.61,.36,1), opacity .28s ease;
  outline:none;
}

.rvform.is-open .rvform__panel{
  transform:translateY(0) scale(1);
  opacity:1;
}

.rvform__close{
  position:absolute;
  top:18px;
  right:18px;
  width:38px;
  height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:50%;
  cursor:pointer;
  color:var(--ink);
  background:rgba(15,29,23,.06);
  transition:background-color .2s ease, transform .2s ease;
}

.rvform__close:hover{
  background:rgba(15,29,23,.12);
  transform:rotate(90deg);
}

.rvform__title{
  margin:0;
  font-size:24px;
  font-weight:800;
  letter-spacing:-.025em;
}

.rvform__lead{
  margin-top:8px;
  font-size:14.5px;
  line-height:1.5;
  color:var(--ink-50);
}

.rvform__field{
  display:block;
  margin-top:18px;
}

.rvform__field > span{
  display:block;
  margin-bottom:7px;
  font-size:14px;
  font-weight:600;
}

.rvform__field > span i{
  font-style:normal;
  font-weight:500;
  color:var(--ink-50);
}

.rvform__field input,
.rvform__field textarea{
  width:100%;
  padding:13px 15px;
  border:1.6px solid var(--line);
  border-radius:12px;
  font:inherit;
  font-size:15px;
  color:var(--ink);
  background:var(--white);
  resize:vertical;
  transition:border-color .2s ease, box-shadow .2s ease;
}

.rvform__field input:focus,
.rvform__field textarea:focus{
  outline:none;
  border-color:var(--green);
  box-shadow:0 0 0 3px rgba(30,122,32,.14);
}

.rvform__field input.is-invalid,
.rvform__field textarea.is-invalid{
  border-color:#D94A4A;
  box-shadow:0 0 0 3px rgba(217,74,74,.13);
}

/* --- звёзды в форме --- */
.rvform__stars{
  display:flex;
  gap:4px;
}

.rvform__stars button{
  padding:2px;
  border:0;
  background:none;
  cursor:pointer;
  font-size:30px;
  line-height:1;
  color:rgba(15,29,23,.18);
  transition:color .15s ease, transform .15s ease;
}

.rvform__stars button:hover{ transform:scale(1.12); }
.rvform__stars button.is-on{ color:#FFB020; }

.rvform__error{
  margin-top:14px;
  padding:11px 14px;
  border-radius:10px;
  background:rgba(217,74,74,.1);
  color:#B93636;
  font-size:14px;
}

.rvform__error[hidden]{ display:none; }

.rvform__submit{
  width:100%;
  margin-top:22px;
  padding:16px 22px;
}

.rvform__submit[disabled]{
  opacity:.6;
  cursor:default;
}

.rvform__policy{
  margin-top:12px;
  font-size:12px;
  line-height:1.45;
  color:var(--ink-50);
  text-align:center;
}

/* --- экран «спасибо» --- */
.rvform__done[hidden]{ display:none; }

.rvform__done{ text-align:center; padding:14px 0 6px; }

.rvform__done-ico{
  width:66px;
  height:66px;
  margin:0 auto 16px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:var(--white);
  background:linear-gradient(180deg,var(--green-light),var(--green));
}

.rvform__done h4{
  margin:0;
  font-size:22px;
  font-weight:800;
  letter-spacing:-.02em;
}

.rvform__done p{
  margin-top:9px;
  font-size:15px;
  line-height:1.55;
  color:var(--ink-50);
}

.rvform__done .btn-ghost{
  flex:none;
  width:auto;
  margin-top:20px;
  padding:12px 30px;
}

/* ============ адаптив: отзывы ============ */
@media (max-width:1100px){
  .rv{ grid-template-columns:1fr; }
  .rv__card{ width:calc((100% - 18px) / 2); }
  .rv__nav--prev{ left:-8px; }
  .rv__nav--next{ right:-8px; }
}

@media (max-width:640px){
  .reviews{ padding:70px 0 76px; }

  .rv{ gap:18px; }
  .rv__summary{ padding:26px 20px 22px; }
  .rv__score-num{ font-size:44px; }

  .rv__card{
    width:88%;
    padding:20px;
  }

  .rv__track{ gap:12px; }

  /* стрелки на мобильном не нужны — листаем свайпом */
  .rv__nav{ display:none; }

  .rvform{ padding:0; align-items:flex-end; }

  .rvform__panel{
    width:100%;
    max-height:92vh;
    padding:28px 20px 24px;
    border-radius:20px 20px 0 0;
    transform:translateY(100%);
  }

  .rvform.is-open .rvform__panel{ transform:translateY(0); }
}

/* сводка на планшете: оценка | шкалы | площадки + кнопка */
@media (max-width:1100px) and (min-width:700px){
  .rv__summary{
    display:grid;
    grid-template-columns:170px minmax(0,1fr) 220px;
    grid-template-rows:auto auto 1fr;
    column-gap:32px;
    align-items:center;
    padding:28px 30px;
    text-align:left;
  }
  .rv__score{ grid-column:1; grid-row:1 / 4; }
  .rv__bars{ grid-column:2; grid-row:1 / 4; margin-top:0; }
  .rv__srclabel{ grid-column:3; grid-row:1; margin-top:0; }
  .rv__sources{ grid-column:3; grid-row:2; justify-content:flex-start; }
  .rv__cta{ grid-column:3; grid-row:3; align-self:start; margin-top:14px; }
}

/* --- ссылки на все отзывы --- */
.rv__links{
  margin-top:38px;
  padding-top:30px;
  border-top:1px solid rgba(255,255,255,.2);
}

.rv__links-title{
  margin-bottom:16px;
  color:rgba(255,255,255,.82);
  font-size:15px;
  font-weight:600;
}

.rv__links-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}

.rv__link{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:14px;
  background:rgba(255,255,255,.08);
  color:var(--white);
  transition:background-color .2s ease, border-color .2s ease, transform .2s ease;
}

.rv__link:hover{
  background:rgba(255,255,255,.16);
  border-color:rgba(255,255,255,.4);
  transform:translateY(-2px);
}

.rv__link .rv__src{ flex:none; }

.rv__link-body{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
  flex:1;
}

.rv__link-body b{
  font-size:14.5px;
  font-weight:700;
  letter-spacing:-.01em;
}

.rv__link-body i{
  font-style:normal;
  font-size:12.5px;
  color:rgba(255,255,255,.7);
}

.rv__link > svg{
  flex:none;
  opacity:.75;
  transition:transform .2s ease;
}

.rv__link:hover > svg{ transform:translateX(3px); }

@media (max-width:1100px){
  .rv__links-grid{ grid-template-columns:repeat(2,1fr); }
}

@media (max-width:640px){
  .rv__links{ margin-top:28px; padding-top:24px; }
  .rv__links-grid{ grid-template-columns:1fr; gap:10px; }
}

/* ============ модальное окно записи ============ */
.book[hidden]{ display:none; }

.book{
  position:fixed;
  inset:0;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
}

.book__overlay{
  position:absolute;
  inset:0;
  background:rgba(9,26,34,.55);
  opacity:0;
  transition:opacity .3s ease;
}

.book.is-open .book__overlay{ opacity:1; }

.book__panel{
  position:relative;
  display:flex;
  flex-direction:column;
  width:min(520px,100%);
  max-height:100%;
  overflow-y:auto;
  padding:32px 32px 28px;
  border-radius:20px;
  background:var(--white);
  box-shadow:0 40px 80px -40px rgba(9,26,34,.8);
  transform:translateY(16px) scale(.98);
  opacity:0;
  transition:transform .32s cubic-bezier(.22,.61,.36,1), opacity .28s ease;
  outline:none;
}

.book.is-open .book__panel{
  transform:translateY(0) scale(1);
  opacity:1;
}

/* в режиме виджета окно шире и без внутренних отступов снизу */
.book.book_widget-mode .book__panel{
  width:min(680px,100%);
  height:min(760px,100%);
  padding:26px 26px 0;
  overflow:hidden;
}

.book__close{
  position:absolute;
  top:16px;
  right:16px;
  z-index:2;
  width:38px;
  height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:50%;
  cursor:pointer;
  color:var(--ink);
  background:rgba(15,29,23,.06);
  transition:background-color .2s ease, transform .2s ease;
}

.book__close:hover{
  background:rgba(15,29,23,.12);
  transform:rotate(90deg);
}

.book__head{ flex:none; padding-right:44px; }

.book__title{
  margin:0;
  font-size:23px;
  font-weight:800;
  letter-spacing:-.025em;
}

.book__doc{
  margin-top:6px;
  color:var(--green);
  font-size:15px;
  font-weight:600;
}

.book__doc[hidden]{ display:none; }

/* --- виджет MedFlex --- */
.book__widget{
  flex:1;
  min-height:0;
  margin-top:16px;
  margin-inline:-26px;
}

.book__widget[hidden]{ display:none; }

.book__widget iframe{
  display:block;
  width:100%;
  height:100%;
  min-height:520px;
  border:0;
}

/* --- форма заявки --- */
.book__form[hidden]{ display:none; }

.book__lead{
  margin-top:10px;
  font-size:14.5px;
  line-height:1.5;
  color:var(--ink-50);
}

.book__field{
  display:block;
  margin-top:16px;
}

.book__field > span{
  display:block;
  margin-bottom:7px;
  font-size:14px;
  font-weight:600;
}

.book__field > span i{
  font-style:normal;
  font-weight:500;
  color:var(--ink-50);
}

.book__field input,
.book__field textarea{
  width:100%;
  padding:13px 15px;
  border:1.6px solid var(--line);
  border-radius:12px;
  font:inherit;
  font-size:15px;
  color:var(--ink);
  background:var(--white);
  resize:vertical;
  transition:border-color .2s ease, box-shadow .2s ease;
}

.book__field input:focus,
.book__field textarea:focus{
  outline:none;
  border-color:var(--green);
  box-shadow:0 0 0 3px rgba(30,122,32,.14);
}

.book__field input.is-invalid,
.book__field textarea.is-invalid{
  border-color:#D94A4A;
  box-shadow:0 0 0 3px rgba(217,74,74,.13);
}

.book__error{
  margin-top:14px;
  padding:11px 14px;
  border-radius:10px;
  background:rgba(217,74,74,.1);
  color:#B93636;
  font-size:14px;
}

.book__error[hidden]{ display:none; }

.book__submit{
  width:100%;
  margin-top:20px;
  padding:16px 22px;
}

.book__submit[disabled]{
  opacity:.6;
  cursor:default;
}

.book__policy{
  margin-top:12px;
  font-size:12px;
  line-height:1.45;
  color:var(--ink-50);
  text-align:center;
}

/* --- экран «отправлено» --- */
.book__done[hidden]{ display:none; }

.book__done{ text-align:center; padding:18px 0 6px; }

.book__done-ico{
  width:66px;
  height:66px;
  margin:0 auto 16px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:var(--white);
  background:linear-gradient(180deg,var(--green-light),var(--green));
}

.book__done h4{
  margin:0;
  font-size:21px;
  font-weight:800;
  letter-spacing:-.02em;
}

.book__done p{
  margin-top:9px;
  font-size:15px;
  line-height:1.55;
  color:var(--ink-50);
}

.book__done .btn-ghost{
  flex:none;
  width:auto;
  margin-top:20px;
  padding:12px 30px;
}

@media (max-width:640px){
  .book{ padding:0; align-items:flex-end; }

  .book__panel{
    width:100%;
    max-height:94vh;
    padding:26px 20px 22px;
    border-radius:20px 20px 0 0;
    transform:translateY(100%);
  }

  .book.book_widget-mode .book__panel{
    width:100%;
    height:94vh;
    padding:24px 16px 0;
  }

  .book.is-open .book__panel{ transform:translateY(0); }

  .book__widget{ margin-inline:-16px; }
}

/* ============ promo — Наши акции ============ */

.promo{
  position:relative;
  padding:104px 0 96px;
  background:var(--blue-tint);
  overflow:hidden;
  isolation:isolate;
}

/* фоновая картинка (параллакс) */
.promo__bg{
  position:absolute;
  top:-20%;
  left:0;
  right:0;
  height:140%;
  z-index:0;
  will-change:transform;
  pointer-events:none;
}

.promo__bg img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
  opacity:.35;
  filter:saturate(1.05);
}

/* светлая вуаль поверх фото — чтобы текст и плашки хорошо читались */
.promo__veil{
  position:absolute;
  inset:0;
  z-index:0;
  background:linear-gradient(180deg,
    rgba(230,241,248,.55) 0%,
    rgba(230,241,248,.40) 50%,
    rgba(230,241,248,.55) 100%);
  pointer-events:none;
}

.promo .container{ position:relative; z-index:1; }

/* карточки на фоне с фото — добавляем лёгкий фон для читаемости */
.promo__card .promo__poster{
  box-shadow:0 14px 34px -12px rgba(15,29,23,.35);
}

.promo .container{ position:relative; z-index:1; }

.promo__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  margin:0;
  padding:0;
  list-style:none;
  align-items:stretch;
}

/* ---- карточка (без плашки — только фото + кнопка) ---- */
.promo__card{
  position:relative;
  display:flex;
  flex-direction:column;
  background:transparent;
  box-shadow:none;
  border-radius:0;
  overflow:visible;
  transform-style:preserve-3d;
  will-change:transform;
  cursor:default;
  isolation:isolate;
  /* начальное состояние для анимации появления */
  opacity:0;
  transform:translateY(36px) scale(.97);
  transition:
    transform .45s cubic-bezier(.2,.7,.2,1),
    opacity .7s ease;
}

.promo__card.is-in{
  opacity:1;
  transform:translateY(0) scale(1);
}

/* ---- постер (фото) — скругление 30px ---- */
.promo__poster{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3/4;
  object-fit:cover;
  object-position:center;
  border-radius:30px;
  box-shadow:0 12px 30px -12px rgba(15,29,23,.25);
  transition:transform .7s cubic-bezier(.2,.7,.2,1), box-shadow .45s ease;
}

.promo__card:hover .promo__poster{
  transform:scale(1.025);
  box-shadow:0 24px 50px -16px rgba(15,29,23,.40);
}

/* === адаптив === */
@media (max-width:1080px){
  .promo__grid{ grid-template-columns:1fr 1fr; }
}

@media (max-width:720px){
  .promo{ padding:64px 0 56px; }
  .promo__grid{ grid-template-columns:1fr; gap:18px; }
  .promo__card{ border-radius:20px; }
}

@media (prefers-reduced-motion: reduce){
  .promo__card{ transition:opacity .4s ease, box-shadow .4s ease; transform:none; }
  .promo__poster{ transition:none; }
}

/* ============ services.html — страница услуг ============ */

.page-hero{
  padding:160px 0 60px;
  background:linear-gradient(180deg, var(--blue-tint) 0%, #fff 100%);
}

.crumbs{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  color:var(--ink-50);
  margin-bottom:20px;
}

.crumbs a{
  color:var(--ink-50);
  text-decoration:none;
  transition:color .18s ease;
}

.crumbs a:hover{ color:var(--green); }
.crumbs span{ color:var(--ink-50); }

.page-hero__title{
  font-size:clamp(40px,5vw,64px);
  line-height:1.05;
  font-weight:800;
  letter-spacing:-.03em;
  margin:0 0 18px;
}

.page-hero__lead{
  max-width:680px;
  font-size:18px;
  line-height:1.6;
  color:var(--ink-50);
  margin:0;
}

.srv{ padding:90px 0; }
.srv--alt{ background:var(--blue-tint); }

.srv__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin:0;
  padding:0;
  list-style:none;
}

.srv__item{
  display:flex;
  flex-direction:column;
  padding:28px 26px 26px;
  border-radius:20px;
  background:#fff;
  box-shadow:0 6px 20px -10px rgba(15,29,23,.18);
  transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease;
}

.srv__item:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 40px -16px rgba(15,29,23,.30);
}

.srv__name{
  font-size:19px;
  font-weight:700;
  line-height:1.3;
  margin:0 0 10px;
  color:var(--ink);
}

.srv__desc{
  font-size:14.5px;
  line-height:1.55;
  color:var(--ink-50);
  margin:0 0 18px;
  flex:1 1 auto;
}

.srv__price{
  display:inline-flex;
  align-items:center;
  gap:6px;
  align-self:flex-start;
  padding:7px 14px;
  border-radius:999px;
  background:var(--green-tint);
  color:var(--green);
  font-size:15px;
  font-weight:700;
  margin-bottom:18px;
}

.srv__cta{
  align-self:flex-start;
  text-decoration:none;
}

@media (max-width:960px){
  .srv__grid{ grid-template-columns:1fr 1fr; gap:16px; }
  .page-hero{ padding:130px 0 40px; }
}

@media (max-width:600px){
  .srv__grid{ grid-template-columns:1fr; }
  .srv{ padding:60px 0; }
  .page-hero__title{ font-size:clamp(34px,8vw,46px); }
}

/* ============ fallback: пока нет реальных фото ============ */
.hero__bg{ background:#F4F8FB; }
.hero__bg img{ opacity:0; }
.doc-badge__name{ color:var(--ink); }

/* ============ overrides под фото в формате JPEG (не PNG) ============ */
.hero__media{
  transform:none;
  justify-content:center;
  align-items:center;
}
.hero__figure{
  width:min(640px,100%);
  border-radius:24px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 30px 60px -24px rgba(5,132,148,.30), 0 8px 24px -12px rgba(15,29,23,.18);
}
.hero__doctors{
  width:100%;
  height:auto;
  aspect-ratio:4/5;
  object-fit:cover;
  object-position:center 25%;
  filter:brightness(1.08) saturate(1.04) contrast(1.02);
}

/* показываем интерьер клиники на фоне hero (справа сквозь вуаль) */
.hero__bg img{ opacity:1; }

/* ============ reveal-анимации ============ */
.reveal{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1);
}
.reveal.is-in{ opacity:1; transform:none; }
.reveal--d1{ transition-delay:.08s; }
.reveal--d2{ transition-delay:.16s; }
.reveal--d3{ transition-delay:.24s; }
@media (prefers-reduced-motion:reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
}

/* ============ секция «Преимущества» ============ */
.advantages{ padding:104px 0 96px; background:var(--white); position:relative; overflow:hidden; }
.advantages::before{
  content:"";
  position:absolute;
  top:-200px; right:-200px;
  width:600px; height:600px;
  background:radial-gradient(circle,rgba(56,168,181,.08) 0%,transparent 65%);
  pointer-events:none;
  z-index:0;
}
.advantages .container{ position:relative; z-index:1; }

.adv__grid{
  margin-top:52px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
}

.adv__card{
  display:flex;
  flex-direction:column;
  padding:30px 26px 28px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--white);
  box-shadow:var(--shadow-card);
  transition:transform .26s ease, box-shadow .26s ease, border-color .26s ease;
}

.adv__card:hover{
  transform:translateY(-5px);
  border-color:rgba(5,132,148,.28);
  box-shadow:0 24px 46px -24px rgba(5,132,148,.5);
}

.adv__icon{
  position:relative;
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  margin-bottom:22px;
  border-radius:18px;
  color:var(--green);
  background:var(--green-tint);
  overflow:hidden;
  isolation:isolate;
  transition:transform .35s cubic-bezier(.2,.7,.2,1), background-color .35s ease, color .35s ease;
}
.adv__icon::before{
  content:"";
  position:absolute;
  inset:-50%;
  background:conic-gradient(from 0deg, transparent 0deg, rgba(5,132,148,.35) 60deg, transparent 120deg);
  animation:adv-icon-spin 4s linear infinite;
  z-index:-1;
  opacity:0;
  transition:opacity .35s ease;
}
.adv__icon::after{
  content:"";
  position:absolute;
  inset:2px;
  background:linear-gradient(135deg,var(--green-tint),#D6ECF0);
  border-radius:16px;
  z-index:-1;
  transition:opacity .35s ease;
}
.adv__card:hover .adv__icon{
  transform:translateY(-3px) rotate(-6deg) scale(1.08);
  background:linear-gradient(135deg,var(--green),var(--green-dark));
  color:#fff;
}
.adv__card:hover .adv__icon::before{ opacity:1; }
.adv__card:hover .adv__icon::after{ opacity:0; }
.adv__card:hover .adv__icon svg{
  animation:adv-icon-bounce .6s cubic-bezier(.34,1.56,.64,1) forwards;
}
.adv__card:nth-child(1):hover .adv__icon svg{ animation-name:adv-icon-wiggle; }
.adv__card:nth-child(2):hover .adv__icon svg{ animation-name:adv-icon-pop; }
.adv__card:nth-child(3):hover .adv__icon svg{ animation-name:adv-icon-flip; }
.adv__card:nth-child(4):hover .adv__icon svg{ animation-name:adv-icon-pulse; }
@keyframes adv-icon-spin{ to{ transform:rotate(360deg); } }
@keyframes adv-icon-bounce{
  0%{ transform:translateY(0) scale(1); }
  40%{ transform:translateY(-4px) scale(1.18); }
  100%{ transform:translateY(0) scale(1); }
}
@keyframes adv-icon-wiggle{
  0%{ transform:rotate(0); }
  25%{ transform:rotate(-12deg) scale(1.1); }
  50%{ transform:rotate(10deg) scale(1.15); }
  75%{ transform:rotate(-6deg) scale(1.1); }
  100%{ transform:rotate(0) scale(1.1); }
}
@keyframes adv-icon-pop{
  0%{ transform:scale(1); }
  50%{ transform:scale(1.25) translateY(-2px); }
  100%{ transform:scale(1.1); }
}
@keyframes adv-icon-flip{
  0%{ transform:rotateY(0); }
  50%{ transform:rotateY(180deg) scale(1.1); }
  100%{ transform:rotateY(360deg) scale(1.1); }
}
@keyframes adv-icon-pulse{
  0%,100%{ transform:scale(1.1); filter:drop-shadow(0 0 0 rgba(255,255,255,0)); }
  50%{ transform:scale(1.18); filter:drop-shadow(0 0 8px rgba(255,255,255,.6)); }
}
.adv__icon svg{
  position:relative;
  z-index:1;
  transition:transform .35s ease;
  display:block;
}

.adv__title{
  font-size:19px;
  font-weight:700;
  line-height:1.25;
  letter-spacing:-.02em;
}

.adv__text{
  margin-top:10px;
  font-size:14.5px;
  line-height:1.55;
  color:var(--ink-50);
}

/* ============ секция «О клинике» + счётчики ============ */
.about{ padding:110px 0; background:var(--blue-tint); }

.about__grid{
  display:grid;
  grid-template-columns:minmax(0,440px) minmax(0,1fr);
  gap:64px;
  align-items:stretch;
}

.about__media{
  position:relative;
  border-radius:24px;
  overflow:hidden;
  min-height:100%;
  box-shadow:0 30px 60px -30px rgba(9,26,34,.5);
}

/* фото вертикальное: верх — по плашке «О клинике», низ — по карточкам статистики */
.about__media img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 20%;
}

.about__lic{
  position:absolute;
  left:18px;
  bottom:18px;
  right:18px;
  padding:12px 16px;
  border-radius:14px;
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  font-size:12.5px;
  line-height:1.4;
  color:var(--ink-70);
  box-shadow:var(--shadow-card);
}

.about__lic b{ color:var(--ink); }

.about__body .section-head{ margin-bottom:0; }

.about__mission{
  margin-top:18px;
  display:grid;
  gap:12px;
}

.about__mission p{
  position:relative;
  padding-left:26px;
  font-size:15.5px;
  line-height:1.6;
  color:var(--ink-70);
}

.about__mission p::before{
  content:'';
  position:absolute;
  left:0;
  top:9px;
  width:14px;
  height:14px;
  border-radius:50%;
  background:radial-gradient(circle at 50% 50%,var(--green) 0 5px,var(--green-tint) 6px 7px);
}

.stats{
  margin-top:34px;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:16px;
}

.stat{
  padding:22px 22px 20px;
  border-radius:16px;
  background:var(--white);
  box-shadow:var(--shadow-card);
}

.stat__num{
  display:block;
  font-size:clamp(34px,3.4vw,44px);
  font-weight:800;
  line-height:1;
  letter-spacing:-.03em;
  color:var(--green);
}

.stat__label{
  display:block;
  margin-top:8px;
  font-size:14px;
  color:var(--ink-50);
}

/* ============ секция «Услуги и цены» ============ */
.prices{ padding:110px 0 116px; background:var(--white); }
.prices .srv__grid{ margin-top:52px; }
.prices .srv__item{
  background:var(--blue-tint);
  box-shadow:none;
}
.prices .srv__item:hover{ box-shadow:0 18px 40px -22px rgba(5,132,148,.35); }
.prices .srv__price{ background:var(--white); }

/* нейтрализуем flex:1 у кнопки внутри колоночной карточки */
.srv__cta.btn-solid,
.srv__cta.btn-ghost{ flex:0 0 auto; }

.prices__foot{
  margin-top:40px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:24px 28px;
  border-radius:18px;
  background:var(--blue-tint);
}

.prices__foot p{
  font-size:15.5px;
  line-height:1.5;
  color:var(--ink-70);
}

.prices__foot p b{ color:var(--ink); }

.prices__pdf{
  display:inline-flex;
  align-items:center;
  gap:10px;
  flex:none;
  padding:14px 26px;
  border-radius:999px;
  border:1.6px solid var(--green);
  color:var(--green);
  font-weight:700;
  font-size:15px;
  transition:background-color .2s ease, color .2s ease;
}

.prices__pdf:hover{ background:var(--green); color:var(--white); }

/* ============ секция «Контакты»: карта во всю ширину + карточка поверх ============ */
.contacts{
  position:relative;
  padding:110px 0 0;
  background:var(--white);
  isolation:isolate;
}

.contacts__stage{
  position:relative;
  margin-top:48px;
  height:660px;
  background:var(--blue-tint);
}
.contacts__map{
  position:absolute;
  inset:0;
}
.contacts__map iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}
/* слой по сетке сайта: карточка встаёт ровно по левому краю контента */
.contacts__overlay{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  pointer-events:none;
}
.contacts__card{
  position:relative;
  z-index:2;
  width:min(420px,100%);
  max-height:calc(100% - 56px);
  overflow-y:auto;
  padding:28px 30px 26px;
  border-radius:24px;
  background:var(--white);
  box-shadow:0 30px 70px -30px rgba(15,29,23,.45);
  pointer-events:auto;
}
.contacts__card .contact-row{ padding:13px 0; }
.contacts__card .contact-row:first-of-type{ padding-top:0; }
.contacts__card .contact-row__ico{
  background:linear-gradient(135deg,var(--green-tint),#D7EDF1);
  color:var(--green);
}

.contacts__socials{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  margin-top:16px;
}
.contacts__social{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:12px 6px;
  border-radius:14px;
  overflow:hidden;
  color:var(--white);
  font-size:11px;
  font-weight:600;
  letter-spacing:.01em;
  transition:transform .25s ease, box-shadow .25s ease, filter .25s ease;
}
.contacts__social:hover{
  transform:translateY(-3px);
  filter:brightness(1.08);
  box-shadow:0 12px 24px -8px rgba(0,0,0,.35);
}
.contacts__social--wa{ background:linear-gradient(135deg,#25D366,#128C7E); }
.contacts__social--tg{ background:linear-gradient(135deg,#29B6F6,#0288D1); }
.contacts__social--vk{ background:linear-gradient(135deg,#0077FF,#0050A0); }
.contacts__social--max{ background:linear-gradient(135deg,#00A2FF,#0066CC); }

.contacts__cta{ margin-top:18px; }
.contacts__cta .btn{ width:100%; margin-top:0; justify-content:center; padding:16px; font-size:16px; }

@media (max-width:900px){
  .contacts{ padding:80px 0 72px; }
  .contacts__stage{ height:auto; background:none; }
  .contacts__map{ position:relative; height:360px; }
  .contacts__overlay{ position:relative; inset:auto; display:block; pointer-events:auto; }
  .contacts__card{ width:auto; max-height:none; margin-top:-48px; }
}
@media (max-width:560px){
  .contacts{ padding:64px 0 56px; }
  .contacts__map{ height:300px; }
  .contacts__card{ margin-top:-36px; padding:22px 20px; border-radius:20px; }
  .contacts__socials{ grid-template-columns:repeat(2,1fr); }
}

.contact-row{ padding:13px 0; }
.contacts__card .contact-row:first-of-type{ padding-top:0; }
.contacts__card .contact-row__ico{
  background:linear-gradient(135deg,var(--green-tint),#D7EDF1);
  color:var(--green);
}

.contacts__socials{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  margin-top:16px;
}
.contacts__social{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:12px 6px;
  border-radius:14px;
  overflow:hidden;
  color:var(--white);
  font-size:11px;
  font-weight:600;
  letter-spacing:.01em;
  transition:transform .25s ease, box-shadow .25s ease, filter .25s ease;
}
.contacts__social:hover{
  transform:translateY(-3px);
  filter:brightness(1.08);
  box-shadow:0 12px 24px -8px rgba(0,0,0,.35);
}
.contacts__social--wa{ background:linear-gradient(135deg,#25D366,#128C7E); }
.contacts__social--tg{ background:linear-gradient(135deg,#29B6F6,#0288D1); }
.contacts__social--vk{ background:linear-gradient(135deg,#0077FF,#0050A0); }
.contacts__social--max{ background:linear-gradient(135deg,#00A2FF,#0066CC); }

.contacts__cta{ margin-top:18px; }
.contacts__cta .btn{ width:100%; margin-top:0; justify-content:center; padding:16px; font-size:16px; }

@media (max-width:900px){
  .contacts{ padding:80px 0 90px; }
  .contacts__stage{
    height:auto;
    overflow:visible;
    border-radius:0;
    background:none;
    box-shadow:none;
  }
  .contacts__map{
    position:relative;
    height:360px;
    border-radius:22px;
    overflow:hidden;
  }
  .contacts__card{
    position:relative;
    top:auto;
    left:auto;
    transform:none;
    width:auto;
    max-height:none;
    margin:-48px 14px 0;
  }
}
@media (max-width:560px){
  .contacts{ padding:64px 0 72px; }
  .contacts__map{ height:300px; }
  .contacts__card{ margin:-36px 0 0; padding:22px 20px; border-radius:20px; }
  .contacts__socials{ grid-template-columns:repeat(2,1fr); }
}

.contact-row{ padding:14px 0; }
.contacts__card .contact-row:first-of-type{ padding-top:0; }
.contacts__card .contact-row:last-of-type{ padding-bottom:18px; }
.contacts__card .contact-row__ico{
  background:linear-gradient(135deg,var(--green-tint),#D7EDF1);
  color:var(--green);
}
.contacts__card .contact-row__val{ font-size:17px; }
.contacts__card .contact-row__val a{ color:var(--ink); transition:color .18s ease; }
.contacts__card .contact-row__val a:hover{ color:var(--green); }
.contacts__socials{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  margin-top:8px;
  padding-top:18px;
  border-top:1px solid var(--line);
}
.contacts__social{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
  padding:12px 8px;
  border-radius:14px;
  color:var(--white);
  font-size:11px;
  font-weight:600;
  letter-spacing:.01em;
  transition:transform .25s ease, box-shadow .25s ease, filter .25s ease;
  position:relative;
  overflow:hidden;
}
.contacts__social::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.22),rgba(255,255,255,0));
  opacity:0;
  transition:opacity .25s ease;
}
.contacts__social:hover{
  transform:translateY(-3px);
  filter:brightness(1.1);
  box-shadow:0 12px 24px -8px rgba(0,0,0,.35);
}
.contacts__social:hover::before{ opacity:1; }
.contacts__social span{ position:relative; z-index:1; }
.contacts__social svg{ position:relative; z-index:1; }
.contacts__social--wa{ background:linear-gradient(135deg,#25D366,#128C7E); }
.contacts__social--tg{ background:linear-gradient(135deg,#29B6F6,#0288D1); }
.contacts__social--vk{ background:linear-gradient(135deg,#0077FF,#0050A0); }
.contacts__social--max{ background:linear-gradient(135deg,#00A2FF,#0066CC); }
.contacts__cta{ margin-top:20px; }
.contacts__cta .btn{ width:100%; justify-content:center; padding:16px; font-size:16px; }
@media (max-width:1100px){
  .contacts__inner{ grid-template-columns:1fr; gap:32px; }
  .contacts__socials{ grid-template-columns:repeat(4,1fr); }
}
@media (max-width:640px){
  .contacts__map{ height:380px; }
  .contacts__inner{ margin-top:-120px; }
  .contacts__card{ padding:24px 22px 22px; border-radius:20px; }
  .contacts__socials{ grid-template-columns:repeat(2,1fr); }
}

.contacts__grid{
  margin-top:52px;
  display:grid;
  grid-template-columns:minmax(0,420px) minmax(0,1fr);
  gap:28px;
  align-items:stretch;
}

.contacts__info{
  display:flex;
  flex-direction:column;
  padding:34px 32px;
  border-radius:var(--radius);
  background:var(--white);
  box-shadow:var(--shadow-card);
}

.contact-row{
  display:flex;
  gap:16px;
  padding:18px 0;
  border-bottom:1px solid var(--line);
}

.contact-row:first-of-type{ padding-top:0; }

.contact-row__ico{
  flex:none;
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border-radius:12px;
  color:var(--green);
  background:var(--green-tint);
}

.contact-row__label{
  font-size:13px;
  color:var(--ink-50);
  margin-bottom:3px;
}

.contact-row__val{
  font-size:16px;
  font-weight:700;
  color:var(--ink);
  line-height:1.35;
}

.contact-row__val a{ color:var(--ink); transition:color .18s ease; }
.contact-row__val a:hover{ color:var(--green); }

.contact-row__sub{
  margin-top:2px;
  font-size:13.5px;
  color:var(--ink-50);
  font-weight:400;
}

/* ============ подвал ============ */
.footer{
  background:linear-gradient(180deg,#058494 0%,#03616d 100%);
  color:rgba(255,255,255,.86);
  padding:70px 0 34px;
  position:relative;
  overflow:hidden;
}
.footer::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(60% 50% at 15% 10%,rgba(56,168,181,.35) 0%,transparent 60%),
    radial-gradient(50% 40% at 100% 100%,rgba(255,210,122,.18) 0%,transparent 65%);
  pointer-events:none;
}
.footer > *{ position:relative; z-index:1; }

.footer__top{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1.1fr;
  gap:36px;
  padding-bottom:44px;
  border-bottom:1px solid rgba(255,255,255,.12);
}

.footer__logo{ display:inline-block; margin-bottom:18px; }
.footer__logo img{ height:46px; width:auto; filter:brightness(0) invert(1); }

.footer__about{
  font-size:14px;
  line-height:1.6;
  color:rgba(255,255,255,.6);
  max-width:300px;
}

.footer__col h4{
  margin:0 0 16px;
  color:var(--white);
  font-size:15px;
  font-weight:700;
  letter-spacing:-.01em;
}

.footer__col ul{ display:grid; gap:11px; }

.footer__col a,
.footer__col span{
  font-size:14px;
  color:rgba(255,255,255,.82);
  transition:color .18s ease;
}

.footer__col a:hover{ color:var(--white); }

.footer__phone{
  display:block;
  font-size:19px;
  font-weight:800;
  color:var(--white)!important;
  letter-spacing:-.01em;
  margin-bottom:6px;
}

.footer__bottom{
  display:flex;
  flex-wrap:wrap;
  gap:12px 24px;
  justify-content:space-between;
  align-items:center;
  padding-top:26px;
  font-size:12.5px;
  color:rgba(255,255,255,.5);
}

.footer__bottom a{ color:rgba(255,255,255,.7); text-decoration:underline; text-underline-offset:2px; }

/* ============ виджет быстрой связи ============ */
.qc{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:50;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  pointer-events:none;           /* пустая область вокруг кружка не реагирует на мышь */
}
.qc__toggle{ pointer-events:auto; }
.qc.is-open .qc__list,
.qc.is-hover .qc__list{ pointer-events:auto; }
.qc__list{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:12px;
  margin:0;
  padding:0 5px 16px;
  list-style:none;
}
.qc__list li{
  opacity:0;
  visibility:hidden;
  transform:translateY(18px) scale(.5);
  transform-origin:right center;
  transition:opacity .2s ease, transform .3s ease, visibility 0s linear .3s;
}
.qc.is-open .qc__list li{
  opacity:1;
  visibility:visible;
  transform:none;
  transition:opacity .25s ease, transform .45s cubic-bezier(.34,1.56,.64,1), visibility 0s;
}
/* снизу вверх — «веером» */
.qc.is-open .qc__list li:nth-last-child(2){ transition-delay:.05s; }
.qc.is-open .qc__list li:nth-last-child(3){ transition-delay:.1s; }
.qc.is-open .qc__list li:nth-last-child(4){ transition-delay:.15s; }

.qc__btn{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
}
.qc__label{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  padding:9px 15px;
  border-radius:999px;
  background:var(--white);
  color:var(--ink);
  font-size:14px;
  font-weight:700;
  line-height:1.2;
  white-space:nowrap;
  box-shadow:0 10px 26px -12px rgba(15,29,23,.45);
  opacity:0;
  transform:translateX(12px);
  transition:opacity .25s ease .12s, transform .35s ease .12s, color .2s ease;
}
.qc__label small{
  font-size:11.5px;
  font-weight:600;
  color:var(--ink-50);
}
.qc.is-open .qc__label{ opacity:1; transform:none; }
.qc__ico{
  flex:none;
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:var(--white);
  box-shadow:0 12px 26px -10px rgba(15,29,23,.5);
  transition:transform .25s ease, box-shadow .25s ease;
}
.qc__ico--wa{ background:linear-gradient(135deg,#25D366,#128C7E); }
/* Telegram и ВК — фирменные значки картинкой (img/icons) */
.qc__ico--tg,
.qc__ico--vk{ background:none; overflow:hidden; }
.qc__ico img{ display:block; width:100%; height:100%; }
.qc__ico--ph{ background:linear-gradient(135deg,var(--green-light),var(--green-dark)); }
.qc__btn:hover .qc__ico,
.qc__btn:focus-visible .qc__ico{ transform:scale(1.12); box-shadow:0 16px 30px -10px rgba(15,29,23,.55); }
.qc__btn:hover .qc__label,
.qc__btn:focus-visible .qc__label{ color:var(--green); }
.qc__btn:focus-visible{ outline:none; }

/* главная кнопка: иконки мессенджеров по очереди сменяют друг друга */
.qc__toggle{
  position:relative;
  width:62px;
  height:62px;
  border:0;
  padding:0;
  border-radius:50%;
  cursor:pointer;
  color:var(--white);
  background:linear-gradient(135deg,var(--green-light) 0%,var(--green) 55%,var(--green-dark) 100%);
  box-shadow:0 16px 34px -10px rgba(5,132,148,.65);
  transition:transform .3s ease, box-shadow .3s ease;
}
.qc__toggle:hover{ transform:scale(1.06); }
.qc__toggle:focus-visible{ outline:3px solid var(--green-light); outline-offset:4px; }
.qc__toggle::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  background:var(--ink);
  opacity:0;
  transition:opacity .3s ease;
}
.qc__toggle::after{
  content:"";
  position:absolute;
  inset:-6px;
  border-radius:50%;
  border:2px solid rgba(5,132,148,.5);
  animation:qc-pulse 2.4s ease-out infinite;
  pointer-events:none;
}
@keyframes qc-pulse{
  0%{ transform:scale(1); opacity:.8; }
  100%{ transform:scale(1.5); opacity:0; }
}
.qc__cyc,
.qc__x{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  transition:opacity .25s ease, transform .35s ease;
}
/* трубка и сообщение сменяют друг друга каждые 3 секунды;
   отрицательная задержка — обе анимации идут сразу, со сдвигом по фазе */
.qc__cyc{
  opacity:0;
  animation:qc-swap 6s ease-in-out infinite;
}
.qc__cyc--chat{ animation-delay:-3s; }
@keyframes qc-swap{
  0%{ opacity:0; transform:scale(.55) rotate(-25deg); }
  7%,43%{ opacity:1; transform:none; }
  50%,100%{ opacity:0; transform:scale(.55) rotate(25deg); }
}
/* трубка «звонит» — короткое покачивание, пока она на кнопке */
.qc__cyc--phone svg{ animation:qc-ring 6s ease-in-out infinite; transform-origin:50% 50%; }
@keyframes qc-ring{
  0%,10%,32%,100%{ transform:rotate(0); }
  13%,19%,25%{ transform:rotate(-14deg); }
  16%,22%,28%{ transform:rotate(14deg); }
}
.qc__x{ opacity:0; transform:rotate(-90deg) scale(.6); }

/* открытое состояние: тёмная кнопка с крестиком */
.qc.is-open .qc__toggle::before{ opacity:1; }
.qc.is-open .qc__toggle::after{ animation:none; opacity:0; }
.qc.is-open .qc__cyc{ animation:none; opacity:0; }
.qc.is-open .qc__x{ opacity:1; transform:none; }

/* десктоп: раскрывается по наведению на сам кружок (класс ставит скрипт) */
@media (hover:hover) and (pointer:fine){
  .qc.is-hover .qc__list li{
    opacity:1;
    visibility:visible;
    transform:none;
    transition:opacity .25s ease, transform .45s cubic-bezier(.34,1.56,.64,1), visibility 0s;
  }
  .qc.is-hover .qc__list li:nth-last-child(2){ transition-delay:.05s; }
  .qc.is-hover .qc__list li:nth-last-child(3){ transition-delay:.1s; }
  .qc.is-hover .qc__list li:nth-last-child(4){ transition-delay:.15s; }
  .qc.is-hover .qc__label{ opacity:1; transform:none; }
  .qc.is-hover .qc__toggle::before{ opacity:1; }
  .qc.is-hover .qc__toggle::after{ animation:none; opacity:0; }
  .qc.is-hover .qc__cyc{ animation:none; opacity:0; }
  .qc.is-hover .qc__x{ opacity:1; transform:none; }
}

@media (max-width:560px){
  .qc{ right:16px; bottom:16px; }
  .qc__toggle{ width:56px; height:56px; }
  .qc__ico{ width:48px; height:48px; }
  .qc__list{ gap:10px; padding-right:4px; }
}
@media (prefers-reduced-motion:reduce){
  .qc__toggle::after{ animation:none; display:none; }
  .qc__cyc{ animation:none; }
  .qc__cyc:first-child{ opacity:1; transform:none; }
  .qc.is-open .qc__cyc:first-child{ opacity:0; }
}

/* ============ адаптив: новые секции ============ */
@media (max-width:1100px){
  .adv__grid{ grid-template-columns:repeat(2,1fr); gap:18px; }
  .about__grid{ gap:40px; }
  .footer__top{ grid-template-columns:1fr 1fr; gap:30px; }
}

@media (max-width:760px){
  .advantages{ padding:70px 0 64px; }
  .about{ padding:70px 0; }
  .prices{ padding:72px 0 78px; }

  .about__grid{ grid-template-columns:1fr; gap:30px; }
  .about__media{ aspect-ratio:4/5; max-height:560px; }
  .stats{ margin-top:26px; }
  .adv__grid{ margin-top:36px; }

  .prices__foot{ flex-direction:column; align-items:flex-start; }
  .footer__top{ grid-template-columns:1fr; gap:28px; }
}

@media (max-width:560px){
  .adv__grid{ grid-template-columns:1fr; }
  .stats{ grid-template-columns:1fr 1fr; gap:12px; }
  .stat{ padding:18px 16px; }
}

/* =================================================================
   КОМАНДА ВРАЧЕЙ (bento-секция)
   ================================================================= */

/* eyebrow (надпись над заголовком) */
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:18px;
  padding:8px 16px 8px 12px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.7);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  font-size:13px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--green-dark);
  box-shadow:0 6px 18px -10px rgba(5,132,148,.25);
}
.eyebrow__dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--green-light),var(--green-dark));
  box-shadow:0 0 0 4px rgba(5,132,148,.12);
  animation:eyebrow-pulse 2.2s ease-in-out infinite;
}
@keyframes eyebrow-pulse{
  0%,100%{ box-shadow:0 0 0 4px rgba(5,132,148,.12); }
  50%{ box-shadow:0 0 0 8px rgba(5,132,148,0); }
}

/* секция: фон с декоративными кругами */
.doctors{
  position:relative;
  isolation:isolate;
  padding:120px 0 130px;
  background:linear-gradient(180deg,#fff 0%,#E6F1F8 60%,#DCE9F2 100%);
  overflow:hidden;
}
.doctors__bg{
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
}
.doctors__bg::before,
.doctors__bg::after{
  content:"";
  position:absolute;
  border-radius:50%;
  filter:blur(60px);
  opacity:.55;
}
.doctors__bg::before{
  width:480px; height:480px;
  top:-120px; right:-80px;
  background:radial-gradient(circle,rgba(56,168,181,.35) 0%,transparent 70%);
  animation:bg-drift 18s ease-in-out infinite;
}
.doctors__bg::after{
  width:520px; height:520px;
  bottom:-160px; left:-120px;
  background:radial-gradient(circle,rgba(5,132,148,.28) 0%,transparent 70%);
  animation:bg-drift 22s ease-in-out -8s infinite reverse;
}
@keyframes bg-drift{
  0%,100%{ transform:translate3d(0,0,0) scale(1); }
  50%{ transform:translate3d(40px,-30px,0) scale(1.08); }
}

/* =================================================================
   НАША КОМАНДА — раскрывающийся аккордеон (идея с 21st.dev:
   «expanding image cards» + shared-element переход в модалку)
   ================================================================= */
.team__head{ margin-bottom:44px; }

.team{
  display:flex;
  gap:12px;
  height:clamp(540px,66vh,640px);
}

.tm{
  position:relative;
  flex:1 1 0;
  min-width:0;
  overflow:hidden;
  isolation:isolate;
  border-radius:26px;
  background:#0B2A2E;
  box-shadow:0 14px 40px -24px rgba(15,29,23,.45);
  transition:flex-grow .75s cubic-bezier(.22,.8,.2,1), box-shadow .5s ease;
}
.tm.is-active{
  flex-grow:5.2;
  box-shadow:0 34px 80px -34px rgba(5,132,148,.6);
}

/* фото */
.tm__img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 18%;
  filter:saturate(.3) brightness(.8);
  transform:scale(1.1);
  transition:filter .7s ease, transform 1.2s cubic-bezier(.22,.8,.2,1);
}
.tm:hover .tm__img{ filter:saturate(.75) brightness(.92); }
.tm.is-active .tm__img{ filter:none; transform:scale(1); }

/* тонировка свёрнутой панели + градиент под текстом */
.tm::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(180deg,rgba(5,132,148,.28) 0%,rgba(4,44,48,.78) 100%);
  transition:opacity .6s ease;
  pointer-events:none;
}
.tm.is-active::before{ opacity:0; }
.tm__shade{
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(180deg,rgba(6,28,26,0) 38%,rgba(6,28,26,.5) 60%,rgba(5,24,22,.93) 100%);
  opacity:0;
  transition:opacity .6s ease;
  pointer-events:none;
}
.tm.is-active .tm__shade{ opacity:1; }

/* кликабельная область всей панели */
.tm__hit{
  position:absolute;
  inset:0;
  z-index:3;
  border:0;
  padding:0;
  background:transparent;
  border-radius:inherit;
  cursor:pointer;
}
.tm__hit:focus-visible{ outline:3px solid #fff; outline-offset:-6px; }

/* свёрнутое состояние: номер, вертикальное имя, плюс */
.tm__rail{
  position:absolute;
  inset:0;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:space-between;
  padding:22px 0 24px;
  color:#fff;
  pointer-events:none;
  transition:opacity .45s ease .2s;
}
.tm.is-active .tm__rail{ opacity:0; transition-delay:0s; transition-duration:.2s; }
.tm__num{
  padding:6px 10px;
  border-radius:999px;
  font-size:12.5px;
  font-weight:800;
  letter-spacing:.08em;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.24);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.tm__vname{
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  font-size:19px;
  font-weight:800;
  letter-spacing:-.01em;
  white-space:nowrap;
  text-shadow:0 2px 12px rgba(0,0,0,.35);
}
.tm__vname em{
  font-style:normal;
  font-size:14px;
  font-weight:600;
  opacity:.75;
}
.tm__plus{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.3);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  transition:transform .35s ease, background-color .3s ease, border-color .3s ease;
}
.tm:hover .tm__plus{ transform:rotate(90deg); background:var(--green); border-color:var(--green); }

/* раскрытое состояние: контент */
.tm__content{
  position:absolute;
  left:0;
  bottom:0;
  z-index:4;
  width:100%;
  min-width:430px;
  padding:0 34px 32px;
  color:#fff;
  pointer-events:none;
}
.tm__content > *{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .3s ease, transform .5s cubic-bezier(.22,.8,.2,1);
}
.tm.is-active .tm__content > *{ opacity:1; transform:none; }
.tm.is-active .tm__content > :nth-child(1){ transition-delay:.3s; }
.tm.is-active .tm__content > :nth-child(2){ transition-delay:.36s; }
.tm.is-active .tm__content > :nth-child(3){ transition-delay:.42s; }
.tm.is-active .tm__content > :nth-child(4){ transition-delay:.48s; }
.tm.is-active .tm__content > :nth-child(5){ transition-delay:.54s; }
.tm.is-active .tm__content > :nth-child(6){ transition-delay:.6s; }

.tm__badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-bottom:14px;
  padding:7px 13px;
  border-radius:999px;
  font-size:12.5px;
  font-weight:700;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.28);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.tm__badge--lead{
  background:linear-gradient(135deg,#FFD27A 0%,#F0A04B 100%);
  color:#3A2400;
  border-color:rgba(255,255,255,.45);
}
.tm__badge--kids{
  background:linear-gradient(135deg,#FF9EB5 0%,#F06090 100%);
  border-color:rgba(255,255,255,.45);
}
.tm__name{
  margin:0;
  font-size:30px;
  font-weight:800;
  line-height:1.08;
  letter-spacing:-.025em;
  color:#fff;
}
.tm__spec{
  margin:8px 0 0;
  font-size:15px;
  font-weight:600;
  color:#A9E3EA;
}
.tm__meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin-top:16px;
}
.tm__exp{
  display:inline-flex;
  align-items:baseline;
  gap:6px;
  padding:6px 13px;
  border-radius:999px;
  background:#fff;
  color:var(--ink);
  font-size:13px;
  font-weight:700;
}
.tm__exp b{
  font-size:18px;
  font-weight:800;
  color:var(--green-dark);
  letter-spacing:-.02em;
}
.tm__tag{
  padding:6px 12px;
  border-radius:999px;
  font-size:12.5px;
  font-weight:600;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.22);
}
.tm__text{
  max-width:48ch;
  margin:14px 0 0;
  font-size:15px;
  line-height:1.6;
  color:rgba(255,255,255,.86);
}
.tm__actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:20px;
}
.tm__actions button{ pointer-events:auto; }
.tm__more,
.tm__book{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:13px 20px;
  border-radius:999px;
  font:inherit;
  font-size:14.5px;
  font-weight:700;
  cursor:pointer;
  transition:transform .22s ease, background-color .22s ease, color .22s ease, gap .22s ease, box-shadow .22s ease;
}
.tm__more{
  border:0;
  background:#fff;
  color:var(--ink);
  box-shadow:0 12px 26px -14px rgba(0,0,0,.5);
}
.tm__more:hover{ gap:12px; background:var(--green-tint); color:var(--green-dark); }
.tm__book{
  border:1.5px solid rgba(255,255,255,.45);
  background:rgba(255,255,255,.08);
  color:#fff;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.tm__book:hover{ background:var(--green); border-color:var(--green); transform:translateY(-1px); }
.tm__more:focus-visible,
.tm__book:focus-visible{ outline:3px solid #fff; outline-offset:3px; }

/* автопрокрутка: полоса прогресса */
.tm__progress{
  position:absolute;
  top:18px;
  left:24px;
  right:24px;
  z-index:4;
  height:3px;
  border-radius:3px;
  overflow:hidden;
  background:rgba(255,255,255,.25);
  opacity:0;
  transition:opacity .3s ease;
  pointer-events:none;
}
.tm__progress::after{
  content:"";
  position:absolute;
  inset:0;
  background:#fff;
  transform:scaleX(0);
  transform-origin:left;
}
.team.is-auto .tm.is-active .tm__progress{ opacity:1; }
.team.is-auto .tm.is-active .tm__progress::after{ animation:tm-progress 6.5s linear forwards; }
.team.is-auto:not(.is-visible) .tm.is-active .tm__progress::after{ animation-play-state:paused; }
@keyframes tm-progress{ to{ transform:scaleX(1); } }

/* «перелёт» фото в модалку */
.doc-fly{
  position:fixed;
  z-index:95;
  margin:0;
  object-fit:cover;
  object-position:50% 18%;
  pointer-events:none;
  box-shadow:0 40px 90px -30px rgba(0,0,0,.55);
}
.doc-modal.is-morph .doc-modal__dialog{ transform:none; }
.doc-modal.is-morph .doc-modal__photo img{ animation:none; }

/* планшеты и телефоны: вертикальный аккордеон */
@media (max-width:960px){
  .team{ flex-direction:column; height:auto; gap:10px; }
  .tm{
    flex:none;
    height:88px;
    border-radius:22px;
    transition:height .65s cubic-bezier(.22,.8,.2,1), box-shadow .5s ease;
  }
  .tm.is-active{ height:min(580px,135vw); }
  .tm__img{ object-position:50% 24%; }
  .tm__rail{
    flex-direction:row;
    justify-content:flex-start;
    gap:14px;
    padding:0 18px;
  }
  .tm__vname{ writing-mode:horizontal-tb; transform:none; font-size:17px; }
  .tm__plus{ margin-left:auto; }
  .tm__content{ min-width:0; padding:0 22px 24px; }
  .tm__name{ font-size:25px; }
  .tm__progress{ display:none; }
}
@media (max-width:520px){
  .tm.is-active{ height:min(700px,178vw); }
  .tm__shade{ background:linear-gradient(180deg,rgba(6,28,26,0) 22%,rgba(6,28,26,.62) 42%,rgba(5,24,22,.95) 62%); }
  .tm__vname em{ display:none; }
  .tm__content{ padding:0 18px 20px; }
  .tm__badge{ margin-bottom:10px; }
  .tm__name{ font-size:22px; }
  .tm__spec{ font-size:14px; }
  .tm__text{ font-size:14px; margin-top:12px; }
  .tm__actions{ margin-top:16px; }
  .tm__more,
  .tm__book{ flex:1 1 auto; justify-content:center; padding:12px 16px; }
}
@media (prefers-reduced-motion:reduce){
  .tm, .tm__img, .tm__content > *{ transition-duration:.01s !important; transition-delay:0s !important; }
}

/* блок статистики */
.doctors__stats{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  margin-top:42px;
  padding:26px 32px;
  border:1px solid rgba(255,255,255,.6);
  border-radius:22px;
  background:rgba(255,255,255,.62);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:0 20px 50px -22px rgba(5,132,148,.32);
}
.doctors__stat{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
  padding:4px 12px 4px 0;
  border-left:3px solid var(--green);
  padding-left:16px;
}
.doctors__stat:nth-child(2){ border-left-color:#F0A04B; }
.doctors__stat:nth-child(3){ border-left-color:#F06090; }
.doctors__stat:nth-child(4){ border-left-color:#38a8b5; }
.doctors__stat b{
  font-size:32px;
  font-weight:800;
  line-height:1;
  letter-spacing:-.03em;
  color:var(--ink);
}
.doctors__stat span{
  font-size:13px;
  color:var(--ink-50);
  font-weight:500;
  line-height:1.4;
  margin-top:4px;
}

/* =================================================================
   МОДАЛКА ВРАЧА (центрированная, с табами)
   ================================================================= */

.doc-modal{
  position:fixed;
  inset:0;
  z-index:80;
  display:grid;
  place-items:center;
  padding:24px;
  overflow-y:auto;
  overscroll-behavior:contain;
}
.doc-modal[hidden]{ display:none; }
.doc-modal__overlay{
  position:fixed;
  inset:0;
  background:rgba(8,32,28,.6);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  opacity:0;
  transition:opacity .35s ease;
}
.doc-modal.is-open .doc-modal__overlay{ opacity:1; }

.doc-modal__dialog{
  position:relative;
  z-index:1;
  width:min(1100px,100%);
  max-height:calc(100vh - 48px);
  display:flex;
  flex-direction:column;
  border-radius:28px;
  background:var(--white);
  box-shadow:0 50px 120px -40px rgba(0,0,0,.55);
  overflow:hidden;
  transform:translateY(28px) scale(.96);
  opacity:0;
  transition:transform .42s cubic-bezier(.2,.7,.2,1), opacity .35s ease;
  outline:none;
}
.doc-modal.is-open .doc-modal__dialog{
  transform:translateY(0) scale(1);
  opacity:1;
}

.doc-modal__close{
  position:absolute;
  top:18px;
  right:18px;
  z-index:5;
  width:44px;
  height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:50%;
  cursor:pointer;
  color:#fff;
  background:transparent;
  text-shadow:0 2px 8px rgba(0,0,0,.5);
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.35));
  transition:background-color .22s ease, transform .35s ease;
}
.doc-modal__close:hover{
  background:rgba(0,0,0,.25);
  transform:rotate(90deg);
}

.doc-modal__inner{
  display:flex;
  flex-direction:column;
  flex:1;
  min-height:0;
  overflow-y:auto;
}

/* --- HERO: фото + инфо --- */
.doc-modal__hero{
  display:grid;
  grid-template-columns:340px 1fr;
  gap:0;
  background:linear-gradient(120deg,#F4F8FB 0%,#E6F1F8 60%,#DCE9F2 100%);
  position:relative;
}
.doc-modal__hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(60% 60% at 20% 30%,rgba(56,168,181,.18) 0%,transparent 60%),
    radial-gradient(50% 50% at 100% 100%,rgba(255,210,122,.16) 0%,transparent 70%);
  pointer-events:none;
}

.doc-modal__photo{
  position:relative;
  aspect-ratio:3/4;
  max-height:480px;
  overflow:hidden;
  background:#0F1D17;
}
.doc-modal__photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 20%;
  filter:saturate(1.05);
  animation:docModal-photo-in .55s ease .12s both;
}
@keyframes docModal-photo-in{
  from{ transform:scale(1.05); }
  to{ transform:scale(1); }
}
.doc-modal__photo-badge{
  position:absolute;
  bottom:14px;
  left:14px;
  padding:8px 14px;
  border-radius:999px;
  background:rgba(15,29,23,.62);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  font-size:12.5px;
  font-weight:700;
  color:#fff;
  border:1px solid rgba(255,255,255,.18);
}

.doc-modal__main{
  position:relative;
  padding:34px 40px 30px;
  display:flex;
  flex-direction:column;
  gap:12px;
  z-index:1;
  animation:docModal-info-in .45s ease .18s both;
}
@keyframes docModal-info-in{
  from{ opacity:0; transform:translateY(10px); }
  to{ opacity:1; transform:translateY(0); }
}
.doc-modal__role{
  font-size:13px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--green);
}
.doc-modal__name{
  margin:0;
  font-size:30px;
  font-weight:800;
  line-height:1.1;
  letter-spacing:-.025em;
  color:var(--ink);
}
.doc-modal__spec{
  font-size:16px;
  font-weight:600;
  color:var(--ink-70);
}
.doc-modal__meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:4px;
}
.doc-modal__chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 12px;
  border-radius:999px;
  font-size:13.5px;
  font-weight:600;
  background:rgba(255,255,255,.7);
  border:1px solid var(--line);
  color:var(--ink);
}
.doc-modal__chip--exp{ color:var(--green-dark); background:var(--green-tint); border-color:transparent; }
.doc-modal__chip--rating{ color:#8A5A00; background:#FFF3D9; border-color:#F2DDB6; }
.doc-modal__chip--rating svg{ color:#F0A04B; }
.doc-modal__tags{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:4px;
}
.doc-modal__tags span{
  padding:5px 11px;
  border-radius:999px;
  background:rgba(255,255,255,.7);
  border:1px solid var(--line);
  font-size:12.5px;
  font-weight:600;
  color:var(--ink-70);
}
.doc-modal__actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
  margin-top:auto;
  padding-top:14px;
}
.doc-modal__book{
  margin-top:0 !important;
  padding:14px 22px !important;
  font-size:15px !important;
}
.doc-modal__call{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:11px 16px;
  border-radius:999px;
  background:rgba(15,29,23,.06);
  font-size:14px;
  font-weight:700;
  color:var(--ink);
  transition:background-color .2s ease, color .2s ease;
}
.doc-modal__call:hover{
  background:var(--green);
  color:#fff;
}

/* --- TABS --- */
.doc-modal__tabs{
  display:flex;
  flex-direction:column;
  background:#fff;
}
.doc-modal__tab-bar{
  display:flex;
  gap:4px;
  padding:6px;
  margin:14px 28px 0;
  background:var(--green-tint);
  border-radius:14px;
  align-self:flex-start;
  max-width:100%;
  overflow-x:auto;
  scrollbar-width:none;
}
.doc-modal__tab-bar::-webkit-scrollbar{ display:none; }
.doc-modal__tab{
  flex:none;
  padding:9px 16px;
  border:0;
  border-radius:10px;
  background:transparent;
  font:inherit;
  font-size:14px;
  font-weight:700;
  color:var(--ink-70);
  cursor:pointer;
  white-space:nowrap;
  transition:background-color .22s ease, color .22s ease, box-shadow .22s ease;
}
.doc-modal__tab b{ font-weight:800; }
.doc-modal__tab:hover{ color:var(--green-dark); }
.doc-modal__tab.is-active{
  background:#fff;
  color:var(--ink);
  box-shadow:0 4px 14px -6px rgba(5,132,148,.4);
}

.doc-modal__panel{
  display:none;
  padding:24px 40px 32px;
  animation:docModal-panel-in .35s ease;
}
.doc-modal__panel.is-active{ display:block; }
@keyframes docModal-panel-in{
  from{ opacity:0; transform:translateY(6px); }
  to{ opacity:1; transform:translateY(0); }
}

.doc-modal__about{
  margin:0 0 18px;
  font-size:15.5px;
  line-height:1.7;
  color:var(--ink-70);
}
.doc-modal__sub{
  margin:22px 0 12px;
  font-size:13px;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--green);
}

.doc-modal__why,
.doc-modal__services,
.doc-modal__achievements{
  display:grid;
  gap:10px;
  margin:0;
  padding:0;
  list-style:none;
}
.doc-modal__why{
  grid-template-columns:1fr 1fr;
  gap:10px 16px;
}
.doc-modal__why li{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:14px;
  font-size:14.5px;
  line-height:1.5;
  color:var(--ink-70);
  background:#fff;
  transition:border-color .2s ease, background-color .2s ease;
}
.doc-modal__why li:hover{
  border-color:rgba(5,132,148,.32);
  background:var(--green-tint);
}
.doc-modal__why li svg{
  flex:none;
  width:18px; height:18px;
  padding:2px;
  border-radius:50%;
  background:var(--green);
  color:#fff;
  margin-top:1px;
}
.doc-modal__why--ach li{
  background:#FFF9E8;
  border-color:#F2DDB6;
}
.doc-modal__why--ach li svg{ background:#F0A04B; }

.doc-modal__edu{
  display:grid;
  gap:10px;
  margin:0;
  padding:0;
  list-style:none;
}
.doc-modal__edu li{
  display:grid;
  grid-template-columns:78px 1fr;
  gap:16px;
  align-items:flex-start;
  padding:14px 18px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  position:relative;
}
.doc-modal__edu li::before{
  content:"";
  position:absolute;
  left:78px; top:50%;
  width:1px; height:60%;
  background:linear-gradient(180deg,transparent,var(--green),transparent);
  transform:translateX(-50%);
}
.doc-modal__year{
  font-size:18px;
  font-weight:800;
  color:var(--green-dark);
  letter-spacing:-.02em;
}
.doc-modal__edu span{
  font-size:14.5px;
  line-height:1.55;
  color:var(--ink-70);
}

.doc-modal__services{
  grid-template-columns:1fr 1fr;
  gap:8px 14px;
  margin-bottom:18px;
}
.doc-modal__services li{
  position:relative;
  padding:10px 12px 10px 30px;
  border-radius:10px;
  font-size:14.5px;
  line-height:1.45;
  color:var(--ink-70);
  background:var(--green-tint);
  list-style:none;
}
.doc-modal__services li::before{
  content:"";
  position:absolute;
  left:12px;
  top:50%;
  width:8px; height:8px;
  border-radius:50%;
  background:var(--green);
  transform:translateY(-50%);
  box-shadow:0 0 0 3px rgba(5,132,148,.18);
}
.doc-modal__note{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:14px 18px;
  border:1px dashed rgba(5,132,148,.32);
  border-radius:14px;
  background:rgba(227,241,244,.45);
  font-size:14px;
  line-height:1.55;
  color:var(--ink-70);
}
.doc-modal__note svg{ flex:none; color:var(--green); margin-top:2px; }

.doc-modal__reviews{
  display:grid;
  gap:12px;
  margin-bottom:18px;
}
.doc-modal__review{
  padding:18px 20px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
}
.doc-modal__review-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:6px;
}
.doc-modal__review-stars{
  font-size:14px;
  color:#F0A04B;
  letter-spacing:1px;
}
.doc-modal__review-src{
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--ink-50);
  padding:3px 8px;
  border-radius:6px;
  background:rgba(15,29,23,.05);
}
.doc-modal__review-text{
  margin:8px 0 10px;
  font-size:14.5px;
  line-height:1.6;
  color:var(--ink);
}
.doc-modal__review-meta{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  color:var(--ink-50);
}
.doc-modal__review-meta b{
  color:var(--ink);
  font-weight:700;
}
.doc-modal__review-meta span::before{
  content:"·";
  margin:0 6px;
  opacity:.5;
}

.doc-modal__rating-summary{
  display:flex;
  align-items:center;
  gap:10px;
  padding:16px 20px;
  border-radius:14px;
  background:linear-gradient(180deg,#FFF3D9,#FFE8B8);
}
.doc-modal__rating-summary b{
  font-size:28px;
  font-weight:800;
  color:#8A5A00;
  letter-spacing:-.02em;
}
.doc-modal__rating-stars{
  font-size:18px;
  color:#F0A04B;
  letter-spacing:1.5px;
}
.doc-modal__rating-summary span{
  font-size:14px;
  color:var(--ink-70);
  font-weight:600;
}

/* =================================================================
   АДАПТИВ — команда + модалка
   ================================================================= */
@media (max-width:1100px){
  .doctors__grid{ grid-template-columns:repeat(2,1fr); }
  .doctors__stats{ grid-template-columns:repeat(2,1fr); gap:18px 24px; }
  .doc-modal__hero{ grid-template-columns:300px 1fr; }
  .doc-modal__main{ padding:30px 30px 24px; }
  .doc-modal__name{ font-size:26px; }
  .doc-modal__why{ grid-template-columns:1fr; }
  .doc-modal__services{ grid-template-columns:1fr; }
}
@media (max-width:900px){
  .doctors{ padding:80px 0 90px; }
  .doc-modal{ padding:16px; }
  .doc-modal__dialog{ max-height:calc(100vh - 32px); border-radius:22px; }
  .doc-modal__hero{ grid-template-columns:1fr; }
  .doc-modal__photo{ aspect-ratio:16/10; max-height:300px; }
  .doc-modal__main{ padding:24px 24px 22px; }
  .doc-modal__name{ font-size:24px; }
  .doc-modal__tab-bar{ margin:14px 20px 0; }
  .doc-modal__panel{ padding:22px 24px 28px; }
  .doc-modal__actions{ flex-direction:column; align-items:stretch; }
  .doc-modal__book{ width:100%; justify-content:center; }
  .doc-modal__call{ justify-content:center; }
}
@media (max-width:640px){
  .doctors{ padding:60px 0 70px; }
  .doctors__stats{
    grid-template-columns:1fr 1fr;
    padding:20px 22px;
    gap:16px 14px;
  }
  .doctors__stat b{ font-size:26px; }
  .doc-modal{ padding:0; align-items:flex-end; }
  .doc-modal__dialog{
    max-height:96vh;
    border-radius:24px 24px 0 0;
    align-self:flex-end;
  }
  /* крестик: крупнее, контрастный, всегда поверх фото */
  .doc-modal__close{
    top:14px;
    right:14px;
    width:48px;
    height:48px;
    z-index:10;
    background:rgba(255,255,255,.95);
    color:#0F1D17;
    box-shadow:0 4px 16px -2px rgba(0,0,0,.35), 0 0 0 1px rgba(0,0,0,.06);
  }
  .doc-modal__close svg{ width:22px; height:22px; }
  .doc-modal__close:hover{ background:#fff; }
  .doc-modal__hero{ grid-template-columns:1fr; }
  /* фото врача: во всю ширину плашки, портрет 4:5, лицо в фокусе */
  .doc-modal__photo{
    width:100%;
    aspect-ratio:5/6;
    max-height:none;
    overflow:hidden;
  }
  .doc-modal__photo img{
    object-position:center 30%;
  }
  .doc-modal__main{ padding:20px 20px 18px; gap:10px; }
  .doc-modal__name{ font-size:22px; }
  .doc-modal__spec{ font-size:14.5px; }
  .doc-modal__tab-bar{ margin:10px 16px 0; padding:4px; }
  .doc-modal__tab{ padding:8px 12px; font-size:13px; }
  .doc-modal__panel{ padding:18px 20px 24px; }
  .doc-modal__about{ font-size:14.5px; }
  .doc-modal__edu li{ grid-template-columns:64px 1fr; padding:12px 14px; }
  .doc-modal__edu li::before{ left:64px; }
  .doc-modal__year{ font-size:16px; }
}
@media (max-width:420px){
  .doctors__stats{ grid-template-columns:1fr; }
  .doc-modal__actions{ gap:8px; }
}

/* =================================================================
   ПЕРВЫЙ БЛОК — компьютер (от 961px): фон целиком, белая подложка
   только под текстом, блок высотой 960px. Телефон — отдельно, позже.
   ================================================================= */
@media (min-width:961px){
  .hero{ min-height:960px; }

  /* фото прижато вправо — врач видна целиком */
  .hero__bg img{ object-position:100% 30%; transform:none; }

  /* убираем вуаль на весь блок */
  .hero__bg::after{ display:none; }

  /* текст по центру высоты, с отступом под шапку; без сдвигов вверх */
  .hero__inner{
    transform:none;
    align-items:center;
    padding-top:120px;
    padding-bottom:70px;
  }
  .hero__content{
    transform:none;
    padding-bottom:0;
  }

  /* мягкая белая подложка только под текстовым блоком */
  .hero__content::before{
    content:"";
    position:absolute;
    z-index:-1;
    top:-56px;
    bottom:-56px;
    left:-100vw;
    right:-90px;
    background:linear-gradient(90deg,
      rgba(255,255,255,.9) 0%,
      rgba(255,255,255,.88) calc(100% - 200px),
      rgba(255,255,255,0) 100%);
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 56px,#000 calc(100% - 56px),transparent 100%);
            mask-image:linear-gradient(180deg,transparent 0,#000 56px,#000 calc(100% - 56px),transparent 100%);
    pointer-events:none;
  }
}

/* первый блок, компьютер: врач сдвинута влево на 50px;
   открывшаяся справа полоса залита цветом края снимка (дверь/стена) и растушёвана */
@media (min-width:961px){
  .hero__bg{
    background:linear-gradient(180deg,
      rgb(158,143,114) 0%,
      rgb(202,181,149) 12.5%,
      rgb(224,213,195) 25%,
      rgb(208,198,179) 37.5%,
      rgb(194,182,161) 50%,
      rgb(185,171,147) 62.5%,
      rgb(175,161,136) 75%,
      rgb(164,145,116) 87.5%,
      rgb(163,146,118) 100%);
  }
  .hero__bg img{ object-position:calc(100% - 50px) 30%; }
  .hero__bg::before{
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    right:0;
    z-index:1;
    width:110px;
    background:inherit;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 60px);
            mask-image:linear-gradient(90deg,transparent 0,#000 60px);
    pointer-events:none;
  }
}

/* первый блок, компьютер: фон ниже на 70px (сверху — белая полоса под шапкой,
   край фото растушёван), слева больше белого — весь текст на белом */
@media (min-width:961px){
  .hero__bg{
    background:
      linear-gradient(#fff,#fff) 0 0 / 100% 70px no-repeat,
      linear-gradient(180deg,
        rgb(158,143,114) 0%,
        rgb(202,181,149) 12.5%,
        rgb(224,213,195) 25%,
        rgb(208,198,179) 37.5%,
        rgb(194,182,161) 50%,
        rgb(185,171,147) 62.5%,
        rgb(175,161,136) 75%,
        rgb(164,145,116) 87.5%,
        rgb(163,146,118) 100%) 0 70px / 100% 960px no-repeat;
  }
  .hero__bg img{
    transform:translateY(70px);
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 70px);
            mask-image:linear-gradient(180deg,transparent 0,#000 70px);
  }
  .hero__content::before{
    right:-150px;
    background:linear-gradient(90deg,
      rgba(255,255,255,.97) 0%,
      rgba(255,255,255,.95) calc(100% - 260px),
      rgba(255,255,255,0) 100%);
  }
}

/* плашки первого блока: четыре штуки — сеткой 2×2 (на телефоне остаётся одна колонка) */
.usp{ grid-template-columns:repeat(2,minmax(0,1fr)); max-width:640px; }
.usp__price{ color:var(--green); font-weight:800; white-space:nowrap; }
@media (max-width:760px){
  .usp{ grid-template-columns:1fr; max-width:none; }
}

/* =================================================================
   ПЕРВЫЙ БЛОК: стеклянная подпись на враче (компьютер)
   ================================================================= */
.hero__tag{ display:none; }
@media (min-width:961px){
  .hero__tag{
    position:absolute;
    right:30px;
    bottom:130px;
    z-index:1;
    display:grid;
    grid-template-columns:auto 1fr;
    column-gap:10px;
    row-gap:4px;
    align-items:center;
    max-width:340px;
    padding:16px 22px 17px 18px;
    border:1px solid rgba(255,255,255,.65);
    border-radius:20px;
    background:linear-gradient(135deg,rgba(255,255,255,.55),rgba(255,255,255,.22));
    backdrop-filter:blur(18px) saturate(1.4);
    -webkit-backdrop-filter:blur(18px) saturate(1.4);
    box-shadow:0 24px 50px -24px rgba(15,29,23,.45), inset 0 1px 0 rgba(255,255,255,.7);
  }
  .hero__tag-dot{
    grid-row:1;
    width:9px;
    height:9px;
    border-radius:50%;
    background:var(--green);
    box-shadow:0 0 0 4px rgba(5,132,148,.18);
  }
  .hero__tag-name{
    grid-row:1;
    font-size:17px;
    font-weight:800;
    line-height:1.2;
    letter-spacing:-.015em;
    color:var(--ink);
  }
  .hero__tag-role{
    grid-column:2;
    font-size:13.5px;
    font-weight:600;
    line-height:1.35;
    color:var(--green-dark);
  }
}
@media (min-width:961px) and (max-width:1200px){
  .hero__tag{ right:16px; }
}

/* =================================================================
   «ПРЕИМУЩЕСТВА»: плавная микроанимация без рывков
   ================================================================= */
.adv__card{
  position:relative;
  transition:opacity .7s ease, transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s ease, border-color .45s ease;
}
/* невидимый «хвост» под карточкой: она приподнимается, а курсор с неё не срывается */
.adv__card::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:100%;
  height:8px;
}
.adv__icon{
  transition:transform .5s cubic-bezier(.2,.7,.2,1), color .35s ease;
  will-change:transform;
}
.adv__card:hover .adv__icon{ transform:translateY(-3px); }
/* ободок крутится только при наведении и замирает, а не сбрасывается */
.adv__icon::before{ animation-play-state:paused; }
.adv__card:hover .adv__icon::before{ animation-play-state:running; }
/* иконки — только переходы: одинаково мягко и при наведении, и при уходе мыши */
.adv__icon svg{
  transition:transform .55s cubic-bezier(.34,1.45,.64,1);
  will-change:transform;
}
.adv__card:nth-child(n):hover .adv__icon svg{ animation:none; }
.adv__card:nth-child(1):hover .adv__icon svg{ transform:rotate(-10deg) scale(1.12); }
.adv__card:nth-child(2):hover .adv__icon svg{ transform:scale(1.16); }
.adv__card:nth-child(3):hover .adv__icon svg{ transform:rotate(10deg) scale(1.12); }
.adv__card:nth-child(4):hover .adv__icon svg{ transform:scale(1.16); }
@media (prefers-reduced-motion:reduce){
  .adv__card, .adv__icon, .adv__icon svg{ transition:none; }
  .adv__icon::before{ animation:none; }
}

/* =================================================================
   МЕНЮ «УСЛУГИ»: открытием управляет js/nav.js — без залипаний
   ================================================================= */
/* уровень 2: только по классу .is-open (наведение/фокус больше не «держат» меню) */
.nav__item--dd:hover > .nav__dd,
.nav__item--dd:focus-within > .nav__dd{
  opacity:0;
  visibility:hidden;
  transform:translateY(-6px) scale(.98);
}
.nav__item--dd.is-open > .nav__dd{
  opacity:1;
  visibility:visible;
  transform:translateY(0) scale(1);
}
.nav__item--dd:hover .nav__caret{ transform:none; }
.nav__item--dd.is-open .nav__caret{ transform:rotate(180deg); }

/* уровень 3: только активный пункт; неактивное подменю исчезает сразу, без наложения */
.nav__dd-item:hover > .nav__sub,
.nav__dd-item:focus-within > .nav__sub{
  opacity:0;
  visibility:hidden;
  transform:translateX(-8px);
}
.nav__sub{ transition:none; }
.nav__dd-item.is-active > .nav__sub{
  opacity:1;
  visibility:visible;
  transform:translateX(0);
  transition:opacity .2s ease, transform .2s ease;
}
.nav__dd-item.is-active > .nav__dd-link{
  background:rgba(5,132,148,.10);
  color:var(--green);
}
.nav__dd-item.is-active > .nav__dd-link .nav__dd-arrow{ color:var(--green); transform:translateX(3px); }

/* пункты не «съезжают» под курсором — только подсветка */
.nav__dd-link:hover,
.nav__dd-link:focus-visible,
.nav__sub a:hover,
.nav__sub a:focus-visible{ transform:none; }

/* плашки меню почти непрозрачные — текст страницы не просвечивает */
.nav__dd,
.nav__sub{ background:rgba(255,255,255,.97); }
.nav__sub a > span{ display:block; line-height:1.3; }

/* мобильное меню: плавное раскрытие списка */
.mobile-nav__sub:not([hidden]){ animation:mnav-in .25s ease; }
@keyframes mnav-in{
  from{ opacity:0; transform:translateY(-4px); }
  to{ opacity:1; transform:none; }
}
@media (prefers-reduced-motion:reduce){
  .mobile-nav__sub:not([hidden]){ animation:none; }
  .nav__dd-item.is-active > .nav__sub{ transition:none; }
}

/* шапка на ноутбуках (961–1380px): адрес с часами убираем — иначе кнопка «Записаться»
   уезжает за край экрана. Адрес остаётся в «Контактах», подвале и мобильном меню */
@media (max-width:1380px){
  .header__addr{ display:none; }
}

/* =================================================================
   ФОРМА ЗАПИСИ: галочки согласия (политика + персональные данные)
   ================================================================= */
.book__consents{ display:grid; gap:10px; margin-top:16px; }
.book__check{
  position:relative;
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-size:13.5px;
  line-height:1.4;
  color:var(--ink-70);
  cursor:pointer;
  user-select:none;
}
.book__check input{
  position:absolute;
  top:0;
  left:0;
  width:20px;
  height:20px;
  margin:0;
  opacity:0;
  cursor:pointer;
}
.book__check-box{
  flex:none;
  display:grid;
  place-items:center;
  width:20px;
  height:20px;
  border:1.6px solid rgba(15,29,23,.25);
  border-radius:6px;
  background:#fff;
  transition:background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.book__check-box::after{
  content:"";
  width:10px;
  height:5px;
  border-left:2px solid #fff;
  border-bottom:2px solid #fff;
  transform:translateY(-1px) rotate(-45deg) scale(.4);
  opacity:0;
  transition:transform .2s ease, opacity .15s ease;
}
.book__check:hover .book__check-box{ border-color:var(--green); }
.book__check input:checked + .book__check-box{ background:var(--green); border-color:var(--green); }
.book__check input:checked + .book__check-box::after{ opacity:1; transform:translateY(-1px) rotate(-45deg) scale(1); }
.book__check input:focus-visible + .book__check-box{ box-shadow:0 0 0 3px rgba(5,132,148,.25); }
.book__check.is-invalid .book__check-box{ border-color:#D94A4A; box-shadow:0 0 0 3px rgba(217,74,74,.13); }

/* мобильная шапка: сотовый телефон рядом с логотипом (нажал — звонок) */
.header__mphone{ display:none; }
@media (max-width:960px){
  .header__mphone{
    display:inline-flex;
    align-items:center;
    gap:6px;
    margin-left:auto;
    margin-right:14px;
    font-size:15px;
    font-weight:700;
    color:var(--ink);
    white-space:nowrap;
  }
  .header__mphone svg{ flex:none; color:var(--green); }
}
@media (max-width:420px){
  .header__logo img{ height:34px; }
  .header__mphone{ gap:5px; margin-right:10px; font-size:13px; }
  .header__mphone svg{ width:15px; height:15px; }
}
/* мобильное меню «Услуги»: разделы раскрываются так же плавно */
.mobile-nav__sub-sub:not([hidden]){ animation:mnav-in .25s ease; }

/* мобильное меню: стрелка поворачивается только у своего открытого пункта */
.mobile-nav__item--dd.is-open .mobile-nav__caret,
.mobile-nav__sub-item--dd.is-open .mobile-nav__caret{ transform:none; }
.mobile-nav__item--dd.is-open > .mobile-nav__top .mobile-nav__caret,
.mobile-nav__sub-item--dd.is-open > .mobile-nav__sub-top .mobile-nav__caret{ transform:rotate(180deg); }

/* мобильная шапка: логотип · телефон · бургер помещаются в ширину экрана */
@media (max-width:960px){
  .header__inner{ column-gap:12px; }
  .header__mphone{ margin-right:0; }
}

/* мобильное меню: почти непрозрачный фон — страница под пунктами не просвечивает */
.mobile-nav{ background:rgba(255,255,255,.98); }

/* первый блок, мобильная версия: весь текстовый блок ниже на 50px */
@media (max-width:960px){
  .hero__content{ margin-top:50px; }
}

/* первый блок, мобильная версия: фото врача под плашками, стоит на нижнем крае блока */
.hero__mobile-photo{ display:none; }
@media (max-width:960px){
  .hero__mobile-photo{
    display:block;
    width:100%;
    max-width:420px;
    height:auto;
    margin:28px auto 0;
  }
  .hero__content{ padding-bottom:0; }
}

/* «О клинике» на планшетах 761–1100px: колонки резиновые — без горизонтальной прокрутки */
@media (min-width:761px) and (max-width:1100px){
  .about__grid{ grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:36px; }
}

/* «Наша команда», телефон: «+» — кнопка записи (поверх невидимой кнопки-панели) */
@media (max-width:960px){
  .tm__rail{ z-index:4; }
  .tm__plus{ pointer-events:auto; cursor:pointer; }
  .tm.is-active .tm__plus{ pointer-events:none; }
}

/* «Наша команда»: кнопки внутри карточки нажимаются только у раскрытой карточки
   (у свёрнутой они невидимы и не должны перехватывать тап по имени) */
.tm__actions button{ pointer-events:none; }
.tm.is-active .tm__actions button{ pointer-events:auto; }

/* =================================================================
   «О КЛИНИКЕ»: фото команды на фоне цвета блока — фото растворяется в секции
   ================================================================= */
.about{ background:#DAEBF8; }                         /* = цвет фона на фотографии */
.about__grid{
  grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:48px;
  align-items:center;
}
.about__media{
  position:relative;
  aspect-ratio:auto;
  min-height:0;
  max-height:none;
  border-radius:0;
  overflow:visible;
  background:none;
  box-shadow:none;
}
.about__media img{
  position:relative;
  inset:auto;
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
  /* мягкие края: даже малейшая разница оттенков не видна */
  -webkit-mask-image:
    linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%),
    linear-gradient(180deg,transparent 0,#000 6%,#000 94%,transparent 100%);
  -webkit-mask-composite:source-in;
          mask-image:
    linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%),
    linear-gradient(180deg,transparent 0,#000 6%,#000 94%,transparent 100%);
          mask-composite:intersect;
}
/* лицензия — стеклянная капсула-подпись под командой */
.about__lic{
  left:50%;
  right:auto;
  bottom:2%;
  transform:translateX(-50%);
  width:max-content;
  max-width:94%;
  padding:9px 18px;
  border:1px solid rgba(255,255,255,.75);
  border-radius:999px;
  background:rgba(255,255,255,.6);
  font-size:12px;
  text-align:center;
}
/* текст компактнее, чтобы блок целиком помещался рядом с фото */
.about .section-title{ font-size:clamp(28px,2.5vw,36px); }
.about__mission{ margin-top:14px; gap:10px; }
.about__mission p{ font-size:15px; line-height:1.55; }
.about .stats{ margin-top:24px; gap:12px; }
.about .stat{
  padding:16px 18px;
  border:1px solid rgba(255,255,255,.8);
  background:rgba(255,255,255,.66);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.about .stat__num{ font-size:clamp(28px,2.4vw,34px); }
.about .stat__label{ font-size:13px; margin-top:6px; }

/* телефон и планшет: сначала фото на всю ширину, под ним текст */
@media (max-width:960px){
  .about__grid{ grid-template-columns:1fr; gap:28px; }
  .about__media{ aspect-ratio:auto; max-height:none; }
  .about__lic{ position:relative; left:auto; bottom:auto; transform:none; display:block; margin:-8px auto 0; }
}

/* «О клинике», телефон: капсула с лицензией не шире колонки, текст переносится —
   иначе длинная строка растягивает страницу шире экрана */
@media (max-width:960px){
  .about__grid{ grid-template-columns:minmax(0,1fr); }
  .about__media,
  .about__body{ min-width:0; }
  .about__lic{
    width:auto;
    max-width:100%;
    white-space:normal;
    border-radius:16px;
  }
}

/* «О клинике», компьютер: капсула «Медицинская лицензия» ниже на 75px */
@media (min-width:961px){
  .about__lic{ bottom:calc(2% - 75px); }
}

/* «Наша команда», компьютер: раскрытие мягче и чуть дольше */
@media (min-width:961px){
  .tm{ transition:flex-grow .9s cubic-bezier(.45,.05,.2,1), box-shadow .6s ease; }
  .tm__img{ transition:filter .8s ease, transform 1.1s cubic-bezier(.45,.05,.2,1); }
}
/* окно врача: светлая подложка под фото вместо тёмной */
.doc-modal__photo{ background:#E6F1F8; }
.doc-modal__photo img{ animation:none; }

/* «О клинике», компьютер: команда на фото крупнее на 15%
   (фото растёт от нижнего центра в поля блока — фон совпадает, выход за колонку не виден) */
@media (min-width:961px){
  .about__media img{
    transform:scale(1.15);
    transform-origin:50% 100%;
  }
}

/* «О клинике», компьютер: больше воздуха — блок выше на 100px (по 50px сверху и снизу) */
@media (min-width:961px){
  .about{ padding:160px 0; }
}

/* первый блок: новый фон — только на компьютере, на телефоне прежний (<picture> в разметке) */
.hero__bg picture{ display:contents; }

/* =================================================================
   КОНТАКТЫ: карта Яндекса по ключу API — своя метка, свои кнопки
   ================================================================= */
.contacts__ymap{ position:absolute; inset:0; background:#EEF3F5; }
.contacts__ymap iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.ymap-pin{
  position:absolute;
  display:flex;
  flex-direction:column;
  align-items:center;
  transform:translate(-50%,-100%);
  pointer-events:none;
}
.ymap-pin svg{ display:block; filter:drop-shadow(0 8px 14px rgba(5,132,148,.45)); }
.ymap-pin span{
  order:-1;
  margin-bottom:6px;
  padding:6px 11px;
  border-radius:999px;
  background:#fff;
  color:var(--ink);
  font:700 12.5px/1 Manrope,system-ui,sans-serif;
  white-space:nowrap;
  box-shadow:0 8px 18px -8px rgba(15,29,23,.4);
}
.ymap-ctrl{
  position:absolute;
  top:16px;
  right:16px;
  z-index:3;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.ymap-ctrl button{
  width:40px;
  height:40px;
  border:0;
  border-radius:12px;
  background:#fff;
  color:var(--ink);
  font:700 20px/1 Manrope,system-ui,sans-serif;
  cursor:pointer;
  box-shadow:0 8px 20px -10px rgba(15,29,23,.45);
  transition:background-color .2s ease, color .2s ease;
}
.ymap-ctrl button:hover{ background:var(--green); color:#fff; }
.ymap-route{
  position:absolute;
  right:16px;
  bottom:16px;
  z-index:3;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:11px 16px;
  border-radius:999px;
  background:#fff;
  color:var(--green-dark);
  font-size:14px;
  font-weight:700;
  box-shadow:0 10px 24px -12px rgba(15,29,23,.45);
  transition:background-color .2s ease, color .2s ease;
}
.ymap-route:hover{ background:var(--green); color:#fff; }
/* запасной виджет Яндекса имеет свои кнопки — наши масштабные прячем */
.contacts__map.is-fallback .ymap-ctrl{ display:none; }
/* без плашек соцсетей кнопка записи сразу под контактами */
.contacts__card .contacts__cta{ margin-top:18px; }

/* первый блок, мобильная версия: текст и фото выше на 5px (отступ 50 → 45px) */
@media (max-width:960px){
  .hero__content{ margin-top:45px; }
}