@font-face {
  font-family: "Rula Segoe UI This";
  src: url("../fonts/segoeuithis.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Rula Segoe UI This";
  src: url("../fonts/segoeuithibd.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Rula Segoe UI This";
  src: url("../fonts/segoeuithisi.ttf") format("truetype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Rula Segoe UI This";
  src: url("../fonts/segoeuithisz.ttf") format("truetype");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

html {
  width: 100%;
  min-width: 320px;
  margin: 0;
  padding: 0;
}

body {
  width: 100%;
  min-width: 320px;
  margin: 0;
  padding: 0;
  color: #16283d;
  background: #ffffff;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
}

button,
input,
select,
textarea {
  font: inherit;
}

img {
  max-width: 100%;
}

.rula-header h2, .rula-page h2, .rula-footer h2 {
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif !important;
}

.rula-header p, .rula-page p, .rula-footer p {
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif !important;
}

.rula-header blockquote, .rula-page blockquote, .rula-footer blockquote {
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif !important;
}

.rula-header span, .rula-page span, .rula-footer span {
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif !important;
}

.rula-header table td, .rula-page table td, .rula-footer table td {
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif !important;
}

.rula-header,
.rula-header * {
  box-sizing: border-box;
}

.rula-header {
  --rula-black: #010101;
  --rula-white: #ffffff;
  --rula-muted: #6f8096;
  --rula-link: #0d67ad;
  --rula-dark: #16283d;
  --rula-orange: #ff7a12;
  --rula-blue: #0f6eb8;
  position: sticky;
  top: 0;
  z-index: 900;
  width: 100%;
  min-width: 320px;
  color: var(--rula-dark);
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
}

.rula-header :where(a, button) {
  font-family: inherit;
}

.rula-header :where(a) {
  color: inherit;
  text-decoration: none;
}

.rula-header :where(ul, li, p) {
  margin: 0;
  padding: 0;
}

.rula-header :where(ul) {
  list-style: none;
}

.rula-header :where(button) {
  border: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  cursor: pointer;
}

.rula-header__top {
  height: 126px;
  background: var(--rula-white);
}

.rula-header__top-inner {
  display: grid;
  grid-template-columns: 240px 270px minmax(270px, 1fr) 188px;
  align-items: center;
  gap: 32px;
  width: min(1200px, calc(100% - 48px));
  height: 100%;
  margin: 0 auto;
  padding: 18px 0;
}

.rula-header__logo {
  display: flex;
  align-items: center;
  width: 240px;
  height: 97px;
}

.rula-header__logo-image {
  display: block;
  width: 240px;
  height: 50px;
  object-fit: contain;
}

.rula-header__contact {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.rula-header__contact--primary {
  width: 270px;
  min-height: 58px;
  justify-content: center;
}

.rula-header__primary-row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.rula-header__messengers {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.rula-header__messenger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 9px;
  background: #f5f7fb;
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.rula-header__messenger img {
  display: block;
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.rula-header__messenger--max img {
  width: 25px;
  height: 25px;
}

@media (hover: hover) {
  .rula-header__messenger:hover {
    box-shadow: 0 5px 14px rgb(10 58 103 / 16%);
    transform: translateY(-1px);
  }
}

.rula-header__contact-phone {
  display: block;
  color: var(--rula-dark);
  font-size: 22px;
  font-weight: 700;
  line-height: 29px;
  white-space: nowrap;
}

.rula-header__contact-mail {
  display: block;
  color: var(--rula-link);
  font-size: 15px;
  font-weight: 400;
  line-height: 20px;
  white-space: nowrap;
}

.rula-header__secondary-contacts {
  display: grid;
  gap: 3px;
  min-width: 270px;
  padding-left: 24px;
  border-left: 1px solid #dce5ee;
}

.rula-header__secondary-row {
  display: grid;
  grid-template-columns: max-content 145px;
  align-items: baseline;
  justify-content: end;
  gap: 12px;
}

.rula-header__secondary-row span {
  color: var(--rula-muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 17px;
  white-space: nowrap;
}

.rula-header__secondary-row a {
  color: var(--rula-dark);
  font-size: 16px;
  font-weight: 700;
  line-height: 21px;
  text-align: right;
  white-space: nowrap;
}

.rula-header__secondary-row .rula-header__secondary-phone--accent {
  color: var(--rula-orange);
}

.rula-header__secondary-note {
  color: var(--rula-muted);
  font-size: 11px;
  font-weight: 700;
  line-height: 16px;
  text-align: right;
}

.rula-header__secondary-mail {
  color: var(--rula-link);
  font-size: 13px;
  line-height: 17px;
  text-align: right;
}

.rula-header__cta-group {
  width: 188px;
}

.rula-header__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 188px;
  height: 56px;
  border-radius: 12px;
  background: var(--rula-orange);
  box-shadow: 0 10px 24px rgb(255 122 18 / 28%);
  color: var(--rula-white);
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
  white-space: nowrap;
  transition: transform 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

@media (hover: hover) {
  .rula-header__button:hover {
    color: var(--rula-white);
    background: #f36c05;
    box-shadow: 0 12px 28px rgb(255 122 18 / 34%);
    transform: translateY(-1px);
  }
}

.rula-header__button:active {
  color: var(--rula-white);
  background: #df6000;
  transform: translateY(1px);
}

.rula-header__button--mobile {
  display: none;
}

.rula-header__nav-bar {
  position: relative;
  z-index: 80;
  height: 64px;
  background: var(--rula-blue);
}

.rula-header__nav-inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 24px;
  align-items: center;
  column-gap: 55px;
  width: min(1200px, calc(100% - 48px));
  height: 64px;
  margin: 0 auto;
}

.rula-header__icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.rula-header__icon-button img {
  display: block;
  width: 100%;
  height: 100%;
}

.rula-header__menu-button {
  display: none;
  width: 32px;
  height: 32px;
}

.rula-header__search-button {
  position: relative;
  z-index: 45;
  width: 24px;
  height: 24px;
}

.rula-header__search-panel {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  z-index: 40;
  width: 390px;
  margin: 0;
  padding: 12px;
  border: 1px solid rgba(111, 128, 150, 0.18);
  border-radius: 8px;
  background: var(--rula-white);
  box-shadow: 0 18px 40px rgba(22, 40, 61, 0.16);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
}

.rula-header__search-panel::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 100%;
  left: 0;
  height: 12px;
}

.rula-header__search-panel.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

.rula-header__search-label {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

.rula-header__search-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 36px;
  align-items: center;
  gap: 8px;
}

.rula-header__search-input {
  width: 100%;
  height: 46px;
  padding: 0 15px;
  border: 1px solid rgba(111, 128, 150, 0.26);
  border-radius: 6px;
  background: #f6f9fd;
  color: var(--rula-dark);
  font-family: inherit;
  font-size: 15px;
  font-weight: 600;
  line-height: 20px;
  outline: none;
  transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.rula-header__search-input::-webkit-search-cancel-button {
  -webkit-appearance: none;
}

.rula-header__search-input::placeholder {
  color: #6f8096;
  opacity: 1;
}

.rula-header__search-input:focus {
  border-color: var(--rula-blue);
  background: var(--rula-white);
  box-shadow: 0 0 0 3px rgba(15, 110, 184, 0.12);
}

.rula-header__search-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 100%;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: rgba(15, 110, 184, 0.08);
  cursor: pointer;
  line-height: 0;
}

.rula-header__search-close:hover {
  background: rgba(15, 110, 184, 0.14);
}

.rula-header__search-close img {
  display: block;
  width: 18px;
  height: 18px;
  filter: invert(28%) sepia(92%) saturate(1295%) hue-rotate(181deg) brightness(92%) contrast(94%);
}

.rula-header__search-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 46px;
  margin-top: 10px;
  padding: 0 18px;
  border: 0;
  border-radius: 8px;
  background: var(--rula-orange);
  box-shadow: 0 10px 24px rgb(255 122 18 / 24%);
  color: var(--rula-white);
  font-family: inherit;
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
  text-align: center;
  cursor: pointer;
  transition: transform 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.rula-header__search-submit:hover {
  background: #ff8526;
  box-shadow: 0 12px 28px rgb(255 122 18 / 32%);
}

.rula-header__search-submit:active {
  transform: translateY(1px);
}

.rula-header__nav {
  min-width: 0;
}

.rula-header__nav-list {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 34px;
  height: 64px;
}

.rula-header__nav-item {
  position: relative;
  display: flex;
  height: 64px;
}

.rula-header__nav-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 64px;
  color: var(--rula-white);
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
  white-space: nowrap;
}

.rula-header__nav-link:hover {
  color: var(--rula-white);
}

.rula-header__nav-link--active::after,
.rula-header__nav-link:hover::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 3px;
  background: var(--rula-orange);
}

.rula-header__dropdown {
  position: absolute;
  top: calc(100% + 12px);
  left: 0;
  z-index: 25;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 232px;
  padding: 10px;
  border: 1px solid rgba(111, 128, 150, 0.18);
  border-radius: 8px;
  background: var(--rula-white);
  box-shadow: 0 18px 40px rgba(22, 40, 61, 0.16);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
}

.rula-header__dropdown::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 100%;
  left: 0;
  height: 12px;
}

.rula-header__nav-item--dropdown:hover .rula-header__dropdown,
.rula-header__nav-item--dropdown:focus-within .rula-header__dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.rula-header__dropdown a {
  display: flex;
  align-items: center;
  min-height: 38px;
  padding: 8px 12px;
  border-radius: 6px;
  color: var(--rula-dark);
  font-size: 15px;
  font-weight: 600;
  line-height: 20px;
  white-space: nowrap;
}

.rula-header__dropdown a:hover {
  background: rgba(15, 110, 184, 0.08);
  color: var(--rula-blue);
}

.rula-header__dropdown--mega {
  left: 50%;
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: repeat(6, minmax(42px, auto));
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap: 0;
  width: min(780px, calc(100vw - 48px));
  padding: 16px;
  transform: translate(-50%, 8px);
}

.rula-header__nav-item--mega:hover .rula-header__dropdown--mega,
.rula-header__nav-item--mega:focus-within .rula-header__dropdown--mega {
  transform: translate(-50%, 0);
}

.rula-header__dropdown--mega a {
  height: 100%;
  min-height: 42px;
  padding: 9px 14px;
  border-radius: 0;
  font-size: 14px;
  line-height: 19px;
  white-space: normal;
}

.rula-header__dropdown--mega > li:nth-child(n + 7) > a {
  padding-left: 20px;
  border-left: 1px solid rgba(15, 110, 184, 0.28);
}

.rula-header__dropdown--mega a:hover {
  border-radius: 6px;
}

.rula-header__dropdown--clinics {
  grid-template-rows: repeat(3, minmax(42px, auto));
}

.rula-header__dropdown--clinics > li:nth-child(n + 4) > a {
  padding-left: 20px;
  border-left: 1px solid rgba(15, 110, 184, 0.28);
}

.rula-header__mobile-menu {
  position: fixed;
  inset: 0;
  z-index: 1000;
  overflow-y: auto;
  background: var(--rula-blue);
  color: var(--rula-white);
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
}

.rula-header__mobile-menu[hidden] {
  display: none;
}

.rula-header__mobile-close {
  position: absolute;
  top: 24px;
  right: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
}

.rula-header__mobile-close img {
  display: block;
  width: 24px;
  height: 24px;
}

.rula-header__mobile-nav {
  padding: 97px 32px 0;
}

.rula-header__mobile-list {
  display: flex;
  flex-direction: column;
  gap: 25px;
}

.rula-header__mobile-list a {
  display: inline-flex;
  color: var(--rula-white);
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
}

.rula-header__mobile-list a:hover {
  color: var(--rula-white);
}

.rula-header__mobile-item--dropdown {
  display: flex;
  flex-direction: column;
}

.rula-header__mobile-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 24px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--rula-white);
  font-family: inherit;
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
  text-align: left;
  cursor: pointer;
}

.rula-header__mobile-arrow {
  width: 10px;
  height: 10px;
  margin-right: 2px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform 0.2s ease;
}

.rula-header__mobile-toggle[aria-expanded="true"] .rula-header__mobile-arrow {
  transform: rotate(225deg) translate(-2px, -2px);
}

.rula-header__mobile-submenu {
  display: flex;
  flex-direction: column;
  gap: 13px;
  padding: 17px 0 0 16px;
}

.rula-header__mobile-submenu[hidden] {
  display: none;
}

.rula-header__mobile-submenu a {
  color: rgba(255, 255, 255, 0.76);
  font-size: 16px;
  font-weight: 600;
  line-height: 22px;
}

.rula-header__mobile-submenu a:hover {
  color: var(--rula-white);
}

.rula-header__mobile-contacts {
  display: flex;
  flex-direction: column;
  gap: 22px;
  padding: 40px 32px 48px;
}

.rula-header__mobile-contact {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.rula-header__mobile-label {
  color: var(--rula-dark);
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
}

.rula-header__mobile-phone {
  display: block;
  color: var(--rula-white);
  font-size: 22px;
  font-weight: 700;
  line-height: 29px;
  white-space: nowrap;
}

.rula-header__mobile-primary-row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.rula-header__mobile-contact--primary .rula-header__messenger {
  width: 32px;
  height: 32px;
  background: rgb(255 255 255 / 12%);
}

.rula-header__mobile-contact--primary .rula-header__messenger img {
  width: 26px;
  height: 26px;
}

.rula-header__mobile-contact--secondary {
  gap: 7px;
  padding: 16px;
  border: 1px solid rgb(255 255 255 / 14%);
  border-radius: 12px;
  background: rgb(255 255 255 / 6%);
}

.rula-header__mobile-secondary-row {
  display: grid;
  grid-template-columns: max-content 145px;
  align-items: baseline;
  justify-content: start;
  gap: 12px;
  width: 100%;
}

.rula-header__mobile-secondary-row span {
  color: var(--rula-dark);
  font-size: 13px;
  font-weight: 700;
}

.rula-header__mobile-secondary-row a {
  color: var(--rula-white);
  font-size: 17px;
  font-weight: 700;
  text-align: right;
  white-space: nowrap;
}

.rula-header__mobile-secondary-row:last-of-type a {
  color: var(--rula-orange);
}

.rula-header__mobile-note {
  color: var(--rula-white);
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
}

.rula-header__mobile-mail {
  display: block;
  color: var(--rula-dark);
  font-size: 15px;
  font-weight: 400;
  line-height: 20px;
  text-decoration: underline;
  white-space: nowrap;
}

.rula-header-menu-lock {
  overflow: hidden;
}

@media (max-width: 1240px) {
  .rula-header__top-inner {
    grid-template-columns: 205px 250px minmax(250px, 1fr) 176px;
    gap: 20px;
    width: min(1160px, calc(100% - 32px));
  }

  .rula-header__logo,
  .rula-header__logo-image {
    width: 205px;
  }

  .rula-header__contact-phone {
    font-size: 20px;
  }

  .rula-header__contact--primary {
    width: 250px;
  }

  .rula-header__primary-row {
    gap: 9px;
  }

  .rula-header__messenger {
    width: 27px;
    height: 27px;
  }

  .rula-header__messenger img,
  .rula-header__messenger--max img {
    width: 22px;
    height: 22px;
  }

  .rula-header__secondary-contacts {
    min-width: 250px;
    padding-left: 18px;
  }

  .rula-header__secondary-row {
    grid-template-columns: max-content 132px;
    gap: 9px;
  }

  .rula-header__secondary-row a {
    font-size: 15px;
  }

  .rula-header__cta-group {
    width: 176px;
  }

  .rula-header__button {
    width: 176px;
  }

  .rula-header__nav-inner {
    column-gap: 36px;
  }

  .rula-header__nav-list {
    gap: 24px;
  }
}

@media (max-width: 1023px) {
  .rula-header__top {
    height: 86px;
  }

  .rula-header__top-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 20px 21px 18px 20px;
  }

  .rula-header__logo {
    width: 147px;
    height: 31px;
  }

  .rula-header__logo-image {
    width: 147px;
    height: 31px;
  }

  .rula-header__secondary-contacts,
  .rula-header__cta-group {
    display: none;
  }

  .rula-header__contact--primary {
    display: flex;
    align-items: flex-end;
    width: auto;
    min-height: 48px;
  }

  .rula-header__contact--primary .rula-header__contact-phone {
    font-size: 18px;
    line-height: 24px;
  }

  .rula-header__contact--primary .rula-header__contact-mail {
    display: none;
  }

  .rula-header__nav-bar {
    height: 56px;
  }

  .rula-header__nav-inner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 56px;
    padding: 0 22px 0 23px;
  }

  .rula-header__nav {
    display: none;
  }

  .rula-header__menu-button {
    display: inline-flex;
    width: 26px;
    height: 26px;
  }

  .rula-header__search-button {
    width: 24px;
    height: 24px;
  }

  .rula-header__search-panel {
    top: calc(100% + 8px);
    right: 20px;
    left: 20px;
    width: auto;
    padding: 10px;
    transform: translateY(-8px);
  }

  .rula-header__search-field {
    grid-template-columns: minmax(0, 1fr) 34px;
  }

  .rula-header__search-input {
    height: 42px;
    padding: 0 13px;
    font-size: 14px;
    line-height: 20px;
  }

  .rula-header__search-close {
    width: 34px;
    height: 34px;
  }

  .rula-header__search-submit {
    height: 42px;
    margin-top: 8px;
    border-radius: 7px;
    font-size: 15px;
    line-height: 20px;
  }

  .rula-header__button--mobile {
    position: absolute;
    top: 10px;
    left: 50%;
    display: inline-flex;
    width: 188px;
    height: 38px;
    border-radius: 10px;
    transform: translateX(-50%);
  }

  .rula-header__button--mobile:active {
    transform: translateX(-50%) translateY(1px);
  }
}

@media (max-width: 374px) {
  .rula-header__top-inner {
    padding-right: 15px;
    padding-left: 15px;
  }

  .rula-header__logo,
  .rula-header__logo-image {
    width: 132px;
    height: 28px;
  }

  .rula-header__button--mobile {
    width: 172px;
  }
}

@media (max-width: 520px) {
  .rula-header__top .rula-header__messengers {
    display: none;
  }
}

.rula-page,
.rula-page * {
  box-sizing: border-box;
}

.rula-page {
  width: 100%;
  min-width: 320px;
  max-width: 100%;
  overflow-x: hidden;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif !important;
}

.rula-page :where(a) {
  color: inherit;
  text-decoration: none;
}

.rula-page :where(ul, li, p, h1, h2, h3) {
  margin: 0;
  padding: 0;
}

.rula-page :where(ul) {
  list-style: none;
}

.rula-main-banner {
  --rula-banner-white: #ffffff;
  --rula-banner-orange: #ff7a12;
  --rula-banner-blue: #0f6eb8;
  position: relative;
  display: flex;
  align-items: flex-start;
  isolation: isolate;
  overflow: hidden;
  width: 100%;
  padding: 80px 0;
  background: #07305e;
  color: var(--rula-banner-white);
}

.rula-main-banner::before,
.rula-main-banner::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
}

.rula-main-banner::before {
  background-image: var(--rula-banner-background, url("../images/main-banner.webp"));
  background-position: center 30%;
  background-size: cover;
  background-repeat: no-repeat;
  transform: scaleX(-1);
}

.rula-main-banner::after {
  z-index: -1;
  background: rgb(7 48 94 / 72%);
}

.rula-main-banner__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 784px) 384px;
  gap: 32px;
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
}

.rula-main-banner__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  max-width: 784px;
}

.rula-main-banner__breadcrumbs {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 20px;
  color: rgb(255 255 255 / 64%);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
}

.rula-main-banner__home {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  line-height: 0;
}

.rula-main-banner__home img {
  width: 20px;
  height: 20px;
}

.rula-main-banner__crumb {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: rgb(255 255 255 / 64%);
  text-decoration: underline;
  white-space: nowrap;
}

.rula-main-banner__crumb::before {
  content: "";
  display: block;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: currentColor;
}

.rula-main-banner__crumb--current {
  color: var(--rula-banner-orange);
  text-decoration: none;
}

.rula-page {
  position: relative;
}

.rula-internal-breadcrumbs {
  position: absolute;
  top: 80px;
  left: 50%;
  z-index: 5;
  width: min(1200px, calc(100% - 48px));
  transform: translateX(-50%);
}

