/* ===========================================================
   Аймед — прототип сайта
   Единый файл стилей. Правки цветов/шрифтов — в блоке :root ниже.
   =========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Merriweather:wght@400;700&display=swap');

:root{
  --color-bg: #faf7f1;
  --color-bg-alt: #eef4f4;
  --color-surface: #ffffff;
  --color-text: #1f2e2e;
  --color-text-muted: #5c6d6d;
  --color-primary: #009999;
  --color-primary-dark: #006666;
  --color-primary-light: #d9f5f4;
  --color-accent: #c96f4a;
  --color-accent-dark: #a95736;
  --color-border: #dcece9;
  --radius-s: 8px;
  --radius-m: 16px;
  --radius-l: 28px;
  --shadow-card: 0 4px 20px rgba(7,94,94,0.08);
  --shadow-card-hover: 0 10px 30px rgba(7,94,94,0.14);
  --font-body: 'Manrope', system-ui, sans-serif;
  --font-display: 'Merriweather', Georgia, serif;
  --container: 1120px;
}

*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin: 0;
  font-family: var(--font-body);
  color: var(--color-text);
  background: var(--color-bg);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img{ max-width: 100%; display: block; border-radius: var(--radius-m); }
a{ color: inherit; text-decoration: none; }
h1,h2,h3,h4{
  font-family: var(--font-display);
  line-height: 1.25;
  margin: 0 0 0.5em;
  color: var(--color-primary-dark);
}
p{ margin: 0 0 1em; }
ul{ margin: 0; padding: 0; list-style: none; }

.container{
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 24px;
}

.section{ padding: 72px 0; }
.section--alt{ background: var(--color-bg-alt); }
.section--primary{ background: var(--color-primary); color: #fff; }
.section--primary h1, .section--primary h2, .section--primary h3{ color: #fff; }

.section-head{ max-width: 680px; margin: 0 0 40px; }
.eyebrow{
  display: inline-block;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-accent-dark);
  margin-bottom: 12px;
}
.section-head p{ color: var(--color-text-muted); font-size: 17px; }

/* ---------- Buttons ---------- */
.btn{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 28px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 15px;
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn-primary{ background: var(--color-accent); color: #fff; }
.btn-primary:hover{ background: var(--color-accent-dark); transform: translateY(-1px); }
.btn-outline{ background: transparent; border-color: currentColor; color: inherit; }
.btn-outline:hover{ background: rgba(255,255,255,0.12); }
.btn-ghost{ background: var(--color-primary-light); color: var(--color-primary-dark); }
.btn-ghost:hover{ background: #dcebe4; }
.btn-block{ width: 100%; justify-content: center; }

/* ---------- Header ---------- */
.site-header{
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(250,247,241,0.94);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--color-border);
}
.site-header .container{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-top: 8px;
  padding-bottom: 8px;
}
.header-home-icon{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  overflow: hidden;
  transition: transform .2s ease;
}
.header-home-icon:hover{ transform: translate(-50%, -50%) scale(1.1); }
.header-home-icon img{ width: 100%; height: 100%; object-fit: contain; }
/* Подписи по бокам от иконки в шапке главной */
.header-tag{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  color: var(--color-primary-dark);
  white-space: nowrap;
}
.header-tag-left{ right: calc(50% + 30px); text-decoration: none; }
.header-tag-left:hover{ text-decoration: underline; }
.header-tag-right{ left: calc(50% + 30px); text-decoration: none; }
.header-tag-right:hover{ text-decoration: underline; }
@media (max-width: 860px){
  .header-tag{ display: none; }
}
.site-header .btn-ghost{
  padding: 7px 15px;
  font-size: 13px;
}
.logo{
  display: block;
  white-space: nowrap;
}
.logo-img{
  height: 46px;
  width: auto;
  border-radius: 0;
  transition: transform .2s ease;
}
.logo:hover .logo-img{ transform: rotate(-2deg) scale(1.03); }
@media (max-width: 700px){
  .logo-img{ height: 36px; }
}
.nav-toggle{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px; height: 42px;
  background: var(--color-primary-light);
  border: none;
  border-radius: 10px;
  font-size: 20px;
  cursor: pointer;
  color: var(--color-primary-dark);
  flex-shrink: 0;
}
.header-right{
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.main-nav{
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 24px;
  left: auto;
  min-width: 240px;
  max-height: 75vh;
  overflow-y: auto;
  flex-direction: column;
  gap: 2px;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-m);
  box-shadow: var(--shadow-card-hover);
  padding: 10px;
  font-size: 14.5px;
  font-weight: 600;
  z-index: 150;
}
.main-nav.is-open{ display: flex; }
.main-nav a{
  padding: 11px 14px;
  border-radius: 8px;
  color: var(--color-text);
}
.main-nav a:hover, .main-nav a[aria-current="page"]{
  color: var(--color-primary-dark);
  background: var(--color-primary-light);
}
@media (max-width: 480px){
  .main-nav{ left: 24px; right: 24px; min-width: 0; }
}

/* ---------- Hero ---------- */
.hero{
  position: relative;
  padding: 64px 0 56px;
  background: linear-gradient(180deg, var(--color-primary-light) 0%, var(--color-bg) 100%);
  overflow: hidden;
}
.hero-badge{
  position: absolute;
  top: 28px;
  right: 24px;
  color: var(--color-accent-dark);
  font-weight: 700;
  font-size: 14px;
  text-align: right;
  line-height: 1.4;
}
.hero-mega{
  font-size: clamp(40px, 7vw, 76px);
  line-height: 0.98;
  text-transform: uppercase;
  letter-spacing: -0.01em;
  margin-bottom: 22px;
}
.hero-mega .slash{ color: var(--color-accent); }
.hero-indent::before{ content: "/Д"; visibility: hidden; }  /* отступ: КОСМЕТОЛОГИЯ начинается под буквой Е в ДЕРМАТОЛОГИЯ */
.hero .container{
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 48px;
  align-items: center;
}
.hero h1{ font-size: clamp(28px, 4vw, 42px); }
.hero-lead{ font-size: 18px; color: var(--color-text-muted); max-width: 46ch; }
.hero-actions{ display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; }
.hero-stats{
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 16px;
  margin-top: 40px;
  max-width: 460px;
}
.stat b{ display: block; font-family: var(--font-display); font-size: 26px; color: var(--color-primary); }
.stat span{ font-size: 13px; color: var(--color-text-muted); }
.hero-art{
  background: var(--color-surface);
  border-radius: var(--radius-l);
  padding: 28px;
  box-shadow: var(--shadow-card);
  border: 1px solid var(--color-border);
}
.hero-art img{ border-radius: var(--radius-m); }
/* Перелив по сетке лица на главной: полупрозрачная полоса света
   проходит слева направо только по линиям картинки (mask = сама
   hero.png), непрерывно, без паузы. Импульсы и «открывающийся глаз» (25.09)
   пользователю не понравились -- убраны. */
.hero-face{ position: relative; display: block; }
.hero-shimmer{
  position: absolute; inset: 0; pointer-events: none;
  -webkit-mask: url(../img/site/hero.png) center / 100% 100% no-repeat;
          mask: url(../img/site/hero.png) center / 100% 100% no-repeat;
  background: linear-gradient(105deg, rgba(0,153,153,0) 35%, rgba(0,153,153,.8) 47%, rgba(0,153,153,.95) 50%, rgba(0,153,153,.8) 53%, rgba(0,153,153,0) 65%);
  background-size: 300% 100%;
  animation: hero-shimmer 6s linear infinite;
}
@keyframes hero-shimmer{ 0%{ background-position: 100% 0; } 100%{ background-position: 0% 0; } }
@media (prefers-reduced-motion: reduce){ .hero-shimmer{ animation: none; opacity: 0; } }
@media (max-width: 900px){
  .hero .container{ grid-template-columns: 1fr; }
  .hero-art{ order: -1; }
}

/* ---------- Cards / Grids ---------- */
.grid{ display: grid; gap: 24px; }
.grid-2{ grid-template-columns: repeat(2,1fr); }
.grid-3{ grid-template-columns: repeat(3,1fr); }
.grid-4{ grid-template-columns: repeat(4,1fr); }
@media (max-width: 900px){
  .grid-3, .grid-4{ grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 600px){
  .grid-2, .grid-3, .grid-4{ grid-template-columns: 1fr; }
}

.card{
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-m);
  padding: 28px;
  box-shadow: var(--shadow-card);
  transition: box-shadow .15s ease, transform .15s ease;
}
.card:hover{ box-shadow: var(--shadow-card-hover); transform: translateY(-2px); }
.card-icon{
  width: 52px; height: 52px;
  border-radius: 14px;
  background: var(--color-primary-light);
  color: var(--color-primary);
  display: flex; align-items: center; justify-content: center;
  font-size: 24px;
  margin-bottom: 16px;
}
.card-icon svg{ width: 26px; height: 26px; }
.card h3{ font-size: 19px; margin-bottom: 8px; }
.card p{ color: var(--color-text-muted); font-size: 15px; margin-bottom: 0; }
.card-link{ display: inline-block; margin-top: 14px; font-weight: 700; color: var(--color-accent-dark); font-size: 14px; }
.inline-link{ color: var(--color-accent-dark); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.inline-link:hover{ text-decoration-thickness: 2px; }

/* ---------- Doctor photo: shared style everywhere (cards, doctor-page hero) ---------- */
.doctor-photo{
  aspect-ratio: 3/4;
  background: var(--color-primary-light);
  display: flex; align-items: center; justify-content: center;
  color: var(--color-primary);
  font-family: var(--font-display);
  font-size: 42px;
  font-weight: 700;
  overflow: hidden;
  border-radius: var(--radius-m);
}
.doctor-photo img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

/* ---------- Doctor cards (vrachi.html grid) ---------- */
.doctor-card{
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-m);
  overflow: hidden;
  box-shadow: var(--shadow-card);
}
.doctor-body{ padding: 20px 20px 24px; }
.doctor-body h3{ font-size: 18px; margin-bottom: 4px; }
.doctor-role{ color: var(--color-accent-dark); font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 10px; }
.doctor-body p{ font-size: 14.5px; color: var(--color-text-muted); }
.doctor-tags{ display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 4px; }
.doctor-tags span{
  font-size: 12px;
  background: var(--color-bg-alt);
  border: 1px solid var(--color-border);
  padding: 4px 10px;
  border-radius: 999px;
  color: var(--color-text-muted);
}

/* ---------- Price tables ---------- */
.price-block{ margin-bottom: 40px; }
.price-block h3{
  font-size: 20px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--color-primary);
  display: inline-block;
  margin-bottom: 4px;
}
.price-table{ width: 100%; border-collapse: collapse; margin-top: 12px; }
.price-table tr{ border-bottom: 1px dashed var(--color-border); }
.price-table td{ padding: 13px 4px; font-size: 15px; vertical-align: top; }
.price-table td:last-child{
  text-align: right;
  white-space: nowrap;
  font-weight: 700;
  color: var(--color-primary-dark);
  padding-left: 16px;
}
.price-table tr:last-child{ border-bottom: none; }
.price-note{ font-size: 13.5px; color: var(--color-text-muted); margin-top: 8px; }
.price-note a{ color: var(--color-primary); text-decoration: underline; font-weight: 600; }
.price-note a:hover{ color: var(--color-primary-dark); }

/* ---------- Reviews ---------- */
.review-card{
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-m);
  padding: 24px;
  box-shadow: var(--shadow-card);
}
.review-stars{ color: var(--color-accent); font-size: 15px; letter-spacing: 2px; margin-bottom: 10px; }
.review-meta{ margin-top: 14px; font-size: 13px; color: var(--color-text-muted); display: flex; justify-content: space-between; }

