/* Стили страницы: собраны из inline-<style> экспорта SnapBuild,
   повторяющиеся блоки схлопнуты, порядок правил сохранён. */

/* ==== id="cms-element-fills-saved" ==== */
@media (min-width: 1024px) {
  .hero-school .hero-school-card-1-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
  .hero-school .hero-school__card-metro-dot { background-image: linear-gradient(rgb(2, 160, 63), rgb(2, 160, 63)); background-color: transparent; }
  .hero-school .hero-school-card-2-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
  .hero-school .hero-school-card-metro-dot { background-image: linear-gradient(rgb(0, 212, 255), rgb(0, 212, 255)); background-color: transparent; }
  .hero-school .hero-school-card-metro-dot-2 { background-image: linear-gradient(rgb(0, 6, 41), rgb(0, 6, 41)); background-color: transparent; }
  .hero-school .hero-school-card-3-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
  .hero-first-screen .btn-primary.hero-first-screen__cta { background-image: linear-gradient(rgb(213, 12, 21), rgb(213, 12, 21)); background-color: transparent; }
  .hero-first-screen .hero-first-screen__textblock { background-image: linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255)); background-color: transparent; }
  .form.mr-feedback .mr-feedback__btn { background-image: linear-gradient(rgb(213, 12, 21), rgb(213, 12, 21)); background-color: transparent; }
  .form.mr-feedback .mr-feedback__intro { background-image: linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255)); background-color: transparent; }
  .hero-school .hero-school-card-4-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
  .hero-school .hero-school-card-5-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
  .hero-school .hero-school-card-6-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
  .hero-school .hero-school-card-metro-dot-3 { background-image: linear-gradient(rgb(255, 39, 5), rgb(255, 39, 5)); background-color: transparent; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .hero-first-screen .btn-primary.hero-first-screen__cta { background-image: linear-gradient(rgb(213, 12, 21), rgb(213, 12, 21)); background-color: transparent; }
  .hero-first-screen .hero-first-screen-el { background-image: linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255)); background-color: transparent; }
  .form.mr-feedback .mr-feedback__btn { background-image: linear-gradient(rgb(213, 12, 21), rgb(213, 12, 21)); background-color: transparent; }
  .hero-school .hero-school__card-metro-dot, .hero-school .hero-school-card-metro-dot, .hero-school .hero-school-card-metro-dot-4, .hero-school .hero-school-card-metro-dot-5 { background-image: linear-gradient(rgb(2, 160, 63), rgb(2, 160, 63)); background-color: transparent; }
  .hero-school .hero-school__card-metro-dot.hero-school-card-metro-dot { background-image: linear-gradient(rgb(0, 212, 255), rgb(0, 212, 255)); background-color: transparent; }
  .hero-school .hero-school__card-metro-dot.hero-school-card-metro-dot-2.hero-school-card-metro-dot-4 { background-image: linear-gradient(rgb(0, 6, 41), rgb(0, 6, 41)); background-color: transparent; }
  .hero-school .hero-school__card-metro-dot.hero-school-card-metro-dot-3.hero-school-card-metro-dot-5 { background-image: linear-gradient(rgb(255, 39, 5), rgb(255, 39, 5)); background-color: transparent; }
  .hero-school .hero-school__card-pill.hero-school__card-pill--price.hero-school-card-2-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
  .hero-school .hero-school__card-pill.hero-school__card-pill--price.hero-school-card-1-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
  .hero-school .hero-school__card-pill.hero-school__card-pill--price.hero-school-card-3-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
  .hero-school .hero-school__card-pill.hero-school__card-pill--price.hero-school-card-5-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
  .hero-school .hero-school__card-pill.hero-school__card-pill--price.hero-school-card-4-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
  .hero-school .hero-school__card-pill.hero-school__card-pill--price.hero-school-card-6-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
}
@media (max-width: 767px) {
  .hero-first-screen .btn-primary.hero-first-screen__cta { background-image: linear-gradient(rgb(213, 12, 21), rgb(213, 12, 21)); background-color: transparent; }
  .form.mr-feedback .mr-feedback__btn { background-image: linear-gradient(rgb(213, 12, 21), rgb(213, 12, 21)); background-color: transparent; }
  .hero-school .hero-school__card-metro-dot, .hero-school .hero-school-card-metro-dot, .hero-school .hero-school-card-metro-dot-6, .hero-school .hero-school-card-metro-dot-7 { background-image: linear-gradient(rgb(2, 160, 63), rgb(2, 160, 63)); background-color: transparent; }
  .hero-school .hero-school__card-metro-dot.hero-school-card-metro-dot { background-image: linear-gradient(rgb(0, 212, 255), rgb(0, 212, 255)); background-color: transparent; }
  .hero-school .hero-school__card-metro-dot.hero-school-card-metro-dot-2.hero-school-card-metro-dot-4.hero-school-card-metro-dot-6 { background-image: linear-gradient(rgb(0, 6, 41), rgb(0, 6, 41)); background-color: transparent; }
  .hero-school .hero-school__card-metro-dot.hero-school-card-metro-dot-3.hero-school-card-metro-dot-5.hero-school-card-metro-dot-7 { background-image: linear-gradient(rgb(255, 39, 5), rgb(255, 39, 5)); background-color: transparent; }
  .hero-school .hero-school__card-pill.hero-school__card-pill--price.hero-school-card-2-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
  .hero-school .hero-school__card-pill.hero-school__card-pill--price.hero-school-card-1-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
  .hero-school .hero-school__card-pill.hero-school__card-pill--price.hero-school-card-3-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
  .hero-school .hero-school__card-pill.hero-school__card-pill--price.hero-school-card-5-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
  .hero-school .hero-school__card-pill.hero-school__card-pill--price.hero-school-card-4-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
  .hero-school .hero-school__card-pill.hero-school__card-pill--price.hero-school-card-6-price { background-image: linear-gradient(rgb(245, 245, 245), rgb(245, 245, 245)); background-color: transparent; }
}

/* ==== id="cms-copy-flash-styles" ==== */
@keyframes cms-copy-flash {
			0% {
				outline-color: rgba(255, 109, 61, 1);
			}
			100% {
				outline-color: rgba(255, 109, 61, 0);
			}
		}

		.cms-copy-flash {
			outline: 2px solid rgba(255, 109, 61, 1);
			outline-offset: 2px;
			animation: cms-copy-flash 0.2s ease-in-out;
		}

		@media (prefers-reduced-motion: reduce) {
			.cms-copy-flash {
				animation: none;
			}
		}

