@media (min-width: 901px) {
  .hero {
    height: calc(100svh - 100px);
    min-height: 620px;
  }

  @supports (height: 100dvh) {
    .hero {
      height: calc(100dvh - 100px);
    }
  }
}

.hero__mobile-headline {
  display: none;
}

.hero__mobile-headline:not([data-ready]) {
  visibility: hidden;
}

.site-nav__logo {
  display: block;
  width: 190px;
  height: auto;
}

@media (min-width: 901px) and (max-height: 700px) {
  .hero {
    height: calc(100svh - 84px);
    min-height: 500px;
    padding-top: 20px;
  }

  @supports (height: 100dvh) {
    .hero {
      height: calc(100dvh - 84px);
    }
  }

  .hero__icons {
    top: 24px;
    right: 24px;
    gap: 10px;
  }

  .hero__caption {
    right: 24px;
    bottom: 24px;
    max-width: 320px;
    font-size: var(--type-body-size);
  }

  .site-nav {
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .site-nav__inner {
    min-height: 42px;
    gap: 24px;
  }

  .site-nav__brand {
    font-size: var(--type-ui-size);
  }

  .site-nav__links {
    gap: 40px;
    font-size: var(--type-nav-size);
  }

  .site-nav__button {
    min-height: 36px;
    padding-inline: 22px;
    font-size: var(--type-nav-size);
  }
}

@media (min-width: 1201px) and (max-width: 1365px) {
  .methods {
    margin-top: 132px;
  }

  .methods__headline {
    max-width: 900px;
    margin-bottom: 68px;
  }
}

@media (min-width: 901px) and (max-width: 1280px) {
  .methods {
    margin-top: 128px;
  }
}

@media (max-width: 1920px) {
  .clients__content {
    grid-template-columns: minmax(0, 1fr) 5%;
  }

  .clients__grid {
    grid-template-columns: 0.75fr 1fr 1fr 1fr;
    gap: 110px 55px;
  }

  .clients__ghost {
    display: block;
  }
}

@media (max-width: 1200px) {
  .methods__intro {
    width: 100%;
    max-width: 980px;
    margin-left: 0;
  }

  .methods__headline {
    max-width: 980px;
  }

  .split-layout,
  .tariff {
    grid-template-columns: 1fr;
    row-gap: 32px;
  }

  .site-nav__links {
    gap: 34px;
  }

  .works__slider {
    height: 520px;
  }

  .tariff__controls {
    top: 18px;
    right: 18px;
  }

  .request-form__bottom {
    grid-template-columns: 1fr;
    gap: 38px;
  }

  .tariff__image,
  .tariff__content {
    height: auto;
    min-height: 420px;
  }

  .clients .section__label,
  .clients__content {
    grid-column: 1;
  }

  .clients__content {
    grid-template-columns: 1fr;
    column-gap: 0;
  }

  .clients__grid {
    grid-column: 1;
  }

  .clients__ghost {
    display: none;
  }

  .site-footer__inner {
    grid-template-columns: 1fr;
  }

  .site-footer__content {
    grid-column: 1;
    padding: 0 36px;
  }
}

@media (min-width: 1025px) and (max-width: 1200px) {
  .tariff {
    grid-template-columns: minmax(0, 0.88fr) minmax(0, 1fr);
    column-gap: 24px;
    row-gap: 0;
  }

  .tariff__image,
  .tariff__content {
    height: clamp(420px, 42vw, 500px);
    min-height: clamp(420px, 42vw, 500px);
  }

  .tariff__content {
    padding: clamp(32px, 3vw, 44px) clamp(22px, 2.6vw, 34px);
  }

  .tariff__meta {
    margin-top: 24px;
  }

  .tariff__content p + .tariff__footer {
    margin-top: 12px;
  }
  
  .tariff__footer {
    gap: 14px;
  }

  .tariff__button {
    flex-basis: 250px;
    width: 250px;
  }

  .tariff__price {
    gap: 12px;
  }
}
.br-footer-tablet {
    display: none;
  }
@media (min-width: 901px) and (max-width: 1024px) {
  .br-footer-tablet {
    display: block;
  }

  .tariff {
    --tariff-mobile-slide-max-width: 760px;
    --tariff-mobile-slide-width: min(calc(100vw - 64px), var(--tariff-mobile-slide-max-width));
    grid-template-columns: 1fr;
    padding-inline: 32px;
    row-gap: 0;
  }

  .tariff__mobile {
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
    touch-action: pan-y;
  }

  .tariff__mobile-track {
    display: flex;
    gap: 18px;
    will-change: transform;
    transition: transform 560ms var(--motion-ease-soft);
  }

  .tariff__mobile-slide {
    min-width: 0;
    flex: 0 0 var(--tariff-mobile-slide-width);
    width: var(--tariff-mobile-slide-width);
    overflow: hidden;
    background: var(--surface);
    border-radius: 30px;
    gap: 0;
  }

  .tariff__mobile-image,
  .tariff__mobile-content {
    width: var(--tariff-mobile-slide-width);
    min-width: 0;
    overflow: hidden;
    border-radius: 30px;
    background: var(--surface);
  }

  .tariff__mobile-image {
    height: min(420px, calc(var(--tariff-mobile-slide-width) * 0.72));
  }

  .tariff__mobile-image picture,
  .tariff__mobile-image img {
    display: block;
    width: 100%;
    height: 100%;
  }

  .tariff__mobile-image img {
    object-fit: cover;
    object-position: center center;
  }

  .tariff__mobile-content {
    display: flex;
    flex-direction: column;
    margin-left: 0;
    padding: 30px 24px 72px;
  }

  .tariff__mobile-copy {
    display: block;
    min-height: 0;
    text-align: center;
  }

  .tariff__mobile-copy h2 {
    width: 100%;
    margin: 0 0 30px;
    color: var(--text-light);
    text-align: center;
  }

  .tariff__mobile-copy p {
    max-width: none;
    margin: 0 0 40px;
    color: var(--text-muted);
    text-align: center;
    line-height: 1.41;
  }

  .tariff__mobile-meta {
    display: grid;
    justify-items: center;
    width: 100%;
    margin-top: 0;
    row-gap: 0;
  }

  .tariff__mobile-price {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    gap: 10px;
    white-space: nowrap;
  }

  .tariff__mobile-price span {
    color: var(--text-muted);
    font-size: 12px;
    line-height: 1.5;
  }

  .tariff__mobile-pagination {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 32px;
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: var(--tariff-mobile-slide-width);
  }

  .tariff__mobile-dot {
    width: 10px;
    height: 10px;
    padding: 0;
    border: 1px solid var(--accent);
    border-radius: 999px;
    background: transparent;
  }

  .tariff__mobile-dot.is-active {
    background: var(--accent);
  }

  .tariff__mobile .tariff__button {
    width: min(256px, 100%);
    height: 50px;
    min-height: 50px;
    margin-top: 20px;
    padding: 0;
    border: 1px solid #919191;
    border-radius: 10px;
  }

  .tariff__image,
  .tariff__content,
  .tariff__controls {
    display: none;
  }
}

@media (min-width: 700px) and (max-width: 1200px) {
  .works .swiper-slide {
    width: calc((var(--works-slider-width, 100vw) - var(--works-gap)) / 2);
  }
}

@media (max-width: 1023px) {
  .tariff {
    grid-template-columns: 1fr;
    row-gap: 24px;
  }

  .tariff__image,
  .tariff__content {
    height: auto;
    min-height: 0;
  }

  .clients__content {
    grid-template-columns: 1fr;
    row-gap: 0;
  }

  .clients__ghost {
    display: none;
  }

  .clients__grid {
    grid-column: 1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 40px 44px;
    justify-items: center;
  }
}

@media (min-width: 700px) and (max-width: 1024px) {
  .clients__grid .client-logo,
  .clients__grid img.client-logo,
  .clients__grid .client-logo:nth-child(4n + 1),
  .client-logo--gazprombank,
  .client-logo--tass,
  .client-logo--vtb,
  .client-logo--rosoboronexport,
  .client-logo--nornickel,
  .client-logo--rosatom,
  .client-logo--sber,
  .client-logo--lukoil,
  .client-logo--ugmk,
  .client-logo--moscow-chamber,
  .client-logo--s7,
  .client-logo--fosagro {
    justify-self: center;
    align-self: center;
  }
}

@media (max-width: 900px) {
  :root {
    --motion-distance: 26px;
    --section-space: 120px;
    --section-space-compact: 88px;
    --title-line-height-soft: 1.2;
    --mobile-card-radius: 30px;
    --mobile-card-padding: 20px;
    --tariff-mobile-card-padding-y: 30px;
    --mobile-card-gap: 10px;
    --mobile-title-size: 18px;
    --mobile-title-line: 1;
    --mobile-body-size: 14px;
    --mobile-body-line: 1.41;
    --mobile-button-radius: 10px;
  }

  .methods {
    margin-top: 88px;
    padding-inline: 20px;
  }

  .methods__intro {
    width: 100%;
    max-width: 100%;
    margin-bottom: 0;
    margin-left: 0;
  }

  .methods__headline {
    max-width: 100%;
    margin: 0 0 60px;
  }

  .methods__subtitle {
    display: block;
    margin: 0;
    color: var(--text-muted);
    font-size: var(--type-section-size);
    font-weight: var(--type-section-weight);
    line-height: var(--type-section-line);
  }

  .methods__accent-line {
    display: block;
    width: 19px;
    height: 2px;
    margin-top: 10px;
    margin-bottom: 40px;
    background: var(--accent);
  }

  .methods__layout {
    row-gap: 60px;
  }

  .methods__label {
    display: none;
  }

  .tariff {
    --tariff-mobile-slide-max-width: 600px;
    --tariff-mobile-slide-width: min(calc(100vw - 40px), var(--tariff-mobile-slide-max-width));
  }

  .tariff__mobile {
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
    touch-action: pan-y;
  }

  .tariff__mobile-track {
    display: flex;
    gap: 18px;
    will-change: transform;
    transition: transform 560ms var(--motion-ease-soft);
  }

  .tariff__mobile-slide {
    min-width: 0;
    flex: 0 0 var(--tariff-mobile-slide-width);
    width: var(--tariff-mobile-slide-width);
    overflow: hidden;
    background: var(--surface);
    border-radius: var(--mobile-card-radius);
    gap: 0;
  }

  .tariff__mobile-image,
  .tariff__mobile-content {
    min-width: 0;
    overflow: hidden;
    border-radius: var(--mobile-card-radius);
    background: var(--surface);
  }

  .tariff__mobile-image {
    height: min(420px, var(--tariff-mobile-slide-width));
  }

  .tariff__mobile-image picture,
  .tariff__mobile-image img {
    display: block;
    width: 100%;
    height: 100%;
  }

  .tariff__mobile-image img {
    object-fit: cover;
    object-position: center center;
  }

  .tariff__mobile-content {
    display: flex;
    flex-direction: column;
    margin-left: 0;
    padding: var(--tariff-mobile-card-padding-y) var(--mobile-card-padding) 72px;
  }

  .tariff__mobile-meta {
    display: grid;
    justify-items: center;
    width: 100%;
    margin-top: 0;
    row-gap: 0;
  }

  .tariff__mobile-price {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    gap: 10px;
    color: var(--text-light);
    font-size: var(--mobile-title-size);
    font-weight: 400;
    line-height: var(--mobile-title-line);
    white-space: nowrap;
  }

  .tariff__mobile-price span {
    color: var(--text-muted);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
  }

  .tariff__mobile-pagination {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 32px;
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
  }

  .tariff__mobile-dot {
    width: 10px;
    height: 10px;
    padding: 0;
    border: 1px solid var(--accent);
    border-radius: 999px;
    background: transparent;
    transition: background-color var(--transition), transform var(--transition), opacity var(--transition);
  }

  .tariff__mobile-dot.is-active {
    background: var(--accent);
  }

  .tariff__mobile-dot:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
  }

  .tariff__mobile-slide [data-tariff-pagination] {
    display: none;
  }

  .tariff__mobile-image,
  .tariff__mobile-content,
  .tariff__mobile-pagination {
    width: var(--tariff-mobile-slide-width);
  }

  .tariff__mobile-copy {
    display: block;
    min-height: 0;
    justify-items: start;
    text-align: center;
  }

  .tariff__mobile-copy h2 {
    display: block;
    width: 100%;
    margin: 0 0 30px;
    padding: 0;
    color: var(--text-light);
    text-align: center;
    font-size: var(--mobile-title-size);
    font-weight: 400;
    line-height: var(--mobile-title-line);
    letter-spacing: 0;
  }

  .tariff__mobile-copy p {
    max-width: none;
    margin: 0 0 40px;
    color: var(--text-muted);
    text-align: center;
    font-size: var(--mobile-body-size);
    font-weight: 400;
    line-height: var(--mobile-body-line);
  }

  .tariff__mobile .tariff__button {
    width: min(256px, 100%);
    height: 50px;
    min-height: 50px;
    margin-top: 20px;
    padding: 0;
    border: 1px solid #919191;
    border-radius: var(--mobile-button-radius);
    font-size: var(--mobile-body-size);
    font-weight: 400;
    line-height: var(--mobile-body-line);
  }

  .tariff__image,
  .tariff__content,
  .tariff__controls {
    display: none;
  }

  .site-nav__links {
    display: none;
  }

  .site-footer__inner {
    padding-top: 80px;
    min-height: 340px;
    border-radius: 0;
  }

  .site-footer__content {
    width: 100%;
    margin: 0;
    padding: 0 40px;
  }

  .site-footer__title {
    font-size: var(--type-footer-title-size);
    font-weight: var(--type-footer-title-weight);
    line-height: var(--type-footer-title-line);
    letter-spacing: var(--type-footer-title-tracking);
    text-transform: var(--type-footer-title-transform);
  }

  .site-footer__title span {
    display: block;
  }

  .site-footer__line {
    width: 100%;
    height: 1px;
    margin: 50px 0 0;
    background: var(--text-muted);
    opacity: 0.5;
  }

  .site-footer__bottom {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    margin-top: 50px;
  }

  .site-footer__contacts {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    font-size: var(--type-footer-contact-size);
    font-weight: var(--type-footer-contact-weight);
    line-height: var(--type-footer-contact-line);
    text-transform: var(--type-footer-contact-transform);
  }

  .site-footer__divider {
    display: none;
  }

  .site-footer__button {
    display: flex;
    align-self: stretch;
    width: 100%;
    min-height: 54px;
    margin-top: 50px;
    margin-bottom: calc(40px + env(safe-area-inset-bottom, 0px));
    padding: 0;
    border: 1px solid #919191;
    border-radius: var(--mobile-button-radius);
    white-space: normal;
    background: transparent;
    color: var(--text-light);
  }

  .modal__dialog {
    min-height: min(92svh, 720px);
    padding: 64px 28px 36px;
    border-radius: 24px;
  }

  .modal__dialog--gallery {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas:
      "stage stage"
      "prev next";
    min-height: 0;
    max-height: 100dvh;
    height: 100dvh;
    align-content: stretch;
    justify-content: stretch;
    gap: 8px 12px;
    padding: 50px 12px 8px;
    border-radius: 0;
    overflow: hidden;
  }

  .gallery-modal__stage {
    grid-area: stage;
    width: 100%;
    min-height: 0;
    height: 100%;
    display: grid;
    justify-items: center;
  }

  .gallery-modal__viewport {
    width: 100%;
    height: 100%;
    min-height: 0;
    max-width: 100%;
    max-height: none;
  }

  .gallery-modal__viewport--loading {
    min-width: min(84vw, 640px);
  }

  .gallery-modal__placeholder {
    border: 0;
    box-shadow: none;
    background:
      linear-gradient(110deg, rgba(255, 255, 255, 0.08) 8%, rgba(255, 255, 255, 0.16) 18%, rgba(255, 255, 255, 0.08) 33%),
      rgba(255, 255, 255, 0.04);
  }

  .gallery-modal__loading-label {
    padding: 9px 12px;
    background: rgba(8, 8, 8, 0.74);
    font-size: 11px;
    letter-spacing: 0.05em;
  }

  .gallery-modal__viewport img {
    max-height: calc(100dvh - 116px);
    border: 0;
    border-radius: 0;
  }

  .gallery-modal__nav {
    justify-self: center;
    align-self: center;
    margin-top: 0;
  }

  .gallery-modal__nav--prev {
    grid-area: prev;
    margin-left: auto;
  }

  .gallery-modal__nav--next {
    grid-area: next;
    margin-right: auto;
  }

  .modal__close {
    top: 24px;
    right: 24px;
  }

  .request-form__fields {
    grid-template-columns: 1fr;
    gap: 22px;
    margin-bottom: 38px;
  }

  .request-form__phone-control::after {
    height: 1px;
  }

  .request-form__field:not(.request-form__field--phone)::after {
    height: 1px;
  }

  .request-form__lead {
    margin: 38px 0 44px;
    font-size: var(--type-body-size);
  }

  .request-form__contacts {
    align-items: flex-start;
    flex-direction: column;
    gap: 14px;
    font-size: var(--type-body-size);
  }

  .request-form__consent-block {
    margin-bottom: 48px;
  }

  .request-form__view--success {
    background-size: clamp(220px, 48%, 420px) auto;
  }
}