.rating-badge{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--color-primary-light);
  border-radius: 999px;
  padding: 10px 20px;
  font-weight: 700;
  color: var(--color-primary-dark);
}
.rating-badge b{ font-family: var(--font-display); font-size: 20px; color: var(--color-primary); }

/* ---------- Steps ---------- */
.steps{ counter-reset: step; }
.step{
  display: flex;
  gap: 18px;
  padding: 18px 0;
  border-bottom: 1px solid var(--color-border);
}
.step:last-child{ border-bottom: none; }
.step::before{
  counter-increment: step;
  content: counter(step);
  flex-shrink: 0;
  width: 40px; height: 40px;
  border-radius: 50%;
  background: var(--color-primary);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700;
  font-family: var(--font-display);
}

/* ---------- Gallery ---------- */
.gallery-grid{ display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }
.gallery-item{
  aspect-ratio: 1;
  border-radius: var(--radius-s);
  background: var(--color-primary-light);
  display: flex; align-items: center; justify-content: center;
  color: var(--color-primary);
  font-size: 13px;
  text-align: center;
  border: 1px dashed var(--color-border);
  padding: 10px;
}
@media (max-width: 900px){ .gallery-grid{ grid-template-columns: repeat(2,1fr); } }

.exosomy-gallery{ display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.exosomy-gallery img{ width: 100%; height: auto; border-radius: var(--radius-s); border: 1px solid var(--color-border); }
@media (max-width: 700px){ .exosomy-gallery{ grid-template-columns: 1fr; } }

.slider-row{
  display: flex;
  gap: 14px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: 10px;
  -webkit-overflow-scrolling: touch;
}
.slider-row img{
  flex: 0 0 auto;
  width: 220px;
  height: 220px;
  object-fit: cover;
  border-radius: var(--radius-m);
  border: 1px solid var(--color-border);
  scroll-snap-align: start;
}
.slider-row::-webkit-scrollbar{ height: 8px; }
.slider-row::-webkit-scrollbar-thumb{ background: var(--color-border); border-radius: 999px; }
@media (max-width: 600px){
  .slider-row img{ width: 160px; height: 160px; }
}
.slider-row .card{ flex: 0 0 280px; scroll-snap-align: start; }
@media (max-width: 600px){
  .slider-row .card{ flex-basis: 240px; }
}
.gallery-grid img{
  aspect-ratio: 1;
  object-fit: cover;
  width: 100%;
  border: 1px solid var(--color-border);
  cursor: zoom-in;
}

/* ---------- Video embeds (TV appearances etc.) ---------- */
.video-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.video-embed{
  position: relative;
  aspect-ratio: 16/9;
  border-radius: var(--radius-m);
  overflow: hidden;
  border: 1px solid var(--color-border);
  background: #000;
}
.video-embed iframe{ position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-embed-caption{ margin: 10px 0 0; font-size: 14px; color: var(--color-text-muted); }
@media (max-width: 700px){ .video-grid{ grid-template-columns: 1fr; } }

/* ---------- CTA banner ---------- */
.cta-banner{
  background: var(--color-primary);
  color: #fff;
  border-radius: var(--radius-l);
  padding: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}
.cta-banner h2{ color: #fff; margin-bottom: 6px; }
.cta-banner p{ color: rgba(255,255,255,0.8); margin: 0; }

/* ---------- VIP premium banner ---------- */
.vip-banner{
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, #0b2e2e 0%, #123636 48%, #081c1c 100%);
  padding: 56px 0;
}
.vip-banner::before{
  content: "";
  position: absolute; top: -120px; right: -100px;
  width: 360px; height: 360px; border-radius: 50%;
  background: radial-gradient(circle, rgba(224,171,104,0.35) 0%, rgba(224,171,104,0) 70%);
  animation: vipGlowDrift 14s ease-in-out infinite alternate;
}
.vip-banner::after{
  content: "";
  position: absolute; bottom: -160px; left: -80px;
  width: 320px; height: 320px; border-radius: 50%;
  background: radial-gradient(circle, rgba(0,153,153,0.4) 0%, rgba(0,153,153,0) 70%);
  animation: vipGlowDrift 17s ease-in-out infinite alternate-reverse;
}
@keyframes vipGlowDrift{
  from{ transform: translate(0,0) scale(1); opacity: .85; }
  to{ transform: translate(-24px,18px) scale(1.12); opacity: 1; }
}
.vip-banner .container{
  position: relative; z-index: 1;
  display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 40px; align-items: center;
}
.vip-banner .eyebrow{
  display: inline-block; color: #e0ab68; font-weight: 700; font-size: 13px;
  text-transform: uppercase; letter-spacing: .08em; margin-bottom: 14px;
}
.vip-banner h2{ color: #fff; font-size: clamp(24px,3.2vw,34px); margin: 0 0 14px; line-height: 1.25; }
.vip-banner p{ color: rgba(255,255,255,0.72); font-size: 16px; max-width: 48ch; margin: 0; }
.vip-banner-actions{ display: flex; flex-wrap: wrap; gap: 14px; margin-top: 26px; }
.btn-outline-light{
  display: inline-block;
  border: 1px solid rgba(255,255,255,0.35); color: #fff; padding: 12px 22px; border-radius: 999px;
  font-weight: 600; font-size: 14px; transition: background .2s, border-color .2s;
}
.btn-outline-light:hover{ background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.6); }
.vip-panel{
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: var(--radius-l);
  padding: 26px;
}
.vip-price-row{
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
  padding: 12px 0; border-bottom: 1px dashed rgba(255,255,255,0.18);
}
.vip-price-row:last-of-type{ border-bottom: none; }
.vip-price-row span{ color: rgba(255,255,255,0.75); font-size: 14px; }
.vip-price-row b{ color: #e0ab68; font-family: var(--font-display); font-size: 19px; white-space: nowrap; }
.vip-doctors-row{
  display: flex; align-items: center; gap: 10px; margin-top: 18px; padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,0.14);
}
.vip-doctors-row img{
  width: 44px; height: 44px; border-radius: 50%; object-fit: cover; object-position: top center;
  border: 2px solid rgba(255,255,255,0.55); box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}
.vip-doctors-row span{ color: rgba(255,255,255,0.75); font-size: 13px; }
@media (max-width: 900px){
  .vip-banner .container{ grid-template-columns: 1fr; }
}

@keyframes vipFadeUp{
  from{ opacity: 0; transform: translateY(18px); }
  to{ opacity: 1; transform: translateY(0); }
}
.vip-banner .eyebrow,
.vip-banner h2,
.vip-banner p,
.vip-banner-actions,
.vip-panel{
  animation: vipFadeUp .7s ease-out both;
}
.vip-banner .eyebrow{ animation-delay: .05s; }
.vip-banner h2{ animation-delay: .15s; }
.vip-banner p{ animation-delay: .28s; }
.vip-banner-actions{ animation-delay: .4s; }
.vip-panel{ animation-delay: .35s; }
@media (prefers-reduced-motion: reduce){
  .vip-banner::before, .vip-banner::after{ animation: none; }
  .vip-banner .eyebrow, .vip-banner h2, .vip-banner p, .vip-banner-actions, .vip-panel{ animation: none; }
}

/* ---------- Contact block ---------- */
.contact-item{ display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--color-border); }
.contact-item:last-child{ border-bottom: none; }
.contact-item .ic{
  width: 40px; height: 40px; border-radius: 10px;
  background: var(--color-primary-light); color: var(--color-primary);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.map-placeholder{
  background: var(--color-primary-light);
  border: 1px dashed var(--color-border);
  border-radius: var(--radius-m);
  height: 100%;
  min-height: 320px;
  display: flex; align-items: center; justify-content: center;
  color: var(--color-primary);
  text-align: center;
  padding: 24px;
  font-size: 14px;
}

/* ---------- Breadcrumb / page hero ---------- */
.page-hero{ padding: 44px 0 40px; background: var(--color-bg-alt); border-bottom: 1px solid var(--color-border); }
.page-hero .eyebrow{ margin-bottom: 6px; }
.page-hero h1{ margin-bottom: 10px; }
.page-hero p{ color: var(--color-text-muted); max-width: 60ch; font-size: 16.5px; }

/* ---------- Footer ---------- */
.site-footer{ background: var(--color-primary-dark); color: rgba(255,255,255,0.85); padding: 56px 0 28px; }
.site-footer h4{ color: #fff; font-size: 15px; margin-bottom: 14px; }
.footer-grid{ display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 32px; }
.footer-grid a{ display: block; padding: 5px 0; font-size: 14px; color: rgba(255,255,255,0.75); }
.footer-grid a:hover{ color: #fff; }
.footer-logo{ font-family: var(--font-display); font-size: 20px; color: #fff; margin-bottom: 10px; }
.footer-logo-img{ height: 40px; width: auto; margin-bottom: 14px; border-radius: 0; filter: brightness(0) invert(1); opacity: 0.92; }
.footer-map-buttons{ display: flex; flex-wrap: wrap; gap: 8px; }
.footer-map-btn{
  font-size: 12.5px;
  font-weight: 700;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.3);
  color: rgba(255,255,255,0.9);
  white-space: nowrap;
  flex-shrink: 0;
  transition: background .15s ease, border-color .15s ease;
}
.footer-map-btn:hover{ background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.6); }

.review-links{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 24px;
}
.review-links a{
  font-size: 13.5px;
  font-weight: 700;
  padding: 10px 18px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  color: var(--color-primary-dark);
  background: var(--color-surface);
  white-space: nowrap;
  flex-shrink: 0;
  transition: background .15s ease, border-color .15s ease;
}
.review-links a:hover{ background: var(--color-primary-light); border-color: var(--color-primary); }
.footer-disclaimer{ font-size: 12.5px; color: rgba(255,255,255,0.5); margin-top: 36px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,0.15); }
.social-row{ display: flex; gap: 10px; margin-top: 14px; }
.social-row a{
  width: 36px; height: 36px; border-radius: 50%;
  background: rgba(255,255,255,0.1);
  display: flex; align-items: center; justify-content: center;
  padding: 0;
  font-size: 14px;
}
.social-row a:hover{ background: var(--color-accent); }
@media (max-width: 900px){ .footer-grid{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px){ .footer-grid{ grid-template-columns: 1fr; } }

/* ---------- "Спроси онлайн" чат -- закладка, прижатая к левому краю
   экрана, а не круглая кнопка в углу (2026-08-23, по просьбе
   пользователя: на телефоне низ экрана и так перегружен кнопками
   самого сайта, а середина по высоте не занята вообще). Вертикальная
   позиция задаётся и перетаскивается через JS (initAskToggleDrag в
   js/main.js) -- CSS даёт только стартовое top:50% на случай, если JS
   почему-то не успел отработать. Клик (без сдвига) разворачивает окно
   диалога с GigaChat, как и раньше -- открытая панель (.ask-panel)
   этой правкой не затронута, остаётся там же, где была. ---------- */
.ask-toggle{
  position: fixed;
  left: 0;
  top: 50%;
  z-index: 250;
  width: 30px; height: 132px; /* 2026-09-25: текст на закладке, как на 3191921.ru */
  display: flex; align-items: center; justify-content: center; padding: 0;
  color: #fff;
  background: var(--color-primary-dark);
  border: none;
  border-radius: 0 var(--radius-s) var(--radius-s) 0;
  cursor: grab;
  touch-action: none; /* сами обрабатываем вертикальный драг -- страница не должна ещё и скроллиться под пальцем */
  box-shadow: 3px 4px 14px rgba(31,46,46,.35);
  transition: transform .15s ease;
}
.ask-toggle:active{ cursor: grabbing; }
.ask-toggle:hover{ transform: scale(1.05); }
.ask-toggle[hidden]{ display: none; }
.ask-toggle-label{ writing-mode: vertical-rl; transform: rotate(180deg); font-weight: 700; font-size: 13px; letter-spacing: .03em; white-space: nowrap; pointer-events: none; }
/* Пустая закладка без своей иконки (эмодзи убран 2026-08-23 по просьбе
   пользователя, проверявшего вживую на телефоне) -- единственный
   визуальный сигнал теперь пульсирующая зелёная точка, читается как
   "есть непрочитанное/на связи онлайн", а не просто декоративная метка
   поверх иконки чата. */
.ask-toggle::after{
  content: '';
  position: absolute;
  bottom: -3px; right: -3px; /* ровно в правом нижнем углу закладки -- половина точки под нижней гранью, половина за правой */
  width: 10px; height: 10px;
  border-radius: 50%;
  background: #2ecc71;
  border: 2px solid var(--color-primary-dark);
  animation: ask-status-pulse 2s infinite;
}
@keyframes ask-status-pulse{
  0%{ box-shadow: 0 0 0 0 rgba(46,204,113,.6); }
  70%{ box-shadow: 0 0 0 7px rgba(46,204,113,0); }
  100%{ box-shadow: 0 0 0 0 rgba(46,204,113,0); }
}

.ask-typing{
  display: flex; gap: 4px; align-self: flex-start;
  background: #fff; padding: 12px 16px; border-radius: 14px;
  box-shadow: 0 1px 3px rgba(0,0,0,.08);
}
.ask-typing span{
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--color-text-muted); opacity: .4;
  animation: ask-typing-bounce 1.2s infinite ease-in-out;
}
.ask-typing span:nth-child(2){ animation-delay: .2s; }
.ask-typing span:nth-child(3){ animation-delay: .4s; }
@keyframes ask-typing-bounce{
  0%, 60%, 100%{ transform: translateY(0); opacity: .4; }
  30%{ transform: translateY(-4px); opacity: 1; }
}

.ask-panel{
  position: fixed; left: 20px; bottom: 20px;
  width: min(360px, calc(100vw - 40px));
  height: min(480px, calc(100vh - 100px));
  background: #fff; border-radius: var(--radius-m);
  box-shadow: 0 12px 40px rgba(31,46,46,.25);
  display: flex; flex-direction: column; overflow: hidden;
  /* Выше .floating-contact (260) -- иначе кнопка "Позвонить/MAX"
     справа проступает поверх открытого чата, особенно заметно в
     полноэкранной мобильной модалке (см. медиа-запрос ниже). */
  z-index: 270;
}
.ask-panel[hidden]{ display: none; }
.ask-panel-header{
  background: var(--color-primary-dark); color: #fff;
  padding: 14px 16px; font-weight: 700;
  display: flex; align-items: center; justify-content: space-between;
  flex-shrink: 0;
}
.ask-close{
  background: none; border: none; color: #fff;
  font-size: 22px; line-height: 1; cursor: pointer; padding: 0 4px;
}
.ask-messages{
  flex: 1; overflow-y: auto; padding: 16px;
  display: flex; flex-direction: column; gap: 10px;
  background: var(--color-bg-alt);
}
.ask-message{
  max-width: 85%; padding: 10px 14px; border-radius: 14px;
  font-size: 14px; line-height: 1.4;
}
.ask-message-assistant{ background: #fff; align-self: flex-start; box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.ask-message-user{ background: var(--color-accent); color: #fff; align-self: flex-end; }
.ask-reply-image{ display: block; max-width: 180px; width: 100%; border-radius: 12px; }
.ask-message p{ margin: 0 0 8px; }
.ask-message p:last-child{ margin-bottom: 0; }
.ask-message-assistant a{ color: var(--color-primary-dark); text-decoration: underline; }
.ask-messages[hidden]{ display: none; }
.ask-form{ display: flex; border-top: 1px solid var(--color-border); padding: 10px; gap: 8px; flex-shrink: 0; }
.ask-form[hidden]{ display: none; }
/* Галочка согласия на обработку ПДн над строкой ввода чата. */
.ask-consent{
  border-top: 1px solid var(--color-border);
  padding: 8px 12px 0; font-size: 12px; line-height: 1.35; flex-shrink: 0;
}
.ask-consent a{ color: var(--color-primary-dark); text-decoration: underline; }
.ask-consent[hidden], .ask-consent.is-booking{ display: none; }
.ask-consent:not([hidden]) + .ask-form{ border-top: none; }
.ask-consent.is-required{ color: #a12626; }
/* Строка согласия в чате -- 2 строки на телефоне 360px+. Нужен двойной
   класс: .zapis-consent (13px) объявлен ниже в файле и иначе перебивает. */
.zapis-consent.ask-consent{ font-size: 11px; line-height: 1.3; }
@media (max-width: 340px){ .zapis-consent.ask-consent{ font-size: 10px; } }
.ask-consent.is-required input{ outline: 2px solid #d93b3b; outline-offset: 1px; }
/* Форма записи (после клика по слоту в renderSlotButtons, см. js/main.js)
   -- изначально не имела вообще никаких стилей контейнера: без этого
   правила `hidden` на .ask-messages/.ask-form не действовал (класс с
   display:flex перебивает атрибут -- тот же паттерн уже учтён у
   .ask-panel[hidden] выше, здесь просто забыли повторить), а сама форма
   без flex:1/overflow-y вылезала за пределы фиксированной высоты
   .ask-panel вместо прокрутки внутри себя. */
.ask-booking{
  flex: 1; overflow-y: auto; padding: 16px;
  display: flex; flex-direction: column; gap: 10px;
}
.ask-booking[hidden]{ display: none; }
.ask-booking-back{
  align-self: flex-start;
  background: none; border: none; color: var(--color-primary-dark);
  font: inherit; cursor: pointer; padding: 0; margin-bottom: 4px;
}
.ask-booking-title{ font-weight: 700; }
.ask-input{
  /* min-width:0 -- без него поле не сжимается уже своей собственной
     ширины, и после появления кнопки микрофона «Отправить» уезжала
     за правый край окна чата. */
  flex: 1 1 0; min-width: 0; text-overflow: ellipsis;
  border: 1px solid var(--color-border); border-radius: 999px;
  padding: 10px 16px; font-family: var(--font-body);
  /* 16px, не 14 -- ниже этого iOS Safari зумит страницу при фокусе на
     инпуте, из-за чего и "съезжала" вёрстка окна диалога на телефоне. */
  font-size: 16px;
}
.ask-input:focus{ outline: 2px solid var(--color-primary-dark); }
.ask-send{
  background: var(--color-accent); color: #fff; border: none;
  border-radius: 50%; width: 40px; height: 40px; font-size: 16px;
  cursor: pointer; flex-shrink: 0;
}
.ask-attach-btn{
  background: var(--color-bg-alt); color: var(--color-primary-dark);
  border: none; border-radius: 50%;
  width: 40px; height: 40px; font-size: 18px; line-height: 1;
  cursor: pointer; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.ask-attach-btn:hover{ background: var(--color-border); }
.ask-attach-btn:disabled{ opacity: .5; cursor: default; }
.ask-mic-btn{
  background: var(--color-bg-alt); color: var(--color-primary-dark);
  border: none; border-radius: 50%;
  width: 40px; height: 40px; padding: 0;
  cursor: pointer; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.ask-mic-btn[hidden]{ display: none; }
.ask-mic-btn svg{ width: 20px; height: 20px; }
.ask-mic-btn:hover{ background: var(--color-border); }
.ask-mic-btn:disabled{ opacity: .5; cursor: default; }
.ask-mic-btn.is-recording{ background: #d93b3b; color: #fff; animation: ask-mic-pulse 1.2s infinite; }
@keyframes ask-mic-pulse{ 0%{ box-shadow: 0 0 0 0 rgba(217,59,59,.5); } 70%{ box-shadow: 0 0 0 10px rgba(217,59,59,0); } 100%{ box-shadow: 0 0 0 0 rgba(217,59,59,0); } }
.ask-audio-row{ padding: 6px 8px; }
.ask-audio-row audio{ display: block; width: 240px; max-width: 100%; height: 36px; }

/* На узких экранах окно диалога -- полноэкранная модалка (без
   плавающей карточки со своей шириной/высотой): это одновременно и
   надёжнее (не зависит от вычисления 100vh с учётом сворачивающейся
   адресной строки Safari/Chrome), и ближе к тому, что обычно ожидают
   от "модалки" на телефоне. */
@media (max-width: 700px){
  .ask-panel{
    left: 0; right: 0; top: 0; bottom: 0;
    width: 100%; height: 100%;
    border-radius: 0;
    /* 2026-09-25: сплошной белый фон вокруг окна -- на iPhone окно
       подгоняется под область над клавиатурой, а под ним (сквозь
       полупрозрачную клавиатуру) просвечивала страница сайта. */
    box-shadow: 0 0 0 200vmax #fff;
  }
  .ask-panel-header{ padding-top: calc(14px + env(safe-area-inset-top)); }
  .ask-form{ padding-bottom: calc(10px + env(safe-area-inset-bottom)); }
}
/* Клавиатура открыта (класс ставит fitPanelToViewport в js/main.js):
   компактная шапка и отступы, строка согласия прячется, если галочка
   уже стоит -- иначе на переписку оставалось 7-8 строк. */
.ask-panel.ask-kb .ask-panel-header{ padding: 7px 14px; font-size: 15px; }
.ask-panel.ask-kb .ask-messages{ padding: 10px 12px; gap: 8px; }
.ask-panel.ask-kb .ask-form{ padding: 6px 8px; gap: 6px; }
.ask-panel.ask-kb .ask-input{ padding-top: 7px; padding-bottom: 7px; }
.ask-panel.ask-kb .ask-send,
.ask-panel.ask-kb .ask-attach-btn,
.ask-panel.ask-kb .ask-mic-btn{ width: 36px; height: 36px; }
.ask-panel.ask-kb .ask-consent:has(input:checked){ display: none; }

/* ---------- Floating contact button (call / message) ---------- */
.floating-contact{
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 260;
}
.floating-contact-toggle{
  width: 54px; height: 54px;
  border-radius: 50%;
  background: var(--color-primary-dark);
  color: #fff;
  border: none;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(22,63,57,0.4);
  transition: transform .2s ease;
}
.floating-contact-toggle svg{ width: 24px; height: 24px; }
.floating-contact-toggle:hover{ transform: scale(1.08); }
.floating-contact-menu{
  position: absolute;
  bottom: 64px;
  right: 0;
  display: none;
  flex-direction: column;
  gap: 8px;
  min-width: 176px;
}
.floating-contact.is-open .floating-contact-menu{ display: flex; }
.floating-contact-menu a{
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 999px;
  padding: 11px 18px;
  font-size: 14px;
  font-weight: 700;
  color: var(--color-primary-dark);
  box-shadow: var(--shadow-card);
  white-space: nowrap;
  text-align: center;
}
.floating-contact-menu a:hover{ background: var(--color-primary-light); }

/* ---------- Accordion ---------- */
.accordion{ border-top: 1px solid var(--color-border); }
.accordion-item{ border-bottom: 1px solid var(--color-border); }
.accordion-trigger{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 4px;
  background: none;
  border: none;
  text-align: left;
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 700;
  color: var(--color-primary-dark);
  cursor: pointer;
}
.accordion-trigger .plus{
  flex-shrink: 0;
  width: 30px; height: 30px;
  border-radius: 50%;
  background: var(--color-primary-light);
  color: var(--color-primary);
  display: flex; align-items: center; justify-content: center;
  font-size: 18px;
  transition: transform .2s ease;
}
.accordion-item.is-open .accordion-trigger .plus{ transform: rotate(45deg); }
.accordion-panel{
  max-height: 0;
  overflow: hidden;
  transition: max-height .25s ease;
}
.accordion-panel-inner{ padding: 0 4px 22px; color: var(--color-text-muted); font-size: 15px; }
.accordion-panel-inner p{ margin: 0 0 12px; }
.accordion-panel-inner p:last-child{ margin-bottom: 0; }

/* ---------- Онлайн-запись (виджет расписания) ---------- */
.zapis-doctors{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-top:16px; }
@media (max-width:700px){ .zapis-doctors{ grid-template-columns:1fr; } }
.zapis-doctor-btn{
  text-align:left; border:1px solid var(--color-border); border-radius:var(--radius-s);
  padding:14px 16px; background:#fff; cursor:pointer; font-family:inherit;
}
.zapis-doctor-btn:hover{ border-color:var(--color-primary); }
.zapis-doctor-btn.is-selected{ border-color:var(--color-primary); background:var(--color-primary-light); }
.zapis-doctor-btn strong{ display:block; font-size:15.5px; }
.zapis-doctor-btn span{ display:block; color:var(--color-text-muted); font-size:13.5px; margin-top:2px; }
.zapis-columns{ display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:16px; }
@media (max-width:700px){ .zapis-columns{ grid-template-columns:1fr; gap:28px; } }
.zapis-column{ border:1px solid var(--color-border); border-radius:var(--radius-s); padding:16px; }
.zapis-column h4{ margin:0 0 4px; font-size:16px; color:var(--color-primary-dark); }
.zapis-column .zapis-day:first-of-type{ margin-top:14px; }
.zapis-day{ margin-top:18px; }
.ask-slots-doctor-heading{ font-weight:700; font-size:14.5px; margin-top:14px; margin-bottom:-8px; color:var(--color-primary-dark); }
.zapis-day h4{ margin:0 0 8px; font-size:14.5px; color:var(--color-text-muted); font-weight:600; }
.zapis-slots{ display:flex; flex-wrap:wrap; gap:8px; }
.zapis-slot-btn{
  border:1px solid var(--color-border); border-radius:8px; padding:8px 14px;
  background:#fff; cursor:pointer; font-family:inherit; font-size:14px;
}
.zapis-slot-btn:hover{ border-color:var(--color-primary); }
.zapis-slot-btn.is-selected{ background:var(--color-primary); border-color:var(--color-primary); color:#fff; }
.zapis-form{ margin-top:20px; display:grid; gap:12px; max-width:420px; }
.zapis-form label{ font-size:13.5px; color:var(--color-text-muted); display:block; margin-bottom:4px; }
.zapis-form input[type="text"], .zapis-form input[type="tel"], .zapis-form input[type="date"], .zapis-form textarea{
  width:100%; padding:10px 12px; border:1px solid var(--color-border); border-radius:8px; font-family:inherit; font-size:14.5px;
}
.zapis-consent{ display:flex; gap:8px; align-items:flex-start; font-size:13px; color:var(--color-text-muted); }
.zapis-consent input{ margin-top:3px; }
.zapis-status{ margin-top:14px; padding:12px 14px; border-radius:8px; font-size:14.5px; }
.zapis-status.is-error{ background:#fdecec; color:#a12626; }
.zapis-status.is-success{ background:#e8f7ef; color:#15794a; }
.zapis-status.is-loading{ background:var(--color-primary-light); color:var(--color-primary); }

/* ---------- Scroll reveal + micro-interactions ---------- */
.reveal{
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .5s ease, transform .5s ease;
}
.reveal.is-visible{ opacity: 1; transform: none; }

.btn:active{ transform: scale(0.96); }

/* ---------- Cookie banner ---------- */
.cookie-banner{
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 300;
  max-width: 680px;
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  margin: 0 auto;
  background: var(--color-primary-dark);
  color: rgba(255,255,255,0.92);
  border-radius: var(--radius-m);
  padding: 18px 20px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.25);
}
.cookie-banner p{ margin: 0 0 10px; font-size: 13.5px; line-height: 1.5; }
.cookie-banner a{ text-decoration: underline; color: #fff; }
.cookie-banner .cookie-pd{ color: rgba(255,255,255,0.8); }
.cookie-actions{ display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.cookie-actions .btn{ flex: 1 1 150px; justify-content: center; text-align: center; }
.cookie-actions .btn-ghost{ background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,0.7); }
.cookie-actions .btn-ghost:hover{ background: rgba(255,255,255,0.12); }
.cookie-settings{ margin: 12px 0 0; display: grid; gap: 10px; }
.cookie-settings[hidden]{ display: none; }
.cookie-opt{ display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.45; background: rgba(255,255,255,0.08); border-radius: 10px; padding: 10px 12px; }
.cookie-opt input{ margin-top: 3px; flex-shrink: 0; accent-color: var(--color-accent); }
.cookie-opt small{ display: block; color: rgba(255,255,255,0.72); font-size: 12px; margin-top: 2px; }
@media (max-width: 700px){
  .cookie-banner{ bottom: 76px; max-height: calc(100vh - 92px); }
}

/* ---------- Юридические документы ---------- */
.legal-doc h2{ font-size: 21px; margin: 34px 0 12px; }
.legal-doc p, .legal-doc li{ line-height: 1.7; }
.legal-doc ul{ padding-left: 22px; }
.legal-meta{ color: var(--color-text-muted); font-size: 14px; }
.legal-table-wrap{ overflow-x: auto; margin: 16px 0; }
.legal-table{ border-collapse: collapse; width: 100%; font-size: 14px; }
.legal-table th, .legal-table td{ border: 1px solid var(--color-border); padding: 10px 12px; text-align: left; vertical-align: top; }
.legal-table th{ background: var(--color-bg-alt); }
.legal-doc code{ font-size: 13px; background: var(--color-bg-alt); padding: 1px 5px; border-radius: 4px; }
.consent-check{ display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; line-height: 1.5; color: var(--color-text-muted); }
.consent-check input{ margin-top: 3px; flex-shrink: 0; }
.consent-check a{ text-decoration: underline; }
.footer-legal-links{ margin-top: 28px; font-size: 13px; color: rgba(255,255,255,0.6); }
.footer-legal-links a{ color: rgba(255,255,255,0.75); text-decoration: underline; margin-right: 14px; white-space: nowrap; display: inline-block; }
.footer-legal-links a.footer-long-link{ white-space: normal; overflow-wrap: anywhere; }

/* ---------- Utilities ---------- */
.text-center{ text-align: center; }
.mt-0{ margin-top: 0; }
.two-col{ display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 40px; align-items: start; }
@media (max-width: 900px){ .two-col{ grid-template-columns: 1fr; } }
.two-col > *{ min-width: 0; }

/* ---------- Doctor documents (капча + просмотр) ---------- */
.docviewer-list{ margin-top: 28px; }
.docviewer-list h3{ margin-bottom: 10px; }
.docviewer-consent-note{ margin-top: 10px; font-size: 12.5px; color: var(--color-text-muted); }
.docviewer-doc-btn{
  display: inline-block; margin: 0 10px 10px 0;
  border: 1px solid var(--color-border); border-radius: var(--radius-s);
  background: #fff; padding: 10px 16px; font-family: inherit; font-size: 14.5px;
  cursor: pointer; color: var(--color-primary-dark); text-align: left;
}
.docviewer-doc-btn:hover{ border-color: var(--color-primary); }
.docviewer-overlay{
  position: fixed; inset: 0; background: rgba(20,30,30,0.55);
  display: flex; align-items: center; justify-content: center;
  padding: 20px; z-index: 1000;
}
.docviewer-box{
  background: #fff; border-radius: var(--radius-m); padding: 28px;
  max-width: 480px; width: 100%; max-height: 86vh; overflow-y: auto;
  position: relative; box-shadow: var(--shadow-card-hover);
}
.docviewer-close{
  position: absolute; top: 14px; right: 16px; border: none; background: none;
  font-size: 24px; line-height: 1; cursor: pointer; color: var(--color-text-muted);
}
.docviewer-body p{ margin: 0 0 14px; }
.docviewer-input{
  width: 100%; padding: 10px 12px; border: 1px solid var(--color-border);
  border-radius: 8px; font-family: inherit; font-size: 14.5px; margin-bottom: 12px;
}
.docviewer-error{ color: #a12626; font-size: 13.5px; min-height: 18px; }
.docviewer-image{ width: 100%; height: auto; border-radius: var(--radius-s); display: block; }

/* ---------- Doctor page: reviews ---------- */
.doctor-review{
  border: 1px solid var(--color-border); border-radius: var(--radius-s);
  padding: 14px 16px; margin-bottom: 12px; background: #fff;
}
.doctor-review-head{ display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.doctor-review-stars{ color: var(--color-accent-dark); letter-spacing: 1px; }
.doctor-review p{ margin: 0; color: var(--color-text); font-size: 14.5px; }
.doctor-review-date{ margin-top: 6px; font-size: 12.5px; color: var(--color-text-muted); }
.blur-author{ filter: blur(4px); user-select: none; }

/* ---------- Заметное предупреждение о противопоказаниях (ст. 24 закона «О рекламе») ---------- */
.med-warning{ background: #fff3e0; border-bottom: 1px solid #f0d6a8; color: #6b3f0a; text-align: center; padding: 9px 0; font-size: 14.5px; line-height: 1.4; }
.med-warning strong{ font-weight: 700; }
.compare-table td{ white-space: normal; vertical-align: top; font-size: 14px; }
.compare-table td:last-child{ white-space: nowrap; }
.photo-pair{ display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 20px; }
.photo-pair figure{ margin: 0; }
.photo-pair img{ width: 100%; height: auto; display: block; border-radius: var(--radius-m); border: 1px solid var(--color-border); }
.photo-pair figcaption{ font-size: 13px; color: var(--color-text-muted); margin-top: 6px; }
@media (max-width: 560px){ .photo-pair{ grid-template-columns: 1fr; } }
@media (max-width: 560px){ .compare-table td{ font-size: 13px; padding: 10px 3px; } .compare-table td:last-child{ white-space: normal; } }
.page-hero h1{ hyphens: auto; -webkit-hyphens: auto; overflow-wrap: break-word; }

/* Заглушка внешнего сервиса (карта, видео, отзывы) до согласия на cookie -- js/main.js initEmbeds */
.consent-embed-ph{ border: 1px dashed var(--color-border); border-radius: var(--radius-m); padding: 20px; background: var(--color-bg-alt); font-size: 14px; color: var(--color-text-muted); min-height: 140px; display: flex; flex-direction: column; justify-content: center; gap: 12px; }
.consent-embed-ph p{ margin: 0; }
.consent-embed-ph .btn{ align-self: flex-start; }
.video-embed .consent-embed-ph{ position: absolute; inset: 0; min-height: 0; padding: 12px 14px; font-size: 13px; gap: 8px; overflow: auto; }
.video-embed .consent-embed-ph--poster{ padding: 0; border: 0; background: #000 center / cover no-repeat; align-items: center; justify-content: center; cursor: pointer; overflow: hidden; }
.consent-embed-play{ width: 68px; height: 68px; border-radius: 50%; border: 0; background: rgba(0,0,0,.6); position: relative; cursor: pointer; transition: background .2s; }
.consent-embed-play::before{ content: ""; position: absolute; top: 50%; left: 50%; margin: -12px 0 0 -7px; border-top: 12px solid transparent; border-bottom: 12px solid transparent; border-left: 20px solid #fff; }
.consent-embed-ph--poster:hover .consent-embed-play{ background: var(--color-primary); }
.consent-embed-ph--poster p{ position: absolute; left: 0; right: 0; bottom: 0; padding: 18px 12px 8px; font-size: 11.5px; line-height: 1.35; color: rgba(255,255,255,.85); background: linear-gradient(transparent, rgba(0,0,0,.65)); }
.consent-embed-ph--poster p a{ color: #fff; }

/* «Подключить администратора?» -- кнопки под ответом ИИ-консультанта (main.js renderAdminOffer) */
.ask-offer{ display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 10px; }

/* Превью отзывов вместо заглушки ReviewLab (gen_reviews_preview.py) */
.reviews-grid{ display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 32px) / 3); gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 2px 12px; scrollbar-width: thin; }
.reviews-grid > .review-card{ scroll-snap-align: start; }
.review-card{ margin: 0; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-m); padding: 20px 22px; box-shadow: var(--shadow-card); display: flex; flex-direction: column; gap: 10px; }
.review-stars{ color: #f5b301; letter-spacing: 2px; font-size: 17px; line-height: 1; }
.review-card blockquote{ margin: 0; font-size: 15px; line-height: 1.55; color: var(--color-text); flex: 1; }
.review-card figcaption{ font-size: 13px; color: var(--color-text-muted); }
.review-card figcaption a{ color: var(--color-primary-dark); }
.reviews-preview-foot{ margin-top: 20px; display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.reviews-preview-foot p{ margin: 0; font-size: 12px; color: var(--color-text-muted); }
@media (max-width: 900px){ .reviews-grid{ grid-auto-columns: calc((100% - 16px) / 2); } }
@media (max-width: 600px){ .reviews-grid{ grid-auto-columns: 85%; } }
.reviews-note{ margin: 12px 0 0; font-size: 12px; color: var(--color-text-muted); text-align: center; }

/* 2026-09-30: кнопка «Построить маршрут» */
.footer-grid .footer-map-btn--route{ background: #fff; color: #1a1a1a; border-color: #fff; }
.footer-grid .footer-map-btn--route:hover{ background: rgba(255,255,255,0.85); border-color: #fff; color: #1a1a1a; }
.route-btn-row{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-top:14px; }

/* ---- Версия для слабовидящих (html.a11y, переключатель в меню и подвале) ---- */
.a11y-exit{display:none;}
html.a11y .a11y-exit{display:block;position:fixed;top:8px;right:8px;z-index:10000;padding:10px 16px;font-size:18px;font-weight:700;background:#000;color:#fff;border:3px solid #fff;border-radius:8px;cursor:pointer;}
html.a11y body, html.a11y body *{background-color:#fff !important;background-image:none !important;color:#000 !important;border-color:#000 !important;box-shadow:none !important;text-shadow:none !important;}
html.a11y body{font-size:20px !important;line-height:1.7 !important;}
html.a11y p, html.a11y li, html.a11y a, html.a11y span, html.a11y label, html.a11y td, html.a11y th,
html.a11y input, html.a11y textarea, html.a11y select, html.a11y button, html.a11y summary{font-size:20px !important;line-height:1.6 !important;letter-spacing:.02em;}
html.a11y h1{font-size:36px !important;} html.a11y h2{font-size:30px !important;} html.a11y h3{font-size:24px !important;}
html.a11y a{text-decoration:underline !important;color:#00008b !important;}
html.a11y .btn, html.a11y button{border:2px solid #000 !important;}
html.a11y img, html.a11y video, html.a11y iframe{filter:grayscale(1) contrast(1.1);}
html.a11y :focus-visible{outline:4px solid #000 !important;outline-offset:2px;}
html.a11y .a11y-exit{background:#000 !important;color:#fff !important;}

/* Виджет записи 09.10: группы по профилю, ближайшая запись, «можно раньше» */
.zapis-group{ grid-column:1/-1; margin:14px 0 0; font-size:15px; font-weight:600; color:var(--color-text-muted); }
.zapis-group:first-child{ margin-top:0; }
.zapis-near{ display:block; font-style:normal; font-size:13px; margin-top:6px; color:var(--color-text-muted); }
.zapis-near.is-soon{ color:#15794a; font-weight:600; }
.zapis-advice{ margin:14px 0 6px; padding:14px 16px; border-radius:var(--radius-s); background:var(--color-primary-light); font-size:14.5px; }
.zapis-advice p{ margin:0 0 10px; }
.zapis-link-btn{ border:0; background:none; padding:0; color:var(--color-primary); text-decoration:underline; cursor:pointer; font:inherit; }
.zapis-wait-form{ display:grid; gap:10px; max-width:420px; position:relative; }
.zapis-wait-form input[type="text"], .zapis-wait-form input[type="tel"]{
  width:100%; box-sizing:border-box; padding:10px 12px; border:1px solid var(--color-border); border-radius:var(--radius-s); font:inherit; background:#fff;
}

/* 2026-10-23: согласие на ПДн -- карточкой в ленте чата при первой отправке (main.js hasConsent) */
.ask-consent-card{ align-self: stretch; background: var(--color-surface, #fff); border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 12px; font-size: 13px; line-height: 1.4; }
.ask-consent-card-text{ margin: 0 0 8px; }
.ask-consent-card-text a{ color: var(--color-primary-dark); text-decoration: underline; }
.ask-consent-card-btn{ width: 100%; padding: 10px 14px; font-size: 14px; }
.ask-consent-card-done{ color: var(--color-text-muted); font-size: 12px; }

/* 24.10.2026: ссылка на MAX-канал клиники в подвале */
.site-footer .footer-channel{ display: inline-block; margin-top: 12px; padding: 9px 14px; border-radius: 12px; background: var(--color-accent); color: #fff; font-size: 13px; font-weight: 600; line-height: 1.3; text-decoration: none; max-width: 260px; }
.site-footer .footer-channel:hover{ opacity: .9; color: #fff; }