.rula-internal-title {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* Макет «Внутренняя без баннера»: крошки и заголовок идут в потоке страницы,
   а не поверх баннера. */
.rula-internal-head {
  padding: 32px 24px 0;
  background: #f5f7fa;
}

.rula-internal-head__inner {
  width: min(1200px, 100%);
  margin: 0 auto;
}

.rula-internal-head .rula-breadcrumbs,
.rula-internal-head .rula-breadcrumbs__item {
  color: #6f8096;
}

/* Иконка «домика» нарисована белой под тёмный баннер — на светлом фоне
   перекрашиваем её маской. */
.rula-internal-head .rula-breadcrumbs__item:first-child {
  background: #6f8096;
  -webkit-mask: url("../images/main-banner-home.svg") center / 20px 20px no-repeat;
  mask: url("../images/main-banner-home.svg") center / 20px 20px no-repeat;
}

.rula-internal-head .rula-breadcrumbs__item:first-child:hover {
  background: #0f6eb8;
}

.rula-internal-head .rula-breadcrumbs__item:hover {
  color: #0f6eb8;
}

.rula-internal-head .rula-breadcrumbs__item--current,
.rula-internal-head .rula-breadcrumbs__item--current:hover {
  color: var(--rula-orange, #ff7a12);
}

.rula-internal-head__title {
  margin: 16px 0 0;
  color: #1f3552;
  font-size: 48px;
  font-weight: 700;
  line-height: 56px;
}

.rula-breadcrumbs {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 20px;
  overflow-x: auto;
  color: rgb(255 255 255 / 64%);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  scrollbar-width: none;
}

.rula-breadcrumbs::-webkit-scrollbar {
  display: none;
}

.rula-breadcrumbs__item {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 12px;
  color: rgb(255 255 255 / 64%);
  text-decoration: underline;
  white-space: nowrap;
}

.rula-breadcrumbs__item + .rula-breadcrumbs__item::before {
  content: "";
  display: block;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: currentColor;
}

.rula-breadcrumbs__item:first-child {
  width: 20px;
  height: 20px;
  overflow: hidden;
  background: url("../images/main-banner-home.svg") center / 20px 20px no-repeat;
  color: transparent;
  font-size: 0;
  line-height: 0;
  text-decoration: none;
}

.rula-breadcrumbs__item--current {
  color: var(--rula-orange, #ff7a12);
  text-decoration: none;
}

.rula-internal-breadcrumbs + .rula-main-banner,
.rula-internal-breadcrumbs + * .rula-main-banner {
  padding-top: 80px;
}

.rula-internal-breadcrumbs + .rula-main-banner .rula-main-banner__content,
.rula-internal-breadcrumbs + * .rula-main-banner__content {
  padding-top: 44px;
}

/* Netcat заворачивает баннер в служебные `tpl-block-*`, а между крошками и
   баннером выводит скрытый `<h1 class="rula-internal-title">`, поэтому селекторы
   по соседству выше не срабатывают. Отступ задаётся от самой страницы. */
.rula-page:has(> .rula-internal-breadcrumbs) .rula-main-banner {
  padding-top: 80px;
}

.rula-page:has(> .rula-internal-breadcrumbs) .rula-main-banner__content {
  padding-top: 44px;
}

@media (max-width: 1023px) {
  .rula-internal-breadcrumbs {
    top: 36px;
    width: 100%;
    padding: 0 24px;
  }

  .rula-internal-breadcrumbs + .rula-main-banner,
  .rula-internal-breadcrumbs + * .rula-main-banner {
    padding-top: 36px;
  }

  .rula-internal-breadcrumbs + .rula-main-banner .rula-main-banner__content,
  .rula-internal-breadcrumbs + * .rula-main-banner__content {
    padding-top: 44px;
  }

  .rula-page:has(> .rula-internal-breadcrumbs) .rula-main-banner {
    padding-top: 36px;
  }

  .rula-page:has(> .rula-internal-breadcrumbs) .rula-main-banner__content {
    padding-top: 44px;
  }
}

.rula-main-banner__title {
  max-width: 784px;
  color: var(--rula-banner-white);
  font-size: 48px;
  font-weight: 700;
  line-height: 56px;
}

.rula-main-banner__title-line {
  display: block;
}

.rula-main-banner__title-line--mobile {
  display: none;
}

.rula-main-banner__text {
  max-width: 784px;
  color: rgb(255 255 255 / 94%);
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
}

.rula-main-banner__actions {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
}

.rula-main-banner__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  height: 64px;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
  white-space: nowrap;
  transition: transform 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.rula-main-banner__button img {
  display: block;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
}

.rula-main-banner__button--primary {
  width: 286px;
  padding: 20px 24px;
  background: var(--rula-banner-orange);
  box-shadow: 0 10px 24px rgb(255 122 18 / 28%);
  color: var(--rula-banner-white);
}

.rula-main-banner__button--primary:hover {
  color: var(--rula-banner-white);
  background: #f36c05;
  box-shadow: 0 12px 28px rgb(255 122 18 / 34%);
}

.rula-main-banner__button--primary:active {
  color: var(--rula-banner-white);
  background: #df6000;
}

.rula-main-banner__button--secondary {
  width: 272px;
  padding: 20px 30px;
  border: 1px solid rgb(85 115 140 / 18%);
  background: var(--rula-banner-white);
  color: var(--rula-banner-blue);
}

.rula-main-banner__button--secondary:hover {
  color: var(--rula-banner-blue);
  background: #f7fbff;
}

.rula-main-banner__button:active {
  transform: translateY(1px);
}

.rula-main-banner__aside {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  width: 384px;
  padding: 32px 24px;
  border: 1px solid rgb(255 255 255 / 18%);
  border-radius: 24px;
  background: rgb(255 255 255 / 12%);
  box-shadow: 0 12px 32px rgb(16 52 89 / 8%);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.rula-main-banner__aside-title {
  color: var(--rula-banner-white);
  font-size: 28px;
  font-weight: 700;
  line-height: 37px;
}

.rula-main-banner__list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.rula-main-banner__list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  color: rgb(255 255 255 / 95%);
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
}

.rula-main-banner__list img {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  margin-top: 1px;
}

@media (max-width: 1240px) {
  .rula-main-banner__inner {
    grid-template-columns: minmax(0, 1fr) 360px;
  }

  .rula-main-banner__aside {
    width: 360px;
  }
}

@media (max-width: 1023px) {
.rula-main-banner {
    padding: 36px 0 32px;
    background-position: 51% center;
  }

  .rula-main-banner__inner {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
    padding: 0 24px;
  }

  .rula-main-banner__content {
    gap: 24px;
    max-width: none;
    width: 100%;
  }

  .rula-main-banner__breadcrumbs {
    gap: 12px;
    width: 100%;
  }

  .rula-main-banner__title {
    max-width: 100%;
    font-size: 30px;
    line-height: 42px;
  }

  .rula-main-banner__title-line--desktop {
    display: none;
  }

  .rula-main-banner__title-line--mobile {
    display: block;
  }

  .rula-main-banner__text {
    max-width: 100%;
    font-size: 14px;
    line-height: 20px;
  }

  .rula-main-banner__actions {
    flex-direction: column;
    gap: 16px;
  }

  .rula-main-banner__button {
    width: 100%;
    height: 56px;
    padding: 16px 20px;
  }

.rula-main-banner__aside {
    width: 100%;
    gap: 24px;
    padding: 24px 14px;
    border-radius: 24px;
  }

  .rula-main-banner__aside-title {
    font-size: 28px;
    line-height: 37px;
  }

  .rula-main-banner__list {
    gap: 16px;
  }

  .rula-main-banner__list li {
    gap: 12px;
    font-size: 18px;
    line-height: 27px;
  }
}

@media (max-width: 374px) {
  .rula-main-banner__inner {
    padding-right: 16px;
    padding-left: 16px;
  }

  .rula-main-banner__title {
    font-size: 28px;
    line-height: 38px;
  }

  .rula-main-banner__list li {
    font-size: 16px;
    line-height: 24px;
  }
}

.rula-advantages {
  width: 100%;
  padding: 80px 0;
  background: #ffffff;
  color: #1f3552;
}

.rula-advantages__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
}

.rula-advantages__heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  max-width: 920px;
  text-align: center;
}

.rula-advantages__title {
  margin: 0;
  color: #1f3552;
  font-size: 40px;
  font-weight: 700;
  line-height: 48px;
}

.rula-advantages__description {
  width: 100%;
  color: #6f8096;
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  text-align: center;
}

.rula-advantages__cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
  width: 100%;
}

.rula-advantages__card {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 16px;
  padding: 24px;
  border: 1px solid rgb(18 60 101 / 5%);
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0 8px 24px rgb(27 60 99 / 6%);
}

.rula-advantages__card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
}

.rula-advantages__icon {
  display: flex;
  flex: 0 0 36px;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 2px solid rgb(255 255 255 / 22%);
  border-radius: 9px;
  background: #f2f6fb;
}

.rula-advantages__icon img {
  display: block;
  width: 20px;
  height: 20px;
}

.rula-advantages__card-copy {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.rula-advantages__card-title {
  color: #1f3552;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
}

.rula-advantages__card-text {
  color: #6f8096;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.rula-advantages__more {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  margin-top: auto;
  color: #0d67ad;
  font-size: 15px;
  font-weight: 700;
  line-height: 20px;
  white-space: nowrap;
}

.rula-advantages__more:hover {
  color: #0d67ad;
  text-decoration: underline;
}

.rula-page .rula-advantages__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 402px;
  height: 64px;
  padding: 20px 24px;
  border-radius: 12px;
  background: #ff7a12;
  box-shadow: 0 10px 24px rgb(255 122 18 / 28%);
  color: #ffffff;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
  white-space: nowrap;
  transition: transform 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.rula-advantages__button img {
  display: block;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
}

.rula-page .rula-advantages__button:hover {
  color: #ffffff;
  background: #ff8526;
  box-shadow: 0 12px 28px rgb(255 122 18 / 34%);
}

.rula-advantages__button:active {
  transform: translateY(1px);
}

@media (max-width: 1023px) {
  .rula-advantages__button img {
    display: none;
  }

  .rula-advantages {
    /* min-height: 2023px; */
    padding: 80px 0;
  }

  .rula-advantages__inner {
    gap: 40px;
    width: 100%;
    padding: 0 20px;
  }

  .rula-advantages__title {
    font-size: 34px;
    line-height: 42px;
  }

  .rula-advantages__description {
    font-size: 20px;
    line-height: 28px;
  }

  .rula-advantages__cards {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

.rula-advantages__card {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 24px 20px;
  }

  .rula-advantages__icon {
    flex-basis: 36px;
    width: 36px;
    height: 36px;
    border-radius: 9px;
  }

  .rula-advantages__icon img {
    width: 20px;
    height: 20px;
  }

  .rula-advantages__card-copy {
    gap: 8px;
  }

  .rula-advantages__card-title {
    font-size: 18px;
    line-height: 24px;
  }

  .rula-advantages__card-text {
    font-size: 16px;
    line-height: 24px;
  }

  .rula-advantages__more {
    margin-top: 0;
  }

  .rula-advantages__button {
    width: 100%;
    height: 64px;
    padding: 20px 18px;
  }
}

@media (max-width: 374px) {
  .rula-advantages__inner {
    padding-right: 16px;
    padding-left: 16px;
  }

  .rula-advantages__description {
    font-size: 18px;
    line-height: 26px;
  }

  .rula-advantages__card {
    padding-right: 16px;
    padding-left: 16px;
  }

  .rula-advantages__title {
    font-size: 30px;
    line-height: 38px;
  }

  .rula-advantages__card-title {
    font-size: 18px;
    line-height: 24px;
  }

  .rula-advantages__button {
    font-size: 15px;
  }
}

.rula-cases {
  width: 100%;
  overflow: hidden;
  padding: 80px 0 120px;
  background: #f5f7fa;
  color: #1f3552;
}

.rula-cases :where(button) {
  border: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font-family: inherit;
  cursor: pointer;
}

.rula-cases :where(blockquote) {
  margin: 0;
}

.rula-cases__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
}

.rula-cases__intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 800px;
  max-width: 800px;
  text-align: center;
}

.rula-cases__eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 181px;
  min-height: 35px;
  padding: 8px 16px;
  border-radius: 999px;
  background: rgb(47 127 215 / 4%);
  color: #0f6eb8;
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
}

.rula-cases__title {
  width: 100%;
  color: #1f3552;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
  font-size: 48px;
  font-weight: 700;
  line-height: 56px;
  text-align: center;
}

.rula-cases__subtitle {
  width: 100%;
  color: #6f8096;
  font-size: 20px;
  font-weight: 400;
  line-height: 27px;
  text-align: center;
}

.rula-cases__slider-shell {
  position: relative;
  width: 1200px;
  max-width: 100%;
  height: auto;
}

.rula-cases__viewport {
  width: 100%;
  height: auto;
  overflow: hidden;
}

.rula-cases__wrapper {
  display: flex;
  width: 100%;
  height: auto;
  transition: transform 320ms ease;
  will-change: transform;
}

.rula-cases__card {
  position: relative;
  display: flex;
  flex: 0 0 384px;
  flex-direction: column;
  width: 384px;
  height: auto;
  max-height: none;
  margin-right: 24px;
  overflow: hidden;
  border: 1px solid rgb(18 60 101 / 5%);
  border-radius: 20px;
  background: #ffffff;
}


.rula-cases__image-wrap {
  position: relative;
  width: 100%;
  height: 250px;
  flex: 0 0 250px;
  overflow: hidden;
  background: #e8eef5;
}

.rula-cases__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rula-cases__tag {
  position: absolute;
  top: 20px;
  left: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 107px;
  min-height: 35px;
  padding: 8px 16px;
  border-radius: 999px;
  background: #ffe8d9;
  color: #ff7a12;
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
}

.rula-cases__body {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  height: auto;
  padding: 24px 20px;
}

.rula-cases__card-title {
  display: flex;
  align-items: center;
  color: #1f3552;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
}

.rula-cases__meta {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

.rula-cases__meta-row {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  color: #6f8096;
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
}

.rula-cases__meta-row img {
  display: block;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
}

.rula-cases__meta-row span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rula-cases__details {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  /* min-height: 107px; */
  padding: 16px;
  border-radius: 14px;
  background: #f7f8fa;
  color: #1f3552;
  font-size: 16px;
  font-weight: 400;
  line-height: 21px;
}

.rula-cases__details strong {
  font-weight: 700;
}

.rula-cases__results-title {
  color: #1f3552;
  font-size: 16px;
  font-weight: 700;
  line-height: 21px;
}

.rula-cases__results {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

.rula-cases__results li {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #6f8096;
  font-size: 16px;
  font-weight: 400;
  line-height: 21px;
}

.rula-cases__results img {
  display: block;
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
}

.rula-cases__quote {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 16px;
  border: 0;
  border-radius: 14px;
  background: #f7f8fa;
  color: #6f8096;
  font-size: 16px;
  font-style: italic;
  font-weight: 400;
  line-height: 21px;
}

.rula-cases__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  height: 48px;
  padding: 12px 30px;
  border: 1px solid rgb(85 115 140 / 18%);
  border-radius: 12px;
  color: #1f3552;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
  transition: background-color 160ms ease, transform 160ms ease;
}

.rula-cases__button:hover {
  color: #1f3552;
  background: #f7f8fa;
}

.rula-cases__button:active {
  transform: translateY(1px);
}

.rula-cases__button img {
  display: block;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
}

.rula-cases__nav {
  position: absolute;
  top: 463px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border: 1px solid rgb(85 115 140 / 18%);
  border-radius: 12px;
  transition: background-color 160ms ease, transform 160ms ease;
}

.rula-cases__nav:hover {
  background: #ffffff;
}

.rula-cases__nav:active {
  transform: translateY(1px);
}

.rula-cases__nav img {
  display: block;
  width: 24px;
  height: 24px;
}

.rula-cases__nav--prev {
  left: -72px;
}

.rula-cases__nav--prev img {
  transform: rotate(180deg);
}

.rula-cases__nav--next {
  right: -72px;
}

.rula-cases__pagination {
  position: static;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 32px;
  width: 100%;
  height: 14px;
  line-height: 0;
}




.rula-cases__stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 32px;
  width: 100%;
  padding: 48px;
  border-radius: 18px;
  background: #ffefe2;
}

.rula-cases__stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 0;
  text-align: center;
}

.rula-cases__stat-value {
  color: #ff7a12;
  font-size: 48px;
  font-weight: 700;
  line-height: 64px;
}

.rula-cases__stat-label {
  color: rgb(0 0 0 / 64%);
  font-size: 17px;
  font-weight: 400;
  line-height: 23px;
}

@media (max-width: 1023px) {
.rula-cases {
    padding: 49px 0 48px;
  }

  .rula-cases__inner {
    gap: 48px;
    width: 100%;
  }

.rula-cases__intro {
    width: 100%;
    max-width: none;
    padding: 0 24px;
  }

  .rula-cases__title {
    font-size: 28px;
    line-height: 34px;
    white-space: nowrap;
  }

  .rula-cases__subtitle {
    max-width: 366px;
    font-size: 16px;
    line-height: 22px;
  }

.rula-cases__slider-shell {
    align-self: center;
    width: 100%;
    height: auto;
  }

.rula-cases__card {
    flex: 0 0 min(322px, calc(100vw - 92px));
    width: min(322px, calc(100vw - 92px));
    height: auto;
    margin-right: 16px;
  }

.rula-cases__body {
    gap: 18px;
    height: auto;
    padding: 24px 19px 24px 20px;
  }

.rula-cases__card-title {
    display: block;
    font-size: 24px;
    line-height: 30px;
  }

  .rula-cases__details,
  .rula-cases__results-title,
  .rula-cases__results,
  .rula-cases__quote {
    display: none;
  }

  .rula-cases__button {
    margin-top: auto;
  }

  .rula-cases__nav {
    display: none;
  }

.rula-cases__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 16px;
    row-gap: 13px;
    width: calc(100% - 48px);
    padding: 25px 20px;
  }

.rula-cases__stat {
  }

  .rula-cases__stat-value {
    font-size: 34px;
    line-height: 41px;
  }

  .rula-cases__stat-label {
    font-size: 16px;
    line-height: 23px;
    white-space: nowrap;
  }
}

@media (max-width: 400px) {
  .rula-cases__card-title {
    line-height: 23px;
  }
}

@media (max-width: 374px) {
  .rula-cases__intro {
    padding-right: 16px;
    padding-left: 16px;
  }

  .rula-cases__title {
    font-size: 25px;
    line-height: 32px;
  }

  .rula-cases__subtitle {
    font-size: 15px;
    line-height: 21px;
  }

  .rula-cases__slider-shell {
    width: 100%;
  }

  .rula-cases__card {
    flex-basis: calc(100vw - 48px);
    width: calc(100vw - 48px);
  }

  .rula-cases__body {
    padding-right: 16px;
    padding-left: 16px;
  }

  .rula-cases__stats {
    width: calc(100% - 32px);
    padding-right: 16px;
    padding-left: 16px;
  }

  .rula-cases__stat-label {
    font-size: 15px;
  }
}

.rula-copy {
  display: grid;
  grid-template-columns: minmax(24px, 1fr) minmax(0, 1200px) minmax(24px, 1fr);
  row-gap: 32px;
  width: 100%;
  background: #f5f7fa;
  color: #1f3552;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
}

.rula-copy > * {
  grid-column: 2;
  min-width: 0;
}

.rula-copy--opinion {
  padding: 80px 0;
}

.rula-copy--final {
  padding: 80px 0 120px;
}

.rula-copy header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: min(900px, 100%);
  margin: 0 auto;
  text-align: center;
}

.rula-copy header > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 35px;
  padding: 8px 16px;
  border-radius: 999px;
  background: rgb(47 127 215 / 4%);
  color: #0f6eb8;
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
}

.rula-copy h2 {
  color: #1f3552;
  font-size: 36px;
  font-weight: 700;
  line-height: 44px;
}

.rula-copy--opinion header h2 {
  width: 100%;
  font-size: 48px;
  line-height: 56px;
}

.rula-copy header p {
  width: 100%;
  color: #6f8096;
  font-size: 20px;
  line-height: 28px;
}

.rula-copy > p {
  color: #1f3552;
  font-size: 18px;
  line-height: 24px;
}

.rula-copy hr {
  width: 100%;
  height: 1px;
  margin: 0;
  border: 0;
  background: #e2e2e2;
}

.rula-copy aside {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  padding: 32px;
  border: 1px solid rgb(255 122 18 / 45%);
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 8px 24px rgb(27 60 99 / 6%);
}

.rula-copy--opinion aside {
  display: flex;
  flex-direction: column;
  gap: 32px;
  border-radius: 20px;
}

.rula-copy--final aside {
  border-color: rgb(255 122 18 / 65%);
}

/*
 * Netcat uses the opinion variant for all three SEO sections.
 * Restore the compact histology/final layouts used by service.html.
 */
.tpl-block-564 + .rula-copy--opinion {
  padding: 0;
}

.tpl-block-564 + .rula-copy--opinion header h2,
.rula-copy--opinion + .rula-copy--opinion header h2 {
  font-size: 36px;
  line-height: 44px;
}

.tpl-block-564 + .rula-copy--opinion aside,
.rula-copy--opinion + .rula-copy--opinion aside {
  gap: 20px;
  border-radius: 12px;
}

.rula-copy--opinion + .rula-copy--opinion {
  padding: 80px 0 48px;
}

.rula-copy--opinion + .rula-copy--opinion aside {
  border-color: rgb(255 122 18 / 65%);
}

.rula-copy aside h3 {
  width: min(504px, 100%);
  color: #1f3552;
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
}

.rula-copy ul {
  display: flex;
  flex-direction: column;
  gap: 32px;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

.rula-copy li {
  position: relative;
  min-height: 24px;
  padding-left: 48px;
  color: #1f3552;
  font-size: 18px;
  line-height: 24px;
}

.rula-copy li::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 24px;
  height: 24px;
  background: url("../images/cases-checkround.svg") center / contain no-repeat;
  content: "";
}

