.skip-link {
  top: -100px;
  transform: none;
}

.skip-link:focus {
  top: 12px;
}

.cases-stage {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 18px;
}

.cases-stage .case {
  grid-area: auto;
  min-height: 280px;
  margin-top: 0;
  padding: clamp(30px, 3.5vw, 48px);
  border-radius: var(--block-radius);
}

.cases-stage .case--1 { grid-column: 1 / 8; }
.cases-stage .case--2 { grid-column: 8 / 13; }
.cases-stage .case--3 { grid-column: 1 / 6; }
.cases-stage .case--4 { grid-column: 6 / 13; }

.cases-stage .case h3 {
  margin-bottom: 14px;
}

.scene-canvas,
.scene-entry,
.scene-result,
.gateway-grid,
.possibilities .capability,
.cases-stage .case,
.pricing-preview,
.integration-stage nav a,
.product-illustration::before,
.main-nav {
  box-shadow: none;
}

.feature-showcase .formats-grid--six {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(18px, 2.5vw, 36px);
  align-items: stretch;
}

.feature-showcase .formats-grid--six > .format-card--illustrated {
  display: flex;
  grid-column: span 4;
  min-width: 0;
  min-height: 0;
  height: 780px;
  flex-direction: column;
  border-radius: 16px;
}

.feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(-n + 2) {
  grid-column: span 3;
}

.feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(-n + 3) {
  height: 740px;
}

.feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(3) {
  grid-column: span 6;
}

.feature-showcase .formats-grid--six .format-copy,
.feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(3) .format-copy,
.feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(4) .format-copy {
  align-self: stretch;
  padding: clamp(28px, 2.8vw, 40px) clamp(26px, 2.8vw, 40px) 18px;
}

.feature-showcase .formats-grid--six .format-card h3 {
  margin: 0;
  font-size: clamp(24px, 2vw, 30px);
  line-height: 1.08;
}

.feature-showcase .formats-grid--six .format-card p {
  max-width: 500px;
  margin-top: 12px;
  font-size: clamp(15px, 1.2vw, 17px);
  line-height: 1.45;
}

.feature-showcase .formats-grid--six .format-card p + p {
  margin-top: 10px;
}

.feature-showcase .formats-grid--six .format-visual,
.feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(3) .format-visual,
.feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(4) .format-visual {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: calc(100% - 170px);
  min-height: 0;
  flex: none;
  margin: 0;
}

.feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(2) .format-visual { height: calc(100% - 140px); }
.feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(3) .format-visual { height: calc(100% - 115px); }
.feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(4) .format-visual { height: calc(100% - 120px); }
.feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(5) .format-visual { height: calc(100% - 140px); }
.feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(6) .format-visual { height: calc(100% - 150px); }

.feature-showcase .formats-grid--six .format-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

.plan-visual {
  margin-bottom: 28px;
}

.plan-visual {
  grid-template-rows: 100%;
}

.workflow-list,
.faq-list {
  border-top: 0;
}

.workflow-item:last-child,
.faq-list > details:last-child {
  border-bottom: 0;
}

.pricing-grid,
.pricing-grid .plan {
  background: transparent;
}

.pricing-grid .plan > .plan-price {
  margin: 0 0 10px;
  color: var(--navy);
  font-size: clamp(26px, 2.4vw, 34px);
  font-weight: 800;
  line-height: 1.1;
}

.pricing-grid .plan ul {
  margin-top: 0;
}

.pricing-grid .plan li {
  padding-top: 6px;
  padding-bottom: 6px;
  border-bottom: 0;
}

.pricing-grid .plan li::before {
  top: calc(6px + 0.75em);
  transform: translateY(-50%);
}

@media (min-width: 761px) {
  .pricing-grid .plan-subtitle {
    min-height: 2.8em;
  }

  .pricing-grid .plan-subtitle + p {
    min-height: 3.5em;
  }

}

.pricing-grid .plan--3 .plan-subtitle {
  color: var(--violet);
}

.gateway::before,
.gateway + .detail-section::before,
.detail-hero + .use-cases::before,
.detail-hero + .integration-map::before,
.pricing-page + .result-section::before,
.faq + .start-section::before,
.possibilities + .start-section::before {
  display: none;
}

.workflow {
  overflow: visible;
}

.workflow::after {
  top: 0;
  right: 0;
  width: 130px;
  height: 170px;
  aspect-ratio: auto;
  border-radius: 0;
  clip-path: circle(180px at calc(100% + 50px) -10px);
}

.pricing-preview {
  z-index: auto;
  margin: 0;
  border-radius: 0;
}

.site-footer {
  margin-top: 0;
}

.site-footer::before {
  top: -76px;
}

.footer-top {
  grid-template-columns: minmax(260px, 1fr) minmax(0, 1.45fr);
  gap: clamp(50px, 7vw, 120px);
}

.footer-map {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: clamp(24px, 3vw, 56px);
  row-gap: 14px;
}

.footer-map a {
  align-self: start;
  min-width: 0;
  padding: 0;
  border: 0;
  line-height: 1.35;
}

.result-section {
  padding-bottom: calc(var(--section-space) + 64px);
}

.start-section {
  padding-top: 48px;
}

.faq,
.possibilities:has(+ .start-section) {
  padding-bottom: 0;
}

:root {
  --wave-overlap-space: 76px;
}

