/* Neutralize site chrome fonts/buttons on CTB landing so etalon styles win */
body {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  line-height: 1.5em !important;
  letter-spacing: 0.3px !important;
  color: var(--gray) !important;
  padding-top: 0 !important;
}

/* Kill site/bootstrap .container side paddings that shrink the text column */
body .container {
  max-width: 1200px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

section {
  padding-left: 50px !important;
  padding-right: 50px !important;
}

/* Etalon zeroes section padding here; horizontal inset lives on .photo-flex */
section.photo {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.photo-flex {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 20px !important;
  margin-bottom: 32px !important;
  padding: 0 50px !important;
}

.photo .photo__title,
.photo .video__title,
.photo__title {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 30px !important;
  font-weight: 400 !important;
  line-height: 50px !important;
  letter-spacing: 0.3px !important;
  color: var(--gray) !important;
  max-width: 40% !important;
  width: auto !important;
  margin: 0 50px 0 0 !important;
  padding-left: 0 !important;
  text-align: left !important;
}

.swiper-photo {
  width: 70% !important;
  height: 500px !important;
  border-radius: 20px !important;
}

body button,
body input,
body textarea,
body select,
.header,
.header *,
main,
main *:not(script):not(style) {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
}

/* CTAs must match etalon, not site .base-btn */
.hero .base-btn,
.hero__btn,
.specialists__call .base-btn,
.header .header__btn {
  display: inline-block;
  position: relative;
  height: auto !important;
  min-height: 0 !important;
  padding: 15px 20px !important;
  background: var(--orange) !important;
  border: 1px solid var(--orange) !important;
  border-radius: 6px !important;
  text-align: center;
  font-size: 16px !important;
  font-weight: 500 !important;
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  line-height: 1.2 !important;
  color: var(--white) !important;
  box-shadow: none !important;
  text-transform: none !important;
  letter-spacing: 0.3px !important;
  text-decoration: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Keep header «Записаться» always visible (etalon hides until scroll) */
.header__btn,
.header__btn.header__btn--active {
  opacity: 1 !important;
  visibility: visible !important;
}

.hero .base-btn:hover,
.hero__btn:hover,
.specialists__call .base-btn:hover,
.header .header__btn:hover {
  background: var(--hover-orange) !important;
  border-color: var(--hover-orange) !important;
  color: var(--white) !important;
}

/* Orange CTA: etalon is centered stack, not side-by-side flex */
.symptoms-swiper__if,
.symptoms__if {
  display: block !important;
  width: 100% !important;
  padding: 50px !important;
  border-radius: 20px !important;
  text-align: center !important;
  margin-bottom: 60px !important;
  background-color: var(--bg-orange) !important;
  gap: 0 !important;
}

.symptoms-swiper__if-text,
.symptoms__if-text {
  display: block !important;
  max-width: none !important;
  width: 100% !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  text-align: center !important;
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 1.5em !important;
  letter-spacing: 0.3px !important;
  color: var(--gray) !important;
}

.symptoms-swiper__if-btn,
.symptoms__if .base-btn {
  display: inline-block !important;
  position: relative !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 0 40px !important;
  background: var(--orange) !important;
  border: 1px solid var(--orange) !important;
  border-radius: 6px !important;
  text-align: center !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  line-height: 45px !important;
  color: var(--white) !important;
  box-shadow: none !important;
  text-transform: none !important;
  letter-spacing: 0.3px !important;
  white-space: nowrap !important;
}

.symptoms-swiper__if-btn:hover,
.symptoms__if .base-btn:hover {
  background: var(--hover-orange) !important;
  border-color: var(--hover-orange) !important;
  color: var(--white) !important;
}

.title {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 28px !important;
  margin-bottom: 15px !important;
  line-height: 32px !important;
  font-weight: 500 !important;
  letter-spacing: 0.3px !important;
  color: var(--gray) !important;
}

.info__text-title {
  text-align: center !important;
  max-width: 700px !important;
  margin: 0 auto 15px !important;
  font-size: 28px !important;
  line-height: 32px !important;
  font-weight: 500 !important;
}

.info__block {
  max-width: 40% !important;
}

.info__title.title,
.info__title {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 28px !important;
  line-height: 32px !important;
  font-weight: 500 !important;
  margin-bottom: 15px !important;
  letter-spacing: 0.3px !important;
  color: var(--gray) !important;
}

.info__comment {
  max-width: 400px !important;
  color: #666 !important;
  line-height: 15px !important;
  font-size: 12px !important;
  margin-bottom: 15px !important;
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: 0.3px !important;
}

.info__block > .info__text {
  max-width: 400px !important;
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 1.5em !important;
  letter-spacing: 0.3px !important;
  color: var(--gray) !important;
  margin: 0 !important;
}

.info__item-title {
  font-size: 23px !important;
  font-weight: 700 !important;
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  line-height: 1.5em !important;
  color: var(--gray) !important;
  margin: 0 0 10px !important;
}

.info__item-title strong {
  font-weight: 700 !important;
  font-family: "Core Sans N 45 Regular", sans-serif !important;
}

.info__descr {
  font-size: 20px !important;
  line-height: 1.5em !important;
  font-weight: 400 !important;
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  color: var(--gray) !important;
  margin: 0 !important;
  max-width: 100% !important;
}

/* UPOINTS: left swiper column + right text; exactly 2 cards with Swiper gap */
.info__container {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 40px !important;
}

.info__pagination-container {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  flex: 0 1 55% !important;
  width: 55% !important;
  max-width: 55% !important;
  min-width: 0 !important;
  height: auto !important;
  overflow: visible !important; /* arrows sit outside the swiper viewport */
}

.info__swiper-wrapper {
  width: 100% !important;
  padding: 70px 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

.swiper-info {
  width: 100% !important;
  height: 350px !important;
  max-height: 350px !important;
  overflow: hidden !important;
  padding: 0 !important; /* etalon padding:5px 0 lets a 3rd card peek when gap is reserved */
  box-sizing: border-box !important;
}

.info__list,
.info__list.swiper-wrapper {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 350px !important;
  max-height: 350px !important;
  box-sizing: border-box !important;
}

/* Do NOT zero vertical margin — Swiper spaceBetween uses margin-bottom */
.info__list .swiper-slide,
.info__item.swiper-slide {
  width: 98% !important;
  max-width: 98% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  outline: 1px solid var(--border) !important;
  border-radius: 20px !important;
  box-shadow: 5px 2px 5px 0 var(--border) !important;
  background-color: #ecf5fe !important;
  padding: 20px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

.info .swiper-button-prev,
.info .swiper-button-next {
  left: 50% !important;
  margin-left: -20px !important;
  z-index: 2 !important;
}

.info__block {
  flex: 0 1 40% !important;
  max-width: 40% !important;
  width: 40% !important;
}

/* Symptoms slide: match etalon font metrics and list column */
.symptoms-swiper__list,
.symptoms-swiper__list li,
.symptoms-swiper__item,
.symptoms-swiper__symptom-title {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  letter-spacing: 0.3px !important;
  color: #232427 !important;
}

.symptoms-swiper__list {
  padding: 50px 30px 50px 45% !important;
  box-sizing: border-box !important;
}

.symptoms-swiper__list li,
.symptoms-swiper__item {
  font-size: 20px !important;
  line-height: 1.8em !important;
  margin-bottom: 10px !important;
  font-weight: 400 !important;
}

.symptoms-swiper__symptom-title {
  font-size: 22px !important;
  font-weight: 500 !important;
  margin-bottom: 15px !important;
  line-height: 1.5em !important;
}

.symptoms-swiper .swiper-symptoms {
  width: 90% !important;
}

/* Aliases for leftover project class names */
.diagnoses__lists,
.symptoms-swiper__diagnoses-lists {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  gap: 0 !important;
}

.diagnoses__list,
.symptoms-swiper__diagnoses-list {
  width: 49% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

.diagnoses__list.list-two {
  margin-right: 0 !important;
  margin-bottom: 10px !important;
}

.symptoms-swiper__diagnoses-title,
.symptom__diagnoses-title {
  text-align: center !important;
  margin-bottom: 15px !important;
  font-size: 23px !important;
  font-weight: 500 !important;
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  line-height: 1.5em !important;
  letter-spacing: 0.3px !important;
  color: var(--gray) !important;
}

.symptoms-swiper__diagnoses-item,
.diagnoses__item {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 1.8em !important;
  letter-spacing: 0.3px !important;
  color: var(--gray) !important;
  margin-bottom: 10px !important;
}

.specialists__descr {
  padding: 60px;
}

/* Methods diagnostics list */
.methods {
  padding-top: 120px !important;
  background-repeat: no-repeat !important;
  background-position: right !important;
  background-size: contain !important;
}

.methods .title {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 28px !important;
  font-weight: 500 !important;
  line-height: 32px !important;
  letter-spacing: 0.3px !important;
  color: var(--gray) !important;
  margin-bottom: 15px !important;
}

.methods__container {
  display: flex !important;
  justify-content: flex-start !important;
}

.methods__list {
  width: 49% !important;
  margin-right: 20px !important;
  margin-bottom: 60px !important;
  padding: 0 !important;
}

.methods__item {
  line-height: 1.8em !important;
  margin-bottom: 10px !important;
  font-size: 20px !important;
}

.methods__link,
.methods a.methods__link,
a.methods__link {
  display: inline !important;
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 1.8em !important;
  letter-spacing: 0.3px !important;
  color: var(--gray) !important;
  text-decoration: none !important;
  padding-bottom: 3px !important;
  border: none !important;
  background: none !important;
  box-shadow: none !important;
  text-transform: none !important;
}

.methods__link::before,
a.methods__link::before {
  content: "—" !important;
  margin-right: 5px !important;
  font-weight: 400 !important;
}

.methods__link:hover,
a.methods__link:hover {
  color: var(--orange) !important;
}

/* Specialists: kill site chrome .specialists { background:#EDF2F5; overflow:hidden }.
   Keep background transparent (like etalon) — opaque white hides card ::before blob
   (z-index: -2 paints behind the section background). */
.specialists {
  background: transparent !important;
  background-color: transparent !important;
  height: auto !important;
  overflow: visible !important;
  margin-bottom: 60px !important;
}

.specialists .title {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 28px !important;
  font-weight: 500 !important;
  line-height: 32px !important;
  letter-spacing: 0.3px !important;
  color: var(--gray) !important;
  margin-bottom: 15px !important;
}

.specialists__card {
  position: relative !important;
  isolation: isolate !important;
  z-index: 0 !important;
  background-color: transparent !important;
  background-repeat: no-repeat !important;
  background-position: right -40px bottom !important;
  background-size: 300px 300px !important;
  pointer-events: auto !important;
}

/* Soft blue blob (etalon .specialists__card::before) */
.specialists__card::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 420px !important;
  height: 460px !important;
  background: rgba(11, 137, 240, 0.18) !important;
  opacity: 0.3 !important;
  border-radius: 50% 50% 79% 21% / 77% 36% 64% 23% !important;
  transform: rotate(20deg) translate(-40%, -20%) !important;
  z-index: -1 !important;
  pointer-events: none !important;
}

/* Etalon card hover: name → orange (see name rules below) */
.specialists__info,
.specialist__info,
.specialists__descr {
  position: relative !important;
  z-index: 1 !important;
  pointer-events: auto !important;
}

/*
  FIO: etalon leaves <h3> UA metrics (≈1.17em / 700) with Core Sans Regular
  (synthetic bold). Do not flatten to body 400/20px — cards look too light.
*/
.specialists__name,
.specialist__name {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 1.17em !important;
  font-weight: 700 !important;
  line-height: 30px !important;
  letter-spacing: 0.8px !important;
  color: var(--gray) !important;
  margin-bottom: 15px !important;
  max-width: 140px !important;
  transition: color 0.3s ease !important;
}

.specialists__info:hover .specialists__name,
.specialists__info:hover .specialist__name,
.specialist__info:hover .specialists__name,
.specialist__info:hover .specialist__name,
.specialists__card:hover .specialists__name,
.specialists__card:hover .specialist__name {
  color: var(--orange) !important;
}

.specialists__profession,
.specialist__profession,
.specialists__consultation,
.specialist__consultation {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  color: #909eaa !important;
  max-width: 230px !important;
  margin: 0 !important;
}

.specialists__price,
.specialist__price {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 1.5em !important;
  color: var(--gray) !important;
  margin: 0 0 20px !important;
}

.specialists__btn,
.specialist__btn {
  display: inline-block !important;
  position: relative !important;
  height: auto !important;
  width: auto !important;
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  color: var(--orange) !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transition: color 0.3s ease !important;
}

.specialists__btn::after,
.specialist__btn::after {
  display: block !important;
  content: "" !important;
  height: 1px !important;
  width: 0% !important;
  background-color: var(--hover-orange) !important;
  transition: width 0.4s ease !important;
}

.specialists__btn:hover,
.specialist__btn:hover {
  color: var(--hover-orange) !important;
}

.specialists__btn:hover::after,
.specialist__btn:hover::after {
  width: 100% !important;
}

.specialists__info,
.specialist__info,
.specialists__descr {
  padding: 60px !important;
}

.specialists__call {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 20px !important;
  padding: 50px !important;
  border-radius: 20px !important;
  background-color: var(--bg-blue) !important;
}

.specialists__call-text {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 1.5em !important;
  letter-spacing: 0.3px !important;
  color: var(--gray) !important;
  max-width: 50% !important;
  margin: 0 !important;
}

.specialists__call .hero__btn,
.specialists__call-btn {
  flex-shrink: 0 !important;
  white-space: nowrap !important;
  padding: 15px 40px !important;
  font-size: 16px !important;
  line-height: 1.2 !important;
}

/* Modal banner: etalon .modal-specialist__banner (our template uses specialist-banner) */
.modal-specialist .specialist-banner {
  padding: 100px 40px 70px 100px !important;
  min-height: 340px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  background-color: #edf2f5 !important;
  background-position: right -40px bottom !important;
  background-repeat: no-repeat !important;
  background-size: 270px 270px !important;
}

.modal-specialist .specialist-banner__name {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 30px !important;
  font-weight: 700 !important;
  margin: 0 0 40px !important;
  color: var(--gray) !important;
  max-width: 58% !important;
}

.modal-specialist .specialist-banner__profession {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  color: #909eaa !important;
  max-width: 58% !important;
  line-height: 24px !important;
  margin: 0 !important;
}

.modal-specialist .modal__btn-close {
  top: 16px !important;
  right: 16px !important;
  margin-bottom: 0 !important;
  z-index: 2 !important;
}

/* Keep site footer intact (landing img{width:100%} / body fonts must not leak) */
.main-footer {
  background-color: #50606E !important;
  padding: 60px 0 !important;
  color: #C5CDD4 !important;
  font-family: var(--regular-font), sans-serif !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
}

.main-footer * {
  font-family: inherit !important;
  letter-spacing: 0 !important;
}

.main-footer__container {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 50px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 40px !important;
  width: auto !important;
}

.main-footer__content {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  max-width: none !important;
  order: 2 !important;
}

.main-footer__text,
.main-footer__copyright {
  margin: 0 !important;
  color: #C5CDD4 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
}

.main-footer__link,
.main-footer__captcha-accent {
  color: #FFF !important;
  font-family: var(--bold-font), sans-serif !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

.main-footer__captcha {
  color: #C5CDD4 !important;
  text-decoration: none !important;
  font-size: 12px !important;
}

.main-footer__authors {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 24px 80px !important;
  width: 100% !important;
  order: 1 !important;
}

.main-footer__authors-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 8px !important;
  color: #FFF !important;
  text-decoration: none !important;
  font-size: 12px !important;
}

.main-footer__authors-logo,
.main-footer img {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
}

.main-footer__authors-text {
  color: #FFF !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
}

/* Contacts: text left + map visible (etalon .contacts__map) */
.contacts {
  padding-bottom: 50px !important;
  font-size: 20px !important;
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-weight: 400 !important;
  color: var(--gray) !important;
  letter-spacing: 0.3px !important;
}

.contacts-container {
  display: flex !important;
  flex-flow: row nowrap !important;
  justify-content: space-between !important;
  align-items: stretch !important;
  gap: 40px !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

.contacts-info {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  width: 45% !important;
  max-width: 45% !important;
  margin: 0 !important;
  margin-right: auto !important;
  flex: 0 0 45% !important;
  text-align: left !important;
}

.contacts-container .contacts__map {
  width: 50% !important;
  max-width: 55% !important;
  flex: 1 1 50% !important;
  min-height: 620px !important;
  overflow: hidden !important;
  border-radius: 20px !important;
  background: #f3f3f3 !important;
}

.contacts-container .map {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 620px !important;
  min-height: 620px !important;
  border-radius: 20px !important;
}

/* Title: medium Regular (etalon .title weight 500) */
.contacts .title {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-size: 28px !important;
  font-weight: 500 !important;
  line-height: 32px !important;
  letter-spacing: 0.3px !important;
  color: var(--gray) !important;
  text-align: left !important;
  margin-bottom: 15px !important;
  width: 100% !important;
}

.contacts__info,
.contacts__address {
  margin-bottom: 20px !important;
  line-height: 25px !important;
}

/*
  Labels (h4): bold — site chrome sets h4{font-weight:normal} and
  landing forces Core Sans N 45 Regular on main*, which flattens etalon
  UA-bold h4 contrast. Restore via Bold face @ 600.
*/
.contacts__address h4,
.contacts__info h4 {
  font-family: "Core Sans N 65 Bold", sans-serif !important;
  font-weight: 600 !important;
  font-size: 20px !important;
  line-height: 25px !important;
  letter-spacing: 0.3px !important;
  color: var(--gray) !important;
  margin: 0 !important;
}

/* Values: address, phones, stop names — Regular 400 */
.contacts__address p,
.contacts__info p,
.contacts__tel,
.contacts a.contacts__tel {
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-weight: 400 !important;
  font-size: 20px !important;
  line-height: 25px !important;
  letter-spacing: 0.3px !important;
  color: var(--gray) !important;
  margin: 0 !important;
}

/* Hours + pipe separator: lighter grey (etalon .contacts__info span) */
.contacts__info > span,
.contacts__info h4 span {
  color: #CACACA !important;
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-weight: 400 !important;
  font-size: 18px !important;
  line-height: 25px !important;
  letter-spacing: 0.3px !important;
}

.contacts__mail {
  display: inline-block !important;
  font-family: "Core Sans N 45 Regular", sans-serif !important;
  font-weight: 500 !important;
  background-color: var(--orange) !important;
  color: var(--white) !important;
  width: fit-content !important;
  padding: 0 20px !important;
  line-height: 45px !important;
  font-size: 16px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
}

@media (max-width:991px) {
  .main-footer {
    padding: 40px 0 !important;
  }

  .main-footer__container {
    gap: 32px !important;
    padding: 0 20px !important;
  }

  .main-footer__authors {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
}

@media (max-width:940px) {
  .contacts-container {
    flex-direction: column-reverse !important;
    gap: 30px !important;
  }

  .contacts-info,
  .contacts-container .contacts__map {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 auto !important;
  }

  .contacts-container .contacts__map,
  .contacts-container .map {
    min-height: 400px !important;
    height: 400px !important;
  }
}

@media (max-width:1250px) {
  .symptoms-swiper__list {
    padding: 50px 30px 50px 42% !important;
  }
}

@media (max-width:1100px) {
  section {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  section.photo {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .specialists__info,
  .specialist__info,
  .specialists__descr {
    padding: 40px !important;
  }

  .specialists__profession,
  .specialist__profession,
  .specialists__consultation,
  .specialist__consultation {
    max-width: 150px !important;
  }

  .photo .photo__title,
  .photo .video__title,
  .photo__title {
    font-size: 25px !important;
  }

  .symptoms-swiper__list {
    padding: 50px 30px 50px 25% !important;
  }

  .methods {
    background-size: cover !important;
    background-position: 0 0 !important;
  }

  .methods__list {
    width: 60% !important;
  }
}

@media (max-width:940px) {
  body {
    font-size: 16px !important;
  }

  .symptoms-swiper__list {
    padding: 50px 30px 50px 15% !important;
  }

  .symptoms-swiper__list li,
  .symptoms-swiper__item {
    font-size: 16px !important;
  }

  .symptoms-swiper__symptom-title {
    font-size: 18px !important;
  }

  .symptoms-swiper__if-text,
  .symptoms__if-text {
    font-size: 16px !important;
  }

  .symptoms-swiper__diagnoses-item,
  .diagnoses__item {
    font-size: 16px !important;
  }

  .photo .photo__title,
  .photo .video__title,
  .photo__title {
    font-size: 20px !important;
  }

  .swiper-photo,
  .swiper-photo .swiper-slide {
    height: 300px !important;
  }

  .methods__list {
    width: 70% !important;
  }

  .methods__link,
  .methods a.methods__link,
  a.methods__link,
  .methods__item {
    font-size: 16px !important;
  }

  .specialists__call-text {
    font-size: 16px !important;
    max-width: 360px !important;
    line-height: 30px !important;
  }

  .specialists .title {
    font-size: 20px !important;
    line-height: 1.3em !important;
  }

  .specialists__card {
    background-position: right -35px bottom !important;
    background-size: 280px 280px !important;
    min-height: 420px !important;
  }

  .specialists__price,
  .specialist__price {
    font-size: 20px !important;
  }

  .modal-specialist .specialist-banner {
    padding: 70px 20px 50px 50px !important;
    min-height: 310px !important;
    background-position: right -35px bottom !important;
    background-size: 250px 250px !important;
  }

  .modal-specialist .specialist-banner__name,
  .modal-specialist .specialist-banner__profession {
    max-width: 58% !important;
  }

  .modal-specialist .specialist-banner__profession {
    font-size: 15px !important;
    line-height: 22px !important;
  }
}

@media (max-width:770px) {
  .diagnoses__lists,
  .symptoms-swiper__diagnoses-lists {
    flex-direction: column !important;
    flex-wrap: wrap !important;
  }

  .diagnoses__list,
  .symptoms-swiper__diagnoses-list {
    width: 100% !important;
  }

  .symptoms-swiper__diagnoses-title,
  .symptom__diagnoses-title {
    font-size: 20px !important;
  }

  .photo-flex {
    flex-direction: column !important;
    padding: 0 20px !important;
  }

  .photo .photo__title,
  .photo .video__title,
  .photo__title {
    line-height: 32px !important;
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 0 15px !important;
    text-align: center !important;
  }

  .swiper-photo {
    width: 100% !important;
  }

  .info__block,
  .info__comment,
  .info__block > .info__text {
    max-width: 100% !important;
    width: 100% !important;
  }

  .info__container {
    flex-direction: column-reverse !important;
    gap: 0 !important;
  }

  .info__pagination-container {
    flex: 1 1 auto !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .info__text-title {
    font-size: 18px !important;
    line-height: 1.4em !important;
  }

  .info__title.title,
  .info__title {
    font-size: 25px !important;
    line-height: 1.3em !important;
  }

  .info__list,
  .info__list.swiper-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    /* taller viewport so 2 cards + borders fit without clipping */
    height: 480px !important;
    max-height: 480px !important;
  }

  .info__swiper-wrapper {
    margin-right: 0 !important;
    padding: 56px 0 !important;
  }

  .swiper-info {
    height: 480px !important;
    max-height: 480px !important;
    /* inset so outline/shadow of first/last card are not cropped */
    padding: 6px 0 !important;
    box-sizing: border-box !important;
  }

  .info__list .swiper-slide,
  .info__item.swiper-slide {
    width: 96% !important;
    max-width: 96% !important;
    padding: 14px 16px !important;
    overflow: hidden !important;
  }

  .info .swiper-button-prev,
  .info .swiper-button-next {
    left: 50% !important;
  }

  /* scale type so copy fits inside the blue cards */
  .info__item-title {
    font-size: 17px !important;
    line-height: 1.35em !important;
    margin: 0 0 8px !important;
  }

  .info__descr {
    font-size: 15px !important;
    line-height: 1.4em !important;
  }

  .info__descr,
  .info__item-title {
    line-height: 1.4em !important;
  }

  .methods__list {
    width: 100% !important;
  }

  .specialists__call,
  .symptoms-swiper__if,
  .symptoms__if {
    padding: 20px !important;
  }

  .specialists__call-text {
    max-width: 270px !important;
    margin-right: 20px !important;
  }

  .specialists__card {
    flex-basis: 100% !important;
    height: 380px !important;
    min-height: auto !important;
    padding: 40px !important;
    background-size: 300px 300px !important;
    background-position: right -40px bottom !important;
  }

  .specialists__info,
  .specialist__info,
  .specialists__descr {
    padding: 0 !important;
  }

  .specialists__name,
  .specialist__name {
    max-width: 58% !important;
    font-size: 22px !important;
    line-height: 28px !important;
  }

  .specialists__profession,
  .specialist__profession {
    max-width: 58% !important;
    font-size: 14px !important;
    line-height: 20px !important;
  }

  .specialists__price,
  .specialist__price {
    margin-bottom: 10px !important;
    font-size: 20px !important;
  }

  .modal-specialist .specialist-banner {
    min-height: 300px !important;
    background-position: right -40px bottom !important;
    background-size: 260px 260px !important;
  }

  .modal-specialist .specialist-banner__name {
    font-size: 24px !important;
    line-height: 30px !important;
    max-width: 58% !important;
    margin-bottom: 16px !important;
  }

  .modal-specialist .specialist-banner__profession {
    max-width: 58% !important;
    font-size: 15px !important;
    line-height: 22px !important;
  }
}

@media (max-width:550px) {
  body {
    font-size: 14px !important;
  }

  .swiper-info,
  .info__list,
  .info__list.swiper-wrapper {
    height: 500px !important;
    max-height: 500px !important;
  }

  .info__list .swiper-slide,
  .info__item.swiper-slide {
    width: 98% !important;
    max-width: 98% !important;
    padding: 14px 16px !important;
  }

  .info__item-title {
    font-size: 16px !important;
    line-height: 1.35em !important;
    margin: 0 0 6px !important;
  }

  .info__descr {
    font-size: 14px !important;
    line-height: 1.4em !important;
  }

  .methods__link,
  .methods a.methods__link,
  a.methods__link,
  .methods__item {
    font-size: 14px !important;
  }

  .symptoms-swiper__list {
    padding: 40px 10px 10px 10% !important;
  }

  .symptoms-swiper__list li,
  .symptoms-swiper__item,
  .symptoms-swiper__symptom-title {
    font-size: 14px !important;
  }

  .symptoms-swiper__if-text,
  .symptoms__if-text {
    font-size: 14px !important;
    line-height: 30px !important;
  }

  .symptoms-swiper__if-btn {
    font-size: 14px !important;
  }

  .symptoms-swiper__diagnoses-item,
  .diagnoses__item {
    font-size: 14px !important;
  }

  .specialists__call {
    flex-direction: column !important;
  }

  .specialists__call-text {
    font-size: 14px !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    margin-bottom: 20px !important;
    text-align: center !important;
    line-height: 1.5em !important;
  }

  .specialists__call .hero__btn,
  .specialists__call-btn {
    font-size: 14px !important;
    padding: 14px 30px !important;
  }

  .specialists .title {
    font-size: 20px !important;
    margin-bottom: 20px !important;
  }

  .specialists__card {
    height: 400px !important;
    padding: 24px !important;
    background-size: 280px 280px !important;
    background-position: right -50px bottom !important;
  }

  .specialists__name,
  .specialist__name {
    font-size: 20px !important;
    line-height: 26px !important;
    max-width: 55% !important;
  }

  .specialists__profession,
  .specialist__profession {
    font-size: 14px !important;
    line-height: 20px !important;
    max-width: 55% !important;
  }

  .modal-specialist .specialist-banner {
    padding: 40px 12px 24px 24px !important;
    min-height: 280px !important;
    background-size: 240px 240px !important;
    background-position: right -50px bottom !important;
  }

  .modal-specialist .modal__btn-close {
    top: 12px !important;
    right: 12px !important;
  }

  .modal-specialist .specialist-banner__name {
    font-size: 24px !important;
    line-height: 30px !important;
    margin-bottom: 12px !important;
    max-width: 58% !important;
  }

  .modal-specialist .specialist-banner__profession {
    font-size: 15px !important;
    line-height: 22px !important;
    max-width: 58% !important;
  }
}

@media (max-width:403px) {
  .modal-specialist .specialist-banner {
    min-height: 260px !important;
    background-position: right -50px bottom !important;
    background-size: 220px 220px !important;
  }

  .modal-specialist .specialist-banner__name {
    font-size: 22px !important;
    line-height: 28px !important;
    max-width: 55% !important;
  }

  .modal-specialist .specialist-banner__profession {
    font-size: 14px !important;
    line-height: 20px !important;
    max-width: 55% !important;
  }

  .specialists__card {
    background-size: 260px 260px !important;
  }

  .specialists__name,
  .specialist__name {
    max-width: 52% !important;
  }

  .specialists__profession,
  .specialist__profession {
    max-width: 52% !important;
  }
}