@media (max-width: 1023px) {
  .rula-copy {
    grid-template-columns: 24px minmax(0, 1fr) 24px;
  }

  .rula-copy--opinion {
    padding: 64px 0;
  }

  .rula-copy--final {
    padding: 68px 0 60px;
  }

  .rula-copy h2 {
    font-size: 26px;
    line-height: 32px;
  }

  .rula-copy--opinion header h2 {
    font-size: 30px;
    line-height: 38px;
  }

  .rula-copy header p {
    font-size: 16px;
    line-height: 22px;
  }

  .rula-copy > p {
    font-size: 18px;
    line-height: 24px;
  }

  .rula-copy aside {
    padding: 32px 20px;
  }

  .rula-copy--opinion aside {
    padding: 35px 20px 31px;
    border-radius: 16px;
  }

  .rula-copy aside h3 {
    font-size: 21px;
    line-height: 28px;
  }

  .rula-copy ul {
    gap: 28px;
  }

  .rula-copy--final ul {
    gap: 32px;
  }

  .rula-copy li {
    padding-left: 36px;
    font-size: 16px;
    line-height: 21px;
  }

  .rula-copy--final li {
    line-height: 24px;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .rula-copy {
    padding-top: 56px;
    padding-bottom: 64px;
  }
}

@media (max-width: 374px) {
  .rula-copy {
    grid-template-columns: 16px minmax(0, 1fr) 16px;
  }

  .rula-copy h2 {
    font-size: 25px;
    line-height: 31px;
  }

  .rula-copy--opinion header h2 {
    font-size: 28px;
    line-height: 36px;
  }

  .rula-copy > p {
    font-size: 17px;
    line-height: 23px;
  }
}

.rula-text-section {
  width: 100%;
  background: #f5f7fa;
  color: #1f3552;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
}

.rula-text-section :where(a) {
  color: inherit;
}

.rula-text-section__eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  min-height: 35px;
  padding: 8px 16px;
  border-radius: 999px;
  background: rgb(47 127 215 / 4%);
  color: #0f6eb8;
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
  text-align: center;
}

.rula-text-section__title {
  color: #1f3552;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
  font-weight: 700;
}

.rula-text-section__title--split {
  width: 100%;
  font-size: 36px;
  line-height: 44px;
}

.rula-text-section__copy p {
  color: #1f3552;
  font-size: 18px;
  font-weight: 400;
  line-height: 24px;
}

.rula-text-section__copy {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
}

.rula-text-section__copy a {
  color: #ff7a12;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.rula-text-section--split {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 80px 0;
}

.rula-text-section--split-left {
}

.rula-text-section--split-right {
}

/* Блок без картинки: текст на всю ширину, а не в половину колонки. */
.rula-text-section--plain {
  padding: 80px 0;
}

.rula-text-section__inner {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
}

@media (max-width: 767px) {
  .rula-text-section--plain {
    padding: 48px 0;
  }
}

.rula-text-split {
  display: grid;
  grid-template-columns: minmax(0, 768px) 384px;
  align-items: center;
  gap: 48px;
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
}

.rula-text-split--reverse {
  grid-template-columns: 384px minmax(0, 768px);
}

.rula-text-split__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  width: 100%;
}

.rula-text-split__figure {
  width: 384px;
  height: 384px;
  overflow: hidden;
  border-radius: 12px;
  background: #d9d9d9;
}

.rula-text-split__figure img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 1023px) {
  .rula-text-section__eyebrow {
    align-self: center;
  }

  .rula-text-section__title--split {
    font-size: 26px;
    line-height: 32px;
  }

  .rula-text-section__copy p {
    font-size: 18px;
    line-height: 24px;
  }

  .rula-text-section--split {
    display: block;
    padding: 48px 0;
  }

  .rula-text-section--split-left {
    /* min-height: 1038px; */
  }

  .rula-text-section--split-right {
    /* min-height: 1134px; */
  }

  .rula-text-split,
  .rula-text-split--reverse {
    display: flex;
    flex-direction: column;
    gap: 48px;
    width: 100%;
  }

  .rula-text-section--split-left .rula-text-split__content {
    order: 1;
  }

  .rula-text-section--split-left .rula-text-split__figure {
    order: 0;
  }

  .rula-text-split__content {
    width: 100%;
    padding: 0 24px;
  }

  .rula-text-split__figure {
    width: calc(100% - 30px);
    height: 139px;
    margin: 0 auto;
    border-radius: 10px;
  }

}

@media (max-width: 374px) {
  .rula-text-split__content {
    padding-right: 16px;
    padding-left: 16px;
  }

  .rula-text-section__title--split {
    font-size: 25px;
    line-height: 31px;
  }

  .rula-text-section__copy p {
    font-size: 17px;
    line-height: 23px;
  }
}

.rula-price {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  width: 100%;
  padding: 64px 0 120px;
  background: #ffffff;
  color: #1f3552;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
}

.rula-price__intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 900px;
  max-width: calc(100% - 48px);
  text-align: center;
}

.rula-price__eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  min-height: 35px;
  padding: 8px 16px;
  border-radius: 999px;
  background: rgb(47 127 215 / 4%);
  color: #0f6eb8;
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
}

.rula-price__title {
  width: 100%;
  color: #1f3552;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
  font-size: 40px;
  font-weight: 700;
  line-height: 53px;
  text-align: center;
}

/* Теги направлений над таблицей цен. */
.rula-price__tags {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  width: min(1200px, calc(100% - 48px));
  margin-bottom: 24px;
}

.rula-price__tag {
  padding: 10px 18px;
  color: #1f3552;
  font-family: inherit;
  font-size: 15px;
  font-weight: 600;
  line-height: 20px;
  background: #ffffff;
  border: 1px solid rgb(15 110 184 / 20%);
  border-radius: 999px;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.rula-price__tag:hover {
  background: #f1f6fc;
  border-color: rgb(15 110 184 / 45%);
}

.rula-price__tag--active {
  color: #ffffff;
  background: #0f6eb8;
  border-color: #0f6eb8;
}

@media (max-width: 767px) {
  .rula-price__tags {
    justify-content: flex-start;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 4px;
    scrollbar-width: none;
  }

  .rula-price__tags::-webkit-scrollbar {
    display: none;
  }

  .rula-price__tag {
    flex: 0 0 auto;
    font-size: 14px;
    padding: 8px 14px;
  }
}

.rula-price__card {
  width: min(1200px, calc(100% - 48px));
  height: auto;
  padding: 24px;
  overflow: hidden;
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0 4px 32px rgb(27 60 99 / 12%);
}

/* Netcat component: service prices */
.rula-price__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  width: 100%;
}

.rula-price-list {
  width: 100%;
}

.rula-price-list__head,
.rula-price-list__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 180px;
  align-items: center;
  width: 100%;
}

.rula-price-list__head {
  border-bottom: 2px solid #f0f3f5;
}

.rula-price-list__heading,
.rula-price-list__cell {
  padding: 16px 12px;
}

.rula-price-list__heading {
  color: #1568c7;
  font-size: 20px;
  font-weight: 600;
  line-height: 27px;
}

.rula-price-list__heading--price {
  text-align: right;
}

.rula-price-list__body > .tpl-block-list-objects {
  display: contents;
}

.rula-price-list__object {
  position: relative;
}

.rula-price-list__object:nth-child(even) .rula-price-list__row,
.rula-price-list__body > .tpl-block-list-objects > .rula-price-list__object:nth-child(even) .rula-price-list__row {
  background: #f0f3f5;
}

.rula-price-list__cell--title {
  color: #6f8096;
  font-size: 16px;
  font-weight: 400;
  line-height: 21px;
}

.rula-price-list__cell--price {
  color: #1f3552;
  font-size: 20px;
  font-weight: 600;
  line-height: 27px;
  text-align: right;
  white-space: nowrap;
}

.rula-price__table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.rula-price__col-cost {
  width: 120px;
}

.rula-price__table tr {
  height: auto;
}

.rula-price__table thead tr {
  border-bottom: 2px solid #f0f3f5;
}

.rula-price__table tbody tr:nth-child(even) {
  background: #f0f3f5;
}

.rula-price__table th,
.rula-price__table td {
  height: auto;
  padding: 16px 12px;
  border: 0;
  vertical-align: middle;
}

.rula-price__table th {
  color: #1568c7;
  font-size: 16px;
  font-weight: 400;
  line-height: 21px;
  text-align: left;
}

.rula-price__table th:last-child {
  font-size: 20px;
  font-weight: 600;
  line-height: 27px;
  text-align: right;
}

.rula-price__table td:first-child {
  color: #6f8096;
  font-size: 16px;
  font-weight: 400;
  line-height: 21px;
}

.rula-price__table td:last-child {
  color: #1f3552;
  font-size: 20px;
  font-weight: 600;
  line-height: 27px;
  text-align: right;
  white-space: nowrap;
}

@media (max-width: 1023px) {
.rula-price {
    gap: 24px;
    padding: 48px 0 40px;
  }

.rula-price__intro {
    gap: 8px;
    width: 100%;
    max-width: none;
    padding: 0 16px;
  }

  .rula-price__eyebrow {
    width: 58px;
    min-height: 28px;
    padding: 5px 12px;
    font-size: 12px;
    line-height: 16px;
  }

  .rula-price__title {
    font-size: 28px;
    line-height: 37px;
  }

  .rula-price__card {
    width: calc(100% - 32px);
    height: auto;
    padding: 10px;
    border-radius: 16px;
    box-shadow: 0 4px 32px rgb(27 60 99 / 10%);
  }

  .rula-price__inner {
    gap: 24px;
  }

  .rula-price-list__head,
  .rula-price-list__row {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .rula-price-list__heading,
  .rula-price-list__cell {
    padding: 13px 8px;
  }

  .rula-price-list__heading,
  .rula-price-list__heading--price {
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
  }

  .rula-price-list__cell--title {
    padding-right: 16px;
    font-size: 14px;
    line-height: 18px;
  }

  .rula-price-list__cell--price {
    font-size: 20px;
    line-height: 27px;
  }

  .rula-price__table,
  .rula-price__table thead,
  .rula-price__table tbody {
    display: block;
    width: 100%;
  }

.rula-price__table tr {
    display: grid;
    grid-template-columns: 174px minmax(0, 1fr);
    width: 100%;
    height: auto;
  }

.rula-price__table thead tr {
  }

.rula-price__table th,
  .rula-price__table td {
    display: flex;
    align-items: center;
    height: auto;
    padding: 13px 8px;
  }

  .rula-price__table th {
    font-size: 14px;
    line-height: 19px;
  }

  .rula-price__table th:last-child {
    justify-content: flex-end;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
  }

  .rula-price__table td:first-child {
    font-size: 14px;
    line-height: 16px;
  }

  .rula-price__table td:last-child {
    justify-content: flex-end;
    font-size: 20px;
    line-height: 27px;
  }
}

@media (max-width: 374px) {
  .rula-price__card {
    width: calc(100% - 24px);
    padding-right: 8px;
    padding-left: 8px;
  }

  .rula-price__table tr {
    grid-template-columns: 164px minmax(0, 1fr);
  }

  .rula-price__table td:first-child {
    font-size: 13px;
    line-height: 16px;
  }

  .rula-price__table td:last-child {
    font-size: 18px;
  }
}

.rula-doctors {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 64px;
  width: 100%;
  padding: 80px 0;
  overflow: hidden;
  background: #f5f7fa;
  color: #1f3552;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
}

.rula-doctors,
.rula-doctors * {
  box-sizing: border-box;
}

.rula-doctors :where(h2, h3, p) {
  margin: 0;
}

.rula-doctors :where(a) {
  color: inherit;
  text-decoration: none;
}

.rula-doctors :where(button) {
  border: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font-family: inherit;
  cursor: pointer;
}

.rula-doctors__intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: min(1200px, calc(100% - 48px));
  text-align: center;
}

.rula-doctors__eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 181px;
  min-height: 35px;
  padding: 8px 16px;
  border-radius: 999px;
  background: rgb(47 127 215 / 4%);
  color: #0f6eb8;
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
}

.rula-doctors__title {
  width: 100%;
  max-width: 900px;
  color: #1f3552;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
  font-size: 48px;
  font-weight: 700;
  line-height: 56px;
  text-align: center;
}

.rula-doctors__subtitle {
  width: 100%;
  max-width: 843px;
  color: #6f8096;
  font-size: 20px;
  font-weight: 400;
  line-height: 27px;
  text-align: center;
}

.rula-doctors__subtitle-copy {
  display: block;
}

.rula-doctors__subtitle-copy--mobile {
  display: none;
}

.rula-doctors__slider-shell {
  position: relative;
  width: min(1200px, calc(100% - 48px));
  height: auto;
}

.rula-doctors__viewport {
  width: 100%;
  height: auto;
  overflow: hidden;
}

.rula-doctors__wrapper {
  display: flex;
  width: 100%;
  height: auto;
  transition: transform 320ms ease;
  will-change: transform;
}

.rula-doctors__card {
  position: relative;
  display: flex;
  flex: 0 0 276px;
  flex-direction: column;
  width: 276px;
  height: auto;
  margin-right: 32px;
  overflow: hidden;
  border-radius: 20px;
  background: #ffffff;
}


.rula-doctors__photo-wrap {
  position: relative;
  width: 100%;
  height: 217.45px;
  flex: 0 0 217.45px;
  overflow: hidden;
  background: #dfe7ed;
}

.rula-doctors__photo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.rula-doctors__photo-frame {
  position: absolute;
  top: 18px;
  right: 18px;
  bottom: 18.45px;
  left: 18px;
  border: 1px solid rgb(255 255 255 / 38%);
  border-radius: 18px;
  opacity: 0.9;
  pointer-events: none;
}

.rula-doctors__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  width: 100%;
  height: auto;
  padding: 24px;
}

.rula-doctors__name {
  width: 100%;
  color: #1f3552;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 29px;
  text-align: center;
}

.rula-doctors__text {
  display: flex;
  align-items: center;
  width: 100%;
  color: #1f3552;
  font-size: 16px;
  font-weight: 400;
  line-height: 21px;
  text-align: center;
}

.rula-doctors__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 48px;
  padding: 12px 30px;
  border: 1px solid rgb(85 115 140 / 18%);
  border-radius: 12px;
  color: #1f3552;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
  transition: background-color 160ms ease, transform 160ms ease;
}

.rula-doctors__button:hover {
  color: #1f3552;
  background: #f7f8fa;
}

.rula-doctors__button:active {
  transform: translateY(1px);
}

.rula-doctors__nav {
  position: absolute;
  top: 238.34px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border: 1px solid rgb(85 115 140 / 18%);
  border-radius: 12px;
  transition: background-color 160ms ease, transform 160ms ease;
}

.rula-doctors__nav:hover {
  background: #ffffff;
}

.rula-doctors__nav:active {
  transform: translateY(1px);
}

.rula-doctors__nav img {
  display: block;
  width: 24px;
  height: 24px;
}

.rula-doctors__nav--prev {
  left: -72px;
}

.rula-doctors__nav--prev img {
  transform: rotate(180deg);
}

.rula-doctors__nav--next {
  right: -80px;
}

.rula-doctors__pagination {
  position: static;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 32px;
  flex: 0 0 14px;
  width: min(1200px, calc(100% - 48px));
  height: 14px;
  margin: 0 auto;
  padding: 0 0 0 calc((100% - 182px) / 2);
  line-height: 0;
  transform: none;
}





@media (max-width: 1023px) {
.rula-doctors {
    gap: 64px;
    padding: 64px 0 65px;
  }

.rula-doctors__intro {
    width: 100%;
    padding: 0 24px;
  }

  .rula-doctors__title {
    max-width: 320px;
    font-size: 28px;
    line-height: 37px;
  }

  .rula-doctors__subtitle {
    max-width: 382px;
    font-size: 16px;
    line-height: 21px;
  }

  .rula-doctors__subtitle-copy--desktop {
    display: none;
  }

  .rula-doctors__subtitle-copy--mobile {
    display: block;
  }

.rula-doctors__slider-shell {
    width: 100%;
    max-width: none;
    height: auto;
  }

.rula-doctors__card {
    flex: 0 0 320px;
    width: 320px;
    height: auto;
    margin-right: 12px;
    border-radius: 18px;
  }

  .rula-doctors__photo-wrap {
    height: 253px;
    flex-basis: 253px;
  }

  .rula-doctors__photo-frame {
    bottom: 18px;
  }

.rula-doctors__body {
    height: auto;
    padding: 24px;
  }

.rula-doctors__text {
  }

  .rula-doctors__nav {
    display: none;
  }

  .rula-doctors__pagination {
    align-self: center;
    width: 100%;
    max-width: none;
    padding-left: 116px;
  }
}

@media (max-width: 374px) {
  .rula-doctors__intro {
    padding-right: 16px;
    padding-left: 16px;
  }

  .rula-doctors__title {
    max-width: 292px;
    font-size: 25px;
    line-height: 33px;
  }

  .rula-doctors__subtitle {
    font-size: 15px;
    line-height: 20px;
  }

  .rula-doctors__card {
    flex-basis: calc(100vw - 48px);
    width: calc(100vw - 48px);
  }

  .rula-doctors__body {
    padding-right: 20px;
    padding-left: 20px;
  }

  .rula-doctors__pagination {
    padding-left: calc((100vw - 182px) / 2);
  }
}

.rula-consultation {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 64px;
  width: 100%;
  padding: 120px 0;
  overflow: hidden;
  background:
    linear-gradient(0deg, rgb(7 48 94 / 72%), rgb(7 48 94 / 72%)),
    url("../images/form-background.webp") center center / cover no-repeat;
  color: #ffffff;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
}

.rula-consultation,
.rula-consultation * {
  box-sizing: border-box;
}

.rula-consultation :where(h2, h3, p) {
  margin: 0;
}

.rula-consultation :where(a) {
  color: inherit;
  text-decoration: none;
}

.rula-consultation :where(button, input) {
  font-family: inherit;
}

.rula-consultation__top {
  display: flex;
  align-items: stretch;
  gap: 32px;
  width: min(1200px, calc(100% - 48px));
  height: auto;
}

.rula-consultation__form {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  justify-content: center;
  gap: 32px;
  width: 787px;
  height: auto;
  padding: 32px 64px;
  border-radius: 24px;
  background: #ffffff;
  color: #1f3552;
}

.rula-consultation__form-head {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

.rula-consultation__title {
  max-width: 659px;
  color: #1f3552;
  font-size: 32px;
  font-weight: 700;
  line-height: 43px;
}

.rula-consultation__subtitle {
  max-width: 659px;
  color: #6f8096;
  font-size: 18px;
  font-weight: 400;
  line-height: 24px;
}

.rula-consultation__fields {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.rula-consultation__field {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1px;
  width: 100%;
  height: 60px;
  padding: 8px 16px 8px 24px;
  border: 1px solid #0f6eb8;
  border-radius: 4px;
  background: #ffffff;
}

.rula-consultation__label {
  display: block;
  color: #bdbdbd;
  font-size: 14px;
  font-weight: 400;
  line-height: 19px;
}

.rula-consultation__input {
  display: block;
  width: 100%;
  height: 21px;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: #2f3135;
  font-size: 16px;
  font-weight: 400;
  line-height: 21px;
}

.rula-consultation__input::placeholder {
  color: #2f3135;
  opacity: 1;
}

.rula-consultation__field:focus-within {
  border-color: #0f6eb8;
  box-shadow: 0 0 0 2px rgb(15 110 184 / 12%);
}

.rula-consultation__submit-wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 24px;
  width: 100%;
}

.rula-consultation__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 64px;
  padding: 20px 24px;
  border: 0;
  border-radius: 12px;
  background: #ff7a12;
  box-shadow: 0 10px 24px rgb(255 122 18 / 28%);
  color: #ffffff;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
  cursor: pointer;
  transition: background-color 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.rula-consultation__submit:hover {
  background: #ff861f;
  box-shadow: 0 12px 28px rgb(255 122 18 / 32%);
}

.rula-consultation__submit:active {
  transform: translateY(1px);
}

.rula-consultation__message {
  margin-top: 12px;
  color: #1b7f4b;
  font-size: 15px;
  font-weight: 600;
  line-height: 22px;
}

.rula-consultation__message--error {
  color: #c8442c;
}

.rula-consultation__privacy {
  width: 100%;
  color: #98a4b7;
  font-size: 14px;
  font-weight: 400;
  line-height: 19px;
  text-align: center;
}

.rula-consultation__coordinator {
  display: flex;
  flex: 0 0 381px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
  width: 381px;
  height: auto;
  padding: 32px 42px;
  border: 1px solid rgb(255 255 255 / 18%);
  border-radius: 24px;
  background: rgb(255 255 255 / 12%);
  box-shadow: 0 12px 32px rgb(16 52 89 / 8%);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  text-align: center;
}

.rula-consultation__coordinator-photo {
  display: block;
  width: 174px;
  height: 173px;
  border-radius: 999px;
  object-fit: cover;
  object-position: center 0%;
}

.rula-consultation__coordinator-role {
  color: rgb(255 255 255 / 92%);
  font-size: 16px;
  font-weight: 400;
  line-height: 21px;
  text-align: center;
}

.rula-consultation__coordinator-name {
  width: 100%;
  color: #ffffff;
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
  text-align: center;
}

.rula-consultation__coordinator-text {
  width: 100%;
  color: rgb(255 255 255 / 90%);
  font-size: 16px;
  font-weight: 400;
  line-height: 21px;
  text-align: center;
}

.rula-consultation__contacts {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 100%;
}

.rula-consultation__contact {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: #ffffff;
  font-size: 16px;
  font-weight: 400;
  line-height: 21px;
}

.rula-consultation__contact img {
  display: block;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
}

.rula-consultation__benefits {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 32px;
  width: min(1200px, calc(100% - 48px));
}

/* Expose Netcat objects as direct grid children. */
.rula-consultation__benefits > .tpl-block-list-objects {
  display: contents;
}

.rula-consultation__benefit {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  min-width: 0;
  color: #ffffff;
}

.rula-consultation__benefit-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  border: 2px solid rgb(255 255 255 / 22%);
  border-radius: 999px;
}