@media (min-width: 700px) and (max-width: 900px) {
  .hero__caption {
    max-width: min(70%, 520px);
    bottom: 56px;
    font-size: 32px;
  }

  .site-nav {
    margin-top: 26px;
    padding: 0 20px;
    border-bottom: 0;
    padding-bottom: 15px;
  }

  .site-nav::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 1px;
    background: #272727;
  }

  .site-nav__inner {
    min-height: 30px;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
  }

  .site-nav__brand {
    min-width: 0;
    font-size: 0;
    letter-spacing: 0;
    overflow: visible;
  }

  .site-nav__logo {
    width: min(146px, 100%);
    height: auto;
  }

  .site-nav__links {
    display: none;
  }

  .site-nav__button {
    justify-self: end;
    width: 105px;
    height: 30px;
    min-height: 30px;
    margin-left: auto;
    padding: 0;
    border-radius: 10px;
  }
}

@media (min-width: 561px) and (max-width: 900px) {
  .works__slider {
    height: calc((var(--works-slider-width, 100vw) - var(--works-gap)) / 2);
  }

  .works .swiper-slide {
    width: calc((var(--works-slider-width, 100vw) - var(--works-gap)) / 2);
    height: 100%;
  }

  .site-footer__bottom {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 1fr);
    align-items: start;
    column-gap: 24px;
    margin-top: 50px;
  }

  .site-footer__contacts {
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
  }

  .site-footer__contacts a {
    white-space: nowrap;
  }

  .site-footer__divider {
    display: none;
  }

  .site-footer__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: start;
    justify-self: end;
    width: 100%;
    margin-top: 0;
    margin-bottom: calc(40px + env(safe-area-inset-bottom, 0px));
    padding-inline: 28px;
  }

  .modal__dialog--gallery {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "stage";
    grid-template-rows: minmax(0, 1fr);
  }

  .gallery-modal__nav {
    display: none;
  }

  .gallery-modal__stage {
    touch-action: none;
  }

  .modal--gallery .modal__overlay {
    opacity: calc(1 - (var(--gallery-dismiss-progress, 0) * 0.72));
  }

  .gallery-modal__stage.is-swipe-preparing {
    position: relative !important;
    display: block !important;
    overflow: hidden !important;
  }

  .gallery-modal__stage.is-swipe-preparing .gallery-modal__viewport--outgoing,
  .gallery-modal__stage.is-swipe-preparing .gallery-modal__viewport--incoming {
    position: absolute !important;
    inset: 0 !important;
    display: grid !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    grid-area: auto !important;
    will-change: transform, opacity !important;
  }

  .gallery-modal__stage.is-swiping-next .gallery-modal__viewport--outgoing {
    z-index: 2 !important;
    animation: gallery-tablet-slide-out-next 320ms var(--motion-ease-soft) both !important;
  }

  .gallery-modal__stage.is-swiping-prev .gallery-modal__viewport--outgoing {
    z-index: 2 !important;
    animation: gallery-tablet-slide-out-prev 320ms var(--motion-ease-soft) both !important;
  }

  .gallery-modal__stage.is-swiping-next .gallery-modal__viewport--incoming {
    z-index: 1 !important;
    animation: gallery-tablet-slide-in-next 320ms var(--motion-ease-soft) both !important;
  }

  .gallery-modal__stage.is-swiping-prev .gallery-modal__viewport--incoming {
    z-index: 1 !important;
    animation: gallery-tablet-slide-in-prev 320ms var(--motion-ease-soft) both !important;
  }

  @keyframes gallery-tablet-slide-out-next {
    from { opacity: 1; transform: translateX(0); }
    to { opacity: 0; transform: translateX(-100%); }
  }

  @keyframes gallery-tablet-slide-out-prev {
    from { opacity: 1; transform: translateX(0); }
    to { opacity: 0; transform: translateX(100%); }
  }

  @keyframes gallery-tablet-slide-in-next {
    from { opacity: 0; transform: translateX(100%); }
    to { opacity: 1; transform: translateX(0); }
  }

  @keyframes gallery-tablet-slide-in-prev {
    from { opacity: 0; transform: translateX(-100%); }
    to { opacity: 1; transform: translateX(0); }
  }
}

