/* Папка /fonts/: браузер берёт первый поддерживаемый формат — woff2 → woff → ttf */
@font-face {
  font-family: 'TT Hoves';
  src:
    url('../fonts/tthoves-regular.woff2') format('woff2'),
    url('../fonts/tthoves-regular.woff') format('woff'),
    url('../fonts/tthoves-regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'TT Hoves';
  src:
    url('../fonts/tthoves-medium.woff2') format('woff2'),
    url('../fonts/tthoves-medium.woff') format('woff'),
    url('../fonts/tthoves-medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  --color-accent: #C7AC44;
  --color-main: #0E0E0E;
  --color-surface: #FFFFFF;
  --color-text-secondary: #555555;
  --color-surface-alt: #F8F8F8;

  --color-border: #EDEDED;

  --font-family: 'TT Hoves', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --container-max: 1440px;
  --container-padding: 60px;

  --gradient-accent: linear-gradient(to bottom, #C7AC44, #FFCA00);
}

*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font-family);
  color: var(--color-main);
  background-color: var(--color-surface);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

/* ===== Container ===== */

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

/* ===== Hero ===== */

.hero {
  position: relative;
  width: 100%;
  height: 90vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background-image: url('../img/background.jpg');
  background-size: cover;
  background-position: center;
  --hero-plane-scroll: 0px;
}

.hero__plane-parallax {
  position: absolute;
  left: calc(50% - 132px);
  top: 46%;
  z-index: 3;
  pointer-events: none;
  user-select: none;
  transform: translateY(-50%) translateX(var(--hero-plane-scroll));
  will-change: transform;
}

.hero__plane {
  display: block;
  width: 1509px;
  height: 704px;
  max-width: none;
  object-fit: contain;
}

@keyframes hero-content-reveal {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

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

@keyframes hero-plane-in {
  from {
    opacity: 0;
    transform: translate(28px, 22px);
  }

  to {
    opacity: 1;
    transform: translate(0, 0);
  }
}

@media (prefers-reduced-motion: no-preference) {
  .hero .header__inner {
    opacity: 0;
    animation: hero-content-reveal 0.52s ease 0.05s forwards;
  }

  .hero__label {
    opacity: 0;
    animation: hero-content-reveal 0.52s ease 0.1s forwards;
  }

  .hero__title {
    opacity: 0;
    animation: hero-content-reveal 0.58s ease 0.16s forwards;
  }

  .hero__stat-label {
    opacity: 0;
    animation: hero-content-reveal 0.48s ease 0.22s forwards;
  }

  .hero__stat-value {
    opacity: 0;
    animation: hero-content-reveal 0.52s ease 0.26s forwards;
  }

  .hero__case-label {
    opacity: 0;
    animation: hero-content-reveal 0.48s ease 0.24s forwards;
  }

  .hero__case-text {
    opacity: 0;
    animation: hero-content-reveal 0.52s ease 0.28s forwards;
  }

  .hero__demo {
    opacity: 0;
    animation: hero-content-reveal 0.52s ease 0.32s forwards;
  }

  .hero__plane {
    opacity: 0;
    animation: hero-plane-in 0.72s ease 0.48s forwards;
  }
}

@media (prefers-reduced-motion: reduce) {

  .hero .header__inner,
  .hero__label,
  .hero__title,
  .hero__stat-label,
  .hero__stat-value,
  .hero__case-label,
  .hero__case-text,
  .hero__demo,
  .hero__plane {
    opacity: 1;
    transform: none;
    animation: none;
  }
}

/* ===== Header ===== */

.header {
  position: relative;
  z-index: 2;
  padding-top: 36px;
  flex-shrink: 0;
}

.header__inner {
  display: flex;
  align-items: center;
}

.header__logo {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding: 0;
}

.header__logo img {
  height: 48px;
  width: auto;
}

.header__nav {
  display: flex;
  gap: 24px;
  margin-left: 40px;
}

.header__nav-link {
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 20px;
  color: var(--color-text-secondary);
  transition: color 0.2s;
}

.header__nav-link:hover {
  color: var(--color-main);
}

.header__nav-link--active {
  color: var(--color-main);
}

.header__actions {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.header__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding: 14px 32px;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 20px;
  white-space: nowrap;
  background-color: var(--color-main);
  color: var(--color-surface);
  transition: opacity 0.2s;
}

.header__cta:hover {
  opacity: 0.88;
}

.header__account {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  background-color: var(--color-surface);
  color: var(--color-main);
  border-radius: 12px;
  transition: opacity 0.2s;
}

.header__account:hover {
  opacity: 0.88;
}

.header__menu {
  display: none;
}

/* ===== Hero Content ===== */

.hero__content {
  position: relative;
  z-index: 2;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-bottom: 64px;
}

.hero__label {
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  color: var(--color-text-secondary);
  margin-bottom: 12px;
}

.hero__title {
  font-size: 96px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 88px;
}

.hero__title-accent {
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

@media (min-width: 721px) {
  .hero__title-accent--fleet {
    white-space: nowrap;
  }
}

/* ===== Hero Bottom ===== */

.hero__bottom {
  position: relative;
  z-index: 2;
  flex-shrink: 0;
  border-top: 1px solid var(--color-border);
  padding: 40px 0 48px;
}

.hero>.hero__bottom {
  border-top-color: #ffffff;
}

.hero__bottom-inner {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: auto 1fr;
  column-gap: 24px;
  row-gap: 8px;
}

.hero__stat {
  display: contents;
}

.hero__stat-label {
  grid-column: 1 / 4;
  grid-row: 1;
  align-self: start;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 16px;
  color: var(--color-text-secondary);
}

.hero__stat-value {
  grid-column: 1 / 4;
  grid-row: 2;
  align-self: end;
  font-size: 61px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 0.72;
}

.hero__case {
  display: contents;
}

.hero__case-label {
  grid-column: 5 / 9;
  grid-row: 1;
  align-self: start;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 16px;
  color: var(--color-text-secondary);
}

.hero__case-text {
  grid-column: 5 / 9;
  grid-row: 2;
  align-self: end;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 20px;
  color: var(--color-main);
}

.hero__demo {
  grid-column: 11 / 13;
  grid-row: 1 / 3;
  align-self: end;
}

.hero__demo-btn {
  display: flex;
  align-items: center;
  gap: 0;
  width: 100%;
  height: 80px;
  padding: 8px 8px 8px 24px;
  background-color: var(--color-main);
  border-radius: 16px;
  transition: opacity 0.2s;
}

.hero__demo-btn:hover {
  opacity: 0.88;
}

.hero__demo-text {
  flex: 1;
  text-align: center;
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  color: var(--color-surface);
}

.hero__demo-circle {
  flex-shrink: 0;
  width: 64px;
  height: 64px;
  border-radius: 12px;
  background: var(--gradient-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  color: var(--color-main);
}

/* ===== Shared Section Styles ===== */

.section-head {
  margin-bottom: 64px;
}

.section-label {
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  margin-bottom: 12px;
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

.section-title {
  font-size: 61px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 64px;
  color: var(--color-main);
}

.section-desc {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 20px;
  color: var(--color-text-secondary);
  margin-top: 24px;
  max-width: 640px;
}

.accent {
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

/* ===== Aircrafts Marquee Section ===== */

.aircrafts {
  height: 10vh;
  background-image: url('../img/dark.png');
  background-size: cover;
  background-position: center top;
  overflow: hidden;
  display: flex;
  align-items: center;
  position: relative;
}

.aircrafts__track {
  display: flex;
  width: max-content;
  animation: aircrafts-scroll 30s linear infinite;
}

.aircrafts__content {
  display: flex;
  align-items: center;
  gap: 0.35em;
  white-space: nowrap;
  padding-right: 0.35em;
  font-size: 61px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 1.3;
}

.aircrafts__brand {
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

.aircrafts__model {
  color: var(--color-surface);
}

@keyframes aircrafts-scroll {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-50%);
  }
}

/* ===== Problem–Solution Combined Section ===== */

.ps {
  height: 500vh;
  background-color: var(--color-main);
  position: relative;
  transition: background-color 0.45s ease 0.06s;
}

.ps.is-solution {
  background-color: var(--color-surface);
}

.ps__sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
  background-color: var(--color-main);
  transition: background-color 0.45s ease 0.06s;
}

.ps__sticky.is-solution {
  background-color: var(--color-surface);
}

.ps__sticky::before,
.ps__sticky::after {
  content: '';
  position: absolute;
  inset: 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  transition: opacity 0.6s ease;
  will-change: opacity;
  z-index: 0;
}

.ps__sticky::before {
  background-image: url('../img/dark.png');
  opacity: 1;
}

.ps__sticky::after {
  background-image: url('../img/light.png');
  opacity: 0;
}

.ps__sticky.is-solution::before {
  opacity: 0;
}

.ps__sticky.is-solution::after {
  opacity: 1;
}

.ps__sticky>.container {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding-top: 48px;
  padding-bottom: 48px;
  position: relative;
  z-index: 1;
}

/* --- Progress nav bar (H2 typography) --- */

.ps__nav {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-shrink: 0;
}

.ps__nav-start {
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  white-space: nowrap;
  transition: opacity 0.45s ease 0.06s;
}

.ps__sticky.is-solution .ps__nav-start {
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

.ps__nav-end {
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  color: rgba(255, 255, 255, 0.3);
  white-space: nowrap;
  transition: color 0.45s ease 0.06s;
}

.ps__nav-product {
  display: none;
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  color: rgba(255, 255, 255, 0.3);
  white-space: nowrap;
  transition: color 0.45s ease 0.06s, opacity 0.45s ease 0.06s;
}

.ps__sticky.is-solution .ps__nav-end {
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

/* В фазе «продукт» подписи «проблема» и «решение» остаются с градиентом, как в фазе «решение» */

.ps__sticky.is-platform .ps__nav-product {
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

.ps__nav-track {
  flex: 1;
  height: 2px;
  background-color: rgba(255, 255, 255, 0.15);
  position: relative;
  top: 2px;
  border-radius: 0;
  transition: background-color 0.45s ease 0.06s;
}

.ps__sticky.is-solution .ps__nav-track {
  background-color: rgba(14, 14, 14, 0.15);
}

.ps__nav-fill {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background: var(--gradient-accent);
  border-radius: 0;
  width: calc(var(--progress, 0) * 100%);
  will-change: width;
}


/* --- Heading area (vertically centered, sequenced fade) --- */

.ps__heading-wrap {
  flex: 1;
  display: grid;
  place-items: center;
  min-height: 0;
}

.ps__heading {
  grid-area: 1 / 1;
  font-size: 61px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 64px;
  text-align: center;
  width: 100%;
}

.ps__heading-text--mobile {
  display: none;
}

.ps__heading-solution-text--mobile {
  display: none;
}

.ps__heading--problem {
  color: var(--color-surface);
  opacity: 1;
  transition: opacity 0.3s ease 0.7s;
}

.ps__heading--solution {
  color: var(--color-main);
  opacity: 0;
  transition: opacity 0.3s ease 0.1s;
}

.ps__sticky.is-solution .ps__heading--problem {
  opacity: 0;
  transition: opacity 0.42s ease 0.08s;
  animation: none;
}

.ps__sticky.is-solution .ps__heading--solution {
  opacity: 1;
  transition: opacity 0.42s ease 0.12s;
}

/* --- Card grid --- */

.ps__cards {
  flex-shrink: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 24px;
  row-gap: 16px;
  align-items: stretch;
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.34s ease 0.06s, transform 0.34s ease 0.06s;
  position: relative;
  z-index: 1;
}

.ps__media {
  position: relative;
  flex-shrink: 0;
  height: 516px;
}

.ps__platform {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 100%;
  opacity: 0;
  transform: translateY(16px);
  pointer-events: none;
  transition: opacity 0.44s ease 0.18s, transform 0.44s ease 0.18s;
}

.ps__platform-frame {
  width: 100%;
  border-radius: 0;
  border: none;
  box-shadow: none;
  overflow: visible;
  background-color: transparent;
  position: relative;
  height: 100%;
}

.ps__platform-image {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: auto;
  object-fit: initial;
  object-position: initial;
  display: block;
  backface-visibility: hidden;
  border-radius: 0;
  opacity: 0;
  transition: opacity 0.38s ease;
}

.ps__platform-image.is-active {
  opacity: 1;
}

.ps__sticky.is-platform .ps__cards {
  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;
}

.ps__sticky.is-platform .ps__platform {
  opacity: 1;
  transform: translateY(0);
}

.ps__card {
  border-radius: 0;
  display: grid;
  height: 250px !important;
  min-height: 250px;
  max-height: 250px;
}

.ps__card-content {
  grid-area: 1 / 1;
  padding: 32px;
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 0;
  height: 250px;
  min-height: 250px;
  max-height: 250px;
  overflow: hidden;
}

.ps__card-content--problem {
  opacity: 1;
  transition: opacity 0.3s ease 0.85s;
  position: relative;
  padding: 32px 40px 48px;
  border-radius: 0;
  border: none;
  background: transparent;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  height: 250px;
  z-index: 1;
}

.ps__card-content--problem::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  border-radius: 0;
  border: 1.5px solid #FFFFFF;
  background: transparent;
  z-index: -2;
  pointer-events: none;
}

.ps__card-content--problem::after {
  transform: none;
}

.ps__card-content--problem::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 16px;
  border-radius: 0;
  border: 1.5px solid #FFFFFF;
  background: transparent;
  z-index: -1;
  pointer-events: none;
}

.ps__card-content--solution {
  opacity: 0;
  transition: opacity 0.3s ease 0s;
  pointer-events: none;
  position: relative;
  padding: 32px 40px 48px;
  border-radius: 0;
  border: none;
  background: transparent;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  height: 250px;
  z-index: 1;
}

.ps__card-content--solution::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  border-radius: 0;
  border: 1.5px solid var(--color-border);
  background: var(--color-surface-alt);
  z-index: -2;
  pointer-events: none;
}

.ps__card-content--solution::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 16px;
  border-radius: 0;
  border: none;
  background: var(--color-surface);
  z-index: -1;
  pointer-events: none;
}

.ps__sticky.is-solution .ps__card-content--problem {
  opacity: 0;
  transition: opacity 0.42s ease 0.1s;
  pointer-events: none;
  animation: none;
}

.ps__sticky.is-solution .ps__card-content--solution {
  opacity: 1;
  transition: opacity 0.42s ease 0.18s;
  pointer-events: auto;
}

.ps__card-icon {
  width: 56px;
  height: 56px;
  border-radius: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 24px;
}

.ps__card-content--problem .ps__card-icon {
  position: absolute;
  top: 24px;
  right: 24px;
  margin: 0;
  width: 88px;
  height: 88px;
  background: none;
  color: var(--color-text-secondary);
}

.ps__card-content--problem .ps__card-icon svg {
  width: 88px;
  height: 88px;
}

.ps__card-content--solution .ps__card-icon {
  position: absolute;
  top: 24px;
  right: 24px;
  margin: 0;
  width: 88px;
  height: 88px;
  background: none;
  color: var(--color-border);
}

.ps__card-content--solution .ps__card-icon svg {
  width: 88px;
  height: 88px;
}

.ps__card-title {
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  color: var(--color-main);
  margin-bottom: 12px;
}

.ps__card-content--problem .ps__card-title {
  color: rgba(255, 255, 255, 0.96);
  padding-right: 72px;
}

.ps__card-content--solution .ps__card-title {
  padding-right: 72px;
}

.ps__card-text {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 20px;
  color: var(--color-text-secondary);
  max-width: 320px;
}

.ps__card-content--problem .ps__card-text {
  color: rgba(228, 232, 240, 0.86);
  max-width: 320px;
}

@keyframes ps-problem-reveal {
  from {
    opacity: 0;
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.ps:not(.is-ps-inview) .ps__nav,
.ps:not(.is-ps-inview) .ps__heading--problem {
  opacity: 0;
  transform: translate3d(0, 20px, 0);
  pointer-events: none;
  will-change: opacity, transform;
  backface-visibility: hidden;
}

.ps.is-ps-inview:not(.is-solution) .ps__nav {
  animation: ps-problem-reveal 0.52s ease forwards;
  animation-delay: 0.05s;
  animation-fill-mode: both;
  pointer-events: auto;
  transition: none;
}

.ps.is-ps-inview:not(.is-solution) .ps__heading--problem {
  animation: ps-problem-reveal 0.52s ease forwards;
  animation-delay: 0.12s;
  animation-fill-mode: both;
  transition: none;
}

/* --- Row-based card reveal (desktop) --- */
@media (min-width: 721px) and (prefers-reduced-motion: no-preference) {
  .ps .ps__card {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s ease, transform 0.5s ease;
  }

  .ps__sticky.ps-row1-in .ps__card:nth-child(-n+3) {
    opacity: 1;
    transform: translateY(0);
  }

  .ps__sticky.ps-row2-in .ps__card:nth-child(n+4) {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ===== Scroll reveal (sections after Problem → Solution) ===== */

.scroll-reveal .container>*:not(.ac__panel) {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.45s ease, transform 0.45s ease;
  will-change: opacity, transform;
}

.scroll-reveal.is-revealed .container>*:not(.ac__panel) {
  opacity: 1;
  transform: translateY(0);
}

.scroll-reveal.is-revealed .container>*:not(.ac__panel):nth-child(1) {
  transition-delay: 0s;
}

.scroll-reveal.is-revealed .container>*:not(.ac__panel):nth-child(2) {
  transition-delay: 0.12s;
}

.scroll-reveal.is-revealed .container>*:not(.ac__panel):nth-child(3) {
  transition-delay: 0.24s;
}

.scroll-reveal.is-revealed .container>*:not(.ac__panel):nth-child(4) {
  transition-delay: 0.36s;
}

.scroll-reveal.is-revealed .container>*:not(.ac__panel):nth-child(5) {
  transition-delay: 0.48s;
}

.scroll-reveal.is-revealed .container>*:not(.ac__panel):nth-child(6) {
  transition-delay: 0.6s;
}

.scroll-reveal--ac:not(.is-revealed) .ac__panel--advantages .ac__why,
.scroll-reveal--ac:not(.is-revealed) .ac__panel--advantages .ac__media {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.45s ease, transform 0.45s ease;
}

.scroll-reveal--ac.is-revealed .ac__panel--advantages .ac__why,
.scroll-reveal--ac.is-revealed .ac__panel--advantages .ac__media {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0s;
}

.scroll-reveal:not(.is-revealed) .case__stat {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

.scroll-reveal.is-revealed .case__stat {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

.scroll-reveal.is-revealed .case__stat:nth-child(1) {
  transition-delay: 0.28s;
}

.scroll-reveal.is-revealed .case__stat:nth-child(2) {
  transition-delay: 0.34s;
}

.scroll-reveal.is-revealed .case__stat:nth-child(3) {
  transition-delay: 0.4s;
}

.scroll-reveal.is-revealed .case__stat:nth-child(4) {
  transition-delay: 0.46s;
}

.scroll-reveal:not(.is-revealed) .process__card {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

.scroll-reveal.is-revealed .process__card {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

.scroll-reveal.is-revealed .process__card:nth-child(1) {
  transition-delay: 0.22s;
}

.scroll-reveal.is-revealed .process__card:nth-child(2) {
  transition-delay: 0.3s;
}

.scroll-reveal.is-revealed .process__card:nth-child(3) {
  transition-delay: 0.38s;
}

.scroll-reveal.is-revealed .process__card:nth-child(4) {
  transition-delay: 0.46s;
}

.scroll-reveal:not(.is-revealed) .stages__content>* {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.45s ease, transform 0.45s ease;
}

.scroll-reveal.is-revealed .stages__content>* {
  opacity: 1;
  transform: translateY(0);
}

.scroll-reveal.is-revealed .stages__content>*:nth-child(1) {
  transition-delay: 0.15s;
}

.scroll-reveal:not(.is-revealed) .results__board>.results__center .results__metrics {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.45s ease, transform 0.45s ease;
}

.scroll-reveal.is-revealed .results__board>.results__center .results__metrics {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.45s ease, transform 0.45s ease;
}

.scroll-reveal:not(.is-revealed) .results__board>.results__title {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.45s ease, transform 0.45s ease;
}

.scroll-reveal.is-revealed .results__board>.results__title {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.45s ease, transform 0.45s ease;
}

.scroll-reveal.is-revealed .results__board>.results__center .results__metrics {
  transition-delay: 0.1s;
}

.scroll-reveal.is-revealed .results__board>.results__title {
  transition-delay: 0.22s;
}


@media (prefers-reduced-motion: reduce) {

  .scroll-reveal .container>*:not(.ac__panel),
  .scroll-reveal:not(.is-revealed) .case__stat,
  .scroll-reveal:not(.is-revealed) .process__card,
  .scroll-reveal:not(.is-revealed) .stages__content>*,
  .scroll-reveal:not(.is-revealed) .results__board>.results__center .results__metrics,
  .scroll-reveal:not(.is-revealed) .results__board>.results__title,
  .scroll-reveal--ac:not(.is-revealed) .ac__panel--advantages .ac__why,
  .scroll-reveal--ac:not(.is-revealed) .ac__panel--advantages .ac__media {
    opacity: 1;
    transform: none;
    transition: none;
    will-change: auto;
  }

  .results .results__chart-bar {
    transition: none !important;
    transition-delay: 0s !important;
  }

  .ps:not(.is-solution) .ps__nav,
  .ps:not(.is-solution) .ps__heading--problem {
    animation: none;
    opacity: 1;
    transform: none;
    pointer-events: auto;
  }

  .ps__sticky::before,
  .ps__sticky::after {
    transition: none;
  }

  .ps__cards,
  .ps__platform,
  .ps__platform-image {
    transition: none;
  }

  .results {
    height: auto;
    min-height: 90vh;
  }

  .results__sticky {
    position: relative;
    height: auto;
    min-height: min(720px, calc(90vh - 160px));
    max-height: none;
    padding: 80px 0;
  }

  .results__sticky>.container {
    flex: 1;
    min-height: 0;
  }

  .results__board {
    flex: 1;
    margin-top: 0;
    padding-bottom: 0;
  }

  .results__center {
    flex: 1;
  }

  .sticky-progress {
    display: none !important;
  }
}

/* ===== Case Section ===== */

.case {
  background-color: var(--color-surface);
  min-height: 90vh;
}

.case>.container {
  display: flex;
  flex-direction: column;
  min-height: 90vh;
  padding-top: 48px;
  padding-bottom: 48px;
}

.case .section-label {
  flex-shrink: 0;
}

.case__hero {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.case__number-wrap {
  width: 100%;
  margin-bottom: 24px;
}

.case__number {
  margin: 0;
  padding: 0;
  display: block;
  font-family: var(--font-family);
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 0.88;
  color: var(--color-main);
  white-space: nowrap;
  width: max-content;
  max-width: 100%;
  font-variant-numeric: tabular-nums;
  font-size: var(--case-number-fs, clamp(2rem, 14vw, 12rem));
}

.case__desc {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  overflow: visible;
}

.case__context-col {
  order: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.case__context {
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  color: var(--color-text-secondary);
  margin-top: 24px;
}

.case__subtitle {
  order: 2;
  flex-shrink: 0;
  margin: 0;
  padding: 0 12px 12px 0;
  box-sizing: content-box;
  font-size: 96px;
  font-weight: 500;
  letter-spacing: -0.04em;
  /* 88px обрезала хвосты букв при background-clip: text; чуть выше кап-высота + выносные элементы */
  line-height: 1.06;
  text-align: right;
  overflow: visible;
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

.case__number-img {
  display: none;
  width: 100%;
  height: auto;
}

.case__stats {
  flex-shrink: 0;
  border-top: 1px solid var(--color-border);
  padding-top: 40px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 24px;
}

.case__stat-value {
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  color: var(--color-main);
  display: block;
  margin-bottom: 8px;
}

.case__stat-label {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 20px;
  color: var(--color-text-secondary);
}

/* ===== Process Section ===== */

.process {
  background-color: var(--color-surface);
  min-height: 90vh;
  padding: 85px 0 72px;
}

.fleet {
  background-color: var(--color-surface);
  height: 90vh;
  min-height: 90vh;
  padding: 48px 0 56px;
  overflow: hidden;
}

.fleet>.container {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: 20px;
  row-gap: 88px;
  height: 100%;
  min-height: 0;
  align-content: center;
}

.fleet__heading {
  grid-column: 2 / -1;
  font-size: 61px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 64px;
  color: var(--color-main);
  margin: 0;
}

.fleet__heading-accent {
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.fleet__grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 20px;
  row-gap: 20px;
  align-items: stretch;
  margin: 0;
}

.fleet__card {
  position: relative;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  height: 272px;
  min-height: 272px;
  max-height: 272px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  z-index: 1;
  overflow: hidden;
}

.fleet__card--stat {
  padding: 0;
  align-items: center;
  justify-content: center;
}

.fleet__card--stat::before,
.fleet__card--stat::after {
  display: none;
}

.fleet__stat {
  width: max-content;
  max-width: none;
  text-align: left;
}

.fleet__stat-value {
  /* Second level titles */
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  font-variant-numeric: tabular-nums;
}

.fleet__stat-desc {
  margin-top: 4px;
  /* Buttons */
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 20px;
  color: var(--color-text-secondary);
}

.fleet__card::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  border-radius: 0;
  border: none;
  background: var(--color-surface-alt);
  z-index: -2;
  pointer-events: none;
}

.fleet__card::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 16px;
  border-radius: 0;
  border: 1.5px solid var(--color-border);
  background: var(--color-surface);
  z-index: -1;
  pointer-events: none;
}

.fleet__img {
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  object-position: center;
}

.fleet__name {
  position: absolute;
  right: 24px;
  bottom: 24px;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 26px;
  color: var(--color-main);
  text-align: right;
  max-width: calc(100% - 48px);
}

.process__heading {
  font-size: 61px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 64px;
  color: var(--color-main);
  margin-bottom: 64px;
  margin-left: calc(50% + 10px);
  width: calc(50% - 10px);
}

.process__heading-accent {
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.process__flow {
  position: relative;
}

.process__arrows-top {
  position: relative;
  height: 56px;
}

.process__arrows-top img {
  position: absolute;
  top: 0;
  height: 100%;
  width: calc((100% + 20px) / 4);
}

.process__arrows-top img:nth-child(1) {
  left: calc((100% - 60px) / 8);
}

.process__arrows-top img:nth-child(2) {
  left: calc((100% - 60px) / 8 + (100% + 20px) / 4);
}

.process__arrows-top img:nth-child(3) {
  left: calc((100% - 60px) / 8 + 2 * (100% + 20px) / 4);
}

.process__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 20px;
  margin-top: 24px;
}

.process__card {
  position: relative;
  padding: 32px 32px calc(32px + 100px) 32px;
  border: none;
  border-radius: 0;
  background: transparent;
  display: flex;
  flex-direction: column;
  z-index: 1;
}

.process__card::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  border-radius: 0;
  border: none;
  background: var(--color-surface-alt);
  z-index: -2;
  pointer-events: none;
}

.process__card::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 16px;
  border-radius: 0;
  border: 1.5px solid var(--color-border);
  background: var(--color-surface);
  z-index: -1;
  pointer-events: none;
}

.process__card-icon {
  width: auto;
  height: auto;
  display: block;
  color: var(--color-border);
  margin-bottom: 18px;
  font-size: clamp(2.75rem, 4.2vw, 4rem);
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 0.9;
  font-variant-numeric: tabular-nums;
}

.process__card-icon svg {
  display: block;
}

.process__card-icon span {
  display: block;
}

.process__card-title {
  font-size: 20px;
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 26px;
  color: var(--color-main);
  margin-bottom: 16px;
}

.process__card-list {
  list-style: none;
  counter-reset: step;
  margin: 0;
  padding: 0;
}

.process__card-list li {
  counter-increment: step;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 20px;
  color: var(--color-text-secondary);
  padding-left: 20px;
  position: relative;
  margin-bottom: 4px;
}

.process__card-list li:last-child {
  margin-bottom: 0;
}

.process__card-list li::before {
  content: counter(step) ".";
  position: absolute;
  left: 0;
  color: var(--color-text-secondary);
}


.process__arrow-bottom {
  margin-top: 24px;
  /* Стрелка должна идти от 4-й карточки к 2-й (с центров). */
  margin-left: calc((3 * (100% - 60px)) / 8 + 20px);
  width: calc(50% + 10px);
}

.process__arrow-bottom img {
  display: block;
  width: 100%;
  height: auto;
}

/* ===== Stages Section ===== */

.stages {
  position: relative;
  height: 400vh;
  box-sizing: border-box;
  background-color: var(--color-surface);
}

/* Нижняя полоса прогресса: этапы, проблема–решение–продукт, результат, почему re:source */
.sticky-progress {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 10px;
  z-index: 6;
  pointer-events: none;
}

.sticky-progress__track {
  height: 10px;
  width: 100%;
  background-color: rgba(14, 14, 14, 0.15);
  position: relative;
}

.sticky-progress__fill {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background: var(--gradient-accent);
  border-radius: 0;
  width: calc(var(--sticky-progress, 0) * 100%);
  will-change: width;
}

.ps__sticky:not(.is-solution) .sticky-progress__track {
  background-color: rgba(255, 255, 255, 0.15);
}

.ac__sticky .sticky-progress__track {
  background-color: rgba(14, 14, 14, 0.15);
}

.ps__sticky.is-solution .sticky-progress__track {
  background-color: rgba(14, 14, 14, 0.15);
}

.is-sticky-progress-done .sticky-progress {
  visibility: hidden;
  opacity: 0;
  height: 0;
  overflow: hidden;
}

.stages__sticky {
  position: sticky;
  top: 0;
  left: 0;
  right: 0;
  min-height: 100vh;
  height: 100vh;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  padding: 48px 0 56px;
  background-color: var(--color-surface);
}

@media (prefers-reduced-motion: reduce) {
  .stages {
    height: auto;
    min-height: 90vh;
  }

  .stages__sticky {
    position: relative;
    height: auto;
    min-height: 90vh;
  }
}

.stages__container {
  display: flex;
  flex-direction: column;
  width: 100%;
  flex: 1;
  min-height: 0;
}

/* На десктопе не меняет раскладку: дети участвуют во flex .stages__container */
.stages__kpi-slot {
  display: contents;
}

.stages__label {
  font-size: 24px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 28px;
  margin: 0;
  flex-shrink: 0;
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

/* Равный зазор «этапы ↔ KPI» и «KPI ↔ карточка» */
.stages__mid-spacer {
  flex: 1 1 0;
  min-height: 0;
}

/* Как в бэкапе: KPI над правой половиной (сетка 648 + 648) */
.stages__level1-row {
  flex-shrink: 0;
  display: grid;
  grid-template-columns: minmax(0, 648px) minmax(0, 648px);
  gap: 24px;
  width: 100%;
  max-width: 1320px;
  align-self: center;
  margin-bottom: 0;
}

.stages__level1-gutter {
  min-width: 0;
}

.stages__level1-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 312px));
  gap: 24px;
  min-width: 0;
  justify-content: start;
}

.stages__level1 {
  min-width: 0;
}

.stages__level1-line {
  margin: 0;
  font-size: 61px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 64px;
  color: var(--color-main);
}

.stages__level1-accent {
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.stages__level1--kpi-a {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.stages__kpi-footnote {
  margin: 10px 0 0;
  max-width: 312px;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 16px;
  color: var(--color-text-secondary);
}

.stages__content {
  flex-shrink: 0;
  width: 100%;
  min-width: 0;
}

/* Две карточки в стопке — анимация как codepen.io/shubhamc_007/pen/oyEJBm (scale + слой) */
.stages__card-stack {
  position: relative;
  width: 100%;
  min-height: 584px;
}

.stages__card {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  height: 544px;
  border: 1px solid var(--color-border);
  background-color: var(--color-surface);
  overflow: hidden;
}

.stages__card--layer {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  z-index: 1;
  transform: translateY(40px) scale(0.9);
  transform-origin: center top;
  transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
}

.stages__card--layer.is-active {
  z-index: 2;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

.stages__card-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  width: 100%;
  height: 100%;
  min-height: 0;
}

.stages__card-col--text {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  align-self: stretch;
  height: 100%;
  min-height: 0;
  padding: 48px 0 48px 48px;
  min-width: 0;
  box-sizing: border-box;
}

.stages__card-textblock {
  flex-shrink: 0;
  max-width: min(100%, 520px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
}

/*
 * Типографика карточки — Docs/DESIGN_SYSTEM_RULES.md:
 * Accent: 96px / Medium / -4% / 88px — key numbers, цвет Borders
 * First level (H1): 61px / Medium / -4% / 64px — Main
 * Second level titles (H2): 27px / Medium / -4% / 32px — описание, серый
 */
.stages__card-step {
  margin: 0;
  flex-shrink: 0;
  font-size: 96px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 88px;
  font-variant-numeric: tabular-nums;
  color: var(--color-border);
}

.stages__card-title {
  margin: 0;
  padding: 0;
  font-size: 61px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 64px;
  color: var(--color-main);
  max-width: 100%;
}

.stages__card-desc {
  margin: 16px 0 0;
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  color: var(--color-text-secondary);
  max-width: 100%;
}

.stages__card-col--media {
  background-color: var(--color-surface-alt);
  min-width: 0;
  min-height: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Натуральный размер по ширине файла, не растягиваем на всю колонку; без отступов слева/справа у колонки */
.stages__card-img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
}

/* ===== Breakpoint: viewport height ≤ 800px (laptops) ===== */

@media (min-width: 721px) and (max-height: 800px) {
  :root {
    --container-padding: 40px;
  }

  /* --- Hero --- */
  .hero__label {
    font-size: 22px;
    line-height: 28px;
  }

  .hero__title {
    font-size: 72px;
    line-height: 68px;
  }

  .hero__stat-value {
    font-size: 48px;
    line-height: 0.76;
  }

  .hero__demo-btn {
    height: 68px;
    padding: 8px 8px 8px 20px;
  }

  .hero__demo-text {
    font-size: 22px;
    line-height: 28px;
  }

  .hero__demo-circle {
    width: 52px;
    height: 52px;
    font-size: 24px;
  }

  .hero__plane {
    width: 1200px;
    height: 560px;
  }

  .hero__content {
    padding-bottom: 48px;
  }

  .hero__bottom {
    padding: 32px 0 40px;
  }

  /* --- Shared section typography --- */
  .section-label {
    font-size: 22px;
    line-height: 28px;
  }

  .section-title {
    font-size: 48px;
    line-height: 52px;
  }

  /* --- Aircrafts marquee --- */
  .aircrafts__content {
    font-size: 48px;
    line-height: 1.3;
  }

  /* --- Problem–Solution --- */
  .ps__nav-start,
  .ps__nav-end,
  .ps__nav-product {
    font-size: 22px;
    line-height: 28px;
  }

  .ps__heading {
    font-size: 48px;
    line-height: 52px;
  }

  .ps__card {
    height: 176px !important;
    min-height: 176px;
    max-height: 176px;
  }

  .ps__card-content {
    height: 176px;
    min-height: 176px;
    max-height: 176px;
  }

  .ps__card-content--problem,
  .ps__card-content--solution {
    height: 176px;
    min-height: 176px;
    max-height: 176px;
    padding: 20px 24px 28px;
  }

  .ps__card-content--problem .ps__card-icon,
  .ps__card-content--solution .ps__card-icon {
    width: 44px;
    height: 44px;
    top: 18px;
    right: 18px;
  }

  .ps__card-content--problem .ps__card-icon svg,
  .ps__card-content--solution .ps__card-icon svg {
    width: 44px;
    height: 44px;
  }

  .ps__card-title {
    font-size: 20px;
    line-height: 26px;
  }

  .ps__card-text {
    font-size: 14px;
    line-height: 18px;
  }

  .ps__media {
    height: 380px;
  }

  .ps__platform-image {
    width: 70%;
    left: 15%;
  }

  /* --- Case --- */
  .case__subtitle {
    font-size: 72px;
    line-height: 1.06;
  }

  .case__context {
    font-size: 22px;
    line-height: 28px;
  }

  .case__stat-value {
    font-size: 22px;
    line-height: 28px;
  }

  /* --- Process --- */
  .process__heading {
    font-size: 48px;
    line-height: 52px;
    margin-bottom: 48px;
  }

  .process__card {
    padding: 20px 24px calc(20px + 56px) 24px;
  }

  .process__card::before {
    bottom: 12px;
  }

  .process__card-icon {
    font-size: clamp(2.25rem, 3.5vw, 3.25rem);
    margin-bottom: 12px;
  }

  .process__card-title {
    font-size: 18px;
    line-height: 24px;
    margin-bottom: 12px;
  }

  /* --- Fleet --- */
  .fleet {
    padding: 40px 0 48px;
  }

  .fleet>.container {
    row-gap: 56px;
  }

  .fleet__heading {
    font-size: 48px;
    line-height: 52px;
  }

  .fleet__card {
    height: 220px;
    min-height: 220px;
    max-height: 220px;
  }

  .fleet__card::before {
    bottom: 12px;
  }

  .fleet__img {
    max-height: 150px;
    object-fit: contain;
    object-position: right top;
    margin-left: auto;
  }

  .fleet__name {
    font-size: 16px;
    line-height: 20px;
    right: 16px;
    bottom: 20px;
    max-width: calc(100% - 32px);
  }

  .fleet__stat-value {
    font-size: 22px;
    line-height: 28px;
  }

  .fleet__stat-desc {
    font-size: 14px;
    line-height: 18px;
  }

  /* --- Stages --- */
  .stages__sticky {
    padding: 36px 0 40px;
  }

  .stages__label {
    font-size: 20px;
    line-height: 24px;
  }

  .stages__level1-row {
    max-width: 1100px;
  }

  .stages__level1-line {
    font-size: 48px;
    line-height: 52px;
  }

  .stages__card-stack {
    min-height: 400px;
  }

  .stages__card {
    height: 360px;
    min-height: 360px;
    max-height: 360px;
  }

  .stages__card-step {
    font-size: 56px;
    line-height: 52px;
  }

  .stages__card-title {
    font-size: 40px;
    line-height: 44px;
  }

  .stages__card-desc {
    font-size: 20px;
    line-height: 26px;
    margin-top: 12px;
  }

  .stages__card-col--text {
    padding: 28px 0 28px 32px;
  }

  .stages__card-textblock {
    max-width: min(100%, 440px);
  }

  /* Results — правила перенесены после базовых стилей Results (см. ниже) */

  /* --- Advantages / Why re:source --- */
  .ac__why-title {
    font-size: 48px;
    line-height: 52px;
  }

  /* --- CTA --- */
  .cta-final__label {
    font-size: 22px;
    line-height: 28px;
  }

  .cta-final__title {
    font-size: 72px;
    line-height: 68px;
  }

  .cta-final__btn {
    font-size: 22px;
    line-height: 28px;
    padding: 16px 40px;
  }

  .cta-final__btn-hero {
    height: 68px;
    padding: 8px 8px 8px 20px;
  }

  .cta-final__btn-hero-text {
    font-size: 22px;
    line-height: 28px;
  }

  .cta-final__btn-hero-circle {
    width: 52px;
    height: 52px;
    font-size: 24px;
  }

  /* Company page — правила перенесены после базовых стилей Company (см. ниже) */
}

@media (max-width: 1100px) {
  .process__heading {
    margin-left: 0;
    width: 100%;
  }
}

@media (max-width: 1350px) {
  .stages__level1-row {
    grid-template-columns: 1fr;
    max-width: 100%;
  }

  .stages__level1-gutter {
    display: none;
  }

  .stages__level1-pair {
    grid-template-columns: 1fr 1fr;
    justify-content: stretch;
  }
}

@media (max-width: 900px) {
  .stages__level1-pair {
    grid-template-columns: 1fr;
  }

  .stages__card-stack {
    min-height: 0;
  }

  .stages__card {
    height: auto;
    min-height: 0;
  }

  .stages__card--layer {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    transform: none;
    transition: none;
    pointer-events: auto;
    z-index: 1;
  }

  .stages__card--layer:not(.is-active) {
    display: none;
  }

  .stages__card--layer.is-active {
    transform: none;
    z-index: 1;
  }

  .stages__card-inner {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
  }

  .stages__card-col--text {
    padding: 48px 24px 48px 48px;
    justify-content: space-between;
    min-height: 320px;
    height: auto;
  }

  .stages__card-textblock {
    max-width: none;
  }

  .stages__card-col--media {
    align-items: center;
    justify-content: center;
    min-height: 200px;
  }

  .stages__card-img {
    max-width: 100%;
  }
}

/* ===== Results Section ===== */

.results {
  --results-metrics-cols: repeat(4, minmax(0, 1fr));

  box-sizing: border-box;
  /* Высота > 100vh: пока «съедается» прокрутка, весь кадр .results__sticky неподвижен (как .stages__sticky) */
  height: 185vh;
  min-height: 185vh;
  background-color: var(--color-surface);
  position: relative;
  padding: 0;
}

.results__sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  min-height: 100vh;
  max-height: 100vh;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  padding: 80px 0;
  background-color: var(--color-surface);
}

.results__sticky>.container {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  min-width: 0;
  width: 100%;
}

.results__sticky>.container>.section-label {
  flex-shrink: 0;
  align-self: flex-start;
}

.results__board {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  margin-top: 0;
  padding-bottom: 0;
  min-width: 0;
  align-self: stretch;
}

.results__center {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  width: 100%;
}

/* Десктоп: зазор только на мобилке (прямой потомок .results__sticky) */
.results__sticky>.results__mobile-spacer {
  display: none;
}

.results__metrics {
  display: flex;
  flex-direction: column;
  gap: 29px;
  width: 100%;
  flex-shrink: 0;
}

.results__kpi-grid {
  display: grid;
  grid-template-columns: var(--results-metrics-cols);
  width: 100%;
  align-items: start;
}

.results__title {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  align-self: flex-start;
  flex-shrink: 0;
  margin-top: 140px;
  margin-bottom: 0;
  width: max-content;
  max-width: min(520px, 100%);
  font-size: clamp(28px, 5.5vw + 1.25rem, 96px);
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 0.92;
  color: var(--color-main);
  text-align: left;
}

.results__title-line {
  display: block;
  white-space: nowrap;
}

.results__title-desktop {
  display: block;
}

.results__title-mobile {
  display: none;
}

.results__title-accent {
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.results__chart {
  /* Масштаб графика: максимум по модулю среди отрицательных KPI (−35%) */
  --chart-neg-max-px: clamp(72px, 11vw, 140px);

  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
}

.results__chart-pos,
.results__chart-neg {
  display: grid;
  grid-template-columns: var(--results-metrics-cols);
  width: 100%;
}

.results__chart-pos {
  min-height: calc(7.5 / 35 * var(--chart-neg-max-px));
  align-items: end;
}

.results__chart-neg {
  min-height: var(--chart-neg-max-px);
  align-items: start;
}

.results__chart-col {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.results__chart-pos .results__chart-col {
  justify-content: flex-end;
}

.results__chart-axis {
  width: 100%;
  height: 1px;
  flex-shrink: 0;
  background-color: var(--color-border);
}

.results__chart-bar {
  width: 100%;
  flex-shrink: 0;
  transition: height 0.75s cubic-bezier(0.22, 1, 0.36, 1);
}

.results__chart-bar--neg.results__chart-bar--accent {
  height: calc(35 / 35 * var(--chart-neg-max-px));
}

.results__chart-bar--neg.results__chart-bar--black {
  height: calc(24 / 35 * var(--chart-neg-max-px));
}

.results__chart-bar--neg.results__chart-bar--gray {
  height: calc(30 / 35 * var(--chart-neg-max-px));
}

.results__chart-bar--pos.results__chart-bar--borders {
  height: calc(7.5 / 35 * var(--chart-neg-max-px));
}

.results__chart-bar--accent {
  background-color: var(--color-accent);
}

.results__chart-bar--black {
  background-color: var(--color-main);
}

.results__chart-bar--gray {
  background-color: var(--color-text-secondary);
}

.results__chart-bar--borders {
  background-color: var(--color-border);
}

.results__kpi-cell {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  gap: 8px;
  padding-right: 24px;
}

.results__kpi-cell:last-child {
  padding-right: 0;
}

@media (max-width: 1100px) {
  .results__kpi-cell {
    padding-right: 16px;
  }
}

@media (max-width: 900px) {
  .results__board {
    min-height: 0;
  }
}

@media (prefers-reduced-motion: no-preference) {

  .results__chart-bar--neg.results__chart-bar--accent:not(.is-shown),
  .results__chart-bar--neg.results__chart-bar--black:not(.is-shown),
  .results__chart-bar--neg.results__chart-bar--gray:not(.is-shown),
  .results__chart-bar--pos.results__chart-bar--borders:not(.is-shown) {
    height: 0;
    min-height: 0;
  }
}

@media (max-width: 720px) {
  .results__chart {
    --chart-neg-max-px: clamp(52px, 18vw, 100px);
  }

  .results__kpi-grid {
    grid-template-columns: 1fr;
    gap: 32px 0;
  }

  .results__kpi-cell {
    padding-right: 0;
  }
}

/* ===== Rotate gate (mobile landscape) ===== */
.rotate-gate {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 10000;
  width: 100vw;
  height: 100dvh;
  background-color: var(--color-main);
  background-image: url('../img/background.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
}

.rotate-gate::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(14, 14, 14, 0.55);
}

.rotate-gate__inner {
  position: relative;
  z-index: 1;
  height: 100%;
  width: 100%;
  display: grid;
  place-items: center;
  padding: 24px;
  text-align: center;
}

.rotate-gate__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  max-width: 720px;
}

.rotate-gate__icon {
  width: 42px;
  height: 42px;
  opacity: 0.95;
  /* rotate.svg вставлен как <img>, поэтому красим через filter */
  filter: brightness(0) invert(1);
}

/* Second level titles (H2) — DESIGN_SYSTEM_RULES.md */
.rotate-gate__text {
  margin: 0;
  /* Как "Цифровая платформа" в mobile hero (.hero__label) */
  font-size: 20px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 24px;
  text-transform: none;
  color: var(--color-surface);
}

/* ===== Mobile landscape (phone rotation) =====
 * Цель: когда телефон в landscape (ширина > 720px), не попадать в “десктоп/ноутбук”
 * и уместить контент по высоте (часто 360–500px).
 */
@media (max-width: 900px) and (orientation: landscape) and (max-height: 500px) and (hover: none) and (pointer: coarse) {

  html,
  body {
    width: 100%;
    height: 100%;
    background-color: var(--color-main);
    background-image: url('../img/background.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }

  body {
    overflow: hidden;
  }

  /* Спрятать весь сайт, оставить только один экран */
  body>*:not(.rotate-gate) {
    display: none !important;
  }

  .rotate-gate {
    display: block;
  }

  /* На iOS fixed часто дёргается без явной высоты */
  .rotate-gate__inner {
    height: 100dvh;
  }
}

.results__kpi-name {
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  letter-spacing: 0;
  color: var(--color-text-secondary);
}

/* First level titles (H1) — DESIGN_SYSTEM_RULES.md */
.results__kpi-value {
  font-size: 61px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 64px;
  color: var(--color-main);
  display: block;
  font-variant-numeric: tabular-nums;
}

.results__kpi-desc {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.25;
  color: #2b2b2b;
  max-width: 100%;
}

/* --- Results: breakpoint height ≤ 800px (после базовых стилей) --- */
@media (min-width: 721px) and (max-height: 800px) {
  .results__sticky {
    padding: 32px 0;
  }

  .results .section-label {
    margin-bottom: 8px;
  }

  .results__kpi-value {
    font-size: 48px;
    line-height: 52px;
  }

  .results__kpi-name {
    font-size: 12px;
    line-height: 14px;
  }

  .results__kpi-desc {
    font-size: 14px;
    line-height: 1.3;
  }

  .results__kpi-cell {
    gap: 6px;
    padding-right: 16px;
  }

  .results__chart {
    --chart-neg-max-px: clamp(48px, 6vw, 80px);
  }

  .results__metrics {
    gap: 16px;
  }

  .results__title {
    margin-top: 24px;
    font-size: 72px;
    line-height: 68px;
    max-width: min(520px, 100%);
  }
}

/* ===== Advantages Section ===== */

.advantages {
  background-color: var(--color-surface);
  padding: 120px 0;
}

.advantages__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 24px;
  row-gap: 48px;
}

.advantages__card {
  padding: 32px;
  border: 1px solid var(--color-border);
  border-radius: 0;
  background-color: var(--color-surface);
  transition: border-color 0.25s, background 0.25s;
}

.advantages__card:hover {
  border-color: transparent;
  background:
    linear-gradient(var(--color-surface), var(--color-surface)) padding-box,
    var(--gradient-accent) border-box;
}

.advantages__icon {
  width: 56px;
  height: 56px;
  border-radius: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--gradient-accent);
  color: var(--color-main);
  margin-bottom: 24px;
}

.advantages__title {
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  color: var(--color-main);
  margin-bottom: 12px;
}

.advantages__text {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 20px;
  color: var(--color-text-secondary);
}

/* ===== Advantages → CTA (scroll-driven) ===== */

.ac {
  height: 320vh;
  position: relative;
  background-color: var(--color-surface);
  background-image: url('../img/light.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  /* Фон только под вьюпорт, не едет и не тянется вместе с 320vh секцией */
  background-attachment: fixed;
}

/* Company page: «Запишитесь на демо» без скролл-стикинг и без линии прогресса */
.ac--static {
  height: 100vh;
  padding: 0;
  background-attachment: fixed;
}

.ac--static .ac__sticky {
  position: relative;
  top: auto;
  height: 100vh;
  max-height: none;
  overflow: hidden;
  background-color: transparent;
}

.ac--static .ac__sticky>.container {
  height: 100%;
  padding-top: 0;
  padding-bottom: 0;
}

.ac--static .ac__panel {
  position: absolute;
  inset: 0;
  width: 100%;
  opacity: 1;
  pointer-events: auto;
}

.ac--static .ac__panel--advantages {
  display: none;
}

.ac--static .ac__panel--cta {
  opacity: 1;
  pointer-events: auto;
  min-height: 100%;
}

.ac__sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
  background-color: transparent;
}

.ac__sticky>.container {
  height: 100%;
  position: relative;
  padding-top: 0;
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 0;
}

.ac__panel {
  position: absolute;
  inset: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  transition: opacity 0.35s ease;
  padding-left: var(--container-padding);
  padding-right: var(--container-padding);
  box-sizing: border-box;
}

.ac__panel--advantages {
  opacity: 1;
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  padding-top: 72px;
  padding-bottom: 48px;
  box-sizing: border-box;
  min-height: 100%;
}

.ac__panel--cta {
  opacity: 0;
  pointer-events: none;
  display: grid;
  grid-template-rows: 1fr auto;
  align-items: stretch;
  justify-items: stretch;
  padding-top: 48px;
  padding-bottom: 40px;
  min-height: 100%;
  box-sizing: border-box;
}

.ac__sticky.is-cta .ac__panel--advantages {
  opacity: 0;
  pointer-events: none;
}

.ac__sticky.is-cta .ac__panel--cta {
  opacity: 1;
  pointer-events: auto;
}

.ac__why {
  width: 100%;
  max-width: none;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 40px;
}

.ac__why-heading-wrap {
  flex-shrink: 0;
}

/* First level title — на фоне как в hero */
.ac__why-title {
  margin: 0;
  flex-shrink: 0;
  font-size: 61px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 64px;
  color: var(--color-main);
  text-align: left;
}

.ac__why-accent--mobile {
  display: none;
}

.ac__media {
  width: 100%;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.ac__cards {
  width: 100%;
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 24px;
  row-gap: 16px;
  align-items: stretch;
  align-content: center;
}

/* Карточки «Почему re:source» — как «решение» в секции проблема–решение */
.ac__panel--advantages .ps__card-content--problem::after {
  border: 1.5px solid var(--color-border);
  background: var(--color-surface-alt);
}

.ac__panel--advantages .ps__card-content--problem::before {
  left: 0;
  right: 0;
  top: 0;
  bottom: 16px;
  border: none;
  background: var(--color-surface);
}

.ac__panel--advantages .ps__card-content--problem .ps__card-icon {
  color: var(--color-border);
}

.ac__panel--advantages .ps__card-content--problem .ps__card-title {
  color: var(--color-main);
}

.ac__panel--advantages .ps__card-content--problem .ps__card-text {
  color: var(--color-text-secondary);
}

.ac__card {
  background-color: transparent;
  border: none;
  border-radius: 0;
}

.ac__cta-stage {
  display: grid;
  place-items: center;
  min-height: 0;
  padding: 48px 0;
}

.ac__cta-inner {
  text-align: center;
  max-width: 720px;
  margin: 0 auto;
  width: 100%;
}

.ac__cta-label {
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

.ac__cta-title {
  color: var(--color-main);
}

.ac__cta-text {
  color: var(--color-text-secondary);
}

.ac__cta-contacts .cta-final__sep {
  color: rgba(14, 14, 14, 0.35);
}

.ac__panel--cta .cta-final__contact {
  color: var(--color-text-secondary);
}

.ac__panel--cta .cta-final__contact:hover {
  color: var(--color-main);
}

.ac__footer {
  border-top: none;
}

.ac__footer .footer__inner {
  gap: 24px;
  align-items: center;
}

.ac__footer .footer__text,
.ac__footer .footer__reg {
  color: var(--color-text-secondary);
}

.ac__footer .footer__reg {
  color: var(--color-text-secondary);
}

.ac__footer .footer__logo img {
  filter: none;
  opacity: 1;
}

.ac__footer .footer__reg {
  text-align: right;
}

.ac__footer .footer__inner {
  padding: 0;
}

.ac__footer {
  padding-left: 0;
  padding-right: 0;
}

@media (max-width: 800px) {
  .ac__footer .footer__info {
    text-align: left;
    justify-self: start;
  }

  .ac__footer .footer__reg {
    text-align: left;
    justify-self: start;
  }

  .ac__footer .footer__logo {
    justify-self: center;
  }
}

.ac__panel--cta .ac__footer {
  position: relative;
  left: auto;
  right: auto;
  bottom: auto;
  width: 100%;
  align-self: end;
}

.ac__panel--cta .footer__inner {
  padding: 0 var(--container-padding);
  max-width: var(--container-max);
  margin: 0 auto;
  width: 100%;
  box-sizing: border-box;
}

@media (max-width: 800px) {
  .ac__why-title {
    font-size: 40px;
    line-height: 44px;
  }

  .ac__cards {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 560px) {
  .ac__cards {
    grid-template-columns: 1fr;
  }
}

/* ===== CTA Final Section ===== */

.cta-final {
  background-color: var(--color-main);
  padding: 160px 0;
}

.cta-final__inner {
  text-align: center;
  max-width: 720px;
  margin: 0 auto;
}

.cta-final__label {
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  margin-bottom: 12px;
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

.cta-final__title {
  font-size: 96px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 88px;
  color: var(--color-surface);
  margin-bottom: 32px;
}

.cta-final__text {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 20px;
  color: rgba(255, 255, 255, 0.6);
  margin-bottom: 48px;
}

.cta-final__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 20px 48px;
  background: var(--gradient-accent);
  color: var(--color-main);
  border-radius: 100px;
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  transition: opacity 0.25s;
}

.cta-final__btn:hover {
  opacity: 0.88;
}

.cta-final__contacts {
  margin-top: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}

.cta-final__contact {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 20px;
  color: rgba(255, 255, 255, 0.6);
  transition: color 0.2s;
}

.cta-final__contact:hover {
  color: var(--color-surface);
}

.cta-final__sep {
  color: rgba(255, 255, 255, 0.3);
}

/* CTA в секции .ac: после общих .cta-final__* — явно тёмный текст; .accent остаётся градиентом */
.ac__panel--cta .cta-final__title {
  color: var(--color-main);
  -webkit-text-fill-color: var(--color-main);
}

.ac__panel--cta .cta-final__title .accent {
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.ac__panel--cta .cta-final__text {
  color: var(--color-main);
  -webkit-text-fill-color: var(--color-main);
}

.cta-final__btn-text--mob {
  display: none;
}

.cta-final__btn-hero {
  display: inline-flex;
  align-items: center;
  gap: 0;
  height: 80px;
  padding: 8px 8px 8px 24px;
  background-color: var(--color-main);
  border-radius: 16px;
  transition: opacity 0.2s;
}

.cta-final__btn-hero:hover {
  opacity: 0.88;
}

.cta-final__btn-hero-text {
  flex: 1;
  text-align: center;
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  color: var(--color-surface);
  padding-right: 16px;
}

.cta-final__btn-hero-circle {
  flex-shrink: 0;
  width: 64px;
  height: 64px;
  border-radius: 12px;
  background: var(--gradient-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  color: var(--color-main);
}

/* ===== Footer ===== */

.footer {
  background-color: var(--color-surface-alt);
  padding: 48px 0 40px;
  margin-top: 100px;
}

.footer__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 24px 32px;
}

.footer__info {
  grid-column: 1;
  grid-row: 1;
  justify-self: start;
  align-self: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
}

.footer__logo {
  grid-column: 2;
  grid-row: 1;
  justify-self: center;
  align-self: center;
  display: flex;
  align-items: center;
  line-height: 0;
}

.footer__logo img {
  height: 40px;
  width: auto;
  display: block;
}

.footer__text {
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 16px;
  color: var(--color-text-secondary);
  margin: 0;
}

.footer__reg {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
  align-self: center;
  margin: 0;
  margin-left: 0;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 16px;
  color: var(--color-text-secondary);
  text-align: right;
}

@media (max-width: 800px) {
  .footer__inner {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    gap: 20px;
  }

  .footer__info {
    grid-column: 1;
    justify-self: center;
    text-align: center;
    order: 1;
  }

  .footer__logo {
    grid-column: 1;
    order: 2;
  }

  .footer__reg {
    grid-column: 1;
    justify-self: center;
    text-align: center;
    order: 3;
  }
}

/* CTA panel footer must not inherit light .footer chrome; 40px to screen edge via .ac__panel--cta padding-bottom */
footer.footer.ac__footer {
  background-color: transparent;
  padding: 0;
  margin-top: 100px;
}

/* Company page CTA: footer должен быть внизу панели */
.ac--static footer.footer.ac__footer {
  margin-top: 100px;
}

/* ===== Company page ===== */


.company-expertise {
  min-height: 0;
}

.company-expertise>.container {
  min-height: 0;
  padding-top: 48px;
  padding-bottom: 48px;
}

.company-expertise .section-label {
  flex-shrink: 0;
  margin-bottom: 24px;
}

/* Company page — Documents & status (card layout, 3 in a row) */
.cp.company-credentials {
  padding: 56px 0 48px;
}

.cp.company-credentials .company-credentials__cards {
  margin-top: 48px;
}

.cp.company-credentials .ps__card .ps__card-content--solution {
  opacity: 1;
  pointer-events: auto;
}

.cp.company-credentials .ps__card-content--solution::after {
  border: none;
}

.cp.company-credentials .ps__card-content--solution::before {
  border: 1.5px solid var(--color-border);
}

.company-expertise__intro {
  margin-bottom: 48px;
  max-width: 900px;
}

.company-expertise__heading {
  margin-bottom: 24px;
}

.company-expertise__lead {
  margin-top: 0;
  max-width: 640px;
}

.company-expertise__stats {
  grid-template-columns: repeat(5, 1fr);
}

@media (max-width: 1200px) {
  .company-expertise__stats {
    grid-template-columns: repeat(3, 1fr);
    row-gap: 32px;
  }
}

@media (max-width: 720px) {
  .company-expertise__stats {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .company-expertise__stats {
    grid-template-columns: 1fr;
  }
}

/* ===== Company page — hero + positioning (company-desktop.png) ===== */

.company-hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background-image: url('../img/light.png');
  background-size: cover;
  background-position: center;
}

.company-hero .header {
  flex-shrink: 0;
}

.company-hero__content {
  position: relative;
  z-index: 2;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-bottom: 64px;
}

.company-hero__title {
  font-size: 96px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 88px;
  color: var(--color-main);
  max-width: 1120px;
}

.company-hero__title-line {
  display: block;
}

.company-hero__lead {
  margin: 24px 0 0;
  max-width: 900px;
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  color: var(--color-text-secondary);
}

.company-hero__bottom.hero__bottom {
  flex-shrink: 0;
  background-color: transparent;
}

.company-hero .hero__demo-btn {
  border-radius: 16px;
}

/* Позиционирование: sticky 100vh, 6 карточек (2×3), переключение по скроллу, полоса прогресса */
.cp {
  position: relative;
  height: auto;
  box-sizing: border-box;
  background-color: var(--color-surface);
  padding: 56px 0 48px;
}

.cp__sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  max-height: 100vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background-color: var(--color-surface);
  box-sizing: border-box;
}

.cp__sticky .sticky-progress__track {
  background-color: rgba(14, 14, 14, 0.15);
}

.cp__sticky-inner {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding-top: 48px;
  padding-bottom: 48px;
  position: relative;
  z-index: 1;
}

.cp__label.section-label {
  flex-shrink: 0;
  margin: 0;
}

.cp__copy {
  margin-top: 72px;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex: 0 0 auto;
  min-height: 0;
  width: 100%;
}

.cp__copy-grid {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: 24px;
}

.cp__copy-text {
  grid-column: 5 / 13;
  text-align: left;
}

/* Отступ между текстовым блоком и сеткой карточек */
.cp .ps__cards.cp__cards {
  margin-top: 112px;
}

.cp__title {
  margin: 0;
  font-size: 61px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 64px;
  color: var(--color-main);
}

.cp__competitors {
  margin: 24px 0 0;
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  color: var(--color-text-secondary);
}

/* Карточки: две страницы по 3; белый блок (::before) с обводкой, серый (::after) без */
.cp__cards-pages {
  flex-shrink: 0;
  width: 100%;
  margin-top: 0;
}

.cp .cp__cards-page.ps__cards.cp__cards {
  display: none;
  width: 100%;
}

.cp .cp__cards-page.ps__cards.cp__cards.is-active {
  display: grid;
}

.cp .ps__card .ps__card-content--solution {
  opacity: 1;
  pointer-events: auto;
}

.cp .ps__card-content--solution::after {
  border: none;
}

.cp .ps__card-content--solution::before {
  border: 1.5px solid var(--color-border);
}

@media (prefers-reduced-motion: reduce) {
  .cp {
    height: auto;
    min-height: 0;
  }

  .cp__sticky {
    position: relative;
    height: auto;
    max-height: none;
    overflow: visible;
  }

  .cp .cp__cards-page.ps__cards.cp__cards {
    display: grid !important;
    margin-bottom: 16px;
  }

  .cp .cp__cards-page.ps__cards.cp__cards:last-child {
    margin-bottom: 0;
  }

  .cp__sticky .sticky-progress {
    display: none;
  }
}

.company-credentials .section-title {
  margin-bottom: 24px;
}

.company-about {
  padding: 80px 0 72px;
  background-color: var(--color-surface-alt);
}

.results.company-does {
  height: auto;
  min-height: 0;
  padding: 80px 0 96px;
  background-color: var(--color-surface-alt);
}

.company-does .section-head .section-desc {
  margin-top: 16px;
}

.company-market {
  padding: 80px 0 96px;
  background-color: var(--color-surface);
}

.company-market__lead {
  margin-top: 0;
}

.company-market__sub {
  margin-top: 20px;
  margin-bottom: 0;
}

.company-market__list {
  list-style: none;
  padding: 0;
  margin: 24px 0 0;
  max-width: 720px;
}

.company-market__item {
  position: relative;
  padding-left: 22px;
  margin-bottom: 14px;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 20px;
  color: var(--color-text-secondary);
}

.company-market__item:last-child {
  margin-bottom: 0;
}

.company-market__item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 7px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gradient-accent);
}

.company-market__item strong {
  color: var(--color-main);
  font-weight: 500;
}

.company-contact {
  padding: 64px 0 80px;
  background-color: var(--color-surface-alt);
  border-top: 1px solid var(--color-border);
}

.company-contact__title {
  margin-top: 12px;
  margin-bottom: 0;
}

.company-contact__inner {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 40px;
  margin-top: 24px;
  align-items: baseline;
}

.company-contact__inner a {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 20px;
  color: var(--color-main);
  text-decoration: none;
}

.company-contact__inner a:hover {
  text-decoration: underline;
}

.company-contact__legal {
  margin: 0;
  font-size: 16px;
  line-height: 20px;
  color: var(--color-text-secondary);
}

.company-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.company-cards--three {
  grid-template-columns: repeat(3, 1fr);
}

.company-card {
  padding: 32px;
  border: 1px solid var(--color-border);
  border-radius: 0;
  background-color: var(--color-surface);
}

.company-card__title {
  font-size: 27px;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 32px;
  color: var(--color-main);
  margin-bottom: 12px;
}

.company-card__text {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 20px;
  color: var(--color-text-secondary);
}

@media (max-width: 1100px) {

  .company-cards--three,
  .company-cards {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 800px) {
  .cp {
    height: auto;
  }

  .cp__title {
    font-size: 40px;
    line-height: 44px;
  }

  .cp__copy-text {
    grid-column: 1 / -1;
  }

  .cp.company-credentials {
    padding-top: 32px;
  }

  .company-cards--three,
  .company-cards {
    grid-template-columns: 1fr;
  }
}

/* --- Company page: breakpoint height ≤ 800px (после базовых стилей) --- */
@media (min-width: 721px) and (max-height: 800px) {

  /* Hero */
  .company-hero__title {
    font-size: 72px;
    line-height: 68px;
  }

  .company-hero__lead {
    font-size: 22px;
    line-height: 28px;
    margin-top: 16px;
  }

  .company-hero__content {
    padding-bottom: 48px;
  }

  .company-hero__bottom.hero__bottom {
    padding: 32px 0 40px;
  }

  /* CP (Позиционирование) */
  .cp {
    padding: 40px 0 40px;
  }

  .cp__title {
    font-size: 48px;
    line-height: 52px;
  }

  .cp__competitors {
    font-size: 22px;
    line-height: 28px;
    margin-top: 16px;
  }

  .cp__copy {
    margin-top: 48px;
  }

  .cp .ps__cards.cp__cards {
    margin-top: 64px;
  }

  .cp .ps__card {
    height: 176px !important;
    min-height: 176px;
    max-height: 176px;
  }

  .cp .ps__card-content--solution {
    height: 176px;
    min-height: 176px;
    max-height: 176px;
    padding: 20px 24px 28px;
  }

  .cp .ps__card-content--solution .ps__card-icon {
    width: 44px;
    height: 44px;
    top: 18px;
    right: 18px;
  }

  .cp .ps__card-content--solution .ps__card-icon svg {
    width: 44px;
    height: 44px;
  }

  /* Company cards */
  .company-card {
    padding: 24px;
  }

  .company-card__title {
    font-size: 22px;
    line-height: 28px;
    margin-bottom: 8px;
  }

  .company-card__text {
    font-size: 14px;
    line-height: 18px;
  }
}

/* Re:Source — mobile layout (max-width: 720px). Сверка с main-mobile.png + Typescale / Grid mobile */

@media (max-width: 720px) {

  /* Убирает типичную светлую полоску 1px справа (body) при субпикселях / ширине контента */
  body {
    overflow-x: clip;
  }

  :root {
    /* Grid-mobile.md: боковые поля контента 32px */
    --container-padding: 32px;
  }

  /*
   * Сетка самолёта (Grid-mobile.md): margin 32px, gutter 16px, 4 колонки.
   * Вертикаль центра 1-й колонки: margin + (100% − 2×margin − 3×gutter) / 8 — по ней выравнивается левый край img (не центр картинки).
   * Проценты от ширины .hero, не 100vw.
   */
  .hero {
    height: 90vh;
    height: 90svh;
    --plane-grid-margin: 32px;
    --plane-grid-gutter: 16px;
    /* низ хедера: padding-top 36px + ряд 48px (лого / кнопки) */
    --hero-header-bottom: calc(36px + 48px);
  }

  body.nav-open {
    overflow: hidden;
  }

  .desk-only {
    display: none;
  }

  /* Лейблы секций — мелкий жёлтый капс (кейс и результат — как «проблема») */
  .section-label {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.08em;
    line-height: 16px;
    text-transform: uppercase;
    margin-bottom: 12px;
  }

  /* Кейс / Результат: Second level + градиент */
  .case .section-label,
  .results .section-label {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 24px;
    text-transform: none;
    margin-bottom: 0;
    background: var(--gradient-accent);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
  }

  /* Company page: названия секций как на главной (mobile) */
  .cp .section-label,
  .company-credentials .section-label {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 24px;
    text-transform: none;
    margin-bottom: 0;
    background: var(--gradient-accent);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
  }

  /* ----- Aircrafts marquee ----- */
  .aircrafts__content {
    font-size: 32px;
    line-height: 1.3;
  }

  /* ----- Header & menu ----- */
  .header {
    padding-top: 18px;
  }

  .header__nav {
    display: none;
  }

  /* Только мобилка: без кнопки кабинета в хедере (она в выезжающем меню) */
  .header__account {
    display: none !important;
  }

  /* Как на десктопе: Medium 500, те же метрики что у .header__cta */
  .header__cta {
    height: 44px;
    padding: 12px 20px;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 20px;
    border-radius: 10px;
  }

  .header__menu {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 48px;
    height: 48px;
    padding: 0;
    border: none;
    border-radius: 12px;
    background-color: var(--color-surface);
    color: var(--color-main);
    cursor: pointer;
    transition: opacity 0.2s;
  }

  .header__menu:hover {
    opacity: 0.88;
  }

  .header__menu-bar {
    display: block;
    width: 20px;
    height: 2px;
    background-color: currentColor;
    border-radius: 1px;
  }

  .site-menu {
    position: fixed;
    inset: 0;
    z-index: 100;
    pointer-events: none;
  }

  .site-menu.is-open {
    pointer-events: auto;
  }

  .site-menu__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(14, 14, 14, 0.45);
    opacity: 0;
    transition: opacity 0.3s ease;
  }

  .site-menu.is-open .site-menu__backdrop {
    opacity: 1;
  }

  .site-menu__panel {
    position: absolute;
    top: 0;
    right: 0;
    width: min(300px, 88vw);
    height: 100%;
    background: var(--color-surface);
    box-shadow: -12px 0 40px rgba(14, 14, 14, 0.12);
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
    padding: 88px var(--container-padding) 28px;
    box-sizing: border-box;
    overflow: hidden;
  }

  .site-menu.is-open .site-menu__panel {
    transform: translateX(0);
  }

  .site-menu__close {
    position: absolute;
    top: 24px;
    right: 24px;
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border: none;
    border-radius: 12px;
    background: var(--color-surface);
    color: var(--color-main);
    cursor: pointer;
    transition: opacity 0.2s;
  }

  .site-menu__close:hover {
    opacity: 0.88;
  }

  .site-menu__close svg {
    display: block;
  }

  .site-menu__nav {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  .site-menu__link {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 24px;
    color: var(--color-main);
  }

  .site-menu__link--cta {
    margin-top: 8px;
    padding: 14px 24px;
    border-radius: 12px;
    background: var(--color-main);
    color: var(--color-surface);
    text-align: center;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: -0.02em;
    line-height: 20px;
  }

  /* ----- Hero -----
   * Самолёт: высота 266px; горизонтально — по центру 2-й колонки сетки 4×16 (margin 32, gutter 16).
   * Верх img: на 40px ниже нижнего края хедера.
   */
  .hero__plane-parallax {
    left: calc(var(--plane-grid-margin) + 3 * (100% - 2 * var(--plane-grid-margin) - 3 * var(--plane-grid-gutter)) / 8 + var(--plane-grid-gutter));
    top: 72px;
    transform: translateX(var(--hero-plane-scroll));
  }

  .hero__plane {
    width: auto;
    height: 266px;
    max-width: none;
    object-fit: contain;
  }

  .hero__content {
    padding-bottom: 32px;
  }

  /* Second level titles mob */
  .hero__label {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 24px;
    text-transform: none;
    color: var(--color-text-secondary);
    margin-bottom: 16px;
  }

  /* Accent level mob */
  .hero__title {
    font-size: 48px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 48px;
  }

  .hero__title-accent {
    font-size: inherit;
    line-height: inherit;
    letter-spacing: inherit;
  }

  .hero__bottom {
    padding: 24px 0 32px;
  }

  .hero__bottom-inner {
    display: grid;
    grid-template-columns: minmax(150px, max-content) auto;
    grid-template-rows: auto auto;
    column-gap: 16px;
    row-gap: 8px;
    align-items: end;
  }

  .hero__stat-label {
    grid-column: 1;
    grid-row: 1;
  }

  .hero__stat-value {
    grid-column: 1;
    grid-row: 2;
    font-size: 48px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 48px;
    white-space: nowrap;
  }

  /* Блок «проведённые работы» — только десктоп (сетка 12 колонок); на мобильном скрыт по макету */
  .hero .hero__case-label,
  .hero .hero__case-text {
    display: none;
  }

  .hero__demo {
    grid-column: 2;
    grid-row: 1 / 3;
    align-self: end;
    width: auto;
    min-width: 0;
  }

  .hero__demo-btn {
    height: 64px;
    padding: 8px 8px 8px 16px;
    border-radius: 12px;
    width: auto;
    min-width: 160px;
  }

  /* Second level titles mob + белый цвет текста «Демо» */
  .hero__demo-text {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 24px;
    text-transform: none;
    background: none;
    -webkit-background-clip: unset;
    -webkit-text-fill-color: #ffffff;
    background-clip: unset;
    color: #ffffff;
  }

  .hero__demo-circle {
    width: 48px;
    height: 48px;
    font-size: 22px;
    border-radius: 8px;
    background: var(--gradient-accent);
    color: var(--color-main);
  }

  .company-hero {
    min-height: 100vh;
    height: 100vh;
    height: 100svh;
  }

  .company-hero__content {
    padding-bottom: 32px;
  }

  .company-hero__title {
    font-size: 48px;
    line-height: 48px;
    max-width: none;
  }

  .company-hero__lead {
    /* Как "Цифровая платформа" в mobile hero (.hero__label) */
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 24px;
    text-transform: none;
    color: var(--color-text-secondary);
    margin: 16px 0 0;
    max-width: none;
  }

  /* Нижний блок на мобилке — как на главной: KPI слева, кнопка справа */
  .company-hero .hero__case-label,
  .company-hero .hero__case-text {
    display: none;
  }

  /* В KPI значение может быть длиннее чем "$2 млн." */
  .company-hero .hero__stat-value {
    font-size: 40px;
    line-height: 40px;
    white-space: nowrap;
  }

  /* Company page: уменьшить иконки в карточках (позиционирование + документы) */
  .cp .ps__card-content--solution .ps__card-icon {
    width: 40px;
    height: 40px;
    top: 18px;
    right: 18px;
  }

  .cp .ps__card-content--solution .ps__card-icon svg {
    width: 40px;
    height: 40px;
  }

  .cp {
    height: auto;
    padding: 72px 0;
  }

  .cp__title {
    font-size: 40px;
    line-height: 44px;
  }

  .cp__copy-text {
    grid-column: 1 / -1;
  }

  /* ----- Problem / Solution / Product ----- */
  .ps {
    height: 720vh;
  }

  /* Как на десктопе: только «проблема» и «решение», подпись «ресурс» скрыта */
  .ps__nav-product {
    display: none !important;
  }

  .ps__nav {
    flex-wrap: nowrap;
    align-items: center;
    gap: 16px;
    margin-bottom: 0;
  }

  .ps__nav-track {
    order: 0;
    flex: 1;
    top: 2px;
    min-width: 0;
    margin-bottom: 0;
  }

  /* Second level titles mob — наследует градиент / приглушение от десктопных правил .ps__nav-* */
  .ps__nav-start,
  .ps__nav-end {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 24px;
  }

  /* 10px под полосой прогресса; 40px «воздуха» под карточками — в .ps__media (padding-bottom) */
  .ps__sticky>.container {
    min-height: 0;
    padding-top: 28px;
    padding-bottom: 10px;
  }

  /* Фоновые слои чуть шире вьюпорта — без щели 1px у края */
  .ps__sticky::before,
  .ps__sticky::after {
    inset: -1px;
  }

  .ps__heading-text--desktop {
    display: none;
  }

  .ps__heading-text--mobile {
    display: block;
  }

  .ps__heading-solution-text--desktop {
    display: none;
  }

  .ps__heading-solution-text--mobile {
    display: block;
  }

  .ps__heading-wrap {
    min-height: 0;
    place-items: center;
    padding: 0;
    margin-bottom: 0;
  }

  .ps__heading {
    font-size: 40px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 44px;
    text-align: center;
  }

  .ps__cards {
    grid-template-columns: 1fr;
    row-gap: 16px;
    column-gap: 0;
  }

  .ps__cards .ps__card:not(.ps__card--mobile-visible) {
    display: none !important;
  }

  .ps__cards .ps__card.ps__card--mobile-visible {
    display: grid !important;
  }

  .cp .ps__cards .ps__card {
    display: grid !important;
  }

  /* Карточки блока .ps: высота 208px на мобилке */
  .ps .ps__card {
    height: 208px !important;
    min-height: 208px;
    max-height: 208px;
  }

  .ps .ps__card-content,
  .ps .ps__card-content--problem,
  .ps .ps__card-content--solution {
    height: 208px;
    min-height: 208px;
    max-height: 208px;
    padding: 32px 40px 48px;
  }

  .ps .ps__card-content--problem .ps__card-icon,
  .ps .ps__card-content--solution .ps__card-icon {
    width: 54px;
    height: 54px;
    top: 24px;
    right: 24px;
  }

  .ps .ps__card-content--problem .ps__card-icon svg,
  .ps .ps__card-content--solution .ps__card-icon svg {
    width: 54px;
    height: 54px;
  }

  .ps .ps__card-title {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 24px;
    margin-bottom: 12px;
    padding-right: 62px;
  }

  .ps .ps__card-content--problem .ps__card-title {
    padding-right: 62px;
  }

  .ps .ps__card-content--solution .ps__card-title {
    padding-right: 62px;
  }

  .ps .ps__card-text {
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: -0.02em;
    max-width: none;
  }

  .cp .ps__card-content--solution {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .cp .ps__card-content--solution::before,
  .cp .ps__card-content--solution::after {
    display: block !important;
  }

  .cp .ps__card-content--solution::after {
    border: none !important;
  }

  .cp .ps__card-content--solution::before {
    border: 1.5px solid var(--color-border) !important;
  }

  /* Две карточки: 208 + gap 16 + 208; + 40px отступ снизу внутри блока */
  .ps__media {
    min-height: 472px;
    height: auto;
    padding-bottom: 40px;
    box-sizing: border-box;
    align-self: stretch;
    border-radius: 0;
    overflow: hidden;
  }

  .ps__platform-frame {
    overflow: hidden;
    border-radius: 0;
  }

  /* Фаза «продукт»: картинки 450px снизу; та же flex-схема, что у «решение» (heading-wrap flex:1 + media с min-height), чтобы заголовок не прыгал */
  .ps__sticky.is-platform {
    overflow: hidden;
  }

  .ps__sticky.is-platform>.container {
    min-height: 0;
  }

  .ps__sticky.is-platform>.container .ps__media {
    flex: 0 0 auto;
    flex-shrink: 0;
    min-height: 472px;
    height: auto;
    padding-bottom: 40px;
    box-sizing: border-box;
    align-self: stretch;
    border-radius: 0;
    overflow: visible;
    position: relative;
  }

  .ps__sticky.is-platform .ps__platform {
    position: absolute;
    left: 0;
    right: 0;
    top: auto;
    bottom: 0;
    height: 450px;
  }

  .ps__sticky.is-platform .ps__platform-frame {
    height: 100%;
    overflow: visible;
  }

  .ps__sticky.is-platform .ps__platform-image {
    position: absolute;
    left: 0;
    bottom: 0;
    top: auto;
    transform: none;
    width: auto;
    max-width: none;
    height: 450px;
    object-fit: contain;
    object-position: left bottom;
  }

  /* ----- Case ----- */
  .case>.container {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 16px;
    padding-top: 64px;
    padding-bottom: 64px;
    min-height: 0;
  }

  .case>.container>.section-label {
    grid-column: 1 / -1;
  }

  .case>.container>.case__hero {
    grid-column: 1 / -1;
  }

  .case>.container>.case__stats {
    grid-column: 2 / -1;
  }

  .case__hero {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 16px;
    row-gap: 24px;
    justify-content: stretch;
  }

  .case__number-wrap {
    grid-column: 1 / -1;
    margin-top: 140px;
    margin-bottom: 0;
  }

  .case__number--desktop {
    display: none !important;
  }

  .case__number-img {
    display: block;
    width: 100%;
    height: auto;
  }

  .case__desc {
    display: contents;
  }

  .case__subtitle {
    grid-column: 2 / -1;
    order: 0;
    padding: 0;
    font-size: 48px;
    line-height: 48px;
    text-align: left;
  }

  .case__context-col {
    grid-column: 2 / -1;
    order: 0;
    gap: 16px;
  }

  .case__context {
    font-size: 20px;
    line-height: 24px;
    margin-top: 0;
  }

  .case__stats {
    grid-template-columns: 1fr;
    row-gap: 28px;
    margin-top: 56px;
    padding-top: 0;
    border-top: none;
  }

  .case__stat-value {
    font-size: 20px;
    line-height: 24px;
  }

  /* ----- Process ----- */
  .process {
    padding: 72px 0 72px;
  }

  .process>.container {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 16px;
  }

  .process>.container>.process__heading {
    grid-column: 2 / -1;
  }

  .process>.container>.process__flow {
    grid-column: 1 / -1;
  }

  .process__heading {
    font-size: 40px;
    line-height: 44px;
    margin-bottom: 80px;
    margin-left: 0;
    width: 100%;
  }

  .process__arrows-top,
  .process__arrow-bottom {
    display: none;
  }

  .process__grid {
    grid-template-columns: 1fr;
    margin-top: 0;
    row-gap: 24px;
  }

  /* ----- Fleet ----- */
  .fleet {
    height: auto;
    min-height: 90vh;
    padding: 48px 0 56px;
    overflow: visible;
  }

  .fleet>.container {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 16px;
    row-gap: 88px;
    align-content: center;
  }

  .fleet__grid {
    grid-template-columns: 1fr;
    row-gap: 24px;
    column-gap: 0;
  }

  .fleet__heading {
    grid-column: 2 / -1;
    font-size: 40px;
    line-height: 44px;
    margin: 0;
  }

  .fleet__card {
    height: 272px;
    min-height: 272px;
    max-height: 272px;
  }

  .fleet__img {
    max-height: none;
    object-position: center;
  }

  .process__card {
    box-sizing: border-box;
    height: 440px;
    min-height: 440px;
    max-height: 440px;
    padding: 24px 32px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: left;
    gap: 0;
  }

  /* Цифра — по центру, цвет borders; метрики как Accent level mob */
  .process__card-icon {
    font-size: 48px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 48px;
    margin-bottom: 16px;
    flex-shrink: 0;
    color: var(--color-border);
    font-variant-numeric: tabular-nums;
    width: 100%;
    text-align: center;
  }

  .process__card-icon span {
    text-align: center;
  }

  /* Заголовок по центру */
  .process__card-title {
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 0;
    flex-shrink: 0;
    max-width: 100%;
    width: 100%;
    text-align: center;
    text-wrap: balance;
  }

  /* Основной текст — выключка влево; 48px от заголовка только если есть список */
  .process__card-list {
    flex: 0 1 auto;
    min-height: 0;
    width: 100%;
    align-self: stretch;
    text-align: left;
    margin-top: 48px;
  }

  .process__card-list li {
    padding-left: 20px;
    text-align: left;
  }

  .process__card-list li::before {
    position: absolute;
    left: 0;
    display: block;
    margin-right: 0;
  }

  /* ----- Stages ----- */
  /* Как у PS: отступ подписи — padding-top у контейнера 28px; снизу 24px до карточки + 10px полоса прогресса */
  .stages__sticky {
    padding: 0 0 calc(24px + 10px);
  }

  .stages__container {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 16px;
    grid-template-rows: auto minmax(0, 1fr) auto;
    row-gap: 0;
    flex: 1;
    min-height: 0;
    padding-top: 28px;
  }

  .stages__container>.stages__label {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  .stages__kpi-slot {
    display: grid;
    grid-column: 1 / -1;
    grid-row: 2;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-rows: minmax(0, 1fr) auto minmax(0, 1fr);
    column-gap: 16px;
    row-gap: 0;
    min-height: 0;
    align-self: stretch;
  }

  .stages__kpi-slot>.stages__mid-spacer:first-child {
    grid-column: 1 / -1;
    grid-row: 1;
    min-height: 0;
  }

  .stages__kpi-slot>.stages__level1-row {
    grid-column: 2 / -1;
    grid-row: 2;
    max-width: none;
    width: auto;
    align-self: center;
  }

  .stages__kpi-slot>.stages__mid-spacer:last-child {
    grid-column: 1 / -1;
    grid-row: 3;
    min-height: 0;
  }

  .stages__container>.stages__content {
    grid-column: 1 / -1;
    grid-row: 3;
    align-self: end;
    min-height: 0;
    padding-bottom: 0;
  }

  /* Как подпись «кейс» / «проблема»: Second level + градиент */
  .stages__label {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 24px;
    text-transform: none;
    margin-bottom: 0;
    background: var(--gradient-accent);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
  }

  .stages__level1-line {
    font-size: 40px;
    line-height: 44px;
  }

  /* Один KPI в слоте: полные фразы «5 машин в неделю» / «1 неделя обучения»; кроссфейд при idx >= 2 */
  .stages__level1-pair {
    display: grid;
    grid-template-areas: 'kpi';
    align-content: start;
  }

  .stages__level1-pair>.stages__level1 {
    grid-area: kpi;
    margin: 0;
    transition: opacity 0.45s ease, visibility 0.45s ease;
  }

  .stages__level1--kpi-b {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }

  .stages--kpi-week .stages__level1--kpi-a {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }

  .stages--kpi-week .stages__level1--kpi-b {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .stages__level1-kpi-sub {
    color: var(--color-main);
    -webkit-text-fill-color: var(--color-main);
    background: none;
    -webkit-background-clip: unset;
    background-clip: unset;
  }

  .stages__kpi-footnote {
    margin-top: 8px;
    max-width: 100%;
  }

  .stages__card-stack {
    min-height: 470px;
    height: 470px;
  }

  .stages__card {
    height: 470px;
    min-height: 470px;
    max-height: 470px;
    box-sizing: border-box;
  }

  .stages__card-inner {
    display: flex;
    flex-direction: column;
    grid-template-columns: unset;
    grid-template-rows: unset;
    min-height: 0;
    height: 100%;
  }

  .stages__card-col--media {
    order: -1;
    flex: 0 0 auto;
    width: 100%;
    min-height: 0;
    padding: 0;
    align-items: stretch;
    justify-content: flex-start;
  }

  .stages__card-col--text {
    order: 1;
    flex: 1 1 auto;
    min-height: 0;
    height: auto;
    padding: 32px 24px 24px;
    justify-content: flex-start;
    overflow-y: auto;
  }

  /* Typescale-Mobile: 01 — Accent level mob + Borders; заголовок — Second level mob; описание — Paragraph */
  .stages__card-step {
    margin: 0 0 24px;
    font-size: 48px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 48px;
    font-variant-numeric: tabular-nums;
    color: var(--color-border);
  }

  .stages__card-title {
    margin: 0;
    padding: 0;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 24px;
    color: var(--color-main);
  }

  .stages__card-desc {
    margin: 12px 0 0;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: -0.02em;
    line-height: 20px;
    color: var(--color-text-secondary);
  }

  .stages__card-img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
  }

  @media (prefers-reduced-motion: reduce) {
    .stages__level1-pair>.stages__level1 {
      transition: none;
    }
  }

  /* ----- Results: 858px (810 + 48) на мобилке ----- */
  .results {
    height: 858px;
    min-height: 858px;
    max-height: none;
    box-sizing: border-box;
    padding: 0;
    overflow: visible;
  }

  .results__sticky {
    position: relative;
    top: auto;
    padding: 0;
    max-height: none;
    min-height: 100%;
    height: 100%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
  }

  .results__sticky>.sticky-progress {
    display: none;
  }

  .results__sticky>.container {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 16px;
    row-gap: 56px;
    grid-template-rows: auto auto auto;
    align-content: start;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    min-width: 0;
    padding-top: 28px;
    padding-bottom: 0;
    box-sizing: border-box;
  }

  .results__sticky>.container>.section-label {
    grid-column: 1 / -1;
    grid-row: 1;
    align-self: start;
  }

  .results__board {
    display: contents;
  }

  .results__title {
    grid-column: 2 / -1;
    grid-row: 2;
    align-self: start;
    margin-top: 0;
    margin-bottom: 0;
    font-size: 40px;
    line-height: 44px;
    white-space: normal;
    max-width: 100%;
  }

  .results__title-desktop {
    display: none;
  }

  .results__title-mobile {
    display: block;
  }

  .results__center {
    grid-column: 1 / -1;
    grid-row: 3;
    align-self: start;
    flex: 0 0 auto;
    min-height: 0;
    width: 100%;
  }

  /* После .container: всегда 32px внизу секции (flex-листок под растянутым контейнером) */
  .results__sticky>.results__mobile-spacer {
    display: block;
    flex: 0 0 32px;
    width: 100%;
    height: 32px;
    min-height: 32px;
    max-height: 32px;
    flex-shrink: 0;
    box-sizing: border-box;
    pointer-events: none;
  }

  .results__metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 0;
    align-items: stretch;
    width: 100%;
    min-width: 0;
  }

  .results__kpi-grid {
    grid-column: 1 / 3;
    display: flex;
    flex-direction: column;
    gap: 32px;
    text-align: right;
    align-items: flex-end;
    align-self: stretch;
    min-width: 0;
  }

  .results__kpi-cell {
    padding-right: 0;
    gap: 6px;
    align-items: flex-end;
    text-align: right;
  }

  .results__kpi-name,
  .results__kpi-value,
  .results__kpi-desc {
    text-align: right;
  }

  .results__kpi-value {
    font-size: 40px;
    line-height: 44px;
  }

  /* График: ось по центру; − слева от оси, + справа. Отступ снизу — .results__mobile-spacer в разметке */
  .results__chart {
    grid-column: 3 / -1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr);
    grid-template-rows: repeat(4, minmax(0, 1fr));
    align-items: stretch;
    min-width: 0;
    max-width: none;
    width: 100%;
    height: 100%;
    min-height: 0;
    margin-left: 24px;
    margin-bottom: 0;
    align-self: stretch;
  }

  .results__chart-axis {
    grid-column: 2;
    grid-row: 1 / -1;
    width: 1px;
    height: auto;
    align-self: stretch;
    flex-shrink: 0;
  }

  .results__chart-neg {
    grid-column: 1;
    grid-row: 1 / 4;
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
    width: 100%;
    height: 100%;
    grid-template-columns: none;
    align-items: stretch;
  }

  .results__chart-pos {
    grid-column: 3;
    grid-row: 4;
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    min-height: 0;
    min-width: 0;
    width: 100%;
    height: 100%;
    grid-template-columns: none;
  }

  .results__chart-pos .results__chart-col:not(:last-child) {
    display: none;
  }

  .results__chart-pos .results__chart-col:last-child {
    display: flex;
    flex: 1;
    flex-direction: row;
    align-items: stretch;
    justify-content: flex-start;
    align-self: stretch;
    min-height: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }

  .results__chart-neg .results__chart-col:nth-child(4) {
    display: none;
  }

  .results__chart-neg .results__chart-col:nth-child(1),
  .results__chart-neg .results__chart-col:nth-child(2),
  .results__chart-neg .results__chart-col:nth-child(3) {
    flex: 1 1 0;
  }

  .results__chart-neg .results__chart-col {
    min-height: 0;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: stretch;
    overflow: hidden;
  }

  .results__chart-neg .results__chart-col .results__chart-bar {
    max-width: 100%;
  }

  .results__chart-bar {
    transition: width 0.75s cubic-bezier(0.22, 1, 0.36, 1), height 0.75s cubic-bezier(0.22, 1, 0.36, 1);
  }

  .results__chart-bar--neg.results__chart-bar--accent {
    width: 100%;
    height: 100%;
    min-height: 0;
    transform-origin: right center;
  }

  .results__chart-bar--neg.results__chart-bar--black {
    width: calc(24 / 35 * 100%);
    height: 100%;
    min-height: 0;
    transform-origin: right center;
  }

  .results__chart-bar--neg.results__chart-bar--gray {
    width: calc(30 / 35 * 100%);
    height: 100%;
    min-height: 0;
    transform-origin: right center;
  }

  .results__chart-bar--pos.results__chart-bar--borders {
    width: calc(7.5 / 35 * 100%);
    height: 100%;
    min-height: 0;
    max-width: 100%;
    align-self: stretch;
    flex-shrink: 0;
    transform-origin: left center;
  }

  @media (prefers-reduced-motion: no-preference) {

    .results__chart-bar--neg.results__chart-bar--accent:not(.is-shown),
    .results__chart-bar--neg.results__chart-bar--black:not(.is-shown),
    .results__chart-bar--neg.results__chart-bar--gray:not(.is-shown) {
      width: 0 !important;
      min-width: 0 !important;
      height: 100% !important;
      min-height: 0 !important;
    }

    .results__chart-bar--pos.results__chart-bar--borders:not(.is-shown) {
      width: 0 !important;
      min-width: 0 !important;
      height: 100% !important;
      min-height: 0 !important;
    }
  }

  .results__title-line {
    white-space: normal;
  }

  /* iOS/мобилки: background-attachment: fixed дёргается при скролле.
     Держим фон на sticky-вьюпорте вместо 320vh секции. */
  .ac {
    background-attachment: scroll;
    background-image: none;
  }

  .ac__sticky {
    background-image: url('../img/light.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
  }

  .ac--static {
    background-attachment: scroll;
  }

  .ac--static .ac__sticky {
    background-image: url('../img/light.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
  }

  /* ----- Advantages / Why Re:Source — как мобильная «Проблема»: flex 1 на заголовок, блок карточек снизу, высота стека 208+16+208+40 ----- */
  .ac__sticky>.container {
    padding-top: 28px;
    padding-bottom: 10px;
  }

  .ac__panel--advantages {
    padding-top: 0;
    padding-bottom: 10px;
    min-height: 100%;
  }

  .ac__why {
    flex: 1;
    min-height: 0;
    gap: 0;
    justify-content: flex-start;
    flex-direction: column;
    align-items: stretch;
  }

  /* Как .ps__heading-wrap: вертикальный центр в оставшемся пространстве над карточками */
  .ac__why-heading-wrap {
    flex: 1 1 0;
    display: grid;
    place-items: center;
    min-height: 0;
    width: 100%;
    padding: 0;
    margin: 0;
  }

  .ac__why-title {
    font-size: 40px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 44px;
    text-align: center;
    color: var(--color-main);
    margin: 0;
  }

  .ac__why-accent--desktop {
    display: none;
  }

  .ac__why-accent--mobile {
    display: inline;
  }

  .ac__media {
    position: relative;
    flex: 0 0 auto;
    flex-shrink: 0;
    min-height: 472px;
    height: auto;
    padding-bottom: 40px;
    box-sizing: border-box;
    align-self: stretch;
    border-radius: 0;
    overflow: hidden;
  }

  .ac__cards {
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 16px;
    column-gap: 0;
    align-content: start;
    align-self: stretch;
  }

  .ac__cards .ps__card:not(.ps__card--ac-mobile-visible) {
    display: none !important;
  }

  .ac__cards .ps__card.ps__card--ac-mobile-visible {
    display: grid !important;
  }

  /* Как карточки в мобильной секции «Проблема»: 208px */
  .ac__panel--advantages .ac__cards .ps__card {
    height: 208px !important;
    min-height: 208px;
    max-height: 208px;
  }

  .ac__panel--advantages .ac__cards .ps__card-content--problem {
    height: 208px;
    min-height: 208px;
    max-height: 208px;
    padding: 32px 40px 48px;
  }

  .ac__panel--advantages .ac__cards .ps__card-content--problem .ps__card-icon {
    width: 54px;
    height: 54px;
    top: 24px;
    right: 24px;
    color: var(--color-border);
  }

  .ac__panel--advantages .ac__cards .ps__card-content--problem .ps__card-icon svg {
    width: 54px;
    height: 54px;
  }

  .ac__panel--advantages .ac__cards .ps__card-title {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 24px;
    margin-bottom: 12px;
    padding-right: 62px;
    color: var(--color-main);
  }

  .ac__panel--advantages .ac__cards .ps__card-content--problem .ps__card-title {
    padding-right: 62px;
    color: var(--color-main);
  }

  .ac__panel--advantages .ac__cards .ps__card-text {
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: -0.02em;
    max-width: none;
    color: var(--color-text-secondary);
  }

  .ac__panel--advantages .ac__cards .ps__card-content--problem .ps__card-text {
    color: var(--color-text-secondary);
  }

  .ac__cta-stage {
    padding: 32px 0;
  }

  /* Typescale-Mobile: Accent level mob — как .hero__title */
  .cta-final__title.ac__cta-title {
    font-size: 48px;
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 48px;
    color: var(--color-main);
    -webkit-text-fill-color: var(--color-main);
  }

  .ac__panel--cta .cta-final__title.ac__cta-title .accent {
    -webkit-text-fill-color: transparent;
    color: transparent;
  }

  .ac__panel--cta .cta-final__text.ac__cta-text {
    color: var(--color-main);
    -webkit-text-fill-color: var(--color-main);
  }

  .cta-final__text br {
    display: none;
  }

  /* Кнопка CTA — hero-стиль */
  .cta-final__btn-hero {
    height: 64px;
    padding: 8px 8px 8px 16px;
    border-radius: 12px;
  }

  .cta-final__btn-hero-text {
    font-size: 20px;
    line-height: 24px;
    padding-right: 12px;
  }

  .cta-final__btn-hero-circle {
    width: 48px;
    height: 48px;
    font-size: 22px;
    border-radius: 8px;
  }

  /* Футер блока «Запишитесь на демо»: логотип → ООО → свидетельство; по центру */
  footer.ac__footer .footer__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-align: center;
    gap: 20px;
    grid-template-columns: none;
    justify-items: center;
  }

  footer.ac__footer .footer__logo {
    order: 1;
    grid-column: auto;
    grid-row: auto;
    justify-self: center;
  }

  footer.ac__footer .footer__info {
    order: 2;
    grid-column: auto;
    grid-row: auto;
    justify-self: center;
    align-self: center;
    align-items: center;
    text-align: center;
  }

  footer.ac__footer .footer__reg {
    order: 3;
    grid-column: auto;
    grid-row: auto;
    justify-self: center;
    text-align: center;
  }
}