.rula-consultation__benefit-icon img {
  display: block;
  width: 32px;
  height: 32px;
}

/*
 * Netcat can return an empty name for a selected list item. In that case the
 * component has no icon element at all, so keep the four standard benefits
 * visually complete with the same icon set used by the component.
 */
.rula-consultation__benefit:not(:has(.rula-consultation__benefit-icon))::before {
  display: block;
  flex: 0 0 68px;
  width: 68px;
  height: 68px;
  border: 2px solid rgb(255 255 255 / 22%);
  border-radius: 999px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 32px 32px;
  content: "";
}

.rula-consultation__benefits > .tpl-block-list-objects > .rula-consultation__benefit:nth-child(1)::before {
  background-image: url("../images/icons/form-menu.svg");
}

.rula-consultation__benefits > .tpl-block-list-objects > .rula-consultation__benefit:nth-child(2)::before {
  background-image: url("../images/icons/form-file-text.svg");
}

.rula-consultation__benefits > .tpl-block-list-objects > .rula-consultation__benefit:nth-child(3)::before {
  background-image: url("../images/icons/form-users.svg");
}

.rula-consultation__benefits > .tpl-block-list-objects > .rula-consultation__benefit:nth-child(4)::before {
  background-image: url("../images/icons/form-clock.svg");
}

.rula-consultation__benefit-copy {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.rula-consultation__benefit-copy h3, .rula-consultation__benefit-copy div {
  color: #ffffff;
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
}

.rula-consultation__benefit-copy p {
  color: #ffffff;
  font-size: 18px;
  font-weight: 400;
  line-height: 24px;
}

@media (max-width: 1023px) {
  .rula-consultation {
    gap: 32px;
    /* min-height: 2060px; */
    padding: 48px 0 42px;
    background-position: center top;
  }

  .rula-consultation__top {
    flex-direction: column;
    align-items: center;
    gap: 32px;
    width: 100%;
    height: auto;
  }

.rula-consultation__form {
    flex: none;
    gap: 32px;
    /* width: min(365px, calc(100vw - 48px)); */
    height: auto;
    padding: 32px 24px;
    border-radius: 24px;
  }

  .rula-consultation__form-head {
    /* min-height: 194px; */
  }

  .rula-consultation__title {
    font-size: 28px;
    line-height: 36px;
  }

  .rula-consultation__subtitle {
    font-size: 18px;
    line-height: 24px;
  }

.rula-consultation__submit-wrap {
  }

  .rula-consultation__submit {
    padding-right: 12px;
    padding-left: 12px;
    white-space: nowrap;
  }

  .rula-consultation__privacy {
    max-width: 310px;
    margin: 0 auto;
  }

.rula-consultation__coordinator {
    flex: none;
    /* width: min(365px, calc(100vw - 48px)); */
    height: auto;
    padding: 32px 24px;
  }

  .rula-consultation__coordinator-text {
    max-width: 304px;
  }

.rula-consultation__benefits {
    display: flex;
    flex-direction: column;
    gap: 40px;
    /* width: min(365px, calc(100vw - 48px)); */
  }

  .rula-consultation__benefit {
    display: grid;
    grid-template-columns: 68px minmax(0, 1fr);
    gap: 16px;
    width: 100%;
  }

  .rula-consultation__benefit-copy h3 {
    font-size: 24px;
    line-height: 32px;
  }

  .rula-consultation__benefit-copy p {
    font-size: 18px;
    line-height: 24px;
  }
}

@media (max-width: 374px) {
  .rula-consultation__form,
  .rula-consultation__coordinator,
  .rula-consultation__benefits {
    width: calc(100% - 32px);
  }

  .rula-consultation__form {
    padding-right: 18px;
    padding-left: 18px;
  }

  .rula-consultation__title {
    font-size: 25px;
    line-height: 33px;
  }

  .rula-consultation__subtitle,
  .rula-consultation__benefit-copy p {
    font-size: 16px;
    line-height: 22px;
  }

  .rula-consultation__benefit-copy h3 {
    font-size: 22px;
    line-height: 30px;
  }
}

.rula-reviews,
.rula-videos,
.rula-clinics,
.rula-modal {
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
  box-sizing: border-box;
}

.rula-reviews *,
.rula-videos *,
.rula-clinics *,
.rula-modal * {
  box-sizing: border-box;
}

.rula-reviews :where(h2, h3, p),
.rula-videos :where(h2, h3, p),
.rula-clinics :where(h2, h3, p),
.rula-modal :where(h2, h3, p) {
  margin: 0;
}

.rula-reviews :where(button),
.rula-videos :where(button),
.rula-modal :where(button) {
  font: inherit;
}

.rula-reviews,
.rula-videos,
.rula-clinics {
  background: #f5f7fa;
}

.rula-reviews {
  padding: 64px 0 48px;
}

.rula-reviews__inner,
.rula-videos__inner,
.rula-clinics__inner {
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
}

.rula-reviews__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
}

.rula-reviews__intro,
.rula-videos__intro,
.rula-clinics__intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.rula-reviews__intro {
  width: min(900px, 100%);
  gap: 15px;
}

.rula-reviews__eyebrow,
.rula-videos__eyebrow,
.rula-clinics__eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 35px;
  padding: 8px 16px;
  color: #0f6eb8;
  background: rgba(47, 127, 215, 0.04);
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
  white-space: nowrap;
}

.rula-reviews__title {
  max-width: 790px;
  color: #1f3552;
  font-size: 32px;
  font-weight: 700;
  line-height: 43px;
}

.rula-reviews__subtitle {
  max-width: 903px;
  color: #6f8096;
  font-size: 20px;
  font-weight: 400;
  line-height: 27px;
}

.rula-reviews__slider-shell,
.rula-videos__slider-shell {
  position: relative;
  width: 100%;
}

.rula-reviews__viewport,
.rula-videos__viewport {
  width: 100%;
  overflow: hidden;
}

.rula-reviews__wrapper,
.rula-videos__wrapper {
  align-items: stretch;
}

.rula-reviews__slide {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  width: 100%;
}

.rula-review-card {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  height: auto;
  padding: 24px;
  color: #6f8096;
  background: #ffffff;
  border: 1px solid rgba(18, 60, 101, 0.06);
  border-radius: 20px;
  box-shadow: 0 8px 24px rgba(27, 60, 99, 0.06);
}

.rula-review-card__head {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-bottom: 20px;
  border-bottom: 1px solid #ecf0f3;
}

.rula-review-card__date {
  color: #0d67ad;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}

.rula-review-card__author {
  color: #1f3552;
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
}

.rula-review-card__text {
  display: -webkit-box;
  overflow: hidden;
  color: #6f8096;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 10;
}

/* Текст отзыва приходит из админки абзацами — сбрасываем их отступы,
   иначе обрезка по строкам считает высоту неверно. */
.rula-review-card__text p {
  margin: 0 0 12px;
}

.rula-review-card__text p:last-child {
  margin-bottom: 0;
}

/* Развёрнутый отзыв: снимаем обрезку по строкам (сетка отзывов на /otzyvy/). */
.rula-review-card--expanded .rula-review-card__text {
  display: block;
  overflow: visible;
  -webkit-line-clamp: unset;
}

.rula-review-card__read {
  align-self: flex-start;
  margin-top: auto;
  padding: 0;
  color: #ff7a12;
  background: transparent;
  border: 0;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  cursor: pointer;
}

.rula-review-card__read:hover {
  color: #0d67ad;
}

.rula-reviews__nav {
  position: absolute;
  top: 260px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  padding: 12px;
  background: #f5f7fa;
  border: 1px solid rgba(85, 115, 140, 0.18);
  border-radius: 12px;
  cursor: pointer;
  transition: transform 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
}

.rula-reviews__nav:hover {
  background: #ffffff;
  border-color: rgba(13, 103, 173, 0.28);
}

.rula-reviews__nav:active {
  transform: translateY(1px);
}

.rula-reviews__nav img {
  width: 24px;
  height: 24px;
}

.rula-reviews__nav--prev {
  left: -72px;
}

.rula-reviews__nav--prev img {
  transform: rotate(180deg);
}

.rula-reviews__nav--next {
  right: -72px;
}

.rula-reviews__pagination,
.rula-videos__pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 32px;
  width: 100%;
  height: 14px;
}




.rula-videos {
  padding: 64px 0 120px;
}

.rula-videos__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
}

.rula-videos__intro {
  width: min(955px, 100%);
  gap: 15px;
}

.rula-videos__title {
  color: #1f3552;
  font-size: 48px;
  font-weight: 700;
  line-height: 56px;
}

.rula-videos__subtitle {
  max-width: 900px;
  color: #6f8096;
  font-size: 20px;
  font-weight: 400;
  line-height: 27px;
}

.rula-videos__slider-shell {
  display: flex;
  flex-direction: column;
  gap: 48px;
}

.rula-videos__slide {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  width: 100%;
}

/* Netcat wraps component objects in an additional service container. */
.rula-videos__slide > .tpl-block-list-objects {
  display: contents;
}

.rula-video-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  padding: 0;
  color: #1f3552;
  text-align: left;
  background: transparent;
  border: 0;
  cursor: pointer;
}

.rula-video-card__media {
  position: relative;
  display: block;
  width: 100%;
  height: 216px;
  overflow: hidden;
  border-radius: 16px;
  background: #16283d;
}

.rula-video-card__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
}

.rula-video-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rula-video-card__badge {
  position: absolute;
  top: 32px;
  left: 32px;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 35px;
  padding: 8px 16px;
  color: #ff7a12;
  background: rgba(255, 232, 217, 0.24);
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
}

.rula-video-card__play {
  position: absolute;
  right: 32px;
  bottom: 32px;
  z-index: 1;
  width: 48px;
  height: 48px;
  border: 1px solid rgba(255, 255, 255, 0.46);
  border-radius: 50%;
}

.rula-video-card__play::before {
  content: "";
  position: absolute;
  inset: 5px;
  /* background: #ffffff; */
  border-radius: 50%;
}

.rula-video-card__play::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 52%;
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 12px solid #1f3552;
  transform: translate(-35%, -50%);
}

.rula-video-card__title {
  display: block;
  color: #1f3552;
  font-size: 20px;
  font-weight: 400;
  line-height: 27px;
}

.rula-video-card:hover .rula-video-card__media img {
  transform: scale(1.03);
}

.rula-video-card__media img,
.rula-video-card__play {
  transition: transform 0.25s ease;
}

.rula-video-card:hover .rula-video-card__play {
  transform: scale(1.04);
}

.rula-clinics {
  padding: 32px 0 80px;
}

.rula-clinics__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 64px;
}

.rula-clinics__intro {
  width: 100%;
  gap: 12px;
}

.rula-clinics__title {
  color: #1f3552;
  font-size: 48px;
  font-weight: 700;
  line-height: 56px;
}

.rula-clinics__subtitle {
  max-width: 884px;
  color: #6f8096;
  font-size: 20px;
  font-weight: 400;
  line-height: 27px;
}

/* Страница «Клиники»: заголовок страницы даёт макет 12, поэтому вступление
   блока выравнивается по левому краю, а не по центру, как на главной. */
.rula-clinics--list .rula-clinics__intro {
  align-items: flex-start;
  text-align: left;
}

.rula-clinics__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 64px 32px;
  width: 100%;
}

/* Кнопка «Все клиники» под сеткой на главной. */
.rula-clinics__actions {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: 48px;
}

.rula-clinics__more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  padding: 16px 40px;
  color: #0f6eb8;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  background: #ffffff;
  border: 1px solid rgb(15 110 184 / 24%);
  border-radius: 12px;
  transition: background 0.2s ease;
}

.rula-clinics__more:hover {
  color: #0f6eb8;
  background: #f1f6fc;
}

.rula-clinic-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: auto;
  background: #ffffff;
  border: 1px solid rgba(18, 60, 101, 0.06);
  border-radius: 20px;
}

.rula-clinic-card__image-wrap {
  position: relative;
  width: 100%;
  height: 289px;
  overflow: hidden;
}

.rula-clinic-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rula-clinic-card__frame {
  position: absolute;
  inset: 20px;
  border: 1px solid rgba(255, 255, 255, 0.64);
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0.14) 1.12%, rgba(255, 255, 255, 0) 1.12%, rgba(255, 255, 255, 0) 31.46%);
  opacity: 0.55;
  pointer-events: none;
}

.rula-clinic-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 24px;
  padding: 23px 24px 0;
}

.rula-clinic-card__title {
  color: #1f3552;
  font-size: 24px;
  font-weight: 700;
  line-height: 29px;
}

/* Картинка карточки — тоже ссылка на страницу клиники. */
.rula-clinic-card__image-link {
  display: block;
  width: 100%;
  height: 100%;
}

/* Заголовок карточки — ссылка на страницу клиники. */
.rula-clinic-card__title a {
  color: inherit;
  transition: color 0.2s ease;
}

.rula-clinic-card__title a:hover {
  color: #0f6eb8;
}

.rula-clinic-card__text {
  color: #6f8096;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.rula-clinic-card__stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: auto;
}

.rula-clinic-card__stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 78px;
  padding: 12px;
  color: #0d67ad;
  text-align: center;
  background: #eff5fc;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 18px;
}

.rula-clinic-card__stat strong {
  color: #0d67ad;
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
}

.rula-clinic-card__stat span {
  color: #0d67ad;
  font-size: 14px;
  font-weight: 700;
  line-height: 16px;
}

.rula-clinic-card__link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: calc(100% - 48px);
  height: 56px;
  margin: 24px;
  color: #1f3552;
  text-decoration: none;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
}

.rula-clinic-card__link:hover {
  text-decoration: underline;
  color: #1f3552;
}

.rula-clinic-card__link img {
  width: 24px;
  height: 24px;
}

/* Шапка страницы клиники. Отличается от баннера услуги: светлый фон и большое
   фото клиники слева, а не тёмная подложка с текстом поверх. */
.rula-clinic-hero {
  padding: 40px 24px 64px;
  background: #f5f7fa;
}

/* Крошки и заголовок даёт макет — шапка клиники начинается сразу под ним. */
.rula-internal-head + .rula-clinic-hero {
  padding-top: 28px;
}

.rula-clinic-hero__inner {
  display: flex;
  flex-direction: column;
  gap: 32px;
  width: min(1200px, 100%);
  margin: 0 auto;
}

.rula-clinic-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: 48px;
}

.rula-clinic-hero__media {
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  box-shadow: 0 12px 32px rgba(16, 52, 89, 0.12);
}

.rula-clinic-hero__media img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.rula-clinic-hero__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
}

.rula-clinic-hero__text {
  margin: 0;
  color: #6f8096;
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
}

.rula-clinic-hero__facts {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.rula-clinic-hero__facts li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  color: #1f3552;
  font-size: 16px;
  line-height: 22px;
}

.rula-clinic-hero__facts img {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  margin-top: 1px;
}

.rula-clinic-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 4px;
}

.rula-clinic-hero__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 56px;
  padding: 16px 28px;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.rula-clinic-hero__button--primary {
  color: #ffffff;
  background: var(--rula-orange, #ff7a12);
}

.rula-clinic-hero__button--primary:hover {
  box-shadow: 0 10px 24px rgb(255 122 18 / 28%);
}

.rula-clinic-hero__button--secondary {
  color: #0f6eb8;
  background: #ffffff;
  border: 1px solid rgb(15 110 184 / 24%);
}

.rula-clinic-hero__button--secondary:hover {
  background: #f1f6fc;
}

/* Контакты клиники */
.rula-clinic-contacts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
  padding: 28px 32px;
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0 8px 24px rgba(27, 60, 99, 0.06);
}

.rula-clinic-contacts__item {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.rula-clinic-contacts__label {
  color: #6f8096;
  font-size: 14px;
  font-weight: 600;
  line-height: 19px;
}

.rula-clinic-contacts__value {
  color: #1f3552;
  font-size: 17px;
  font-weight: 700;
  line-height: 24px;
  word-break: break-word;
}

.rula-clinic-contacts__value a {
  color: #0f6eb8;
}

.rula-clinic-contacts__value a:hover {
  text-decoration: underline;
}

@media (max-width: 1023px) {
  .rula-clinic-hero__grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .rula-clinic-contacts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .rula-clinic-hero {
    padding: 24px 16px 48px;
  }

  .rula-clinic-hero__text {
    font-size: 16px;
    line-height: 24px;
  }

  .rula-clinic-contacts {
    grid-template-columns: 1fr;
    padding: 22px;
  }
}

/* Блок «Как добраться»: адрес клиники и карта прямо на странице. */
.rula-clinic-map {
  padding: 0 24px 64px;
  background: #f5f7fa;
}

.rula-clinic-map__inner {
  display: grid;
  grid-template-columns: minmax(0, 380px) minmax(0, 1fr);
  gap: 32px;
  align-items: stretch;
  width: min(1200px, 100%);
  margin: 0 auto;
  padding: 28px;
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0 8px 24px rgba(27, 60, 99, 0.06);
}

.rula-clinic-map__info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.rula-clinic-map__title {
  margin: 0;
  color: #1f3552;
  font-size: 28px;
  font-weight: 700;
  line-height: 36px;
}

.rula-clinic-map__list {
  display: grid;
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.rula-clinic-map__label {
  display: block;
  color: #6f8096;
  font-size: 14px;
  font-weight: 600;
  line-height: 19px;
}

.rula-clinic-map__value {
  display: block;
  color: #1f3552;
  font-size: 17px;
  font-weight: 700;
  line-height: 24px;
  word-break: break-word;
}

.rula-clinic-map__value a {
  color: #0f6eb8;
}

.rula-clinic-map__value a:hover {
  text-decoration: underline;
}

.rula-clinic-map__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  margin-top: auto;
  padding: 12px 24px;
  color: #0f6eb8;
  background: #f1f6fc;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  transition: background-color 0.2s ease;
}

.rula-clinic-map__button:hover {
  background: #e3ecf6;
}

.rula-clinic-map__frame {
  position: relative;
  min-height: 320px;
  overflow: hidden;
  border-radius: 16px;
}

.rula-clinic-map__frame iframe {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 320px;
  border: 0;
}

@media (max-width: 1023px) {
  .rula-clinic-map__inner {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .rula-clinic-map__button {
    margin-top: 0;
  }
}

@media (max-width: 767px) {
  .rula-clinic-map {
    padding: 0 16px 48px;
  }

  .rula-clinic-map__inner {
    padding: 20px;
  }

  .rula-clinic-map__title {
    font-size: 24px;
    line-height: 32px;
  }

  .rula-clinic-map__frame,
  .rula-clinic-map__frame iframe {
    min-height: 260px;
  }
}

/* Простой перечень: отделения клиники, специализированные центры.
   В отличие от акцентного списка — без рамки и галочек, в несколько колонок. */
.rula-clinic-list {
  padding: 64px 24px;
  background: #f5f7fa;
}

.rula-clinic-list + .rula-clinic-list {
  padding-top: 0;
}

.rula-clinic-list__inner {
  width: min(1200px, 100%);
  margin: 0 auto;
}

.rula-clinic-list__intro {
  max-width: 850px;
  margin: 0 auto 36px;
  text-align: center;
}

.rula-clinic-list__title {
  margin: 0 0 12px;
  color: #1f3552;
  font-size: 36px;
  font-weight: 700;
  line-height: 44px;
}

.rula-clinic-list__subtitle {
  margin: 0;
  color: #62758e;
  font-size: 18px;
  line-height: 1.55;
}

.rula-clinic-list__items {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Плитки в палитре блока услуг: светло-синяя подложка и скругление 20px. */
.rula-clinic-list__items li {
  display: flex;
  align-items: center;
  min-height: 88px;
  padding: 20px 24px;
  color: #1f3552;
  background: rgba(47, 127, 215, 0.12);
  border-radius: 20px;
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
  transition: background-color 0.2s ease, transform 0.2s ease;
}

.rula-clinic-list__items li:hover {
  background: rgba(47, 127, 215, 0.18);
  transform: translateY(-2px);
}

@media (max-width: 1023px) {
  .rula-clinic-list__items {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rula-clinic-list__title {
    font-size: 28px;
    line-height: 36px;
  }
}

@media (max-width: 767px) {
  .rula-clinic-list {
    padding: 48px 16px;
  }

  .rula-clinic-list__items {
    grid-template-columns: 1fr;
  }

  .rula-clinic-list__items li {
    min-height: 72px;
    padding: 18px 20px;
    font-size: 17px;
  }
}

/* Страница врача: та же шапка, что у клиники, но с портретом. */
.rula-clinic-hero--doctor .rula-clinic-hero__grid {
  grid-template-columns: minmax(0, 360px) minmax(0, 1fr);
  align-items: start;
}

.rula-clinic-hero--doctor .rula-clinic-hero__media img {
  aspect-ratio: 3 / 4;
}

.rula-copy--doctor {
  padding: 64px 0 72px;
}

.rula-reviews-page--compact {
  padding-top: 0;
}

.rula-reviews-page--compact .rula-reviews-page__title {
  font-size: 36px;
  line-height: 44px;
}

@media (max-width: 1023px) {
  .rula-clinic-hero--doctor .rula-clinic-hero__grid {
    grid-template-columns: 1fr;
  }

  .rula-clinic-hero--doctor .rula-clinic-hero__media {
    max-width: 320px;
  }
}

/* Страница врачей: те же карточки, что в блоке-карусели, но сеткой. */
.rula-doctors-page {
  padding: 40px 24px 96px;
  background: #f5f7fa;
}

.rula-internal-head + .rula-doctors-page {
  padding-top: 28px;
}

.rula-doctors-page__inner {
  width: min(1200px, 100%);
  margin: 0 auto;
}

.rula-doctors-page__intro {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 760px;
  margin-bottom: 36px;
}

.rula-doctors-page__title {
  margin: 0;
  color: #1f3552;
  font-size: 36px;
  font-weight: 700;
  line-height: 44px;
}

.rula-doctors-page__subtitle {
  margin: 0;
  color: #62758e;
  font-size: 18px;
  line-height: 1.55;
}

.rula-doctors-page__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
  align-items: stretch;
}

.rula-doctors__card--grid {
  flex: 1 1 auto;
  width: 100%;
  height: 100%;
  margin-right: 0;
  border: 1px solid rgba(18, 60, 101, 0.06);
  box-shadow: 0 8px 24px rgba(27, 60, 99, 0.06);
}

.rula-doctors__card--grid .rula-doctors__body {
  flex: 1 1 auto;
}

.rula-doctors__card--grid .rula-doctors__button {
  margin-top: auto;
}

.rula-doctors__card--grid .rula-doctors__name a {
  color: inherit;
}

.rula-doctors__card--grid .rula-doctors__name a:hover {
  color: #0f6eb8;
}

@media (max-width: 1199px) {
  .rula-doctors-page__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1023px) {
  .rula-doctors-page__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rula-doctors-page__title {
    font-size: 28px;
    line-height: 36px;
  }
}

@media (max-width: 767px) {
  .rula-doctors-page {
    padding: 24px 16px 64px;
  }

  .rula-doctors-page__grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
}

/* Страница контактов: карточки координаторов и сотрудников. */
.rula-contacts {
  padding: 64px 24px;
  background: #f5f7fa;
}

.rula-contacts--plain {
  background: #f5f7fa;
}

.rula-contacts__inner {
  width: min(1200px, 100%);
  margin: 0 auto;
}

.rula-contacts__intro {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 760px;
  margin-bottom: 36px;
}

.rula-contacts__title {
  margin: 0;
  color: #1f3552;
  font-size: 36px;
  font-weight: 700;
  line-height: 44px;
}

.rula-contacts__subtitle {
  margin: 0;
  color: #62758e;
  font-size: 18px;
  line-height: 1.55;
}

.rula-contacts__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  align-items: start;
}

.rula-contacts--plain .rula-contacts__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.rula-contact-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: 100%;
  padding: 28px;
  background: #ffffff;
  border: 1px solid rgba(18, 60, 101, 0.06);
  border-radius: 20px;
  box-shadow: 0 8px 24px rgba(27, 60, 99, 0.06);
}

.rula-contact-card__head {
  display: flex;
  align-items: center;
  gap: 16px;
}

.rula-contact-card__photo {
  flex: 0 0 88px;
  width: 88px;
  height: 88px;
  object-fit: cover;
  object-position: center top;
  border-radius: 50%;
  background: #dfe7ed;
}

.rula-contact-card__ident {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  min-width: 0;
}

.rula-contact-card__role {
  align-self: flex-start;
  padding: 6px 14px;
  color: #0f6eb8;
  background: rgb(47 127 215 / 8%);
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
}

.rula-contact-card__name {
  margin: 0;
  color: #1f3552;
  font-size: 20px;
  font-weight: 700;
  line-height: 28px;
}

.rula-contact-card__note {
  margin: 0;
  color: #6f8096;
  font-size: 16px;
  line-height: 24px;
}

.rula-contact-card__list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 4px 0 0;
  padding: 0;
  list-style: none;
}