/* ==== data-ds-template="973a8e4b-d3d6-4e95-95f9-028ebb3568ac" ==== */
.header-ondark {
    position: absolute;
    inset-block-start: 0;
    inset-inline: 0;
    z-index: 300;
    background: linear-gradient(180deg, rgba(9, 7, 20, 0.5), rgba(9, 7, 20, 0));
  }

  /* ---- header (dark colors, on white background) ---- */
  .header-ondark__header {
    position: relative;
    max-inline-size: 1440px;
    z-index: 300;
    width: 100%;
    margin-inline: auto;
    padding-inline: 60px;
    padding-block: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    color: #ffffff;
  }

  .header-ondark__header-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-block-size: 38px;
  }

  .header-ondark__logos {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    gap: 20px;
  }

  .header-ondark__logo-item {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
  }

  .header-ondark__logo-item img {
    block-size: 16px;
    inline-size: auto;
    max-width: none;
    display: block;
    flex: 0 0 auto;
    filter: brightness(0) invert(1);
  }

  .header-ondark__logo-sep {
    inline-size: 1px;
    block-size: 16px;
    background-color: rgba(255, 255, 255, 0.3);
    flex: 0 0 auto;
  }

  .header-ondark__header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-inline-start: auto;
    gap: 16px;
  }

  .header-ondark__header-phone {
    font-family: var(--font-primary, "Suisse Intl", sans-serif);
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: #ffffff;
    text-decoration: none;
    white-space: nowrap;
  }

  .header-ondark__header-phone:hover {
    color: var(--color-accent, #754be9);
  }

  .header-ondark__header-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 32px;
    block-size: 32px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #ffffff;
    cursor: pointer;
    touch-action: manipulation;
  }

  .header-ondark__header-icon img {
    inline-size: 20px;
    block-size: 20px;
    flex: 0 0 auto;
    filter: brightness(0) invert(1);
  }

  .header-ondark__header-icon:focus-visible {
    outline: 2px solid var(--color-accent, #754be9);
    outline-offset: 2px;
    border-radius: 6px;
  }

  .header-ondark__header-phone-icon {
    display: none;
  }

  .header-ondark__header-divider {
    border: 0;
    border-block-start: 1px solid rgba(255, 255, 255, 0.2);
    margin-block-start: 8px;
  }

  .header-ondark__header-nav {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    column-gap: 24px;
    row-gap: 4px;
  }

  .header-ondark__header-nav a {
    font-family: var(--font-primary, "Suisse Intl", sans-serif);
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: #ffffff;
    text-decoration: none;
    white-space: nowrap;
  }

  .header-ondark__header-nav a:hover {
    color: var(--color-accent, #754be9);
  }

  /* Tablet (&le;1023): compact header, smaller fonts */
  @media (max-width: 1024px) {
    .header-ondark__header {
      padding-inline: 40px;
      padding-block: 12px;
      gap: 0;
    }

    .header-ondark__header-top {
      min-block-size: 20px;
    }

    .header-ondark__logos {
      gap: 16px;
    }

    .header-ondark__logos > *:nth-child(n+4) {
      display: none;
    }

    .header-ondark__logo-item img {
      block-size: 16px;
    }

    .header-ondark__header-actions {
      gap: 12px;
    }

    .header-ondark__header-icon {
      inline-size: 20px;
      block-size: 20px;
    }

    .header-ondark__header-phone,
    .header-ondark__header-divider,
    .header-ondark__header-nav {
      display: none;
    }

    .header-ondark__header-phone-icon {
      display: inline-flex;
      inline-size: 20px;
      block-size: 20px;
    }

    .header-ondark__header-phone-icon img {
      width: 20px;
      height: 20px;
    }
  }

  /* Mobile (&le;767) */
  @media (max-width: 767px) {
    .header-ondark__header {
      padding-inline: 20px;
    }

    .header-ondark__header-icon--search {
      display: none;
    }
  }

  /* ---- mega menu (opens from the "&#1052;&#1077;&#1085;&#1102;" button) ---- */






  /* stream-select &mdash; brand links ribbon (mobile) */




  /* brand sections */




















  /* mobile nav categories &mdash; accordions in a column (&le;1023) */









  /* mobile bottom microbanners (&le;1023) */



















  /* open state */



  /* Tablet/Mobile (&le;1023): full-screen overlay */
  
  
  @media (prefers-reduced-motion: reduce) {
    .header-ondark *,
    .header-ondark *::before,
    .header-ondark *::after {
      transition-duration: 0.01ms !important;
    }
  }

/* ==== data-ds-template="a2f1c4e8-7b3d-4a9e-8f2c-1d5e6a7b8c9d" ==== */
.header-main {
    position: absolute;
    inset-block-start: 0;
    inset-inline: 0;
    z-index: 300;
    background-color: var(--color-background);
  }

  /* ---- header (dark colors, on white background) ---- */
  .header-main__header {
    position: relative;
    max-inline-size: 1440px;
    z-index: 300;
    width: 100%;
    margin-inline: auto;
    padding-inline: 60px;
    padding-block: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    color: var(--color-neutral, #090714);
  }

  .header-main__header-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-block-size: 38px;
  }

  .header-main__logos {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    gap: 20px;
  }

  .header-main__logo-item {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
  }

  .header-main__logo-item img {
    block-size: 16px;
    inline-size: auto;
    max-width: none;
    display: block;
    flex: 0 0 auto;
  }

  .header-main__logo-sep {
    inline-size: 1px;
    block-size: 16px;
    background-color: var(--color-neutral-300, #d0d1d7);
    flex: 0 0 auto;
  }

  .header-main__header-actions {
    display: flex;
    align-items: center;
    gap: 16px;
  }

  .header-main__header-phone {
    font-family: var(--font-primary, "Suisse Intl", sans-serif);
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: var(--color-neutral, #090714);
    text-decoration: none;
    white-space: nowrap;
  }

  .header-main__header-phone:hover {
    color: var(--color-accent, #754be9);
  }

  .header-main__header-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 32px;
    block-size: 32px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--color-neutral, #090714);
    cursor: pointer;
    touch-action: manipulation;
  }

  .header-main__header-icon img {
    inline-size: 20px;
    block-size: 20px;
    flex: 0 0 auto;
  }

  .header-main__header-icon:focus-visible {
    outline: 2px solid var(--color-accent, #754be9);
    outline-offset: 2px;
    border-radius: 6px;
  }

  .header-main__header-phone-icon {
    display: none;
  }

  .header-main__header-divider {
    border: 0;
    border-block-start: 1px solid var(--color-neutral-200, #e2e3e8);
    margin-block-start: 8px;
  }

  .header-main__header-nav {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    column-gap: 24px;
    row-gap: 4px;
  }

  .header-main__header-nav a {
    font-family: var(--font-primary, "Suisse Intl", sans-serif);
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: #a7a8af;
    text-decoration: none;
    white-space: nowrap;
  }

  .header-main__header-nav a:hover {
    color: var(--color-accent, #754be9);
  }

  /* Tablet (&le;1023): compact header, smaller fonts */
  @media (max-width: 1024px) {
    .header-main__header {
      padding-inline: 40px;
      padding-block: 12px;
      gap: 0;
    }

    .header-main__header-top {
      min-block-size: 20px;
    }

    .header-main__logos {
      gap: 16px;
    }

    .header-main__logos > *:nth-child(n+4) {
      display: none;
    }

    .header-main__logo-item img {
      block-size: 16px;
    }

    .header-main__header-actions {
      gap: 12px;
    }

    .header-main__header-icon {
      inline-size: 20px;
      block-size: 20px;
    }

    .header-main__header-phone,
    .header-main__header-divider,
    .header-main__header-nav {
      display: none;
    }

    .header-main__header-phone-icon {
      display: inline-flex;
      inline-size: 20px;
      block-size: 20px;
    }

    .header-main__header-phone-icon img {
      width: 20px;
      height: 20px;
    }
  }

  /* Mobile (&le;767) */
  @media (max-width: 767px) {
    .header-main__header {
      padding-inline: 20px;
    }

    .header-main__header-icon--search {
      display: none;
    }
  }

  /* ---- mega menu (opens from the "&#1052;&#1077;&#1085;&#1102;" button) ---- */
  .header-main__menu {
    position: absolute;
    inset-block-start: 100%;
    inset-inline: 0;
    z-index: 200;
    pointer-events: none;
    visibility: hidden;
    transition: visibility 0s linear 0.3s;
  }

  .header-main__menu-backdrop {
    position: fixed;
    inset: 115px 0 0;
    background-color: rgba(9, 7, 20, 0.5);
    opacity: 0;
    transition: opacity 0.3s ease;
  }

  .header-main__menu-panel {
    position: relative;
    max-inline-size: 1440px;
    margin-inline: auto;
    background-color: var(--color-background, #ffffff);
    padding-block: 20px 40px;
    padding-inline: 60px;
    opacity: 0;
    transform: translateY(-12px);
    transition: opacity 0.3s ease, transform 0.3s ease;
    max-block-size: calc(100dvh - 115px);
    overflow-y: auto;
  }

  .header-main__menu-head {
    display: flex;
    justify-content: flex-end;
    margin-block-end: 20px;
  }

  .header-main__menu-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 32px;
    block-size: 32px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--color-neutral, #090714);
    cursor: pointer;
    touch-action: manipulation;
  }

  .header-main__menu-close:focus-visible {
    outline: 2px solid var(--color-accent, #754be9);
    outline-offset: 2px;
    border-radius: 6px;
  }

  /* stream-select &mdash; brand links ribbon (mobile) */
  .header-main__menu-stream {
    display: none;
    align-items: center;
    gap: 20px;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    margin-block-end: 24px;
  }

  .header-main__menu-stream::-webkit-scrollbar {
    display: none;
  }

  .header-main__menu-stream-tab {
    display: inline-flex;
    flex: 0 0 auto;
    text-decoration: none;
  }

  .header-main__menu-stream-tab img {
    block-size: 16px;
    inline-size: auto;
    max-inline-size: none;
    display: block;
    filter: brightness(0);
  }

  /* brand sections */
  .header-main__menu-section {
    margin-block-end: 32px;
  }

  .header-main__menu-section:last-of-type {
    margin-block-end: 24px;
  }

  .header-main__menu-heading {
    margin: 0 0 12px;
    font-family: var(--font-primary, "Suisse Intl", sans-serif);
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    color: var(--color-neutral, #090714);
  }

  .header-main__menu-grid {
    display: grid;
    grid-template-columns: repeat(4, 315px);
    grid-auto-flow: row;
    column-gap: 20px;
    row-gap: 4px;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .header-main__menu-grid::-webkit-scrollbar {
    display: none;
  }

  .header-main__menu-scroll {
    position: relative;
  }

  .header-main__menu-project {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-block: 8px;
    text-decoration: none;
    border-block-end: 1px solid var(--color-neutral-200, #e2e3e8);
  }

  .header-main__menu-project-img {
    inline-size: 48px;
    block-size: 48px;
    flex: 0 0 48px;
    border-radius: 8px;
    object-fit: cover;
  }

  .header-main__menu-project-info {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    column-gap: 8px;
    row-gap: 4px;
    flex: 1;
    min-inline-size: 0;
  }

  .header-main__menu-project-name {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
    font-family: var(--font-secondary, "Grtsk Giga", Georgia, serif);
    font-size: 10px;
    font-weight: 500;
    line-height: 12px;
    color: var(--color-neutral, #090714);
  }

  .header-main__menu-project-metro {
    grid-column: 1;
    grid-row: 2;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    align-self: center;
    font-family: var(--font-primary, "Suisse Intl", sans-serif);
    font-size: 12px;
    font-weight: 400;
    line-height: 14px;
    color: #5b5d67;
    min-inline-size: 0;
  }

  .header-main__menu-project-metro-dot {
    inline-size: 6px;
    block-size: 6px;
    flex: 0 0 6px;
    border-radius: 50%;
    background-color: #78177d;
  }

  .header-main__menu-project-price {
    grid-column: 2;
    grid-row: 1;
    text-align: end;
    font-family: var(--font-primary, "Suisse Intl", sans-serif);
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    color: var(--color-neutral, #090714);
  }

  .header-main__menu-project-time {
    grid-column: 2;
    grid-row: 2;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 2px;
    font-family: var(--font-primary, "Suisse Intl", sans-serif);
    font-size: 12px;
    font-weight: 400;
    line-height: 14px;
    color: var(--menu-time, var(--color-neutral-500, #8e9099));
  }

  .header-main__menu-project-time img {
    inline-size: 14px;
    block-size: 14px;
    flex: 0 0 14px;
  }

  .header-main__menu-project-time img.header-main__menu-project-walk {
    inline-size: 10px;
    block-size: 10px;
    flex: 0 0 10px;
  }

  .header-main__menu-cta-wrap {
    display: flex;
    justify-content: center;
    margin-block-start: 8px;
  }

  .header-main__menu-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding-inline: 20px;
    padding-block: 16px;
    border-radius: 9999px;
    background-color: var(--color-primary-500, #754be9);
    color: #ffffff;
    font-family: var(--font-secondary, "Grtsk Giga", Georgia, serif);
    font-size: 10px;
    font-weight: 500;
    line-height: 12px;
    text-decoration: none;
    touch-action: manipulation;
  }

  .header-main__menu-cta img {
    inline-size: 20px;
    block-size: 20px;
    flex: 0 0 20px;
  }

  .header-main__menu-cta:focus-visible {
    outline: 2px solid var(--color-accent, #754be9);
    outline-offset: 2px;
  }

  /* mobile nav categories &mdash; accordions in a column (&le;1023) */
  .header-main__menu-cats {
    display: none;
    flex-direction: column;
    gap: 0;
    margin-block-start: 24px;
  }

  .header-main__menu-cat {
    border-block-end: 1px solid var(--color-neutral-200, #e2e3e8);
  }

  .header-main__menu-cat-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-block-size: 48px;
    padding-block: 6px;
    cursor: pointer;
    list-style: none;
    font-family: var(--font-primary, "Suisse Intl", sans-serif);
    font-size: 16px;
    line-height: 20px;
    color: var(--color-neutral, #090714);
  }

  .header-main__menu-cat-summary::-webkit-details-marker,
  .header-main__menu-cat-summary::marker {
    display: none;
    content: "";
  }

  .header-main__menu-cat-summary img {
    inline-size: 20px;
    block-size: 20px;
    flex: 0 0 20px;
    transition: transform 0.2s ease;
  }

  .header-main__menu-cat[open] .header-main__menu-cat-summary img {
    transform: rotate(180deg);
  }

  .header-main__menu-cat-content {
    display: flex;
    flex-direction: column;
    padding-block-end: 12px;
    overflow: hidden;
    transition: height 0.3s ease;
  }

  .header-main__menu-cat-content a {
    padding-block: 10px;
    font-family: var(--font-primary, "Suisse Intl", sans-serif);
    font-size: 14px;
    line-height: 20px;
    color: var(--color-neutral-700, #4b4d55);
    text-decoration: none;
  }

  .header-main__menu-cat-content a:hover {
    color: var(--color-accent, #754be9);
  }

  /* mobile bottom microbanners (&le;1023) */
  .header-main__menu-banners {
    display: none;
    flex-direction: column;
    gap: 8px;
    margin-block-start: 24px;
  }

  .header-main__menu-banner {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
    border-radius: 20px;
    color: #ffffff;
    text-decoration: none;
    position: relative;
    overflow: hidden;
  }

  .header-main__menu-banner-zero {
    display: none;
    position: absolute;
    inset-block-end: 8px;
    inset-inline-end: 16px;
    font-family: var(--font-secondary, "Grtsk Giga", Georgia, serif);
    font-size: 80px;
    font-weight: 100;
    line-height: 80px;
    color: #ffffff;
    pointer-events: none;
    z-index: 0;
  }

  .header-main__menu-banner--purple {
    background-color: var(--color-primary-500, #754be9);
  }

  .header-main__menu-banner--grey {
    background-color: rgba(116, 118, 128, 0.5);
  }

  .header-main__menu-banner-top {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .header-main__menu-banner-top img {
    inline-size: 20px;
    block-size: 20px;
    flex: 0 0 20px;
  }

  .header-main__menu-banner-title {
    font-family: var(--font-secondary, "Grtsk Giga", Georgia, serif);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    color: #ffffff;
  }

  .header-main__menu-banner--grey .header-main__menu-banner-title {
    font-size: 13px;
    line-height: 14px;
  }

  .header-main__menu-banner-text {
    font-family: var(--font-primary, "Suisse Intl", sans-serif);
    font-size: 14px;
    line-height: 18px;
    color: #d0d1d7;
  }

  .header-main__menu-banner-side {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1;
    min-inline-size: 0;
  }

  .header-main__menu-stores {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
  }

  .header-main__menu-stores a {
    display: inline-flex;
  }

  .header-main__menu-stores img {
    inline-size: 24px;
    block-size: 24px;
    flex: 0 0 24px;
  }

  .header-main__menu-contacts {
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px;
    border-radius: 16px;
    background-color: var(--color-neutral, #090714);
    color: #ffffff;
  }

  .header-main__menu-phone {
    font-family: var(--font-primary, "Suisse Intl", sans-serif);
    font-size: 14px;
    line-height: 18px;
    color: #ffffff;
    text-decoration: none;
  }

  .header-main__menu-socials {
    display: inline-flex;
    gap: 4px;
  }

  .header-main__menu-socials a {
    display: inline-flex;
    inline-size: 32px;
    block-size: 32px;
    align-items: center;
    justify-content: center;
  }

  .header-main__menu-socials img {
    inline-size: 20px;
    block-size: 20px;
  }

  /* open state */
  .header-main__menu--open {
    pointer-events: auto;
    visibility: visible;
    transition: visibility 0s;
  }

  .header-main__menu--open .header-main__menu-backdrop {
    opacity: 1;
  }

  .header-main__menu--open .header-main__menu-panel {
    opacity: 1;
    transform: translateY(0);
  }

  /* Tablet/Mobile (&le;1023): full-screen overlay */
  @media (max-width: 1024px) {
    .header-main__menu {
      position: fixed;
      inset-block: 44px 0;
      inset-inline: 0;
    }

    .header-main__menu-backdrop {
      inset-block-start: 44px;
    }

    .header-main__menu-panel {
      max-inline-size: none;
      max-block-size: none;
      block-size: 100%;
      padding-inline: 20px;
      border-radius: 0;
    }

    .header-main__menu-grid {
      grid-template-columns: repeat(4, 138px);
    }

    .header-main__menu-stream {
      display: flex;
    }

    .header-main__menu-grid--wrap {
      grid-template-columns: repeat(auto-fill, 138px);
      justify-content: start;
      overflow-x: visible;
      row-gap: 8px;
    }

    .header-main__menu-scroll::after {
      content: "";
      position: absolute;
      inset-block: 0;
      inset-inline-end: 0;
      inline-size: 72px;
      background: linear-gradient(to right, rgba(255, 255, 255, 0), var(--color-background, #ffffff));
      pointer-events: none;
      z-index: 1;
    }

    .header-main__menu-cats {
      display: grid;
      grid-template-columns: 1fr 1fr;
      column-gap: 12px;
      row-gap: 0;
    }

    .header-main__menu-project-price,
    .header-main__menu-project-time,
    .header-main__menu-project-metro {
      display: none;
    }

    .header-main__menu-project-info {
      display: flex;
      flex-direction: row;
      align-items: center;
    }

    .header-main__menu-project-img {
      inline-size: 44px;
      block-size: 44px;
      flex: 0 0 44px;
    }

    .header-main__menu-banner-zero {
      display: block;
    }

    .header-main__menu-cta-wrap {
      display: none;
    }

    .header-main__menu-banners {
      display: flex;
      flex-direction: row;
      gap: 8px;
    }

    .header-main__menu-contacts {
      display: flex;
    }
  }

  @media (max-width: 767px) {
    .header-main__menu-cats {
      grid-template-columns: 1fr;
    }

    .header-main__menu-banners {
      flex-direction: column;
    }

    .header-main__menu-banner-zero {
      display: none;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .header-main *,
    .header-main *::before,
    .header-main *::after {
      transition-duration: 0.01ms !important;
    }
  }

/* ==== data-ds-template="9bb4d267-0051-4de4-9eca-018b253cabc6" ==== */
.stats {
    display: block;
    background-color: var(--color-background);
    padding: 60px;
  }

  .stats__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 40px 12px;
    max-inline-size: 1320px;
    margin-inline: auto;
  }

  .stats__item {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  .stats__item--1 {
    grid-row: 1;
    grid-column: 1;
  }

  .stats__item--2 {
    grid-row: 1;
    grid-column: 2;
  }

  .stats__item--3 {
    grid-row: 2;
    grid-column: 1;
  }

  .stats__item--4 {
    grid-row: 2;
    grid-column: 2;
  }

  .stats__number {
    margin: 0;
    font-family: var(--font-secondary);
    font-weight: 500;
    font-size: 68px;
    line-height: 110%;
    color: var(--color-neutral-900);
  }

  .stats__description {
    margin: 0;
    font-family: var(--font-secondary);
    font-weight: 500;
    font-size: 20px;
    line-height: 26px;
    color: var(--color-neutral-600);
  }

  /* 1024px &mdash; tablet */
  @media (max-width: 1023px) {
    .stats {
      padding: 40px;
    }

    .stats__grid {
      gap: 32px 12px;
    }

    .stats__item {
      gap: 8px;
    }

    .stats__number {
      font-size: 38px;
    }

    .stats__description {
      font-size: 13px;
      line-height: 14px;
    }
  }

  /* 375px mobile */
  @media (max-width: 767px) {
    .stats {
      padding: 20px;
    }

    .stats__grid {
      grid-template-columns: 1fr;
      grid-template-rows: auto;
      gap: 32px;
    }

    .stats__item--1,
    .stats__item--2,
    .stats__item--3,
    .stats__item--4 {
      grid-row: auto;
      grid-column: auto;
    }

    .stats__item {
      gap: 8px;
    }

    .stats__number {
      font-size: 36px;
    }

    .stats__description {
      font-size: 13px;
      line-height: 14px;
    }
  }

/* ==== data-ds-template="cad9b819-5240-4126-8686-55987d9e940b" ==== */
/* Form feedback &mdash; MR Group (desktop 1440 / tablet 768 / mobile 375).
     Reuses the dropdown + checkbox + field components from form/steps. */
  .mr-feedback {
    background-color: #ffffff;
    padding-inline: 60px;
    padding-block: 60px;
  }
  .mr-feedback *,
  .mr-feedback *::before,
  .mr-feedback *::after { box-sizing: border-box; }

  .mr-feedback__inner {
    max-width: 1320px;
    margin-inline: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 40px;
    align-items: start;
  }

  /* ---------- left: intro ---------- */
  .mr-feedback__intro {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
  }
  .mr-feedback__title {
    margin: 0;
    color: var(--color-neutral);
    font-family: var(--font-secondary);
    font-weight: 500;
    font-size: 32px;
    line-height: 1.31;
  }
  .mr-feedback__desc {
    margin: 0;
    color: #8E9099;
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 16px;
    line-height: 1.44;
  }

  /* ---------- right: form ---------- */
  .mr-feedback__form {
    display: flex;
    flex-direction: column;
    gap: 24px;
    min-width: 0;
  }

  .mr-feedback__inputs { display: flex; flex-direction: column; gap: 12px; }
  .mr-feedback__inputs-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

  /* field = pill wrapper; input is a transparent overlay and the
     placeholder is a real <span> so it renders like Figma and stays CMS-measurable */
  .mr-feedback__field {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    block-size: 52px;
    padding-inline: 16px;
    border-radius: var(--radius-8);
    background: #f5f5f5;
    border: 0;
  }
  .mr-feedback__input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    -webkit-appearance: none;
    appearance: none;
    border: 0;
    outline: 0;
    padding-inline: 16px;
    border-radius: inherit;
    background: transparent;
    color: var(--color-neutral);
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
  }
  .mr-feedback__ph {
    pointer-events: none;
    color: #5b5d67;
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
  }
  .mr-feedback__input:focus + .mr-feedback__ph,
  .mr-feedback__input:not(:placeholder-shown) + .mr-feedback__ph { opacity: 0; }

  /* custom project dropdown &mdash; animated field-width list, rotating chevron */
  .mr-feedback__field--select {
    flex: 1 1 0;
    position: relative;
    padding: 0;
  }
  .mr-feedback__select-trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    height: 100%;
    padding-inline: 16px;
    border: 0;
    border-radius: inherit;
    background: transparent;
    color: #5b5d67;
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    text-align: start;
    cursor: pointer;
    touch-action: manipulation;
  }
  .mr-feedback__select-trigger:focus-visible {
    outline: 2px solid var(--color-primary-500);
    outline-offset: -2px;
  }
  .mr-feedback__select-value {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .mr-feedback__chevron {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    color: var(--color-neutral-400);
    transition: transform 0.18s ease;
  }
  .mr-feedback__field--select.is-open .mr-feedback__chevron { transform: rotate(180deg); }
  .mr-feedback__select-menu {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    margin: 0;
    padding: 6px;
    list-style: none;
    background: var(--color-background);
    border: 1px solid var(--color-neutral-300);
    border-radius: var(--radius-12);
    box-shadow: var(--shadow-deep);
    z-index: 20;
    opacity: 0;
    transform: translateY(-6px) scale(0.985);
    transform-origin: top center;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.16s ease, transform 0.16s ease, visibility 0.16s ease;
    max-height: 260px;
    overflow-y: auto;
  }
  .mr-feedback__field--select.is-open .mr-feedback__select-menu {
    opacity: 1;
    transform: none;
    visibility: visible;
    pointer-events: auto;
  }
  .mr-feedback__select-option {
    padding-block: 10px;
    padding-inline: 12px;
    border-radius: var(--radius-8);
    color: var(--color-neutral);
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    cursor: pointer;
    transition: background-color 0.12s ease, color 0.12s ease;
  }
  .mr-feedback__select-option:hover,
  .mr-feedback__select-option[aria-selected="true"] {
    background: var(--color-primary-50);
    color: var(--color-primary-600);
  }

  /* ---------- consent + button ---------- */
  .mr-feedback__actions { display: flex; flex-direction: column; gap: 24px; }

  .mr-feedback__consents { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
  .mr-feedback__consent {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    gap: 12px;
    cursor: pointer;
  }
  .mr-feedback__check-input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .mr-feedback__check-box {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin-block-start: 1px;
    border-radius: var(--radius-6);
    background: rgba(116, 118, 128, 0.2);
    display: grid;
    place-items: center;
    color: var(--color-background);
    transition: background 0.15s ease;
  }
  .mr-feedback__check-box::after {
    content: "";
    width: 9px;
    height: 6px;
    border-left: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(-45deg) scale(0);
    transition: transform 0.15s ease;
  }
  .mr-feedback__check-input:checked + .mr-feedback__check-box { background: var(--color-neutral); }
  .mr-feedback__check-input:checked + .mr-feedback__check-box::after { transform: rotate(-45deg) scale(1); }
  .mr-feedback__check-input:focus-visible + .mr-feedback__check-box { outline: 2px solid var(--color-primary-500); outline-offset: 2px; }
  .mr-feedback__check-text {
    color: var(--color-neutral-500);
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
  }
  .mr-feedback__check-text a { color: var(--color-neutral); text-decoration: none; }

  .mr-feedback__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 44px;
    padding-inline: 20px;
    border: 0;
    border-radius: 9999px;
    background: #754be9;
    color: var(--color-background);
    font-family: var(--font-secondary);
    font-weight: 500;
    font-size: 12px;
    line-height: 18px;
    cursor: pointer;
    touch-action: manipulation;
    transition: background-color 0.2s ease, transform 0.1s cubic-bezier(0.55, 0, 0.1, 1);
  }

  .mr-feedback__btn:focus-visible { outline: 2px solid var(--color-primary-500); outline-offset: 2px; }
  .mr-feedback__btn:active { transform: scale(0.97); }

  .mr-feedback__error {
    margin: 0;
    color: var(--color-negative);
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    display: none;
  }
  .mr-feedback.is-invalid .mr-feedback__error { display: block; }

  /* ---------- tablet (768) ---------- */
  @media (max-width: 1023px) {
    .mr-feedback { padding-inline: 40px; padding-block: 60px; }
    .mr-feedback__inner { grid-template-columns: 1fr; row-gap: 32px; }
    .mr-feedback__title { font-size: 28px; line-height: 1.3;}
  }

  /* ---------- mobile (375) ---------- */
  @media (max-width: 767px) {
    .mr-feedback { padding-inline: 20px; padding-block: 40px; }

    .mr-feedback__title { font-size: 22px; line-height: 1.3;}
    .mr-feedback__desc { font-size: 16px; line-height: 22px; }

    /* two-field row stacks on mobile */
    .mr-feedback__inputs-row { grid-template-columns: 1fr; gap: 12px; }
    .mr-feedback__field { flex: 0 0 auto; width: 100%; }
    .mr-feedback__check-text { font-size: 12px; }
  }

  @media (prefers-reduced-motion: reduce) {
    .mr-feedback *,
    .mr-feedback *::before,
    .mr-feedback *::after {
      animation-duration: 0.01ms !important;
      transition-duration: 0.01ms !important;
    }
  }

/* ==== data-ds-template="40cfd984-b0c5-4310-8748-936ddb752b91" ==== */
.hero-first-screen {
    background-color: var(--color-background);
    /* fixed header height: 115 desktop / 56 tablet+mobile */
    --header-offset: 115px;
  }

  /* ---- content grid ---- */
  .hero-first-screen__container {
    max-inline-size: 1440px;
    margin-inline: auto;
    padding-inline: 60px;
    padding-block: calc(60px + var(--header-offset)) 60px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    column-gap: 12px;
    row-gap: 24px;
    align-items: center;
  }

  .hero-first-screen__breadcrumbs {
    grid-column: 1;
    grid-row: 1;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    color: var(--color-neutral-400);
    font-size: 12px;
    line-height: 1.2;
  }

  .hero-first-screen__breadcrumbs a {
    color: inherit;
    text-decoration: none;
  }

  .hero-first-screen__breadcrumbs a:hover {
    color: var(--color-neutral-900);
  }

  .hero-first-screen__crumb-sep {
    color: var(--color-neutral-300);
  }

  .hero-first-screen__media {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    aspect-ratio: 654 / 350;
    clip-path: polygon(19.2% 4.34%, 100% 0%, 95.77% 94.01%, 0% 100%);
  }

  .hero-first-screen__media img {
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
    display: block;
  }

  .hero-first-screen__text {
    grid-column: 1;
    grid-row: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
  }

  .hero-first-screen__textblock {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .hero-first-screen__title {
    margin: 0;
    color: var(--color-neutral-900);
    font-family: var(--font-secondary);
    font-weight: 500;
    font-size: 46px;
    line-height: 1.22;
    text-wrap: balance;
  }

  .hero-first-screen__description {
    margin: 0;
    color: var(--color-neutral-600);
    font-size: 16px;
    line-height: 1.25;
  }

  .hero-first-screen__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    font-family: var(--font-secondary);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.2;
    padding-block: 13px;
    padding-inline: 20px;
    min-block-size: 44px;
    text-decoration: none;
    background-color: var(--color-primary-500);
    color: #ffffff;
    border-radius: 9999px;
  }

  /* Tablet (&le;1023) */
  @media (max-width: 1023px) {
    .hero-first-screen {
      --header-offset: 56px;
    }

    .hero-first-screen__container {
      padding-inline: 40px;
    }

    .hero-first-screen__breadcrumbs {
      font-size: 11px;
    }

    .hero-first-screen__title {
      font-size: 24px;
      line-height: 1.25;
    }

    .hero-first-screen__description {
      font-size: 14px;
      line-height: 1.3;
    }
  }

  /* Mobile (&le;767): stacked layout */
  @media (max-width: 767px) {
    .hero-first-screen__container {
      grid-template-columns: 1fr;
      grid-template-rows: auto auto auto;
      padding-inline: 20px;
      padding-block: calc(20px + var(--header-offset)) 40px;
      column-gap: 0;
      row-gap: 20px;
    }

    .hero-first-screen__breadcrumbs {
      grid-column: 1;
      grid-row: 1;
    }

    .hero-first-screen__media {
      grid-column: 1;
      grid-row: 2;
      aspect-ratio: 338 / 290;
    }

    .hero-first-screen__text {
      grid-column: 1;
      grid-row: 3;
      gap: 20px;
    }

    .hero-first-screen__textblock {
      gap: 8px;
    }

    .hero-first-screen__cta {
      align-self: stretch;
      inline-size: 100%;
    }
  }

/* ==== id="cms-element-sizes-saved" ==== */
@media (min-width: 1024px) {
  .hero-school .hero-school__bg { max-width: 100%; }
  .hero-school .hero-school-card-1-photo { max-width: 100%; }
  .hero-school .hero-school-card-2-photo { max-width: 100%; }
  .hero-school .hero-school-card-3-photo { max-width: 100%; }
  .hero-first-screen .hero-first-screen-image { max-width: 100%; }
  .hero-school .hero-school-card-4-photo { max-width: 100%; }
  .hero-school .hero-school-card-5-photo { max-width: 100%; }
  .hero-school .hero-school-card-6-photo { max-width: 100%; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .footer .fb__col.fb__col--address { width: calc(352 / 7.68 * 1vw); height: calc(43 / 7.68 * 1vw); }
}

/* ==== id="cms-element-text-saved" ==== */
@media (min-width: 1024px) {
  .header.header-ondark .header-ondark-phone { color: rgb(255, 255, 255); }
}

/* ==== id="cms-element-position-saved" ==== */
@media (min-width: 768px) and (max-width: 1023px) {
  .hero-first-screen .hero-first-screen__container { position: relative; top: 0; left: 0; }
}

/* ==== data-ds-template="3610c65f-bcb4-46e1-b226-4ecc1e2b44d9" ==== */
/* ==== mr-group / hero / school ==== "&#1053;&#1072;&#1095;&#1072;&#1083;&#1100;&#1085;&#1072;&#1103; &#1096;&#1082;&#1086;&#1083;&#1072; &#1074; &#1046;&#1050; &#1052;&#1077;&#1090;&#1088;&#1086;&#1087;&#1086;&#1083;&#1080;&#1103;"
     Full-bleed bg image + top gradient + headline (h1, info tags, CTA)
     + slider (prev/next round buttons &mdash; back disabled at slide 1; 3 mini-banner cards per slide). */

  .hero-school {
    position: relative;
    isolation: isolate;
    background-color: #F5F5F5;
    color: #ffffff;
    overflow: hidden;
    /* fixed header height: 115 desktop / 56 tablet+mobile */
    --header-offset: 115px;
  }

  .hero-school__bg {
    position: absolute;
    inset-block-start: 0;
    inset-inline: 0;
    inline-size: 100%;
    block-size: calc(100% - 95px);
    object-fit: cover;
    z-index: -2;
  }

  .hero-school__overlay {
    position: absolute;
    inset-block-start: 0;
    inset-inline: 0;
    inline-size: 100%;
    block-size: calc(100% - 95px);
    z-index: -1;
    background:
      linear-gradient(180deg, rgba(9, 7, 20, 0.55) 0%, rgba(9, 7, 20, 0.15) 30%, rgba(9, 7, 20, 0.10) 60%, rgba(9, 7, 20, 0.55) 100%);
  }

  .hero-school__inner {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-block-size: calc(700px + var(--header-offset));
    max-inline-size: 1440px;
    margin-inline: auto;
    padding-inline: 60px;
    padding-block: calc(40px + var(--header-offset)) 95px;
  }

  .hero-school__headline {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    margin-block-end: auto;
  }

  .hero-school__title {
    margin: 0;
    color: #ffffff;
    font-family: var(--font-secondary);
    font-weight: 500;
    font-size: 54px;
    line-height: 1.22;
    text-wrap: balance;
  }

  .hero-school__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
  }

  .hero-school__tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding-inline: 12px;
    padding-block: 6px;
    border-radius: 999px;
    background-color: rgba(9, 7, 20, 0.35);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    color: #ffffff;
    font-family: var(--font-primary, "Suisse Intl", sans-serif);
    font-size: 13px;
    line-height: 20px;
  }

  .hero-school__tag-icon {
    flex: 0 0 auto;
    inline-size: 16px;
    block-size: 16px;
  }

  /* ---- slider ---- */
  .hero-school__slider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-inline: -60px;
    transform: translateY(50%);
  }

  .hero-school__nav {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-inline-start: 60px;
    padding: 8px;
    flex-shrink: 0;
    block-size: fit-content;
    background-color: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border-radius: 9999px;
  }

  .hero-school__nav-btn {
    inline-size: 70px;
    block-size: 70px;
    border: 0;
    border-radius: 9999px;
    background-color: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    color: #090714;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    touch-action: manipulation;
    transition: opacity 0.2s ease, transform 0.2s ease;
  }

  .hero-school__nav-btn img {
    inline-size: 12px;
    block-size: 12px;
  }



  .hero-school__nav-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
  }

  .hero-school__nav-btn:focus-visible {
    outline: 2px solid var(--color-accent, #754be9);
    outline-offset: 2px;
  }

  .hero-school__viewport {
    overflow: hidden;
    flex: 1;
  }

  .hero-school__track {
    display: flex;
    gap: 12px;
    transition: transform 0.4s var(--dds-ease-out-expo, cubic-bezier(.16, 1, .3, 1));
    will-change: transform;
  }

  .hero-school__slide {
    display: flex;
    gap: 12px;
    flex: 0 0 100%;
  }

  /* split card: white content block (left) + masked photo (right) */
  .hero-school__card {
    display: flex;
    align-items: stretch;
    overflow: hidden;
    border-radius: 16px;
    background-color: #ffffff;
    color: #090714;
    text-decoration: none;
    flex: 0 0 401px;
    inline-size: 401px;
    block-size: 150px;
  }

  .hero-school__card-body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    z-index: 2;
    flex: 1;
    min-inline-size: 0;
    padding-block: 16px;
    padding-inline-start: 16px;
  }

  .hero-school__card-title {
    margin: 0;
    color: #090714;
    font-family: var(--font-secondary);
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
  }

  .hero-school__card-tags {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .hero-school__card-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding-inline: 9px;
    padding-block: 4px;
    border: 1px solid var(--color-neutral-300, #d0d1d7);
    border-radius: 20px;
    background-color: #ffffff;
    color: #8e9099;
    font-family: var(--font-primary, "Suisse Intl", sans-serif);
    font-size: 13px;
    line-height: 20px;
    white-space: nowrap;
  }

  .hero-school__card-pill--price {
    color: #d50c15;
    border: 0;
  }

  .hero-school__card-station {
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .hero-school__card-metro-dot {
    flex: 0 0 auto;
    inline-size: 8px;
    block-size: 8px;
    border-radius: 50%;
    background-color: var(--metro-color, #943e90);
  }

  .hero-school__card-walk {
    flex: 0 0 auto;
    inline-size: 16px;
    block-size: 16px;
  }

  .hero-school__card-img {
    flex: 0 0 168px;
    inline-size: 168px;
    block-size: 100%;
    object-fit: cover;
    /* cut: left-bottom corner sliced diagonally, photo flush to the right edge */
    clip-path: polygon(0 0, 100% 0, 100% 100%, 22.4% 100%, 0 0);
  }

  /* Tablet + Mobile (&le;1023): no slider buttons &mdash; cards in a horizontal scroll row */
  @media (max-width: 1023px) {
    .hero-school { --header-offset: 56px; }
    .hero-school__inner { padding-inline: 40px; padding-block: calc(40px + var(--header-offset)) 133px; }
    .hero-school__bg, .hero-school__overlay { block-size: calc(100% - 133px); }
    .hero-school__title { font-size: 32px; }
    .hero-school__nav { display: none; }
    .hero-school__slider { margin-inline: -40px; min-width: 0; transform: translateY(70%); }
    .hero-school__viewport { overflow: hidden; min-width: 0; }
    .hero-school__track {
      overflow-x: auto;
      scroll-snap-type: x mandatory;
      transform: none;
      inline-size: 100%;
      margin-inline-start: 40px;
      padding-inline-start: 0;
      padding-inline-end: 40px;
      scrollbar-width: none;
      -webkit-overflow-scrolling: touch;
    }
    .hero-school__track::-webkit-scrollbar { display: none; }
    .hero-school__slide { display: contents; }
    .hero-school__card { flex: 0 0 324px; inline-size: 324px; scroll-snap-align: start; }
  }

  @media (max-width: 767px) {
    .hero-school__inner { padding-inline: 20px; padding-block: calc(60px + var(--header-offset)) 133px; min-block-size: calc(600px + var(--header-offset)); }
    .hero-school__bg, .hero-school__overlay { block-size: calc(100% - 133px); }
    .hero-school__title { font-size: 23px; }
    .hero-school__headline { gap: 16px; margin-block-end: 24px; }
    .hero-school__tags { flex-direction: column; align-items: flex-start; }
    .hero-school__slider { margin-inline: -20px; transform: translateY(70%); }
    .hero-school__track {
      margin-inline-start: 20px;
      padding-inline-start: 0;
      padding-inline-end: 20px;
    }
    .hero-school__card { flex: 0 0 324px; }
    .hero-school__card-pill { font-size: 12px; }
    .hero-school__card-img { flex-basis: 150px; inline-size: 150px; }
  }

  @media (prefers-reduced-motion: reduce) {
    .hero-school__track { transition: none; }
  }

/* ==== id="cms-element-layouts-saved" ==== */

/* ==== data-ds-template="1e0c3a92-2b4f-4c9d-8e1a-7f6b5c4d3a01" ==== */
.about {
    background-color: var(--color-surface);
  }

  .about__container {
    max-inline-size: 1440px;
    margin-inline: auto;
    padding-inline: 60px;
    padding-block: 60px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 40px;
    align-items: start;
  }

  .about__headline-block {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  .about__title {
    margin: 0;
    font-family: var(--font-secondary);
    font-weight: 500;
    font-size: 32px;
    line-height: 1.3125;
    color: var(--color-neutral-900);
    text-wrap: balance;
  }

  .about__tags {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    column-gap: 8px;
    row-gap: 8px;
  }

  .about__tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-block-size: 32px;
    padding-inline: 10px;
    border: 1px solid var(--color-neutral-200);
    border-radius: var(--btn-radius);
    font-family: var(--font-primary);
    font-size: 14px;
    line-height: 1.2;
    color: var(--color-neutral-900);
    white-space: nowrap;
  }

  .about__body-block {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  .about__body {
    margin: 0;
    font-family: var(--font-primary);
    font-size: 16px;
    line-height: 1.4444;
    color: var(--color-neutral-900);
  }

  .about__body p {
    margin: 0;
  }

  .about__body p + p {
    margin-block-start: 20px;
  }

  /* 1280px */
  @media (max-width: 1439px) {
    .about__container {
      column-gap: 24px;
    }

    .about__headline-block,
    .about__body-block {
      gap: 20px;
    }

    .about__title {
      font-size: 28px;
      line-height: 1.2857;
    }

    .about__body {
      font-size: 16px;
      line-height: 1.375;
    }
  }

  /* 1024px &mdash; still two columns, tighter padding */
  @media (max-width: 1279px) {
    .about__container {
      padding-inline: 40px;
      padding-block: 40px;
      column-gap: 32px;
    }

    .about__title {
      font-size: 18px;
      line-height: 1.4444;
    }

    .about__body {
      line-height: 1.25;
    }
  }

  /* 768px &mdash; stack vertically */
  @media (max-width: 1023px) {
    .about__container {
      grid-template-columns: 1fr;
      column-gap: 0;
      row-gap: 32px;
    }
  }

  /* 375px mobile */
  @media (max-width: 767px) {
    .about__container {
      padding-inline: 20px;
      row-gap: 32px;
    }

    .about__title {
      font-size: 20px;
      line-height: 1.3;
    }

    .about__tag {
      padding-inline: 8px;
      font-size: 13px;
    }
  }