@media (min-width: 561px) and (max-width: 1024px) {
  .methods__intro {
    box-sizing: border-box;
    padding-inline-start: clamp(8px, 1.5vw, 14px);
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  :root {
    --page-x: 24px;
    --section-space: 132px;
    --section-space-compact: 104px;
    --type-display-size: 34px;
    --type-display-line: 1.06;
    --type-section-size: 24px;
    --type-section-line: 1.04;
    --type-body-size: 15px;
    --type-body-line: 1.45;
    --type-ui-size: 15px;
    --type-ui-line: 1.2;
    --type-nav-size: 14px;
    --type-price-size: 28px;
    --type-price-meta-size: 14px;
    --type-tariff-title-size: 28px;
  }

  .site-nav {
    margin-top: 20px;
    padding: 0 var(--page-x);
    border-bottom: 0;
    padding-bottom: 16px;
  }

  .site-nav::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 1px;
    background: #272727;
  }

  .site-nav__inner {
    min-height: 36px;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
  }

  .site-nav__brand {
    min-width: 0;
    font-size: 0;
    letter-spacing: 0;
    overflow: visible;
  }

  .site-nav__logo {
    width: 164px;
    height: auto;
  }

  .site-nav__links {
    display: none;
  }

  .site-nav__button {
    justify-self: end;
    width: 164px;
    height: 36px;
    min-height: 36px;
    padding: 0 14px;
    border-radius: 10px;
    font-size: var(--type-nav-size);
    line-height: 1;
  }

  .site-nav__button-label--full {
    display: inline;
  }

  .site-nav__button-label--short {
    display: none;
  }

  .methods {
    margin-top: 96px;
    padding-inline: var(--page-x);
  }

  .methods__intro {
    max-width: 100%;
    margin-left: 0;
  }

  .methods__headline {
    max-width: 720px;
    margin-bottom: 52px;
  }

  .methods__subtitle {
    font-size: var(--type-section-size);
  }

  .methods__accent-line {
    margin-bottom: 44px;
  }

  .section + .section {
    margin-top: 108px;
  }

  .works__slider {
    height: calc((var(--works-slider-width, 100vw) - var(--works-gap)) / 2);
  }

  .works .swiper-wrapper {
    gap: 16px;
  }

  .works .swiper-slide {
    width: calc((var(--works-slider-width, 100vw) - var(--works-gap)) / 2);
    height: 100%;
  }

  .advantages {
    padding-inline: var(--page-x);
    row-gap: 44px;
  }

  .advantages__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-top: 0;
  }

  .advantage-card {
    height: 286px;
  }

  .tariff {
    --tariff-mobile-slide-max-width: 720px;
    --tariff-mobile-slide-width: min(calc(100vw - (2 * var(--page-x))), var(--tariff-mobile-slide-max-width));
    padding-inline: var(--page-x);
    row-gap: 0;
  }

  .tariff__mobile {
    width: 100%;
    overflow: hidden;
  }

  .tariff__mobile-track {
    gap: 16px;
  }

  .tariff__mobile-image,
  .tariff__mobile-content,
  .tariff__mobile-pagination {
    width: var(--tariff-mobile-slide-width);
  }

  .tariff__mobile-image {
    height: min(440px, calc(var(--tariff-mobile-slide-width) * 0.72));
  }

  .tariff__mobile-content {
    padding: 32px 24px 68px;
  }

  .tariff__mobile-pagination {
    left: 0;
    right: 0;
    bottom: 24px;
  }

  .clients {
    padding-inline: var(--page-x);
    row-gap: 56px;
  }

  .clients__grid {
    gap: 44px 36px;
  }

  .delivery {
    padding-inline: var(--page-x);
  }

  .delivery__list {
    row-gap: 16px;
  }

  .site-footer__content {
    padding: 0 var(--page-x);
  }
}