.rula-contact-card__list li {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 16px;
  line-height: 24px;
}

.rula-contact-card__label {
  color: #6f8096;
}

.rula-contact-card__list a {
  color: #0f6eb8;
  font-weight: 600;
}

.rula-contact-card__list a:hover {
  text-decoration: underline;
}

@media (max-width: 1023px) {
  .rula-contacts__grid,
  .rula-contacts--plain .rula-contacts__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rula-contacts__title {
    font-size: 28px;
    line-height: 36px;
  }
}

@media (max-width: 767px) {
  .rula-contacts {
    padding: 48px 16px;
  }

  .rula-contacts__grid,
  .rula-contacts--plain .rula-contacts__grid {
    grid-template-columns: 1fr;
  }

  .rula-contact-card {
    padding: 22px 18px;
  }
}

/* Страница отзывов: те же карточки, что в блоке на страницах услуг,
   но сеткой, без карусели. */
.rula-reviews-page {
  padding: 48px 24px 96px;
  background: #f5f7fa;
}

.rula-reviews-page__inner {
  width: min(1200px, 100%);
  margin: 0 auto;
}

.rula-reviews-page__breadcrumbs {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 28px;
  color: #6f8096;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
}

.rula-reviews-page__breadcrumbs a {
  color: #6f8096;
  text-decoration: underline;
}

.rula-reviews-page__breadcrumbs a:hover {
  color: #0f6eb8;
}

.rula-reviews-page__breadcrumbs span[aria-current] {
  color: var(--rula-orange, #ff7a12);
}

.rula-reviews-page__intro {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  max-width: 850px;
  margin: 0 0 44px;
}

/* Заголовок отдаёт макет, поэтому секция начинается сразу под ним. */
.rula-internal-head + .rula-reviews-page {
  padding-top: 28px;
}

.rula-reviews-page__title {
  margin: 0;
  color: #1f3552;
  font-size: 48px;
  font-weight: 700;
  line-height: 56px;
}

.rula-reviews-page__subtitle {
  margin: 0;
  color: #62758e;
  font-size: 18px;
  line-height: 1.55;
}

.rula-reviews-page__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  margin-top: 8px;
  padding: 16px 32px;
  color: #ffffff;
  background: var(--rula-orange, #ff7a12);
  border: 0;
  border-radius: 12px;
  font-family: inherit;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  cursor: pointer;
  transition: box-shadow 0.2s ease;
}

.rula-reviews-page__button:hover {
  box-shadow: 0 10px 24px rgb(255 122 18 / 28%);
}

/* Поле с многострочным текстом в форме отзыва (модалка). */
.rula-consultation__field--textarea {
  height: auto;
  padding-top: 10px;
  padding-bottom: 12px;
}

.rula-consultation__textarea {
  height: auto;
  min-height: 132px;
  margin-top: 4px;
  font-family: inherit;
  line-height: 22px;
  resize: vertical;
}

.rula-reviews-page__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  align-items: start;
}

/* Строка «Клиника» / «Услуга» под текстом отзыва */
.rula-review-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  padding-top: 16px;
  border-top: 1px solid #ecf0f3;
  font-size: 15px;
  line-height: 21px;
}

.rula-review-card__meta-label {
  color: #6f8096;
}

.rula-review-card__meta a {
  color: #0f6eb8;
  font-weight: 600;
}

.rula-review-card__meta a:hover {
  text-decoration: underline;
}

.rula-reviews-page__pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-top: 48px;
}

.rula-reviews-page__page {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  padding: 0 12px;
  color: #1f3552;
  background: #ffffff;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.rula-reviews-page__page:hover {
  background: #e3ecf6;
  color: #0f6eb8;
}

.rula-reviews-page__page--current {
  color: #ffffff;
  background: #2f7fd7;
}

/* Разметка, которую отдаёт сам Netcat (browse_messages и мета-строки отзыва):
   переиспользуем оформление новых классов, не меняя вывод компонента. */
.rula-review-card__metas {
  display: contents;
}

.rula-reviews-page__total {
  margin-top: 40px;
  color: #6f8096;
  font-size: 15px;
  line-height: 21px;
  text-align: center;
}

.rula-reviews-page__pagination .uss_page_num {
  display: contents;
}

.rula-reviews-page__pagination .uss_page {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  color: #ffffff;
  background: #2f7fd7;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
}

.rula-reviews-page__pagination .uss_page:has(a) {
  color: #1f3552;
  background: #ffffff;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.rula-reviews-page__pagination .uss_page:has(a):hover {
  background: #e3ecf6;
  color: #0f6eb8;
}

.rula-reviews-page__pagination .uss_page > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 44px;
  padding: 0 12px;
  color: inherit;
}

@media (max-width: 1023px) {
  .rula-reviews-page__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rula-reviews-page__title {
    font-size: 34px;
    line-height: 42px;
  }

  .rula-internal-head__title {
    font-size: 34px;
    line-height: 42px;
  }
}

@media (max-width: 767px) {
  .rula-reviews-page {
    padding: 32px 16px 64px;
  }

  .rula-reviews-page__grid {
    grid-template-columns: 1fr;
  }

  .rula-reviews-page__title {
    font-size: 28px;
    line-height: 36px;
  }

  .rula-internal-head {
    padding: 20px 16px 0;
  }

  .rula-internal-head__title {
    margin-top: 12px;
    font-size: 28px;
    line-height: 36px;
  }
}

.rula-clinics-cluster {
  display: flex;
  flex-direction: column;
  gap: 48px;
  width: 100%;
  padding: 48px;
  color: #ffffff;
  background: linear-gradient(0deg, rgba(10, 84, 142, 0.75), rgba(10, 84, 142, 0.75)), url("../images/clinics-bg.webp") center / cover no-repeat;
  border-radius: 20px;
}

.rula-clinics-cluster__title {
  color: #ffffff;
  font-size: 30px;
  font-weight: 700;
  line-height: 36px;
}

.rula-clinics-cluster__copy {
  display: block;
}

.rula-clinics-cluster__copy p {
  color: rgba(255, 255, 255, 0.92);
  font-size: 18px;
  font-weight: 400;
  line-height: 24px;
}

.rula-clinics-cluster__stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
  margin-top: auto;
}

.rula-clinics-cluster__stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px;
  text-align: center;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 12px;
}

.rula-clinics-cluster__stat strong {
  color: #ffffff;
  font-size: 32px;
  font-weight: 700;
  line-height: 43px;
}

.rula-clinics-cluster__stat span {
  color: rgba(255, 255, 255, 0.86);
  font-size: 15px;
  font-weight: 400;
  line-height: 22px;
}

/* Standalone Netcat infoblock has no .rula-clinics__inner container. */
.tpl-component-233 .rula-clinics-cluster {
  width: min(1200px, calc(100% - 48px));
  margin: 64px auto 80px;
}

.rula-modal[hidden] {
  display: none !important;
}

.rula-modal-lock {
  overflow: hidden;
}

.rula-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.rula-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(1, 1, 1, 0.58);
}

.rula-modal__dialog {
  position: relative;
  z-index: 1;
  width: min(1390px, 100%);
  max-height: calc(100dvh - 48px);
  overflow: auto;
  padding: 40px;
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0 24px 80px rgba(22, 40, 61, 0.24);
}

.rula-modal__title {
  margin-bottom: 15px !important;
}

.rula-modal__close {
  position: absolute;
  top: 16px;
  right: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  background: #1f3552;
  border: 0;
  border-radius: 10px;
  cursor: pointer;
}

.rula-modal__close img {
  width: 20px;
  height: 20px;
}

.rula-modal__content {
  color: #1f3552;
}

.rula-modal--consultation .rula-modal__dialog {
  width: min(760px, 100%);
  padding: 0;
  overflow: auto;
}

.rula-modal--consultation .rula-consultation__form {
  width: 100%;
  max-width: none;
  padding: 44px 48px;
  border-radius: 20px;
}

.rula-modal--consultation .rula-consultation__form-head {
  padding-right: 48px;
}

.rula-page.rula-service-page .rula-modal--consultation .rula-consultation__title,
.rula-modal--consultation .rula-consultation__title {
  max-width: 560px;
  font-size: 32px;
  line-height: 42px;
}

.rula-modal__kicker {
  margin-bottom: 8px;
  color: #0d67ad;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}

.rula-modal__title {
  margin: 0 44px 20px 0;
  color: #1f3552;
  font-size: 30px;
  font-weight: 700;
  line-height: 38px;
}

.rula-modal__text {
  color: #6f8096;
  font-size: 17px;
  font-weight: 400;
  line-height: 27px;
  white-space: pre-line;
}

.rula-modal__video {
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #010101;
  border-radius: 16px;
}

.rula-modal__video iframe {
  width: 100%;
  height: 100%;
  border: 0;
}

@media (max-width: 1343px) {
  .rula-reviews__nav {
    display: none;
  }
}

@media (max-width: 1023px) {
  .rula-reviews {
    padding: 72px 0 48px;
  }

  .rula-reviews__inner,
  .rula-videos__inner,
  .rula-clinics__inner {
    /* width: min(365px, calc(100vw - 48px)); */
  }

  .rula-reviews__inner {
    gap: 48px;
  }

  .rula-reviews__intro {
    gap: 16px;
  }

  .rula-reviews__title {
    max-width: 365px;
    font-size: 30px;
    line-height: 38px;
  }

  .rula-reviews__subtitle {
    max-width: 365px;
    font-size: 18px;
    line-height: 24px;
  }

  .rula-reviews__slide {
    display: flex;
    flex-direction: column;
    gap: 26px;
  }

.rula-review-card {
    height: auto;
    padding: 20px 18px;
    gap: 18px;
    border-radius: 18px;
  }

  .rula-review-card__head {
    gap: 8px;
    padding-bottom: 0;
    border-bottom: 0;
  }

  .rula-review-card__text {
    -webkit-line-clamp: 5;
  }

  .rula-reviews__pagination,
  .rula-videos__pagination {
    gap: 28px;
  }

  .rula-videos {
    padding: 48px 0 64px;
  }

  .rula-videos__inner {
    gap: 48px;
  }

  .rula-videos__intro {
    gap: 18px;
  }

  .rula-videos__title {
    max-width: 365px;
    font-size: 30px;
    line-height: 38px;
  }

  .rula-videos__subtitle {
    max-width: 365px;
    font-size: 20px;
    line-height: 27px;
  }

  .rula-videos__slider-shell {
    gap: 48px;
  }

  .rula-videos__slide {
    display: flex;
    flex-direction: column;
    gap: 25px;
  }

  .rula-video-card {
    gap: 17px;
  }

  .rula-video-card__media {
    height: 206px;
    border-radius: 14px;
  }

  .rula-video-card__badge {
    top: 24px;
    left: 24px;
  }

  .rula-video-card__play {
    right: 24px;
    bottom: 32px;
  }

  .rula-clinics {
    padding: 32px 0 48px;
  }

  .rula-clinics__inner {
    gap: 48px;
  }

  .rula-clinics__intro {
    gap: 12px;
  }

  .rula-clinics__title {
    max-width: 365px;
    font-size: 30px;
    line-height: 38px;
  }

  .rula-clinics__subtitle {
    max-width: 365px;
    font-size: 16px;
    line-height: 22px;
  }

  .rula-clinics__grid {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

.rula-clinic-card {
    position: relative;
    height: auto;
    border-radius: 18px;
  }

  .rula-clinic-card--barmbek {
    order: -1;
  }

  .rula-clinic-card__image-wrap {
    height: 139px;
  }

  .rula-clinic-card__frame {
    inset: 12px 18px;
    border-radius: 14px;
  }

  .rula-clinic-card__body {
    gap: 8px;
    padding: 20px 64px 20px 24px;
  }

  .rula-clinic-card__title {
    font-size: 24px;
    line-height: 29px;
  }

  .rula-clinic-card__text {
    display: -webkit-box;
    overflow: hidden;
    font-size: 16px;
    line-height: 22px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }

  .rula-clinic-card__stats {
    display: none;
  }

  .rula-clinic-card__link {
    position: absolute;
    right: 22px;
    bottom: 57px;
    width: 32px;
    height: 32px;
    margin: 0;
    padding: 0;
  }

  .rula-clinic-card__link span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }

  .rula-clinic-card__link img {
    width: 24px;
    height: 24px;
  }

.rula-clinics-cluster {
    gap: 24px;
    padding: 24px;
    background-position: center;
    border-radius: 18px;
  }

  .rula-clinics-cluster__title {
    font-size: 30px;
    line-height: 36px;
  }

  .rula-clinics-cluster__copy {
    display: flex;
    flex-direction: column;
    gap: 18px;
  }

  .rula-clinics-cluster__copy p {
    font-size: 16px;
    line-height: 22px;
  }

  .rula-clinics-cluster__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    margin-top: auto;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 12px;
  }

.rula-clinics-cluster__stat {
    padding: 14px 8px;
    border: 0;
    border-radius: 0;
  }

  .rula-clinics-cluster__stat:nth-child(odd) {
    border-right: 1px solid rgba(255, 255, 255, 0.14);
  }

  .rula-clinics-cluster__stat:nth-child(-n + 2) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  }

  .rula-clinics-cluster__stat strong {
    font-size: 28px;
    line-height: 34px;
  }

  .rula-clinics-cluster__stat span {
    font-size: 14px;
    line-height: 20px;
  }

  .rula-modal {
    padding: 16px;
  }

  .rula-modal__dialog {
    max-height: calc(100dvh - 32px);
    padding: 32px 20px 24px;
    border-radius: 18px;
  }

  .rula-modal__title {
    margin-right: 48px;
    font-size: 24px;
    line-height: 31px;
  }

  .rula-modal__text {
    font-size: 16px;
    line-height: 24px;
  }
}

@media (max-width: 374px) {
  .rula-reviews__inner,
  .rula-videos__inner,
  .rula-clinics__inner {
    width: calc(100% - 32px);
  }

  .rula-reviews__title,
  .rula-videos__title,
  .rula-clinics__title,
  .rula-clinics-cluster__title {
    font-size: 27px;
    line-height: 35px;
  }

  .rula-review-card {
    padding-right: 16px;
    padding-left: 16px;
  }

  .rula-video-card__media {
    height: 190px;
  }

  .rula-clinic-card__body {
    padding-right: 56px;
  }
}

.rula-before-footer,
.rula-footer,
.rula-before-footer *,
.rula-footer * {
  box-sizing: border-box;
}

.rula-before-footer,
.rula-footer {
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif !important;
}

.rula-before-footer :where(p),
.rula-footer :where(h2, p, ul, li, address) {
  margin: 0;
  padding: 0;
}

.rula-footer :where(ul) {
  list-style: none;
}

.rula-footer :where(a) {
  color: inherit;
  text-decoration: none;
}

.rula-before-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 10px 0;
  background: #e1e6e9;
}

.rula-before-footer__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 32px;
  width: min(1200px, calc(100% - 48px));
}

.rula-before-footer__age {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  color: #a6bccd;
  border: 2px solid #a6bccd;
  border-radius: 50%;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
}

.rula-before-footer__age::after {
  content: "+";
  position: absolute;
  top: -8px;
  right: -7px;
  color: #a6bccd;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
}

.rula-before-footer__age-icon {
  display: block;
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  object-fit: contain;
}

.rula-before-footer__text {
  color: #a6bccd;
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
  text-transform: uppercase;
}

.rula-footer {
  width: 100%;
  padding: 64px 0 32px;
  color: #ffffff;
  background: #2a2a2a;
}

.rula-footer__inner {
  display: flex;
  flex-direction: column;
  gap: 32px;
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
}

.rula-footer__top {
  display: grid;
  grid-template-columns: 384px repeat(3, minmax(0, 1fr));
  gap: 24px;
  align-items: start;
  padding-bottom: 32px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.32);
}

.rula-footer__brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  width: 384px;
}

.rula-footer__logo {
  display: block;
  width: 240px;
  height: 50px;
}

.rula-footer__logo img {
  display: block;
  width: 240px;
  height: 50px;
  object-fit: contain;
}

.rula-footer__description {
  width: 303px;
  color: #ffffff;
  font-size: 16px;
  font-weight: 400;
  line-height: 21px;
}

.rula-footer__column {
  display: flex;
  flex-direction: column;
  gap: 20px;
  min-width: 0;
}

.rula-footer__heading {
  color: #ffffff;
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
}

.rula-footer__list,
.rula-footer__contact-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.rula-footer__list a {
  display: inline-flex;
  align-items: center;
  color: rgba(255, 255, 255, 0.92);
  font-size: 16px;
  font-weight: 400;
  line-height: 23px;
  transition: color 0.2s ease;
}

.rula-footer__list a:hover,
.rula-footer__legal a:hover,
a.rula-footer__contact:hover {
  color: #ffb173;
}

.rula-footer__contact-list {
  font-style: normal;
}

.rula-footer__contact {
  display: inline-flex;
  align-items: flex-start;
  gap: 12px;
  color: #ffffff;
  font-size: 16px;
  font-weight: 400;
  line-height: 21px;
  transition: color 0.2s ease;
}

.rula-footer__contact img {
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
}

.rula-footer__bottom {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 32px;
}

.rula-footer__copyright {
  justify-self: start;
  max-width: 500px;
  color: #ffffff;
  font-size: 13px;
  font-weight: 400;
  line-height: 19px;
}

.rula-footer__copyright span {
  display: block;
}

.rula-footer__copyright span + span {
  margin-top: 4px;
}

.rula-footer__legal {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  justify-self: center;
}

.rula-footer__legal a {
  color: #ffffff;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color 0.2s ease;
}

.rula-footer__tora {
  display: block;
  justify-self: end;
  width: 196px;
  height: 36px;
  border-radius: 18px;
}

.rula-footer__tora img {
  display: block;
  width: 196px;
  height: 36px;
}

