/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

:root {
    --bg: #020203;
    --text-main: #f2f2f2;
    --text-soft: #d3d3d3;
    --wow-duration: 0.85s;
  }
  
  /* WOW.js + Animate.css 3.x: плавность и отключение при prefer-reduced-motion */
  .wow.animated {
    -webkit-animation-duration: var(--wow-duration);
    animation-duration: var(--wow-duration);
  }
  
  @media (prefers-reduced-motion: reduce) {
    .wow {
      visibility: visible !important;
      -webkit-animation: none !important;
      animation: none !important;
    }
  }
  
  *,
  *::before,
  *::after {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  
  /* Горизонтальный вылет режем на корне; у main не использовать overflow:hidden —
     иначе после перехода по якорю (#about-us) прокрутка вверх к hero может «липнуть». */
  html {
    overflow-x: hidden;
    background-color: var(--bg);
  }
  
  body {
    margin: 0;
    font-family: "Montserrat", Arial, sans-serif;
    color: var(--text-main);
    /* Сплошной фон + градиент сверху: иначе под main (overflow декора) проступал серый круг градиента */
    background-color: var(--bg);
    background-image: -o-radial-gradient(50% 180px, circle, #1f1f1f 0%, var(--bg) 26%, var(--bg) 100%);
    background-image: radial-gradient(circle at 50% 180px, #1f1f1f 0%, var(--bg) 26%, var(--bg) 100%);
  }
  
  main {
    padding-bottom: 44px;
  }
  
  a {
    color: inherit;
    text-decoration: none;
  }
  
  .page {
    position: relative;
    background: #020203;
  }
  
  .element-left-first,
  .element-left-second, .element-right, .bg-bottom {
    position: absolute;
    pointer-events: none;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    z-index: 0;
  }
  
  .element-left-first {
    left: max(-3.25rem, -3.25vw);
    top: 36%;
    -webkit-transform: translateY(-12%);
        -ms-transform: translateY(-12%);
            transform: translateY(-12%);
  }
  
  .element-left-second {
    left: max(-2.75rem, -2.75vw);
    bottom: clamp(1.5rem, 4vh, 4rem);
    -webkit-transform: translateY(10%);
        -ms-transform: translateY(10%);
            transform: translateY(10%);
  }
  
  .element-right {
    right: max(-3.25rem, -3.25vw);
    top: 36%;
    -webkit-transform: translateY(-12%);
        -ms-transform: translateY(-12%);
            transform: translateY(-12%);
  }
  
  .bg-bottom {
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    z-index: 0;
    mix-blend-mode: normal;
  }
  
  
  .container {
    width: min(100%, 1200px);
    margin: 0 auto;
    padding: 0 24px;
  }
  
  /* Якоря + шапка с бургером (после скролла) + полноэкранное меню */
  @media (prefers-reduced-motion: no-preference) {
    html {
      scroll-behavior: smooth;
    }
  }
  
  #about-us,
  #partnership,
  #benefits,
  #contacts {
    scroll-margin-top: 5.5rem;
  }
  
  body.site-nav-open {
    overflow: hidden;
  }
  
  .site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    max-width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    z-index: 100;
    pointer-events: none;
  }
  
  .site-header__bar {
    position: relative;
    z-index: 210;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    max-width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding-top: calc(0.65rem + env(safe-area-inset-top, 0px));
    padding-bottom: calc(0.65rem + env(safe-area-inset-bottom, 0px));
    padding-left: calc(clamp(1rem, 4vw, 2rem) + env(safe-area-inset-left, 0px));
    padding-right: calc(clamp(1rem, 4vw, 2rem) + env(safe-area-inset-right, 0px));
    pointer-events: none;
    background: rgba(2, 2, 3, 0.35);
    -webkit-backdrop-filter: blur(12px);
            backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    -webkit-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
            transform: translateY(-100%);
    -webkit-transition: -webkit-transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), background 0.25s ease;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), background 0.25s ease;
  }
  
  .site-header--visible .site-header__bar {
    pointer-events: auto;
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
  }
  
  .site-header--visible.site-nav-open .site-header__bar,
  .site-nav-open .site-header__bar {
    background: rgba(2, 2, 3, 0.55);
  }
  
  .site-nav__burger {
    position: relative;
    display: block;
    width: 44px;
    height: 44px;
    margin: 0;
    margin-inline-start: auto;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
            flex-shrink: 0;
    overflow: visible;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-transition: opacity 0.2s ease;
    -o-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease;
  }
  
  .site-nav__burger:hover {
    opacity: 0.85;
  }
  
  .site-nav__burger-line {
    position: absolute;
    left: 50%;
    display: block;
    width: 26px;
    height: 2px;
    margin: 0;
    background: #ffffff;
    border-radius: 1px;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    -webkit-transform-origin: center;
        -ms-transform-origin: center;
            transform-origin: center;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    -webkit-transition: top 0.3s ease, opacity 0.3s ease, -webkit-transform 0.3s ease;
    transition: top 0.3s ease, transform 0.3s ease, opacity 0.3s ease;
  }

  /* Три полосы: шаг между центрами 8px (2px линия + 6px зазор) — крест в том же центре, что и «гамбургер» */
  .site-nav__burger-line:nth-child(1) {
    top: calc(50% - 9px);
  }

  .site-nav__burger-line:nth-child(2) {
    top: calc(50% - 1px);
  }

  .site-nav__burger-line:nth-child(3) {
    top: calc(50% + 7px);
  }
  
  .site-nav__burger--open .site-nav__burger-line:nth-child(1) {
    top: calc(50% - 1px);
    -webkit-transform: translateX(-50%) rotate(45deg);
        -ms-transform: translateX(-50%) rotate(45deg);
            transform: translateX(-50%) rotate(45deg);
  }
  
  .site-nav__burger--open .site-nav__burger-line:nth-child(2) {
    opacity: 0;
  }
  
  .site-nav__burger--open .site-nav__burger-line:nth-child(3) {
    top: calc(50% - 1px);
    -webkit-transform: translateX(-50%) rotate(-45deg);
        -ms-transform: translateX(-50%) rotate(-45deg);
            transform: translateX(-50%) rotate(-45deg);
  }
  
  .site-nav__drawer {
    position: fixed;
    inset: 0;
    width: 100%;
    max-width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding-top: env(safe-area-inset-top, 0px);
    padding-right: env(safe-area-inset-right, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
    padding-left: env(safe-area-inset-left, 0px);
    z-index: 200;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background: rgba(2, 2, 3, 0.96);
    -webkit-backdrop-filter: blur(16px);
            backdrop-filter: blur(16px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    -webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
    -o-transition: opacity 0.3s ease, visibility 0.3s ease;
    transition: opacity 0.3s ease, visibility 0.3s ease;
  }
  
  .site-nav__drawer--open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
  
  .site-nav__drawer-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: clamp(1.25rem, 4vh, 2.75rem);
    text-align: center;
    width: 100%;
    max-width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding: clamp(3.5rem, 12vh, 5rem) max(1rem, 4vw) 2rem;
  }
  
  .site-nav__drawer-inner a {
    font-size: clamp(1.85rem, 6.5vw, 3.5rem);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #f2f2f2;
    line-height: 1.15;
    -webkit-transition: color 0.2s ease, -webkit-transform 0.2s ease;
    transition: color 0.2s ease, transform 0.2s ease;
  }
  
  .site-nav__drawer-inner a:hover,
  .site-nav__drawer-inner a:focus-visible {
    color: #ffffff;
    outline: none;
    -webkit-transform: scale(1.02);
        -ms-transform: scale(1.02);
            transform: scale(1.02);
  }
  
  .scene {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
  }
  
  .scene__layer {
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    max-width: none;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    -webkit-user-drag: none;
  }
  
  .scene__layer--bg-bottom {
    width: min(100%, 1200px);
    max-width: 100%;
    bottom: 0;
    opacity: 1;
    mix-blend-mode: lighten;
  }
  
  .scene__layer--logo-bg {
    width: min(86vw, 980px);
    left: 50%;
    top: 50px;
    opacity: 0.55;
    mix-blend-mode: screen;
  }
  
  .scene__layer--right {
    width: clamp(250px, 29vw, 416px);
    right: -56px;
    left: auto;
    top: 510px;
    -webkit-transform: none;
        -ms-transform: none;
            transform: none;
    opacity: 0.9;
    mix-blend-mode: screen;
  }
  
  .scene__layer--left-main {
    width: clamp(245px, 28vw, 396px);
    left: -12px;
    top: 410px;
    -webkit-transform: none;
        -ms-transform: none;
            transform: none;
    opacity: 0.86;
    mix-blend-mode: screen;
  }
  
  .scene__layer--left-bottom {
    width: clamp(260px, 30vw, 419px);
    left: 80px;
    top: 1110px;
    -webkit-transform: none;
        -ms-transform: none;
            transform: none;
    opacity: 0.84;
    mix-blend-mode: screen;
  }
  
  .hero,
  .text-block,
  .benefits,
  .contacts {
    position: relative;
    z-index: 1;
  }
  
  .hero {
    position: relative;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-top: 0;
    min-height: 100vh;
  }
  
  /* На очень широких экранах (ультраширокие / > типичного Full HD) не тянуть hero на всю высоту viewport */
  @media (min-width: 1920px) {
    .hero {
      min-height: auto;
      padding-bottom: clamp(32px, 4vh, 64px);
    }
  }
  
  .hero__stack {
    position: relative;
    width: min(700px, 100%);
    max-width: 100%;
    aspect-ratio: 981 / 965;
    margin: 0 auto;
    overflow: visible;
    isolation: isolate;
    z-index: 2;
  }
  
  .hero__stack img {
    position: absolute;
    display: block;
    height: auto;
    pointer-events: none;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
  }
  
  .hero__element-under-logo {
    position: absolute;
    width: min(980px, 100%);
    max-width: 100%;
    left: 0;
    top: 0;
    /* transform: translateX(50px); */
    z-index: 0; /* ниже всех остальных слоёв в hero */
    mix-blend-mode: normal;
    pointer-events: none;
  }
  
  .hero__white-3 {
    position: absolute;
    width: min(1200px, 100%);
    max-width: 100%;
    left: 50%;
    top: 0;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    z-index: 1;
    opacity: 0.3;
    mix-blend-mode: screen;
    pointer-events: none;
  }
  
  .hero__logo {
    width: 100%;
    height: auto;
    left: 50%;
    top: 20%;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    z-index: 8;
    opacity: 1;
    mix-blend-mode: screen;
  }
  
  .hero__menu {
    margin-top: -50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: clamp(24px, 8vw, 76px);
    position: relative;
    z-index: 10;
  }
  
  .hero__menu-item {
    font-size: clamp(13px, 1.5vw, 20px);
    font-weight: 600;
    letter-spacing: 0.12em;
    white-space: nowrap;
    text-transform: uppercase;
    color: var(--text-soft);
  }
  
  .about-us {
    margin-bottom: 100px;
    min-height: 90vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  
  
  .text-block {
    margin-top: 100px;
    text-align: center;
  }
  
  .contacts {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  
  .text-block h2,
  .contacts h2 {
    margin: 0;
    font-size: clamp(26px, 2.5vw, 44px);
    font-weight: 700;
    letter-spacing: 0.08em;
    color: #ffffff;
    position: relative;
    z-index: 5;
    text-shadow: 0 0 7px rgba(255, 255, 255, 1), 0 0 22px rgba(255, 255, 255, 1);
  }
  
  .text-block p {
    margin: 28px auto 0;
    width: min(100%, 990px);
    color: var(--text-soft);
    font-size: clamp(17px, 1.45vw, 23px);
    font-weight: 400;
    line-height: 1.85;
  }
  
  .partnership {
    margin-bottom: clamp(48px, 7vh, 96px);
  }
  
  .benefits {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: clamp(80px, 10vw, 120px);
    margin-bottom: clamp(48px, 8vh, 100px);
    text-align: center;
  }
  
  .benefit h3 {
    margin: 0;
    font-size: clamp(18px, 1.55vw, 26px);
    line-height: 1.35;
    letter-spacing: 0.06em;
    font-weight: 400;
    color: #ffffff;
    position: relative;
    z-index: 5;
    text-shadow: 0 0 7px rgba(255, 255, 255, 3), 0 0 22px rgba(255, 255, 255, 3);
  }
  
  
  
  .benefit img {
    display: block;
    margin: 28px auto;
    width: clamp(74px, 8vw, 92px);
    height: auto;
  }
  
  .benefits .benefit:last-child {
    margin-top: 20px;
  }
  
  
  
  .contacts__row {
    margin-top: 18px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: clamp(16px, 5vw, 46px);
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    font-size: clamp(15px, 1.25vw, 19px);
    color: #e6e6e6;
  }
  
  .contacts__row a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 8px;
  }
  
  .contacts__row img {
    width: 18px;
    height: 18px;
    -o-object-fit: contain;
       object-fit: contain;
  }
  
  .contacts h2 {
    margin-bottom: 100px;
  }
  
  @media (max-width: 1024px) {
    /* Без горизонтального скролла: 100vw и вылеты absolute часто шире экрана */
    html {
      width: 100%;
      max-width: 100%;
      overflow-x: hidden;
      background-color: var(--bg);
      /* Якоря и scrollIntoView: «вычитаем» фикс. шапку (safe area + padding + бургер до 48px) */
      scroll-padding-top: calc(
        env(safe-area-inset-top, 0px) + 0.6rem + 48px + 0.6rem
      );
    }
  
    #about-us,
    #partnership,
    #benefits,
    #contacts {
      /* не дублировать отступ вместе с scroll-padding на html */
      scroll-margin-top: 0;
    }
  
    body {
      width: 100%;
      max-width: 100%;
      overflow-x: hidden;
      background-color: var(--bg);
    }
  
    main,
    .page {
      max-width: 100%;
      overflow-x: hidden;
    }
  
    .site-header__bar {
      padding-left: calc(1.125rem + env(safe-area-inset-left, 0px));
      padding-right: calc(1.125rem + env(safe-area-inset-right, 0px));
      padding-top: calc(0.6rem + env(safe-area-inset-top, 0px));
      padding-bottom: calc(0.6rem + env(safe-area-inset-bottom, 0px));
    }
  
    .hero {
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      max-width: 100%;
      overflow-x: hidden;
    }
  
   
  
    .hero__stack {
      width: min(600px, 100%);
    }
  
    .hero__logo {
      top: 12%;
    }
  
    .hero__white-3 {
      top: 165px;
    }
  
    .hero__element-under-logo {
    top: 20%;
    left: -75px;
  
    }
  
  
    .element-left-first {
      top: 42%;
      -webkit-transform: translateY(-10%);
          -ms-transform: translateY(-10%);
              transform: translateY(-10%);
      left: max(-2.75rem, -3vw);
    }
  
    .element-left-second {
      left: max(-2.25rem, -2.5vw);
      bottom: clamp(1.25rem, 3.5vh, 3rem);
      -webkit-transform: translateY(8%);
          -ms-transform: translateY(8%);
              transform: translateY(8%);
    }
  
    .element-right {
      top: 42%;
      -webkit-transform: translateY(-10%);
          -ms-transform: translateY(-10%);
              transform: translateY(-10%);
      right: max(-2.75rem, -3vw);
    }
  
    .hero__menu {
      margin-top: 0;
      gap: clamp(18px, 5vw, 44px);
    }
  
    /* Секции без «натянутого» 100vh: ритм как на десктопе, воздух padding + margin */
    .about-us {
      min-height: 0;
      margin-bottom: clamp(72px, 12vh, 120px);
      padding-top: clamp(2.25rem, 7vh, 4rem);
      padding-bottom: clamp(2.25rem, 7vh, 4rem);
      -webkit-box-pack: start;
          -ms-flex-pack: start;
              justify-content: flex-start;
    }
  
    .text-block {
      margin-top: clamp(56px, 10vh, 96px);
    }
  
    .text-block.partnership {
      margin-top: clamp(64px, 11vh, 112px);
    }
  
    .text-block h2,
    .contacts h2 {
      font-size: clamp(24px, 3.2vw, 38px);
    }
  
  
    .text-block p {
      font-size: clamp(16px, 1.9vw, 20px);
      line-height: 1.78;
      font-weight: 300;
    }
  
    .benefits {
      min-height: 0;
      margin-top: clamp(72px, 12vh, 120px);
      margin-bottom: clamp(56px, 9vh, 96px);
      padding-top: clamp(1.75rem, 5vh, 3rem);
      padding-bottom: clamp(2.25rem, 7vh, 4rem);
      -webkit-box-pack: start;
          -ms-flex-pack: start;
              justify-content: flex-start;
    }
  
    .contacts {
      min-height: 0;
      margin-top: clamp(72px, 14vh, 140px);
      padding-top: clamp(2.25rem, 7vh, 4rem);
      padding-bottom: clamp(3rem, 10vh, 5rem);
      -webkit-box-pack: start;
          -ms-flex-pack: start;
              justify-content: flex-start;
    }
  
    .contacts h2 {
      margin-bottom: clamp(1.25rem, 4vh, 2.5rem);
    }
  
    .bg-bottom {
      height: stretch;
    }
  }
  
  @media (max-width: 768px) {
    .container {
      padding: 0 16px;
    }
  
    .site-header__bar {
      padding-left: calc(1rem + env(safe-area-inset-left, 0px));
      padding-right: calc(1rem + env(safe-area-inset-right, 0px));
      padding-top: calc(0.55rem + env(safe-area-inset-top, 0px));
      padding-bottom: calc(0.55rem + env(safe-area-inset-bottom, 0px));
    }
  
    .site-nav__burger {
      width: 48px;
      height: 48px;
    }
  
    .site-nav__burger-line {
      width: 24px;
    }
  
    .text-block h2,
    .contacts h2 {
      font-size: clamp(26px, 7vw, 40px);
    }
  
    .site-nav__drawer-inner {
      padding-left: max(1rem, 5vw);
      padding-right: max(1rem, 5vw);
    }
  
    .site-nav__drawer-inner a {
      font-size: clamp(1.7rem, 10vw, 2.75rem);
    }
  
    .hero {
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
    }
  
    .hero__menu {
      margin-top: clamp(-48px, -10vw, -16px);
      width: 100%;
      max-width: 100%;
      -webkit-align-self: stretch;
          -ms-flex-item-align: stretch;
              align-self: stretch;
      gap: clamp(2px, 1.2vw, 10px);
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
    }
  
    .hero__menu-item {
      -webkit-box-flex: 1;
          -ms-flex: 1 1 0px;
              flex: 1 1 0;
      min-width: 0;
      text-align: center;
      font-size: clamp(10px, 3.5vw, 17px);
      letter-spacing: 0.08em;
    }
  
    .hero__stack {
      width: min(450px, 100%);
    }
  
    .hero__logo {
      top: 11%;
    }
  
    .hero__white-3 {
      top: 20%;
    }
  
    .hero__element-under-logo {
    top: 15%
    }
  
    .element-left-first {
     -webkit-transform: scale(0.9) translateY(-8%);
         -ms-transform: scale(0.9) translateY(-8%);
             transform: scale(0.9) translateY(-8%);
     top: 32%;
     left: -8%;
    }
    .element-left-second {
      -webkit-transform: scale(0.9) translateY(6%);
          -ms-transform: scale(0.9) translateY(6%);
              transform: scale(0.9) translateY(6%);
      bottom: clamp(0.75rem, 2vh, 2rem);
      left: -10%;
     }
  
     .element-right {
      -webkit-transform: scale(0.9) translateY(-8%);
          -ms-transform: scale(0.9) translateY(-8%);
              transform: scale(0.9) translateY(-8%);
      top: 32%;
      right: -8%;
     }
  
    .text-block {
      margin-top: 0;
    }
  
    .text-block.about-us {
      margin-top: 0;
    }
  
    .text-block p {
      margin-top: 20px;
      font-size: clamp(17px, 4.6vw, 22px);
      line-height: 1.78;
    }
  
    .benefit h3 {
      font-size: clamp(17px, 5vw, 25px);
      line-height: 1.32;
    }
  
    .benefit img {
      width: clamp(82px, 16vw, 104px);
      margin: 26px auto;
    }
  
    .benefit + .benefit {
      margin-top: clamp(28px, 5vh, 48px);
      margin-bottom: 0;
    }
  
    .benefits .benefit:last-child {
      margin-top: clamp(28px, 5vh, 48px);
      margin-bottom: 0;
    }
  
    .contacts__row {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      gap: 16px;
      font-size: clamp(16px, 4.2vw, 21px);
      margin-top: 22px;
    }
  
    .contacts__row img {
      width: 22px;
      height: 22px;
    }
  
    /* Секции на всю высоту экрана (как Tilda / kankaramusic.com), ≤768px */
    .partnership {
      margin-bottom: 0;
    }
  
    .about-us {
      min-height: 100vh;
      min-height: 100dvh;
      margin-top: 0;
      margin-bottom: 0;
      padding-top: max(0.75rem, env(safe-area-inset-top, 0px));
      padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
    }
  
    .text-block.partnership {
      min-height: 100vh;
      min-height: 100dvh;
      margin-top: 0;
      margin-bottom: 0;
      padding-top: max(0.75rem, env(safe-area-inset-top, 0px));
      padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
    }
  
    .benefits {
      min-height: 100vh;
      min-height: 100dvh;
      margin-top: 0;
      margin-bottom: 0;
      padding-top: max(0.75rem, env(safe-area-inset-top, 0px));
      padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
    }
  
    .contacts {
      min-height: 100vh;
      min-height: 100dvh;
      margin-top: 0;
      padding-top: max(0.75rem, env(safe-area-inset-top, 0px));
      padding-bottom: max(1.25rem, env(safe-area-inset-bottom, 0px));
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
    }
  }
  
  @media (max-width: 480px) {
    .hero__element-under-logo {
      top: 35%;
      left: -50px;
    }
    .hero__white-3 {
      top: 30%;
    }
  
    .text-block h2,
    .contacts h2 {
      font-size: clamp(24px, 8.5vw, 34px);
    }
  
    .text-block p {
      font-size: clamp(16px, 5vw, 21px);
    }
  
    .benefit h3 {
      font-size: clamp(17px, 5.2vw, 24px);
    }
  
    .hero__menu {
      margin-top: clamp(-56px, -12vw, -28px);
      gap: clamp(2px, 1vw, 8px);
    }
  
    .hero__menu-item {
      font-size: clamp(9px, 3.25vw, 15px);
      letter-spacing: 0.07em;
    }
  
    .hero__element-under-logo {
      -webkit-transform: scale(1.5);
          -ms-transform: scale(1.5);
              transform: scale(1.5);
    }
  
    .element-left-first {
      -webkit-transform: scale(0.6) translateY(-6%);
          -ms-transform: scale(0.6) translateY(-6%);
              transform: scale(0.6) translateY(-6%);
              top: 15%;
              left: -20%;
       }
     .element-left-second {
       -webkit-transform: scale(0.6) translateY(5%);
           -ms-transform: scale(0.6) translateY(5%);
               transform: scale(0.6) translateY(5%);
       bottom: max(0.5rem, 2vh);
       left: -35%;
      }
   
      .element-right {
       -webkit-transform: scale(0.6) translateY(-6%);
           -ms-transform: scale(0.6) translateY(-6%);
               transform: scale(0.6) translateY(-6%);
               top: 30%;
               right: -20%;
      }
  
  }