@media (min-width: 901px) and (max-width: 1024px) {
  .gallery-modal__nav--prev {
    justify-self: end;
  }
}

@media (max-width: 560px) {
  :root {
    --motion-distance: 18px;
    --page-x: 20px;
    --section-space: 72px;
    --section-space-compact: 56px;
    --title-line-height-soft: 1.16;
    --mobile-card-radius: 30px;
    --mobile-card-padding: 20px;
    --tariff-mobile-card-padding-y: 30px;
    --mobile-card-gap: 10px;
    --mobile-title-size: 18px;
    --mobile-title-line: 1;
    --mobile-body-size: 14px;
    --mobile-body-line: 1.41;
    --mobile-button-radius: 10px;
  }

  .hero {
    height: auto;
    min-height: 0;
    padding: 20px 20px 0;
  }

  .hero__media {
    height: clamp(440px, calc(100svh - 122px), 534px);
    border-radius: 20px;
    overflow-anchor: none;
  }

  .hero__caption {
    display: none;
  }

  .hero__mobile-headline {
    position: absolute;
    left: 20px;
    right: 20px;
    bottom: 30px;
    z-index: 4;
    display: block;
    margin: 0;
    color: #fff;
    font-family: "Inter Hero", "Inter", Arial, sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: var(--type-section-line);
    letter-spacing: var(--type-display-tracking);
    text-align: left;
  }

  .hero__label {
    top: 26px;
    left: 20px;
    font-size: var(--type-caption-size);
    font-weight: var(--type-caption-weight);
    line-height: var(--type-caption-line);
    letter-spacing: var(--type-caption-tracking);
  }

  .hero__icons {
    top: 26px;
    left: auto;
    right: 20px;
    gap: 10px;
  }

  .hero__icon {
    width: 10px;
    height: 10px;
    flex: 0 0 10px;
  }

  .site-nav {
    margin-top: 26px;
    padding: 0 20px;
    border-bottom: 0;
    padding-bottom: 15px;
  }

  .site-nav::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 1px;
    background: #272727;
  }

  .site-nav__inner {
    min-height: 30px;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
  }

  .site-nav__brand {
    min-width: 0;
    font-size: 0;
    letter-spacing: 0;
    overflow: visible;
  }

  .site-nav__logo {
    width: min(146px, 100%);
    height: auto;
  }

  .site-nav__button {
    justify-self: end;
    width: 105px;
    height: 30px;
    min-height: 30px;
    padding: 0;
    border-radius: 10px;
    font-size: var(--type-nav-size);
    font-weight: var(--type-nav-weight);
    line-height: var(--type-nav-line);
  }

  .methods {
    margin-top: 56px;
    padding-inline: 20px;
  }

  .methods__intro {
    width: 100%;
    max-width: 100%;
    margin-bottom: 0;
  }

  .methods__headline {
    width: 100%;
    max-width: 335px;
    margin: 0 0 60px;
  }

  .methods__subtitle {
    display: block;
    max-width: 335px;
    margin: 0;
    color: var(--text-muted);
    font-size: var(--type-section-size);
    font-weight: var(--type-section-weight);
    line-height: var(--type-section-line);
  }

  .methods__accent-line {
    display: block;
    width: 19px;
    height: 2px;
    margin-top: 10px;
    margin-bottom: 40px;
    background: var(--accent);
  }

  .section__label::after {
    width: 19px;
    height: 2px;
    margin-top: 10px;
  }

  .section__label {
    max-width: 70%;
  }

  .section + .section {
    margin-top: 72px;
  }

  .methods__list,
  .advantages__grid,
  .delivery__list {
    gap: var(--mobile-card-gap);
  }

  .delivery__list {
    row-gap: 20px;
  }

  .methods__layout {
    row-gap: 60px;
  }

  .methods__label {
    display: none;
  }

  .method,
  .advantage-card,
  .delivery-item {
    width: 100%;
    border-radius: var(--mobile-card-radius);
  }

  .method,
  .advantage-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: var(--mobile-card-padding);
    gap: 0;
  }

  .method {
    min-height: 195px;
    padding: 30px 20px 20px 20px;
    transition:
      opacity var(--motion-duration) var(--motion-ease) var(--reveal-delay),
      transform var(--motion-duration) var(--motion-ease) var(--reveal-delay),
      filter var(--motion-duration) var(--motion-ease) var(--reveal-delay),
      box-shadow 260ms ease,
      background-color 260ms ease;
  }

  .method__content {
    width: 100%;
  }

  .method__title,
  .advantage-card h2,
  .tariff__mobile-copy h2 {
    font-size: var(--mobile-title-size);
    font-weight: 400;
    line-height: var(--mobile-title-line);
    letter-spacing: 0;
  }

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

  .method__body,
  .advantage-card p,
  .tariff__mobile-copy p,
  .delivery-item__lead,
  .delivery-item__body,
  .site-footer__button {
    font-size: var(--mobile-body-size);
    font-weight: 400;
    line-height: var(--mobile-body-line);
  }

  .method__body {
    margin-top: 12px;
  }

  .method__icon {
    position: static;
    order: -1;
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-self: flex-start;
    margin: 0 0 40px;
    transform: none;
    transition: none;
  }

  .method__icon-svg {
    width: 100%;
    height: 100%;
  }

  .works__slider {
    height: 335px;
  }

  .works .swiper-wrapper {
    gap: 10px;
  }

  .works .swiper-slide {
    width: 335px;
    height: 335px;
    border-radius: 30px;
  }

  .advantages {
    padding-inline: 20px;
    row-gap: 40px;
  }

  .advantages__grid {
    grid-template-columns: 1fr;
    margin-top: 0;
  }

  .advantage-card {
    height: auto;
    min-height: 130px;
  }

  .advantage-card h2 {
    margin: 0 0 12px;
  }

  .advantage-card h2 br {
    display: none;
  }

  .advantage-card p .br-wide,
  .advantage-card p br.br-wide {
    display: none;
  }

  .tariff {
    padding-inline: 0;
    row-gap: 0;
  }

  .tariff__mobile {
    padding-left: 20px;
  }

  .tariff__mobile-track {
    gap: 10px;
  }

  .tariff__mobile-slide {
    overflow: hidden;
    background: var(--surface);
    border-radius: var(--mobile-card-radius);
    gap: 0;
  }

  .tariff__mobile-image,
  .tariff__mobile-content {
    border-radius: var(--mobile-card-radius);
  }

  .tariff__mobile-image {
    height: 335px;
  }

  .tariff__mobile-content {
    margin-left: 0;
    padding: var(--tariff-mobile-card-padding-y) var(--mobile-card-padding) 54px;
    background: var(--surface);
  }

  .tariff__mobile-copy h2 {
    display: block;
    width: 100%;
    margin: 0 0 30px;
    padding: 0;
    color: var(--text-light);
    text-align: center;
  }

  .tariff__mobile-copy p {
    max-width: none;
    margin: 0 0 40px;
    color: var(--text-muted);
    text-align: center;
    line-height: 1.41;
  }

  .tariff__mobile-copy {
    display: block;
    min-height: 0;
    justify-items: start;
    text-align: center;
  }

  .tariff__mobile-meta {
    margin-top: 0;
    row-gap: 0;
    justify-items: center;
  }

  .tariff__mobile-price {
    justify-content: center;
    font-size: var(--mobile-title-size);
    font-weight: 400;
    line-height: var(--mobile-title-line);
  }

  .tariff__mobile-price span {
    color: var(--text-muted);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
  }

  .tariff__mobile .tariff__button {
    width: 256px;
    height: 50px;
    min-height: 50px;
    margin-top: 20px;
    padding: 0;
    border: 1px solid #919191;
    border-radius: var(--mobile-button-radius);
    font-size: var(--mobile-body-size);
    font-weight: 400;
    line-height: var(--mobile-body-line);
  }

  .tariff__controls {
    display: none;
  }

  .tariff__mobile-pagination {
    left: 20px;
    right: auto;
    gap: 14px;
    bottom: 20px;
  }

  .tariff__mobile-dot {
    width: 9px;
    height: 9px;
    border-color: var(--text-muted);
    background: transparent;
  }

  .tariff__mobile-dot.is-active {
    border-color: var(--accent);
    background: var(--accent);
  }

  .clients {
    padding-inline: 20px;
    row-gap: 40px;
  }

  .clients__content {
    margin-top: 0;
  }

  .clients__grid {
    width: 100%;
    max-width: none;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 52px;
    justify-content: stretch;
    align-items: center;
    row-gap: 50px;
    column-gap: clamp(20px, 4vw, 36px);
  }

  .client-logo,
  .clients__grid img.client-logo {
    max-width: none;
    max-height: none;
    justify-self: center;
    align-self: center;
  }

  .clients__grid .client-logo {
    justify-self: center;
  }

  .clients__grid .client-logo:nth-child(4n + 1) {
    justify-self: center;
  }

  .client-logo--gazprombank {
    order: 1;
    justify-self: center;
  }

  .client-logo--tass {
    order: 2;
    justify-self: center;
  }

  .client-logo--vtb {
    order: 3;
    justify-self: center;
  }

  .client-logo--rosoboronexport {
    order: 4;
    justify-self: center;
  }

  .client-logo--nornickel {
    order: 5;
    justify-self: center;
  }

  .client-logo--rosatom {
    order: 6;
    justify-self: center;
  }

  .client-logo--sber {
    order: 7;
    justify-self: center;
  }

  .client-logo--lukoil {
    order: 8;
    justify-self: center;
  }

  .client-logo--ugmk {
    order: 9;
    justify-self: center;
  }

  .client-logo--moscow-chamber {
    order: 10;
    justify-self: center;
  }

  .client-logo--s7 {
    order: 11;
    justify-self: center;
  }

  .client-logo--fosagro {
    order: 12;
    justify-self: center;
  }

  .delivery {
    padding-inline: 20px;
    row-gap: 40px;
  }

  .delivery__list {
    margin-top: 0;
  }

  .method:hover,
  .method:focus-within,
  .advantage-card:hover,
  .works .swiper-slide:hover,
  .delivery-item:hover {
    transform: none;
    box-shadow: none;
  }

  .method:hover .method__icon,
  .method:focus-within .method__icon,
  .method:active .method__icon {
    transform: none;
  }

  .works .swiper-slide:hover img,
  .tariff__image:hover img,
  .clients__grid .client-logo:hover {
    transform: none;
    filter: none;
  }

  .delivery-item:hover .delivery-item__icon,
  .delivery-item:hover .delivery-item__toggle {
    transform: none;
  }

  .delivery-item:hover .delivery-item__toggle {
    opacity: 1;
  }
  .client-logo--rosatom {
    width: 44px;
    height: 44px;
  }

  .delivery-item__head {
    min-height: 0;
    grid-template-columns: 30px minmax(0, 1fr) 24px;
    grid-template-areas:
      "icon . toggle"
      "lead lead lead";
    row-gap: 35px;
    column-gap: 16px;
    padding: var(--mobile-card-padding);
  }

  .delivery-item__icon {
    grid-area: icon;
    width: 30px;
    height: 30px;
  }

  .delivery-item__lead {
    grid-area: lead;
  }

  .br-mobile-hidden {
    display: none;
  }

  .delivery-item__toggle {
    grid-area: toggle;
    width: 24px;
    height: 24px;
    color: var(--text-light);
    opacity: 1;
  }

  .delivery-item__toggle::before,
  .delivery-item__toggle::after {
    width: 18px;
  }

  .delivery.section {
    margin-bottom: 72px;
  }

  .delivery-item__body {
    padding: 0 var(--mobile-card-padding) var(--mobile-card-padding);
  }

  .site-footer__inner {
    padding-top: 80px;
    min-height: 340px;
    border-radius: 0;
  }

  .site-footer__content {
    width: 100%;
    margin: 0;
    padding: 0 40px;
  }

  .site-footer__title {
    font-size: var(--type-footer-title-size);
    font-weight: var(--type-footer-title-weight);
    line-height: var(--type-footer-title-line);
    letter-spacing: var(--type-footer-title-tracking);
    text-transform: var(--type-footer-title-transform);
  }

  .site-footer__title span {
    display: block;
  }

  .site-footer__line {
    width: 100%;
    height: 1px;
    margin: 50px 0 0;
    background: var(--text-muted);
    opacity: 0.5;
  }

  .site-footer__bottom {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    margin-top: 50px;
  }

  .site-footer__contacts {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    font-size: var(--type-footer-contact-size);
    font-weight: var(--type-footer-contact-weight);
    line-height: var(--type-footer-contact-line);
    text-transform: var(--type-footer-contact-transform);
  }

  .site-footer__divider {
    display: none;
  }

  .site-footer__button {
    display: flex;
    align-self: stretch;
    width: 100%;
    min-height: 54px;
    margin-top: 50px;
    margin-bottom: calc(40px + env(safe-area-inset-bottom, 0px));
    padding: 0;
    border: 1px solid #919191;
    border-radius: var(--mobile-button-radius);
    white-space: normal;
    background: transparent;
    color: var(--text-light);
    border-color: #919191;
  }

  .modal {
    padding: 10px;
  }

  .modal--gallery {
    padding: 0;
  }

  .modal__dialog {
    width: 100%;
    min-height: 0;
    max-height: calc(100dvh - 20px);
    padding: 52px 20px 24px;
    border-radius: 22px;
    overflow-y: auto;
  }

  .modal__dialog--gallery {
    position: relative;
    display: block;
    min-height: 0;
    max-height: 100dvh;
    height: 100dvh;
    padding: 0;
    border-radius: 0;
  }

  .modal__close {
    top: 18px;
    right: 18px;
    z-index: 10;
  }

  .gallery-modal__stage {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 56px 8px;
  }

  .gallery-modal__nav {
    position: absolute;
    top: 50%;
    z-index: 9;
    transform: translateY(-50%);
  }

  .gallery-modal__nav--prev {
    left: 8px;
  }

  .gallery-modal__nav--next {
    right: 8px;
  }

  .gallery-modal__viewport {
    width: 100%;
    height: 100%;
    max-height: none;
  }

  .gallery-modal__viewport--loading {
    min-width: calc(100vw - 52px);
  }

  .gallery-modal__loading-label {
    font-size: 10px;
    padding: 8px 10px;
  }

  .gallery-modal__viewport img {
    max-height: calc(100dvh - 104px);
    border: 0;
    border-radius: 0;
  }

  .gallery-modal__nav {
    width: 44px;
    height: 44px;
    flex-basis: 44px;
  }

  .gallery-modal__stage {
    touch-action: none;
  }

  .modal--gallery .modal__overlay {
    opacity: calc(1 - (var(--gallery-dismiss-progress, 0) * 0.72));
  }

  .gallery-modal__nav {
    display: none;
  }

  .gallery-modal__stage.is-swipe-preparing .gallery-modal__viewport--outgoing,
  .gallery-modal__stage.is-swipe-preparing .gallery-modal__viewport--incoming {
    position: absolute !important;
    inset: 56px 8px !important;
    display: grid !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    grid-area: auto !important;
    will-change: transform, opacity !important;
  }

  .gallery-modal__stage.is-swipe-preparing {
    display: block !important;
    overflow: hidden !important;
  }

  .gallery-modal__stage.is-swiping-next .gallery-modal__viewport--outgoing {
    z-index: 2 !important;
    animation: gallery-mobile-slide-out-next 320ms var(--motion-ease-soft) both !important;
  }

  .gallery-modal__stage.is-swiping-prev .gallery-modal__viewport--outgoing {
    z-index: 2 !important;
    animation: gallery-mobile-slide-out-prev 320ms var(--motion-ease-soft) both !important;
  }

  .gallery-modal__stage.is-swiping-next .gallery-modal__viewport--incoming {
    z-index: 1 !important;
    animation: gallery-mobile-slide-in-next 320ms var(--motion-ease-soft) both !important;
  }

  .gallery-modal__stage.is-swiping-prev .gallery-modal__viewport--incoming {
    z-index: 1 !important;
    animation: gallery-mobile-slide-in-prev 320ms var(--motion-ease-soft) both !important;
  }

  @keyframes gallery-mobile-slide-out-next {
    from {
      opacity: 1;
      transform: translateX(0);
    }

    to {
      opacity: 0;
      transform: translateX(-100%);
    }
  }

  @keyframes gallery-mobile-slide-out-prev {
    from {
      opacity: 1;
      transform: translateX(0);
    }

    to {
      opacity: 0;
      transform: translateX(100%);
    }
  }

  @keyframes gallery-mobile-slide-in-next {
    from {
      opacity: 0;
      transform: translateX(100%);
    }

    to {
      opacity: 1;
      transform: translateX(0);
    }
  }

  @keyframes gallery-mobile-slide-in-prev {
    from {
      opacity: 0;
      transform: translateX(-100%);
    }

    to {
      opacity: 1;
      transform: translateX(0);
    }
  }

  .gallery-zoom {
    padding: 56px 10px 16px;
  }

  .gallery-zoom__media {
    padding: 8px;
  }

  .gallery-zoom__viewport {
    min-width: calc(100vw - 36px);
  }

  .gallery-zoom__image {
    height: min(86svh, 960px);
    border-radius: 16px;
  }

  .request-form__title {
    font-size: var(--type-modal-title-size);
  }

  .request-form__lead,
  .request-form__field input,
  .request-form__file,
  .request-form__submit,
  .request-form__success-text {
    font-size: var(--type-modal-body-size);
  }

  .request-form__consent {
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 16px;
    font-size: 11px;
  }

  .request-form__consent-note {
    margin-left: 40px;
    font-size: 10px;
  }

  .request-form__submit {
    width: 256px;
    min-width: 0;
    height: 50px;
    min-height: 50px;
    padding: 0;
    border-color: #919191;
    border-radius: var(--mobile-button-radius);
    font-size: var(--mobile-body-size);
    font-weight: 400;
    line-height: var(--mobile-body-line);
  }

  .request-form__success-title {
    font-size: 28px;
  }

  .request-form__view--success {
    position: relative;
    inset: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 360px;
    padding: 24px 8px;
    background-position: center center;
    background-size: clamp(180px, 62%, 260px) auto;
  }
}
@media (max-width: 900px) {
  .tariff__mobile-copy .tariff__subtitle {
    display: block;
    width: 100%;
    max-width: none;
    margin: -12px 0 0;
    color: var(--accent);
    text-align: center;
  }

  .tariff__mobile-copy .tariff__description {
    margin-top: 24px;
  }
}