@media (max-width: 1023px) {
.rula-before-footer {
    align-items: flex-start;
    padding: 24px 0 0;
  }

  .rula-before-footer__inner {
    /* width: min(365px, calc(100vw - 48px)); */
  }

  .rula-before-footer__text {
    display: none;
  }

.rula-footer {
    padding: 32px 0;
  }

  .rula-footer__inner {
    align-items: center;
    gap: 32px;
    /* width: min(365px, calc(100vw - 48px)); */
  }

  .rula-footer__top {
    display: flex;
    justify-content: center;
    width: 100%;
    padding-bottom: 32px;
  }

  .rula-footer__brand {
    align-items: center;
    width: 100%;
    gap: 24px;
    text-align: center;
  }

  .rula-footer__logo,
  .rula-footer__logo img {
    width: 240px;
    height: 50px;
  }

  .rula-footer__description {
    width: min(303px, 100%);
    font-size: 16px;
    line-height: 21px;
  }

  .rula-footer__column {
    display: none;
  }

.rula-footer__bottom {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
    text-align: center;
  }

  .rula-footer__copyright {
    justify-self: auto;
  }

  .rula-footer__legal {
    gap: 12px;
  }

  .rula-footer__tora {
    justify-self: auto;
  }
}

@media (max-width: 374px) {
  .rula-before-footer__inner,
  .rula-footer__inner {
    width: calc(100% - 32px);
  }
}

.rula-index-page,
.rula-index-page * {
  box-sizing: border-box;
}

.rula-index-page {
  width: 100%;
  min-width: 320px;
  overflow-x: hidden;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
}

.rula-index-page :where(h1, h2, p, ul, li) {
  margin: 0;
  padding: 0;
}

.rula-index-page :where(ul) {
  list-style: none;
}

.rula-index-page :where(a) {
  color: inherit;
  text-decoration: none;
}

.rula-index-banner {
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding: 80px 0;
  color: #ffffff;
  background: var(--rula-banner-background, url("../images/form-background.webp"))
    center 50% / cover no-repeat;
  background-position: center 50%;
  background-size: cover;
  background-repeat: no-repeat;
}

.rula-index-banner::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  background: rgba(7, 48, 94, 0.72);
  content: "";
  pointer-events: none;
}

.rula-index-banner__inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 32px;
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
}

.rula-index-banner__content {
  display: flex;
  flex: 1 1 784px;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  min-width: 0;
}

.rula-index-banner__title {
  display: flex;
  flex-direction: column;
  color: #ffffff;
  font-size: 64px;
  font-weight: 700;
  line-height: 85px;
}

.rula-index-banner__title span:first-child {
  margin-bottom: -12px;
}

.rula-index-banner__title span:last-child {
  color: #ff7a12;
}

.rula-index-banner__text {
  max-width: 784px;
  color: rgba(255, 255, 255, 0.94);
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
}

.rula-index-banner__actions {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
}

.rula-index-banner__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 64px;
  padding: 20px 24px;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
  white-space: nowrap;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.rula-index-banner__button img {
  display: none;
}

.rula-index-banner__button:active {
  transform: translateY(1px);
}

.rula-index-banner__button--primary {
  width: 250px;
  color: #ffffff;
  background: #ff7a12;
  box-shadow: 0 10px 24px rgba(255, 122, 18, 0.28);
}

.rula-index-banner__button--primary:hover {
  color: #ffffff;
  background: #f36c05;
  box-shadow: 0 12px 28px rgba(255, 122, 18, 0.34);
}

.rula-index-banner__button--primary:active {
  color: #ffffff;
  background: #df6000;
}

.rula-index-banner__button--secondary {
  width: 221px;
  color: #0f6eb8;
  background: #ffffff;
  border: 1px solid rgba(85, 115, 140, 0.18);
}

.rula-index-banner__button--secondary:hover {
  background: #eff5fc;
}

.rula-index-banner__stats {
  display: flex;
  align-items: flex-start;
  gap: 64px;
  width: 100%;
  padding-top: 32px;
}

.rula-index-banner__stat {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  min-width: 140px;
}

.rula-index-banner__stat-icon {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  border: 2px solid rgba(255, 255, 255, 0.22);
  border-radius: 36px;
}

.rula-index-banner__stat-icon img {
  width: 32px;
  height: 32px;
}

.rula-index-banner__stat-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.rula-index-banner__stat-copy strong {
  color: #ffffff;
  font-size: 48px;
  font-weight: 700;
  line-height: 64px;
}

.rula-index-banner__stat-copy span {
  margin-top: -4px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 18px;
  font-weight: 400;
  line-height: 24px;
}

.rula-index-banner__aside {
  display: flex;
  flex: 0 0 384px;
  flex-direction: column;
  gap: 24px;
  width: 384px;
  padding: 32px 24px;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 24px;
  box-shadow: 0 12px 32px rgba(16, 52, 89, 0.08);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.rula-index-banner__aside-title {
  color: #ffffff;
  font-size: 28px;
  font-weight: 700;
  line-height: 37px;
}

.rula-index-banner__list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.rula-index-banner__list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  color: rgba(255, 255, 255, 0.95);
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
}

.rula-index-banner__list img {
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  margin-top: 1px;
}

@media (max-width: 1240px) {
  .rula-index-banner__stats {
    gap: 36px;
  }
}

@media (max-width: 1023px) {
.rula-index-banner {
    align-items: flex-start;
    padding: 38px 0 32px;
    background-position: 47% center;
  }

  .rula-index-banner__inner {
    flex-direction: column;
    align-items: stretch;
    gap: 32px;
    /* width: min(366px, calc(100vw - 48px)); */
  }

  .rula-index-banner__content {
    flex: none;
    gap: 32px;
    width: 100%;
  }

  .rula-index-banner__title {
    font-size: 32px;
    line-height: 42px;
  }

  .rula-index-banner__title span:first-child {
    margin-bottom: 0;
  }

  .rula-index-banner__text {
    max-width: 340px;
    font-size: 16px;
    line-height: 24px;
  }

  .rula-index-banner__actions {
    flex-direction: column;
    gap: 16px;
  }

  .rula-index-banner__button {
    width: 100%;
    min-height: 56px;
    padding: 16px 20px;
  }

  .rula-index-banner__stats {
    flex-direction: column;
    gap: 26px;
    padding-top: 4px;
  }

  .rula-index-banner__stat {
    align-items: center;
    gap: 18px;
  }

  .rula-index-banner__stat-icon {
    width: 68px;
    height: 68px;
  }

  .rula-index-banner__stat-copy strong {
    font-size: 48px;
    line-height: 56px;
  }

  .rula-index-banner__stat-copy span {
    margin-top: 0;
    font-size: 18px;
    line-height: 24px;
  }

.rula-index-banner__aside {
    flex: none;
    width: 100%;
    padding: 32px 24px;
    border-radius: 24px;
  }

  .rula-index-banner__aside-title {
    font-size: 28px;
    line-height: 37px;
  }

  .rula-index-banner__list {
    gap: 16px;
  }

  .rula-index-banner__list li {
    font-size: 18px;
    line-height: 26px;
  }
}

@media (max-width: 374px) {
  .rula-index-banner__inner {
    width: calc(100% - 32px);
  }

  .rula-index-banner__title {
    font-size: 29px;
    line-height: 38px;
  }

  .rula-index-banner__aside {
    padding-right: 18px;
    padding-left: 18px;
  }

  .rula-index-banner__list li {
    font-size: 16px;
    line-height: 24px;
  }
}

.rula-index-why,
.rula-index-services,
.rula-index-question {
  background: #f5f7fa;
}

.rula-index-why {
  padding: 80px 0;
}

.rula-index-services {
  padding: 80px 0 120px;
}

.rula-index-why__inner,
.rula-index-services__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 64px;
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
}

.rula-index-section-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: min(900px, 100%);
  text-align: center;
}

.rula-index-section-head__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 35px;
  padding: 8px 16px;
  color: #0f6eb8;
  background: rgba(47, 127, 215, 0.04);
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
}

.rula-index-section-head__title {
  color: #1f3552;
  font-size: 56px;
  font-weight: 700;
  line-height: 74px;
  text-align: center;
}

.rula-index-section-head__text {
  max-width: 900px;
  color: #6f8096;
  font-size: 20px;
  font-weight: 400;
  line-height: 27px;
  text-align: center;
}

.rula-index-why__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  width: 100%;
}

.rula-index-why-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 32px 32px 48px;
  gap: 16px;
  color: #1f3552;
  background: #ffffff;
  border: 1px solid rgba(18, 60, 101, 0.05);
  border-radius: 20px;
  box-shadow: 0 8px 24px rgba(27, 60, 99, 0.06);
  text-align: center;
}

.rula-index-why-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 84px;
  height: 84px;
  background: #2f7fd7;
  border-radius: 50%;
  box-shadow: 0 10px 22px rgba(47, 127, 215, 0.22);
}

.rula-index-why-card__icon img {
  width: 32px;
  height: 32px;
  filter: brightness(0) invert(1);
}

.rula-index-why-card__title {
  max-width: 320px;
  color: #1f3552;
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
}

.rula-index-why-card__tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 35px;
  padding: 8px 16px;
  color: #ff7a12;
  background: #ffe8d9;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
  white-space: nowrap;
}

.rula-index-why-card__text {
  max-width: 318px;
  color: #6f8096;
  font-size: 18px;
  font-weight: 400;
  line-height: 24px;
}

.rula-index-why-card__link {
  display: none;
  color: #0f6eb8;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
}

.rula-index-why__stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 32px;
  width: 100%;
  padding: 32px 48px;
  background: #e3ecf6;
  border-radius: 20px;
}

.rula-index-why__stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-width: 0;
  padding: 0 8px;
  text-align: center;
}

.rula-index-why__stat strong {
  color: #1568c7;
  font-size: 48px;
  font-weight: 700;
  line-height: 64px;
}

.rula-index-why__stat span {
  color: #6f8096;
  font-size: 17px;
  font-weight: 400;
  line-height: 24px;
}

.rula-index-services__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  width: 100%;
}

.rula-index-service-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #ffffff;
  border-radius: 20px;
}

.rula-index-service-card__top {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 32px;
  overflow: hidden;
  background: rgba(47, 127, 215, 0.12);
}

.rula-index-service-card__head {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  color: inherit;
  text-decoration: none;
}

.rula-index-service-card__head:hover .rula-index-service-card__title {
  color: #0f6eb8;
}

/* Иконка выводится маской, а не картинкой: в списке иконок лежат и синие
   (index-services-*), и белые (steps-*, index-why-*, они рисуются для синих
   кружков). Маска игнорирует исходный цвет и красит любую иконку в один тон,
   поэтому и сама иконка, и её увеличенная копия в фоне выглядят одинаково. */
.rula-index-service-card__icon,
.rula-index-service-card__ghost {
  display: block;
  background-color: #2f7fd7;
  -webkit-mask-image: var(--rula-service-icon);
  mask-image: var(--rula-service-icon);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.rula-index-service-card__icon {
  position: relative;
  z-index: 2;
  width: 48px;
  height: 48px;
  margin-bottom: 16px;
}

.rula-index-service-card__ghost {
  position: absolute;
  right: 0;
  bottom: -27px;
  z-index: 1;
  width: 227px;
  height: 227px;
  opacity: 0.06;
}

.rula-index-service-card__title {
  position: relative;
  z-index: 2;
  margin-bottom: 12px;
  color: #1f3552;
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
}

.rula-index-service-card__text {
  position: relative;
  z-index: 2;
  max-width: 320px;
  color: #6f8096;
  font-size: 16px;
  font-weight: 400;
  line-height: 21px;
}

.rula-index-service-card__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  padding: 24px;
}

.rula-index-service-card__links {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  align-items: flex-start;
  gap: 24px;
}

.rula-index-service-card__links a {
  color: #a2a2a2;
  font-size: 18px;
  font-weight: 400;
  line-height: 20px;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.rula-index-question {
  padding: 0;
}

.rula-index-question__card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  width: min(1200px, calc(100% - 48px));
  min-height: 280px;
  margin: 0 auto;
  overflow: hidden;
  padding: 48px;
  isolation: isolate;
  color: #ffffff;
  background: linear-gradient(90deg, #2574c8 0%, #4b96e6 100%);
  border-radius: 18px;
  box-shadow: 0 12px 32px rgba(16, 52, 89, 0.08);
}

.rula-index-question__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  width: min(760px, 100%);
}

.rula-index-question__title {
  color: #ffffff;
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
}

.rula-index-question__text {
  max-width: 637px;
  margin-top: -16px;
  color: rgba(255, 255, 255, 0.92);
  font-size: 18px;
  font-weight: 400;
  line-height: 24px;
}

.rula-index-question__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 254px;
  height: 56px;
  min-height: 56px;
  padding: 16px 30px;
  color: #0f6eb8;
  background: #ffffff;
  border: 1px solid rgba(85, 115, 140, 0.18);
  border-radius: 12px;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
  white-space: nowrap;
  transition: transform 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.rula-index-question__button:hover {
  background: #f3f8fd;
  box-shadow: 0 8px 20px rgba(16, 52, 89, 0.08);
}

.rula-index-question__button:active {
  transform: translateY(1px);
}

.rula-index-question__doctor {
  position: absolute;
  right: 39px;
  bottom: 0;
  z-index: 3;
  width: 398px;
  height: auto;
  max-width: none;
  pointer-events: none;
}

/* Оформление блока видео задаётся настройкой «Оформление блока» у компонента 232
   и приходит модификатором на секции. Раньше тема определялась по контексту
   страницы (`.rula-index-page`, `:has(.rula-internal-breadcrumbs)`), из-за чего
   на внутренних страницах подписи карточек оставались белыми. */
.rula-videos--blue {
  background: linear-gradient(90deg, #2574c8 0%, #4b96e6 100%);
}

.rula-videos--blue .rula-videos__eyebrow {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.12);
}

.rula-videos--blue .rula-videos__title {
  color: #ffffff;
}

.rula-videos--blue .rula-videos__subtitle {
  color: rgba(255, 255, 255, 0.88);
}

.rula-videos--blue .rula-video-card__title {
  color: #ffffff;
}

.rula-index-steps {
  position: relative;
  left: 50%;
  width: 100vw;
  margin-left: -50vw;
  overflow: hidden;
  padding: 64px 0 120px;
  background: #f5f7fa;
}

.rula-index-steps__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
}

.rula-index-steps__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 100%;
  text-align: center;
}

.rula-index-steps__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 35px;
  padding: 8px 24px;
  color: #0f6eb8;
  background: rgba(47, 127, 215, 0.04);
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
}

.rula-index-steps__title {
  max-width: 848px;
  margin: 0;
  color: #1f3552;
  font-size: 48px;
  font-weight: 700;
  line-height: 64px;
  text-align: center;
}

.rula-index-steps__subtitle {
  max-width: 747px;
  color: #6f8096;
  font-size: 20px;
  font-weight: 400;
  line-height: 27px;
  text-align: center;
}

.rula-index-steps__timeline {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 528px) 120px minmax(0, 528px);
  align-items: center;
  width: 100%;
}

.rula-index-steps__timeline::before {
  content: "";
  position: absolute;
  top: 19px;
  bottom: 19px;
  left: 50%;
  width: 1px;
  background: #d8e8f8;
  transform: translateX(-50%);
}

.rula-index-steps__marker {
  position: relative;
  z-index: 3;
  display: inline-flex;
  grid-column: 1 / -1;
  align-items: center;
  justify-content: center;
  justify-self: center;
  min-height: 38px;
  margin: 0 0 48px;
  padding: 10px 28px;
  color: #0f6eb8;
  background: #ffffff;
  border-radius: 999px;
  box-shadow: 0 12px 28px rgba(47, 127, 215, 0.15);
  font-size: 14px;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
}

.rula-index-steps__item + .rula-index-steps__marker {
  margin-top: 36px;
}

.rula-index-steps__marker--last {
  margin: 36px 0 0;
}

.rula-index-steps__item {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 528px) 120px minmax(0, 528px);
  align-items: center;
}

.rula-index-steps__item--tall {
  min-height: 174px;
}

.rula-index-steps__item--large {
  min-height: 198px;
}

.rula-index-steps__item--left .rula-index-steps__card {
  grid-column: 1;
}

.rula-index-steps__item--right .rula-index-steps__card {
  grid-column: 3;
}

.rula-index-steps__node {
  position: relative;
  z-index: 2;
  display: flex;
  grid-column: 2;
  grid-row: 1;
  align-items: center;
  justify-content: center;
  justify-self: center;
  width: 80px;
  height: 80px;
  background: linear-gradient(135deg, #4b96e6 0%, #2574c8 100%);
  border-radius: 50%;
  box-shadow: 0 14px 30px rgba(37, 116, 200, 0.24);
}

.rula-index-steps__node img {
  width: 32px;
  height: 32px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}

.rula-index-steps__card {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 24px;
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(27, 60, 99, 0.06);
}

.rula-index-steps__card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
}

.rula-index-steps__number {
  color: #0f6eb8;
  font-size: 14px;
  font-weight: 700;
  line-height: 18px;
  text-transform: uppercase;
}

.rula-index-steps__time {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 74px;
  min-height: 32px;
  margin-top: -4px;
  padding: 8px 16px;
  color: #ff7a12;
  background: #ffe8d9;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  line-height: 16px;
  white-space: nowrap;
}

.rula-index-steps__card-title {
  max-width: 392px;
  margin: 8px 0 0;
  color: #1f3552;
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
}

.rula-index-steps__card-text {
  max-width: 446px;
  margin-top: 24px;
  color: #6f8096;
  font-size: 18px;
  font-weight: 400;
  line-height: 24px;
}

.rula-index-any-question {
  position: relative;
  left: 50%;
  width: 100vw;
  margin-left: -50vw;
  overflow: visible;
  overflow-x: clip;
  padding: 0;
  background: #f5f7fa;
}

.rula-index-any-question__card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  width: min(1200px, calc(100% - 48px));
  min-height: 280px;
  margin: 0 auto;
  overflow: hidden;
  padding: 48px;
  isolation: isolate;
  color: #ffffff;
  background: linear-gradient(90deg, #fb7d22 0%, #f39a58 100%);
  border-radius: 18px;
  box-shadow: 0 12px 32px rgba(16, 52, 89, 0.08);
}

.rula-index-question__card::before,
.rula-index-question__card::after,
.rula-index-any-question__card::before,
.rula-index-any-question__card::after {
  content: "";
  position: absolute;
  z-index: 0;
  border: 36px solid rgba(255, 255, 255, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

.rula-index-question__card::before,
.rula-index-any-question__card::before {
  top: -150px;
  right: -75px;
  width: 330px;
  height: 330px;
}

.rula-index-question__card::after,
.rula-index-any-question__card::after {
  right: 210px;
  bottom: -105px;
  width: 180px;
  height: 180px;
  border-width: 24px;
}

.rula-index-any-question__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  width: min(760px, 100%);
}

.rula-index-any-question__title {
  margin: 0;
  color: #ffffff;
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
}

.rula-index-any-question__text {
  max-width: 637px;
  color: rgba(255, 255, 255, 0.92);
  font-size: 18px;
  font-weight: 400;
  line-height: 24px;
}

.rula-index-any-question__button {
  position: relative;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 254px;
  height: 56px;
  min-height: 56px;
  padding: 16px 30px;
  color: #ffffff;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.47);
  border-radius: 12px;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
  white-space: nowrap;
  transition: transform 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.rula-index-any-question__button:hover {
  background: rgba(255, 255, 255, 0.2);
  box-shadow: 0 8px 20px rgba(16, 52, 89, 0.08);
}

.rula-index-any-question__button:active {
  transform: translateY(1px);
}

.rula-index-any-question__doctor {
  position: absolute;
  right: 39px;
  bottom: 0;
  z-index: 3;
  width: 398px;
  height: auto;
  max-width: none;
  pointer-events: none;
}

.rula-docs {
  overflow: hidden;
  padding: 80px 0;
  background: #f5f7fa;
  color: #1f3552;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
}

.rula-docs,
.rula-docs * {
  box-sizing: border-box;
}

.rula-docs :where(h2, h3, p) {
  margin: 0;
}

.rula-docs :where(button) {
  border: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font-family: inherit;
  cursor: pointer;
}

.rula-docs__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
}

.rula-docs__intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 100%;
  text-align: center;
}

.rula-docs__eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 35px;
  padding: 8px 16px;
  color: #0f6eb8;
  background: rgba(47, 127, 215, 0.04);
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
}

.rula-docs__title {
  max-width: 840px;
  color: #1f3552;
  font-size: 48px;
  font-weight: 700;
  line-height: 64px;
  text-align: center;
}

.rula-docs__subtitle {
  max-width: 843px;
  color: #6f8096;
  font-size: 20px;
  font-weight: 400;
  line-height: 27px;
  text-align: center;
}

.rula-docs__filters {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  margin-top: 4px;
}

.rula-docs__filter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 9px 22px;
  color: #6f8096;
  background: #ffffff;
  border: 1px solid rgba(85, 115, 140, 0.18);
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  line-height: 18px;
  white-space: nowrap;
  transition: border-color 0.2s ease, color 0.2s ease, background-color 0.2s ease;
}

.rula-docs__filter--active,
.rula-docs__filter:hover {
  color: #0f6eb8;
  border-color: #0f6eb8;
}

.rula-docs__slider-shell {
  position: relative;
  width: 100%;
  height: auto;
}