.detail-hero:has(+ :is(.detail-section, .pricing-page)),
.detail-section:has(+ .possibilities),
.workflow:has(+ :is(.use-cases, .start-section)),
.pricing-preview:has(+ .integrations-preview),
.integration-map:has(+ .result-section) {
  padding-bottom: calc(var(--section-space) + var(--wave-overlap-space));
}

.possibilities:has(+ .workflow),
.use-cases:has(+ :is(.pricing-preview, .result-section)),
.integrations-preview:has(+ .faq) {
  padding-bottom: calc(var(--section-space-large) + var(--wave-overlap-space));
}

.start-section {
  padding-bottom: calc(var(--section-space) + var(--wave-overlap-space));
}

.faq,
.possibilities:has(+ .start-section) {
  padding-bottom: 48px;
}

.icon-arrow {
  width: 24px;
  height: 24px;
  vertical-align: middle;
}

.section-link span,
.gateway-card b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.section-link span {
  transform: translateY(1px);
}

.detail-back,
.legal-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.detail-back .icon-arrow--back,
.legal-back .icon-arrow--back {
  transform: translateY(2px) scaleX(-1);
}

.ecosystem-products a::after {
  width: 24px;
  height: 24px;
}

@media (max-width: 950px) and (min-width: 761px) {
  .feature-showcase .formats-grid--six {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .feature-showcase .formats-grid--six > .format-card--illustrated,
  .feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(-n + 2) {
    grid-column: span 1;
  }

  .feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(3),
  .feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(6) {
    grid-column: span 2;
  }
}

@media (max-width: 760px) {
  :root {
    --wave-overlap-space: 41px;
  }

  .hero--home {
    grid-template-areas: "brand" "copy" "visual";
  }

  .gateway-grid .gateway-card:nth-child(3),
  .gateway-grid .gateway-card:nth-child(4) {
    grid-column: auto;
    grid-row: auto;
  }

  .feature-showcase .formats-grid--six {
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
  }

  .feature-showcase .formats-grid--six > .format-card--illustrated,
  .feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(-n + 3) {
    grid-column: 1;
    min-height: 0;
    height: 740px;
  }

  .feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(2) {
    height: 850px;
  }

  .feature-showcase .formats-grid--six > .format-card--illustrated:nth-child(3) {
    height: 490px;
  }

  .cases-stage {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }

  .cases-stage .case,
  .cases-stage .case--1,
  .cases-stage .case--2,
  .cases-stage .case--3,
  .cases-stage .case--4 {
    grid-column: 1;
    min-height: 220px;
    border-radius: var(--block-radius);
  }

  .plan-visual {
    margin-bottom: 24px;
  }

  .result-panel {
    grid-template-columns: minmax(0, 1fr);
  }

  .result-panel > * {
    min-width: 0;
  }

  .result-panel h2,
  .legal h1 {
    hyphens: auto;
    overflow-wrap: anywhere;
  }

  .site-footer::before {
    top: -41px;
  }

  .footer-top {
    grid-template-columns: minmax(0, 1fr);
    gap: 38px;
  }

  .footer-map {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 24px;
    row-gap: 18px;
  }

  .result-section {
    padding-bottom: calc(var(--section-space) + 34px);
  }

  .start-section {
    padding-top: 34px;
  }

  .faq + .start-section,
  .possibilities + .start-section {
    padding-top: 46px;
  }
}

@media (max-width: 420px) {
  .footer-map {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 360px) {
  h1 {
    font-size: clamp(54px, 17vw, 61px);
  }

  h2 {
    font-size: clamp(36px, 12vw, 43px);
  }
}

.primary-link,
.secondary-link,
.header-cta,
.menu-toggle {
  transition: box-shadow .2s ease, background-color .2s ease, color .2s ease;
}

.primary-link:focus-visible {
  box-shadow: 0 0 0 4px rgba(255, 0, 102, .28);
}

.primary-link--light:focus-visible {
  box-shadow: 0 0 0 4px rgba(255, 255, 255, .4);
}

.header-cta:focus-visible,
.menu-toggle:focus-visible {
  box-shadow: 0 0 0 4px rgba(16, 25, 55, .22);
}

.secondary-link:focus-visible {
  background: var(--navy);
  color: #fff;
}

.secondary-link--light:focus-visible {
  background: #fff;
  color: var(--navy);
}

.section-link span {
  transition: transform .2s ease;
}

.section-link:focus-visible span {
  transform: translate(4px, 1px);
}

.detail-back,
.legal-back,
.legal-brand,
.legal article a,
.faq summary,
.footer-map a,
.footer-legal a {
  transition: color .2s ease;
}

.detail-back:focus-visible,
.legal-back:focus-visible,
.legal-brand:focus-visible,
.legal article a:focus-visible,
.faq summary:focus-visible,
.footer-map a:focus-visible,
.footer-legal a:focus-visible {
  color: var(--pink);
}

.brand:focus-visible img,
.hero-brand:focus-visible img,
.footer-brand a:focus-visible img {
  opacity: .72;
}

.language-switcher select:focus-visible {
  background-color: rgba(255, 255, 255, .16);
}

@media (max-width: 760px) {
  :lang(ru) .hero-copy h1 {
    font-size: min(var(--heading-1), 13.4vw);
  }

  :lang(ru) .legal h1 {
    font-size: min(var(--heading-2), 14.4vw);
  }
}