.rula-docs__viewport {
  width: 100%;
  height: auto;
  overflow: hidden;
  cursor: grab;
  scrollbar-width: none;
  -ms-overflow-style: none;
  touch-action: pan-x;
  user-select: none;
  -webkit-user-select: none;
}

.rula-docs__viewport::-webkit-scrollbar {
  display: none;
}

.rula-docs__viewport.is-dragging {
  cursor: grabbing;
  user-select: none;
}

.rula-docs__wrapper {
  display: flex;
  width: 100%;
  height: auto;
  transition: transform 320ms ease;
  will-change: transform;
}

.rula-docs__card {
  display: flex;
  flex: 0 0 220px;
  flex-direction: column;
  align-items: center;
  width: 220px;
  margin-right: 24px;
  user-select: none;
  -webkit-user-select: none;
}

.rula-docs__link {
  display: flex;
  flex-direction: column;
  align-items: center;
  color: inherit;
  text-decoration: none;
  cursor: zoom-in;
}

.rula-docs__link:hover {
  color: inherit;
}

.rula-docs__link:focus-visible {
  outline: 2px solid #0f6eb8;
  outline-offset: 5px;
  border-radius: 10px;
}

.rula-docs__wrapper--single {
  justify-content: center;
}


.rula-docs__image-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 220px;
  height: 303px;
  padding: 16px;
  overflow: hidden;
  background: linear-gradient(110deg, #e4ebf2 0%, #f4f1ed 100%);
  border-radius: 10px;
  transition: box-shadow 160ms ease;
}

@media (hover: hover) {
  .rula-docs__link:hover .rula-docs__image-wrap {
    box-shadow: 0 12px 28px rgba(27, 60, 99, 0.13);
  }
}

.rula-docs__image {
  display: block;
  width: 188px;
  height: 270px;
  object-fit: cover;
  border-radius: 7px;
  box-shadow: 0 8px 18px rgba(27, 60, 99, 0.08);
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
  -webkit-user-select: none;
}

.rula-docs__type {
  position: absolute;
  top: 28px;
  right: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 57px;
  min-height: 31px;
  padding: 8px 16px;
  color: #ff7a12;
  background: #ffe8d9;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  line-height: 15px;
  text-transform: uppercase;
}

.rula-docs__card-title {
  width: 220px;
  margin-top: 24px;
  color: #1f3552;
  font-size: 20px;
  font-weight: 700;
  line-height: 27px;
  text-align: center;
  user-select: none;
  -webkit-user-select: none;
}

.rula-docs__pagination {
  position: static;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 32px;
  width: 100%;
  height: 14px;
  line-height: 0;
  transform: none;
}





@media (max-width: 1023px) {
  .rula-index-steps {
    padding: 48px 0 64px;
  }

  .rula-index-steps__inner {
    gap: 32px;
    /* width: 366px; */
    max-width: calc(100% - 48px);
    margin-right: auto;
    margin-left: auto;
  }

  .rula-index-steps__head {
    gap: 12px;
  }

  .rula-index-steps__badge {
    min-height: 35px;
    padding: 8px 22px;
  }

  .rula-index-steps__title {
    max-width: 334px;
    font-size: 32px;
    line-height: 42px;
  }

  .rula-index-steps__subtitle {
    max-width: 322px;
    font-size: 16px;
    line-height: 24px;
  }

  .rula-index-steps__timeline {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .rula-index-steps__timeline::before {
    top: 19px;
    bottom: 19px;
    left: 50%;
    background: #d4e6f7;
  }

  .rula-index-steps__marker {
    align-self: center;
    min-height: 38px;
    margin: 0 0 50px;
    padding: 10px 24px;
    font-size: 14px;
    line-height: 18px;
  }

  .rula-index-steps__item + .rula-index-steps__marker {
    margin-top: 34px;
  }

  .rula-index-steps__marker--last {
    margin: 34px 0 0;
  }

.rula-index-steps__item {
    display: block;
    margin-bottom: 12px;
  }

  .rula-index-steps__node {
    display: none;
  }

.rula-index-steps__card {
    padding: 24px;
    border-radius: 14px;
  }

  .rula-index-steps__item--tall .rula-index-steps__card,
  .rula-index-steps__item--large .rula-index-steps__card {
    min-height: 160px;
  }

  .rula-index-steps__card-top {
    gap: 12px;
  }

  .rula-index-steps__number {
    font-size: 14px;
    line-height: 18px;
  }

  .rula-index-steps__time {
    min-width: 68px;
    min-height: 31px;
    margin-top: -2px;
    padding: 8px 14px;
    font-size: 12px;
    line-height: 15px;
  }

  .rula-index-steps__card-title {
    max-width: 240px;
    margin-top: 6px;
    font-size: 20px;
    line-height: 27px;
  }

  .rula-index-steps__card-text {
    max-width: 288px;
    margin-top: 24px;
    font-size: 16px;
    line-height: 24px;
  }

  .rula-index-any-question {
    padding: 32px 0;
  }

  .rula-index-any-question__card {
    gap: 32px;
    /* width: 366px; */
    max-width: calc(100% - 48px);
    min-height: 484px;
    margin-right: auto;
    margin-left: auto;
    overflow: hidden;
    padding: 32px 24px 320px;
    border-radius: 18px;
  }

  .rula-index-any-question__content {
    width: 100%;
    gap: 16px;
  }

  .rula-index-any-question__title {
    font-size: 24px;
    line-height: 32px;
  }

  .rula-index-any-question__text {
    max-width: 318px;
    font-size: 16px;
    line-height: 21px;
  }

  .rula-index-any-question__button {
    position: absolute;
    top: 360px;
    right: 24px;
    left: 24px;
    width: auto;
    color: #0f6eb8;
    background: #ffffff;
    border-color: rgba(85, 115, 140, 0.18);
    box-shadow: 0 12px 24px rgba(16, 52, 89, 0.08);
  }

  .rula-index-any-question__button:hover {
    background: #f3f8fd;
    box-shadow: 0 14px 28px rgba(16, 52, 89, 0.1);
  }

  .rula-index-any-question__doctor {
    right: 0;
    bottom: 0;
    width: 365px;
  }

  .rula-docs {
    padding: 64px 0;
  }

  .rula-docs__inner {
    gap: 32px;
    width: 100%;
  }

  .rula-docs__intro {
    width: min(366px, calc(100% - 48px));
  }

  .rula-docs__title {
    max-width: 340px;
    font-size: 32px;
    line-height: 42px;
  }

  .rula-docs__subtitle {
    /* max-width: 366px; */
    font-size: 16px;
    line-height: 24px;
  }

  .rula-docs__filters {
    justify-content: flex-start;
    gap: 8px;
    width: 100%;
    margin-top: 0;
    padding: 0 24px;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .rula-docs__filters::-webkit-scrollbar {
    display: none;
  }

  .rula-docs__filter {
    min-height: 35px;
    padding: 8px 16px;
    font-size: 14px;
    line-height: 19px;
  }

.rula-docs__slider-shell {
    width: 100%;
    height: auto;
  }

  .rula-docs__card {
    flex: 0 0 320px;
    width: 320px;
    margin-right: 12px;
  }

  .rula-docs__image-wrap {
    width: 320px;
    height: 394px;
    padding: 20px;
    border-radius: 18px;
  }

  .rula-docs__image {
    width: 260px;
    height: 354px;
  }

  .rula-docs__type {
    top: 32px;
    right: 32px;
  }

  .rula-docs__card-title {
    width: 320px;
    margin-top: 24px;
    font-size: 22px;
    line-height: 29px;
  }

  .rula-docs__pagination {
    justify-content: flex-start;
    width: 100%;
    padding-left: 116px;
  }

  .rula-index-why {
    padding: 32px 0 48px;
  }

  .rula-index-services {
    padding: 48px 0 64px;
  }

  .rula-index-why__inner,
  .rula-index-services__inner {
    gap: 32px;
    /* width: min(366px, calc(100vw - 48px)); */
  }

  .rula-index-section-head {
    gap: 12px;
  }

  .rula-index-section-head__badge {
    min-height: 35px;
    font-size: 14px;
    line-height: 19px;
  }

  .rula-consultation__form, .rula-consultation__coordinator {
    width: 95%;
  }

  .rula-index-section-head__title {
    /* max-width: 366px; */
    font-size: 32px;
    line-height: 42px;
  }

  .rula-index-why .rula-index-section-head__title {
    max-width: 270px;
  }

  .rula-index-section-head__text {
    /* max-width: 366px; */
    font-size: 16px;
    line-height: 24px;
  }

  .rula-index-why__grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

.rula-index-why-card {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    grid-template-areas:
      "icon title"
      "icon text"
      "icon link";
    align-items: flex-start;
    padding: 24px;
    gap: 8px 16px;
    border-radius: 16px;
    text-align: left;
  }

  .rula-index-why-card--estimate {
    order: 1;
  }

  .rula-index-why-card--coordinators {
    order: 2;
  }

  .rula-index-why-card--commission {
    order: 3;
  }

  .rula-index-why-card--partner {
    order: 4;
  }

  .rula-index-why-card--visa {
    order: 5;
  }

  .rula-index-why-card--manager {
    order: 6;
  }

  .rula-index-why-card__icon {
    grid-area: icon;
    width: 44px;
    height: 44px;
    margin-top: 0;
    background: rgba(47, 127, 215, 0.06);
    border-radius: 12px;
    box-shadow: none;
  }

  .rula-index-why-card__icon img {
    width: 24px;
    height: 24px;
    filter: brightness(0) saturate(100%) invert(41%) sepia(95%) saturate(1159%) hue-rotate(185deg) brightness(93%) contrast(83%);
  }

.rula-index-why-card__title {
    grid-area: title;
    font-size: 22px;
    line-height: 28px;
  }

  .rula-index-why-card__tag {
    display: none;
  }

  .rula-index-why-card__text {
    grid-area: text;
    font-size: 16px;
    line-height: 24px;
  }

  .rula-index-why-card__link {
    display: inline-flex;
    grid-area: link;
    margin-top: -1px;
  }

  .rula-index-why__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px 20px;
    padding: 32px 24px;
    border-radius: 16px;
  }

  .rula-index-why__stat {
    padding: 0;
  }

  .rula-index-why__stat strong {
    font-size: 32px;
    line-height: 42px;
  }

  .rula-index-why__stat span {
    max-width: 120px;
    font-size: 16px;
    line-height: 22px;
  }

  .rula-index-services__grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

.rula-index-service-card,
  .rula-index-service-card:nth-child(1),
  .rula-index-service-card:nth-child(3),
  .rula-index-service-card:nth-child(4),
  .rula-index-service-card:nth-child(6) {
    border-radius: 16px;
  }

.rula-index-service-card__top {
    padding: 24px;
    border-radius: 16px;
  }

  .rula-index-service-card__icon {
    margin-bottom: 44px;
  }

  .rula-index-service-card__ghost {
    right: -4px;
    bottom: -32px;
    width: 227px;
    height: 227px;
  }

  .rula-index-service-card__title {
    margin-bottom: 12px;
    font-size: 24px;
    line-height: 32px;
  }

  .rula-index-service-card__text {
    max-width: 318px;
    font-size: 16px;
    line-height: 24px;
  }

  .rula-index-service-card__body {
    display: none;
  }

  .rula-index-question {
    padding: 0 0 48px;
  }

  .rula-index-question__card {
    /* width: min(366px, calc(100vw - 48px)); */
    min-height: 542px;
    overflow: hidden;
    padding: 52px 24px 24px;
    border-radius: 16px;
  }

  .rula-index-question__content {
    position: static;
    gap: 24px;
    width: 100%;
  }

  .rula-index-question__title {
    max-width: 290px;
    font-size: 28px;
    line-height: 37px;
  }


  .rula-index-question__text {
    max-width: 318px;
    margin-top: -4px;
    font-size: 18px;
    line-height: 24px;
  }

  .rula-index-question__button {
    position: absolute;
    right: 24px;
    bottom: 24px;
    left: 24px;
    z-index: 5;
    width: auto;
    height: 56px;
    min-height: 56px;
    color: #ffffff;
    background: #ff7a12;
    border-color: #ff7a12;
    box-shadow: 0 12px 26px rgba(255, 122, 18, 0.28);
  }

  .rula-index-question__button:hover {
    background: #ff6d00;
    box-shadow: 0 14px 30px rgba(255, 122, 18, 0.34);
  }

  .rula-index-question__doctor {
    right: -3px;
    bottom: -4px;
    width: 352px;
  }
}

@media (max-width: 374px) {
  .rula-index-why__inner,
  .rula-index-services__inner {
    width: calc(100% - 32px);
  }

  .rula-index-section-head__title {
    font-size: 29px;
    line-height: 38px;
  }

  .rula-index-why-card,
  .rula-index-service-card__top {
    padding-right: 18px;
    padding-left: 18px;
  }

  .rula-index-why-card__title {
    font-size: 20px;
    line-height: 27px;
  }

  .rula-index-question__card {
    width: calc(100% - 32px);
    padding-right: 18px;
    padding-left: 18px;
  }

  .rula-index-question__button {
    right: 18px;
    left: 18px;
  }

  .rula-index-question__doctor {
    right: -34px;
  }

  .rula-docs__intro {
    width: calc(100% - 32px);
  }

  .rula-docs__filters {
    padding-right: 16px;
    padding-left: 16px;
  }

  .rula-docs__card {
    flex-basis: calc(100vw - 48px);
    width: calc(100vw - 48px);
  }

  .rula-docs__image-wrap,
  .rula-docs__card-title {
    width: calc(100vw - 48px);
  }

  .rula-docs__image {
    width: min(244px, calc(100vw - 96px));
  }

  .rula-docs__pagination {
    padding-left: calc((100vw - 182px) / 2);
  }
}

.rula-before-footer-index {
  background: #0C4782;
  color: #ffffff !important;
}

.rula-before-footer-index .rula-before-footer__age {
  color: #ffffff;
}

.rula-before-footer-index .rula-before-footer__text {
  color: #ffffff;
}

@media (min-width: 768px) and (max-width: 1023px) {
  .rula-advantages,
  .rula-cases,
  .rula-text-section--split,
  .rula-price,
  .rula-doctors,
  .rula-consultation,
  .rula-reviews,
  .rula-videos,
  .rula-clinics,
  .rula-index-why,
  .rula-index-services,
  .rula-index-steps,
  .rula-docs {
    padding-top: 56px !important;
    padding-bottom: 64px !important;
  }

  .rula-main-banner,
  .rula-index-banner {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }

  .rula-main-banner__inner,
  .rula-advantages__inner,
  .rula-cases__inner,
  .rula-text-split,
  .rula-price__intro,
  .rula-price__card,
  .rula-doctors__slider-shell,
  .rula-doctors__pagination,
  .rula-consultation__top,
  .rula-consultation__benefits,
  .rula-reviews__inner,
  .rula-videos__inner,
  .rula-clinics__inner,
  .rula-before-footer__inner,
  .rula-footer__inner,
  .rula-index-banner__inner,
  .rula-index-why__inner,
  .rula-index-services__inner,
  .rula-index-question__card,
  .rula-index-steps__inner,
  .rula-index-any-question__card,
  .rula-docs__inner {
    width: min(960px, calc(100% - 48px)) !important;
    max-width: min(960px, calc(100% - 48px)) !important;
    margin-right: auto !important;
    margin-left: auto !important;
  }

  .rula-main-banner__inner,
  .rula-text-split__content,
  .rula-index-banner__inner,
  .rula-cases__intro,
  .rula-doctors__intro {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  .rula-main-banner__inner,
  .rula-index-banner__inner {
    align-items: stretch;
  }

  .rula-main-banner__actions,
  .rula-index-banner__actions {
    flex-direction: row !important;
  }

  .rula-main-banner__button,
  .rula-index-banner__button {
    flex: 1 1 0;
    width: auto !important;
  }

.rula-main-banner__aside,
  .rula-index-banner__aside {
    padding: 28px !important;
  }

  .rula-index-banner__stats {
    flex-flow: row wrap !important;
    gap: 24px 40px !important;
  }

  .rula-advantages__cards {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }

.rula-advantages__card {
  }

  .rula-cases__intro,
  .rula-doctors__intro,
  .rula-reviews__intro,
  .rula-videos__intro,
  .rula-clinics__intro,
  .rula-docs__intro,
  .rula-index-section-head,
  .rula-index-steps__head {
    width: 100% !important;
    max-width: 900px !important;
  }

  .rula-cases__title,
  .rula-cases__subtitle,
  .rula-doctors__title,
  .rula-doctors__subtitle,
  .rula-reviews__title,
  .rula-reviews__subtitle,
  .rula-videos__title,
  .rula-videos__subtitle,
  .rula-clinics__title,
  .rula-clinics__subtitle,
  .rula-docs__title,
  .rula-docs__subtitle,
  .rula-index-section-head__title,
  .rula-index-section-head__text,
  .rula-index-steps__title,
  .rula-index-steps__subtitle {
    max-width: 900px !important;
  }

  .rula-cases__title {
    white-space: normal !important;
  }

  .rula-cases__slider-shell,
  .rula-doctors__slider-shell,
  .rula-reviews__slider-shell,
  .rula-videos__slider-shell,
  .rula-docs__slider-shell {
    width: 100% !important;
  }

  .rula-cases__stats {
    width: 100% !important;
  }

  .rula-cases__pagination,
  .rula-doctors__pagination,
  .rula-reviews__pagination,
  .rula-videos__pagination,
  .rula-docs__pagination {
    justify-content: center !important;
    width: 100% !important;
    padding-left: 0 !important;
  }

  .rula-text-split,
  .rula-text-split--reverse {
    gap: 32px !important;
  }

  .rula-text-split__figure {
    width: 100% !important;
    height: 260px !important;
  }

  .rula-price__card {
    overflow-x: auto;
  }

  .rula-consultation {
    gap: 40px !important;
  }

.rula-consultation__top {
    flex-direction: column !important;
    height: auto;
  }

.rula-consultation__form,
  .rula-consultation__coordinator {
    width: 100% !important;
    height: auto;
  }

  .rula-consultation__form {
    min-height: 0 !important;
    padding: 32px !important;
  }

.rula-consultation__form-head,
  .rula-consultation__submit-wrap {
  }

  .rula-consultation__coordinator {
    padding: 32px !important;
  }

.rula-consultation__benefits {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px !important;
  }

  .rula-index-why__grid,
  .rula-index-services__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

.rula-index-why-card,
  .rula-index-service-card,
  .rula-index-service-card:nth-child(1),
  .rula-index-service-card:nth-child(3),
  .rula-index-service-card:nth-child(4),
  .rula-index-service-card:nth-child(6) {
  }

  .rula-index-service-card__body {
    display: flex !important;
  }

  .rula-index-why__stats {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }

  .rula-index-question,
  .rula-index-any-question {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }

  .rula-index-question__card,
  .rula-index-any-question__card {
    min-height: 300px !important;
    overflow: hidden;
    padding: 40px clamp(260px, 34vw, 300px) 40px 40px !important;
  }

  .rula-index-question__content,
  .rula-index-any-question__content {
    position: relative !important;
    z-index: 4;
    width: min(520px, 100%) !important;
  }

  .rula-index-question__button,
  .rula-index-any-question__button {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: 254px !important;
  }

  .rula-index-question__button {
    color: #0f6eb8 !important;
    background: #ffffff !important;
    border-color: rgba(85, 115, 140, 0.18) !important;
    box-shadow: 0 8px 20px rgba(16, 52, 89, 0.08) !important;
  }

  .rula-index-any-question__button {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.12) !important;
    border-color: rgba(255, 255, 255, 0.47) !important;
  }

  .rula-index-question__doctor,
  .rula-index-any-question__doctor {
    right: 16px !important;
    bottom: 0 !important;
    width: clamp(280px, 32vw, 320px) !important;
  }

  .rula-index-steps__timeline,
  .rula-index-steps__item {
    grid-template-columns: minmax(0, 1fr) 92px minmax(0, 1fr) !important;
  }

.rula-index-steps__card {
  }

  .rula-docs__filters {
    justify-content: center !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

.rula-before-footer {
    align-items: center !important;
    padding: 10px 0 !important;
  }

  .rula-before-footer__text {
    display: block !important;
  }
}

@media (min-width: 1024px) and (max-width: 1240px) {
  .rula-text-split {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.52fr);
    gap: 32px;
  }

  .rula-text-split--reverse {
    grid-template-columns: minmax(300px, 0.52fr) minmax(0, 1fr);
  }

  .rula-text-split__figure {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
  }

  .rula-consultation__form {
    padding-right: 32px;
    padding-left: 32px;
  }

  .rula-index-question__card,
  .rula-index-any-question__card {
    padding-right: 300px;
  }

  .rula-index-question__doctor,
  .rula-index-any-question__doctor {
    right: 16px;
    width: 340px;
  }

  .rula-index-banner__title {
    font-size: 56px;
    line-height: 72px;
  }

  .rula-index-banner__stats {
    gap: 32px;
  }

  .rula-index-steps__timeline,
  .rula-index-steps__item {
    grid-template-columns: minmax(0, 1fr) 92px minmax(0, 1fr);
  }
}

/* Embla carousels */
.rula-cases__viewport,
.rula-doctors__viewport,
.rula-reviews__viewport,
.rula-videos__viewport,
.rula-docs__viewport {
  overflow: hidden;
  cursor: grab;
  touch-action: pan-y pinch-zoom;
  user-select: none;
  -webkit-user-select: none;
}

.rula-cases__viewport.is-dragging,
.rula-doctors__viewport.is-dragging,
.rula-reviews__viewport.is-dragging,
.rula-videos__viewport.is-dragging,
.rula-docs__viewport.is-dragging {
  cursor: grabbing;
}

.rula-cases__wrapper,
.rula-doctors__wrapper,
.rula-reviews__wrapper,
.rula-videos__wrapper,
.rula-docs__wrapper {
  display: flex;
  align-items: stretch;
  height: auto;
  touch-action: pan-y pinch-zoom;
  transition: none;
  will-change: transform;
}

.rula-reviews__slide,
.rula-videos__slide {
  flex: 0 0 100%;
  min-width: 0;
  margin-right: 24px;
}

.rula-cases__card,
.rula-doctors__card,
.rula-docs__card,
.rula-reviews__slide,
.rula-videos__slide {
  user-select: none;
  -webkit-user-select: none;
}

.rula-cases__card img,
.rula-doctors__card img,
.rula-docs__card img,
.rula-review-card img,
.rula-video-card img {
  -webkit-user-drag: none;
}

.rula-cases__pagination,
.rula-doctors__pagination,
.rula-reviews__pagination,
.rula-videos__pagination,
.rula-docs__pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 14px;
  padding-left: 0;
  line-height: 0;
}

.rula-carousel__dot {
  display: block;
  flex: 0 0 auto;
  width: 10px;
  height: 10px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #a5bcdb;
  opacity: 1;
  cursor: pointer;
  transition: width 160ms ease, height 160ms ease, background-color 160ms ease;
}

.rula-carousel__dot.is-active {
  width: 14px;
  height: 14px;
  background: #ff7a12;
}

.rula-carousel__dot:focus-visible {
  outline: 2px solid #0f6eb8;
  outline-offset: 3px;
}

.rula-cases__nav:disabled,
.rula-doctors__nav:disabled,
.rula-reviews__nav:disabled {
  opacity: 0.45;
  cursor: default;
}

/* Sections and content cards grow with their content. */
.rula-main-banner,
.rula-index-banner,
.rula-advantages,
.rula-cases,
.rula-copy,
.rula-text-section--split-left,
.rula-text-section--split-right,
.rula-price,
.rula-doctors,
.rula-consultation,
.rula-reviews,
.rula-videos,
.rula-clinics,
.rula-before-footer,
.rula-footer,
.rula-index-why,
.rula-index-services,
.rula-index-steps,
.rula-docs {
  min-height: 0;
  height: auto;
}

.rula-main-banner__aside,
.rula-index-banner__aside,
.rula-advantages__card,
.rula-cases__intro,
.rula-cases__stats,
.rula-cases__stat,
.rula-price__intro,
.rula-doctors__intro,
.rula-doctors__text,
.rula-consultation__form-head,
.rula-consultation__fields,
.rula-consultation__submit-wrap,
.rula-consultation__benefits,
.rula-review-card,
.rula-clinic-card,
.rula-clinics-cluster,
.rula-clinics-cluster__stat,
.rula-footer__bottom,
.rula-index-why-card,
.rula-index-why-card__title,
.rula-index-service-card,
.rula-index-service-card__top,
.rula-index-service-card__links,
.rula-index-steps__item,
.rula-index-steps__card {
  min-height: 0;
}

.rula-price__card,
.rula-price__table tr,
.rula-price__table th,
.rula-price__table td,
.rula-cases__slider-shell,
.rula-cases__viewport,
.rula-cases__card,
.rula-cases__body,
.rula-doctors__slider-shell,
.rula-doctors__viewport,
.rula-doctors__card,
.rula-doctors__body,
.rula-consultation__top,
.rula-consultation__form,
.rula-consultation__coordinator,
.rula-review-card,
.rula-clinic-card,
.rula-docs__slider-shell,
.rula-docs__viewport {
  height: auto;
}

.rula-cases__body,
.rula-doctors__body {
  flex: 1 1 auto;
}

.rula-cases__button,
.rula-doctors__button {
  margin-top: auto;
}

.rula-cases__nav,
.rula-doctors__nav,
.rula-reviews__nav {
  top: 50%;
  transform: translateY(-50%);
}

.rula-cases__nav:active,
.rula-doctors__nav:active,
.rula-reviews__nav:active {
  transform: translateY(calc(-50% + 1px));
}

@media (max-width: 767px) {
  .rula-consultation__form,
  .rula-consultation__coordinator,
  .rula-consultation__benefits {
    width: calc(100% - 48px);
    max-width: 520px;
  }
}

/* Keep the secondary banner button readable after the global link reset. */
.rula-page .rula-main-banner__button--secondary {
  color: var(--rula-banner-blue);
}

/* Unified second-level headings on service pages. */
.rula-page.rula-service-page h2:not(.rula-main-banner__aside-title) {
  margin-top: 0;
  color: #1f3552;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
  font-size: 40px;
  font-weight: 700;
  line-height: 48px;
}

@media (max-width: 1023px) {
  .rula-page.rula-service-page h2:not(.rula-main-banner__aside-title) {
    font-size: 32px;
    line-height: 40px;
  }
}

@media (max-width: 767px) {
  .rula-modal {
    padding: 12px;
  }

  .rula-modal--consultation .rula-modal__dialog {
    max-height: calc(100dvh - 24px);
    border-radius: 16px;
  }

  .rula-modal--consultation .rula-consultation__form {
    gap: 24px;
    padding: 56px 20px 24px;
    border-radius: 16px;
  }

  .rula-modal--consultation .rula-consultation__form-head {
    padding-right: 0;
  }

  .rula-page.rula-service-page .rula-modal--consultation .rula-consultation__title,
  .rula-modal--consultation .rula-consultation__title {
    font-size: 26px;
    line-height: 34px;
  }
}

@media (max-width: 767px) {
  .rula-page.rula-service-page h2:not(.rula-main-banner__aside-title) {
    font-size: 28px;
    line-height: 36px;
  }
}

.rula-modal--document .rula-modal__backdrop {
  background: rgba(1, 1, 1, 0.78);
}

.rula-modal--document .rula-modal__dialog {
  width: auto;
  max-width: calc(100vw - 32px);
  max-height: calc(100dvh - 32px);
  overflow: visible;
  padding: 0;
  background: transparent;
  border-radius: 8px;
  box-shadow: none;
}

.rula-modal--document .rula-modal__content {
  display: flex;
  align-items: center;
  justify-content: center;
}

.rula-docs__pagination[hidden] {
  display: none;
}

.rula-modal--document .rula-modal__close {
  z-index: 2;
  top: 12px;
  right: 12px;
}

.rula-modal__document-title {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.rula-modal__document {
  display: flex;
  align-items: center;
  justify-content: center;
}

.rula-modal__document img {
  display: block;
  width: auto;
  max-width: min(900px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  object-fit: contain;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 24px 80px rgba(1, 1, 1, 0.34);
}

@media (prefers-reduced-motion: reduce) {
  .rula-carousel__dot {
    transition: none;
  }
}

/* Content blocks specific to the diagnostics service page. */
.rula-copy--final {
  padding-bottom: 48px;
}

.rula-programs {
  padding: 48px 24px 80px;
  background: #f4f7fa;
}

.rula-copy--final + .rula-programs {
  padding-top: 24px;
}

.rula-programs__inner {
  width: min(1200px, 100%);
  margin: 0 auto;
}

.rula-programs__intro {
  max-width: 850px;
  margin: 0 auto 40px;
  text-align: center;
}

.rula-programs__title {
  margin: 0 0 16px;
  color: #1f3552;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
  font-size: 36px;
  font-weight: 700;
  line-height: 44px;
}

.rula-programs__intro p,
.rula-programs__note {
  color: #62758e;
  font-size: 18px;
  line-height: 1.55;
}

/* Блок «Частые вопросы». Аккордеон повторяет паттерн «Диагностических
   программ», но в одну колонку — вопросы длиннее заголовков программ. */
.rula-faq {
  padding: 48px 24px 80px;
  background: #f5f7fa;
}

.rula-faq__inner {
  width: min(900px, 100%);
  margin: 0 auto;
}

.rula-faq__intro {
  margin: 0 auto 40px;
  text-align: center;
}

.rula-faq__title {
  margin: 0 0 16px;
  color: #1f3552;
  font-family: "Rula Segoe UI This", "Segoe UI This", "Segoe UI", Arial, sans-serif;
  font-size: 36px;
  font-weight: 700;
  line-height: 44px;
}

.rula-faq__subtitle {
  margin: 0;
  color: #62758e;
  font-size: 18px;
  line-height: 1.55;
}

.rula-faq__list {
  display: grid;
  gap: 16px;
}

.rula-faq__item {
  overflow: hidden;
  border: 1px solid rgba(31, 53, 82, 0.1);
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 10px 35px rgba(31, 53, 82, 0.06);
}

.rula-faq__item summary {
  position: relative;
  padding: 24px 64px 24px 28px;
  color: #1f3552;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.35;
  cursor: pointer;
  list-style: none;
  transition: color 0.2s ease;
}

.rula-faq__item summary::-webkit-details-marker {
  display: none;
}

.rula-faq__item summary:hover {
  color: #0f6eb8;
}

.rula-faq__item summary::after {
  content: "+";
  position: absolute;
  top: 50%;
  right: 28px;
  color: #ff7a12;
  font-size: 28px;
  font-weight: 400;
  line-height: 1;
  transform: translateY(-50%);
}

.rula-faq__item[open] summary::after {
  content: "−";
}

.rula-faq__answer {
  padding: 0 28px 26px;
  color: #526985;
  font-size: 17px;
  line-height: 1.6;
}

.rula-faq__answer p {
  margin: 0 0 14px;
}

.rula-faq__answer p:last-child {
  margin-bottom: 0;
}

@media (max-width: 767px) {
  .rula-faq {
    padding: 40px 16px 56px;
  }

  .rula-faq__title {
    font-size: 28px;
    line-height: 36px;
  }

  .rula-faq__item summary {
    padding: 20px 52px 20px 20px;
    font-size: 18px;
  }

  .rula-faq__item summary::after {
    right: 20px;
  }

  .rula-faq__answer {
    padding: 0 20px 22px;
    font-size: 16px;
  }
}

.rula-programs__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.rula-programs__item {
  align-self: start;
  overflow: hidden;
  border: 1px solid rgba(31, 53, 82, 0.1);
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 10px 35px rgba(31, 53, 82, 0.06);
}

.rula-programs__item summary {
  position: relative;
  padding: 22px 58px 22px 24px;
  color: #1f3552;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  cursor: pointer;
  list-style: none;
}

.rula-programs__item summary::-webkit-details-marker {
  display: none;
}

.rula-programs__item summary::after {
  content: "+";
  position: absolute;
  top: 50%;
  right: 24px;
  color: #ff7a12;
  font-size: 28px;
  font-weight: 400;
  transform: translateY(-50%);
}

.rula-programs__item[open] summary::after {
  content: "−";
}

.rula-programs__item ul {
  display: grid;
  gap: 10px;
  padding: 0 24px 24px 46px;
  color: #526985;
  font-size: 16px;
  line-height: 1.5;
  list-style: disc;
}

.rula-programs__note {
  margin: 30px 0 0;
  padding: 24px;
  border-left: 4px solid #ff7a12;
  border-radius: 0 12px 12px 0;
  background: #ffffff;
}

@media (max-width: 767px) {
  .rula-programs {
    padding: 40px 16px 56px;
  }

  .rula-copy--final {
    padding-bottom: 36px;
  }

  .rula-copy--final + .rula-programs {
    padding-top: 16px;
  }

  .rula-programs__title {
    font-size: 30px;
    line-height: 38px;
  }

  .rula-programs__grid,
  .rula-programs__item summary {
    padding: 18px 52px 18px 18px;
    font-size: 18px;
  }

  .rula-programs__item ul {
    padding: 0 18px 20px 38px;
  }

}

/* CTA консультации без декоративной фотографии врача */
.rula-page .rula-index-question__card,
.rula-page .rula-index-any-question__card {
  min-height: 280px !important;
  padding: 48px 430px 48px 48px !important;
}

.rula-page .rula-index-question__content,
.rula-page .rula-index-any-question__content {
  width: min(650px, 100%) !important;
}

.rula-page .rula-index-question__button,
.rula-page .rula-index-any-question__button {
  position: relative !important;
  inset: auto !important;
  width: 254px !important;
}

.rula-index-cta-benefits {
  position: absolute;
  top: 50%;
  right: 48px;
  z-index: 2;
  width: 330px;
  padding: 4px 0 4px 30px;
  color: #ffffff;
  border-left: 1px solid rgba(255, 255, 255, 0.32);
  transform: translateY(-50%);
}

.rula-index-cta-benefits__person {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.24);
}

.rula-index-cta-benefits__photo {
  flex: 0 0 auto;
  width: 72px;
  height: 72px;
  object-fit: cover;
  object-position: center 24%;
  border: 2px solid rgba(255, 255, 255, 0.72);
  border-radius: 50%;
  box-shadow: 0 8px 20px rgba(19, 58, 101, 0.14);
}

.rula-index-cta-benefits__name,
.rula-index-cta-benefits__role {
  display: block;
}

.rula-index-cta-benefits__name {
  margin-bottom: 4px;
  font-size: 17px;
  font-weight: 700;
  line-height: 22px;
}

.rula-index-cta-benefits__role {
  color: rgba(255, 255, 255, 0.82);
  font-size: 13px;
  line-height: 18px;
}

.rula-index-cta-benefits__list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  font-size: 15px;
  line-height: 21px;
  list-style: none;
}

.rula-index-cta-benefits__list li {
  position: relative;
  padding-left: 26px;
}

.rula-index-cta-benefits__list li::before {
  content: "✓";
  position: absolute;
  top: 0;
  left: 0;
  color: #ffffff;
  font-size: 17px;
  font-weight: 700;
}

@media (max-width: 767px) {
  .rula-page .rula-index-question__card,
  .rula-page .rula-index-any-question__card {
    min-height: 0 !important;
    padding: 32px 24px !important;
  }

  .rula-page .rula-index-question__button,
  .rula-page .rula-index-any-question__button {
    width: 100% !important;
  }

  .rula-index-cta-benefits {
    position: relative;
    top: auto;
    right: auto;
    width: 100%;
    padding: 24px 0 0;
    border-top: 1px solid rgba(255, 255, 255, 0.32);
    border-left: 0;
    transform: none;
  }

  .rula-index-question__card::before,
  .rula-index-any-question__card::before {
    top: -105px;
    right: -105px;
    width: 230px;
    height: 230px;
    border-width: 28px;
  }

  .rula-index-question__card::after,
  .rula-index-any-question__card::after {
    display: none;
  }
}

@media (min-width: 768px) and (max-width: 1240px) {
  .rula-page .rula-index-question__card,
  .rula-page .rula-index-any-question__card {
    min-height: 280px !important;
    padding: 40px 370px 40px 40px !important;
  }

  .rula-index-cta-benefits {
    right: 40px;
    width: 300px;
    padding-left: 24px;
  }
}

/* Промежуточные формы обратной связи на странице услуги */
.rula-service-stats {
  padding: 64px 24px 0;
  background: #f5f7fa;
}

.rula-service-stats__inner {
  width: min(1200px, 100%);
  margin: 0 auto;
}

/* Синий вариант плашки: компонент 230 с настройкой «Цвет плашки» = blue.
   Используется на главной, сразу под блоком «Почему стоит выбрать нас»,
   поэтому верхний отступ убран — его даёт нижний padding самого блока. */
.rula-service-stats--blue {
  padding: 0 24px 80px;
}

.rula-service-stats--blue .rula-cases__stats {
  padding: 32px 48px;
  border-radius: 20px;
  background: #e3ecf6;
}

.rula-service-stats--blue .rula-cases__stat-value {
  color: #1568c7;
}

.rula-service-stats--blue .rula-cases__stat-label {
  color: #6f8096;
}

.rula-service-cta {
  padding: 56px 24px;
  background: #ffffff;
}

.rula-service-cta--orange {
  background: #f5f7fa;
}

.rula-service-cta__card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 350px;
  gap: 48px;
  align-items: center;
  width: min(1200px, 100%);
  min-height: 300px;
  margin: 0 auto;
  overflow: hidden;
  padding: 48px;
  color: #ffffff;
  background: linear-gradient(100deg, #2574c8 0%, #4b96e6 100%);
  border-radius: 20px;
  box-shadow: 0 14px 34px rgba(16, 52, 89, 0.1);
}

.rula-service-cta--orange .rula-service-cta__card {
  background: linear-gradient(100deg, #fb7d22 0%, #f39a58 100%);
}

.rula-service-cta__card::before {
  content: "";
  position: absolute;
  right: -90px;
  bottom: -170px;
  width: 390px;
  height: 390px;
  border: 44px solid rgba(255, 255, 255, 0.07);
  border-radius: 50%;
  pointer-events: none;
}

.rula-service-cta__content,
.rula-service-cta__coordinator {
  position: relative;
  z-index: 1;
}

.rula-service-cta__content {
  max-width: 670px;
}

.rula-page.rula-service-page .rula-service-cta__title {
  margin: 0 0 14px !important;
  color: #ffffff !important;
  font-size: 30px !important;
  line-height: 38px !important;
  text-align: left !important;
}

.rula-service-cta__text {
  max-width: 660px;
  margin: 0 0 28px;
  color: rgba(255, 255, 255, 0.9);
  font-size: 18px;
  line-height: 27px;
}

.rula-service-cta__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  padding: 15px 28px;
  color: #0f6eb8;
  background: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(16, 52, 89, 0.12);
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.rula-service-cta__button:hover {
  box-shadow: 0 14px 28px rgba(16, 52, 89, 0.18);
  transform: translateY(-1px);
}

.rula-service-cta__coordinator {
  padding-left: 32px;
  border-left: 1px solid rgba(255, 255, 255, 0.32);
}

.rula-service-cta__person {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.24);
}

.rula-service-cta__photo {
  flex: 0 0 auto;
  width: 76px;
  height: 76px;
  object-fit: cover;
  object-position: center 24%;
  border: 2px solid rgba(255, 255, 255, 0.72);
  border-radius: 50%;
  box-shadow: 0 8px 20px rgba(19, 58, 101, 0.14);
}

.rula-service-cta__name,
.rula-service-cta__role {
  display: block;
}

.rula-service-cta__name {
  margin-bottom: 4px;
  font-size: 17px;
  line-height: 22px;
}

.rula-service-cta__role {
  color: rgba(255, 255, 255, 0.82);
  font-size: 13px;
  line-height: 18px;
}

.rula-service-cta__list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  font-size: 15px;
  line-height: 21px;
  list-style: none;
}

.rula-service-cta__list li {
  position: relative;
  padding-left: 26px;
}

.rula-service-cta__list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: #ffffff;
  font-size: 17px;
  font-weight: 700;
}

@media (max-width: 900px) {
  .rula-service-stats {
    padding: 48px 0 0;
  }

  .rula-service-stats--blue {
    padding: 0 0 48px;
  }

  .rula-service-stats--blue .rula-cases__stats {
    padding: 32px 24px;
    border-radius: 16px;
  }

  .rula-service-stats__inner {
    width: 100%;
  }

  .rula-service-cta {
    padding: 40px 16px;
  }

  .rula-service-cta__card {
    grid-template-columns: 1fr;
    gap: 32px;
    padding: 36px;
  }

  .rula-service-cta__coordinator {
    padding: 28px 0 0;
    border-top: 1px solid rgba(255, 255, 255, 0.32);
    border-left: 0;
  }
}

@media (max-width: 560px) {
  .rula-service-cta__card {
    padding: 28px 22px;
    border-radius: 16px;
  }

  .rula-page.rula-service-page .rula-service-cta__title {
    font-size: 26px !important;
    line-height: 33px !important;
  }

  .rula-service-cta__text {
    font-size: 16px;
    line-height: 24px;
  }

  .rula-service-cta__button {
    width: 100%;
  }
}

/* Фильтр отзывов по направлениям — те же теги, что на странице цен. */
.rula-reviews-page__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
  margin-bottom: 40px;
}

.rula-reviews-page__filters .rula-price__tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
}

.rula-price__tag-count {
  color: #6f8096;
  font-size: 13px;
  font-weight: 600;
}

.rula-price__tag--active .rula-price__tag-count {
  color: rgb(255 255 255 / 70%);
}

@media (max-width: 767px) {
  .rula-reviews-page__filters {
    flex-wrap: nowrap;
    overflow-x: auto;
    margin-bottom: 28px;
    padding-bottom: 4px;
    scrollbar-width: none;
  }

  .rula-reviews-page__filters::-webkit-scrollbar {
    display: none;
  }

  .rula-reviews-page__filters .rula-price__tag {
    flex: 0 0 auto;
  }
}

/* Картинка в текстовом блоке (компонент 231): на планшетах и телефонах
   показываем целиком, без обрезки по высоте. Перебивает фиксированные
   139px и 260px !important из мобильных правил выше. */
@media (max-width: 1023px) {
  .rula-text-split__figure {
    height: auto !important;
    aspect-ratio: auto !important;
    background: transparent;
  }

  .rula-text-split__figure img {
    height: auto;
    /* До загрузки ленивой картинки держим место 4:3, иначе она схлопывается
       в 0px и может не начать грузиться; после загрузки — родные пропорции. */
    aspect-ratio: auto 4 / 3;
    object-fit: initial;
  }
}
