@font-face {
    font-family: 'Benzin';
    src: url('./font/Benzin-ExtraBold.eot');
    src: local('☞Benzin ExtraBold'), local('Benzin-ExtraBold'),
        url('./font/Benzin-ExtraBold.eot?#iefix') format('embedded-opentype'),
        url('./font/Benzin-ExtraBold.woff2') format('woff2'),
        url('./font/Benzin-ExtraBold.woff') format('woff'),
        url('./font/Benzin-ExtraBold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Benzin';
    src: url('./font/Benzin-Medium.eot');
    src: local('☞Benzin Medium'), local('Benzin-Medium'),
        url('./font/Benzin-Medium.eot?#iefix') format('embedded-opentype'),
        url('./font/Benzin-Medium.woff2') format('woff2'),
        url('./font/Benzin-Medium.woff') format('woff'),
        url('./font/Benzin-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Benzin';
    src: url('./font/Benzin-Bold.eot');
    src: local('☞Benzin Bold'), local('Benzin-Bold'),
        url('./font/Benzin-Bold.eot?#iefix') format('embedded-opentype'),
        url('./font/Benzin-Bold.woff2') format('woff2'),
        url('./font/Benzin-Bold.woff') format('woff'),
        url('./font/Benzin-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Benzin';
    src: url('./font/Benzin-Semibold.eot');
    src: local('☞Benzin Semibold'), local('Benzin-Semibold'),
        url('./font/Benzin-Semibold.eot?#iefix') format('embedded-opentype'),
        url('./font/Benzin-Semibold.woff2') format('woff2'),
        url('./font/Benzin-Semibold.woff') format('woff'),
        url('./font/Benzin-Semibold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Benzin';
    src: url('./font/Benzin-Regular.eot');
    src: local('☞Benzin Regular'), local('Benzin-Regular'),
        url('./font/Benzin-Regular.eot?#iefix') format('embedded-opentype'),
        url('./font/Benzin-Regular.woff2') format('woff2'),
        url('./font/Benzin-Regular.woff') format('woff'),
        url('./font/Benzin-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Good Vibes Pro';
    src: url('./font/GoodVibesPro.eot');
    src: local('Good Vibes Pro'), local('GoodVibesPro'),
        url('./font/GoodVibesPro.eot?#iefix') format('embedded-opentype'),
        url('./font/GoodVibesPro.woff2') format('woff2'),
        url('./font/GoodVibesPro.woff') format('woff'),
        url('./font/GoodVibesPro.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-Regular.eot');
    src: local('Gilroy Regular'), local('Gilroy-Regular'),
        url('./font/Gilroy-Regular.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-Regular.woff2') format('woff2'),
        url('./font/Gilroy-Regular.woff') format('woff'),
        url('./font/Gilroy-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-ExtraboldItalic.eot');
    src: local('Gilroy Extrabold Italic'), local('Gilroy-ExtraboldItalic'),
        url('./font/Gilroy-ExtraboldItalic.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-ExtraboldItalic.woff2') format('woff2'),
        url('./font/Gilroy-ExtraboldItalic.woff') format('woff'),
        url('./font/Gilroy-ExtraboldItalic.ttf') format('truetype');
    font-weight: 800;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-Bold.eot');
    src: local('Gilroy Bold'), local('Gilroy-Bold'),
        url('./font/Gilroy-Bold.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-Bold.woff2') format('woff2'),
        url('./font/Gilroy-Bold.woff') format('woff'),
        url('./font/Gilroy-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-Black.eot');
    src: local('Gilroy Black'), local('Gilroy-Black'),
        url('./font/Gilroy-Black.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-Black.woff2') format('woff2'),
        url('./font/Gilroy-Black.woff') format('woff'),
        url('./font/Gilroy-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-Light.eot');
    src: local('Gilroy Light'), local('Gilroy-Light'),
        url('./font/Gilroy-Light.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-Light.woff2') format('woff2'),
        url('./font/Gilroy-Light.woff') format('woff'),
        url('./font/Gilroy-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-Semibold.eot');
    src: local('Gilroy Semibold'), local('Gilroy-Semibold'),
        url('./font/Gilroy-Semibold.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-Semibold.woff2') format('woff2'),
        url('./font/Gilroy-Semibold.woff') format('woff'),
        url('./font/Gilroy-Semibold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-Medium.eot');
    src: local('Gilroy Medium'), local('Gilroy-Medium'),
        url('./font/Gilroy-Medium.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-Medium.woff2') format('woff2'),
        url('./font/Gilroy-Medium.woff') format('woff'),
        url('./font/Gilroy-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-MediumItalic.eot');
    src: local('Gilroy Medium Italic'), local('Gilroy-MediumItalic'),
        url('./font/Gilroy-MediumItalic.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-MediumItalic.woff2') format('woff2'),
        url('./font/Gilroy-MediumItalic.woff') format('woff'),
        url('./font/Gilroy-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-BlackItalic.eot');
    src: local('Gilroy Black Italic'), local('Gilroy-BlackItalic'),
        url('./font/Gilroy-BlackItalic.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-BlackItalic.woff2') format('woff2'),
        url('./font/Gilroy-BlackItalic.woff') format('woff'),
        url('./font/Gilroy-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-UltraLight.eot');
    src: local('Gilroy UltraLight'), local('Gilroy-UltraLight'),
        url('./font/Gilroy-UltraLight.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-UltraLight.woff2') format('woff2'),
        url('./font/Gilroy-UltraLight.woff') format('woff'),
        url('./font/Gilroy-UltraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-RegularItalic.eot');
    src: local('Gilroy Regular Italic'), local('Gilroy-RegularItalic'),
        url('./font/Gilroy-RegularItalic.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-RegularItalic.woff2') format('woff2'),
        url('./font/Gilroy-RegularItalic.woff') format('woff'),
        url('./font/Gilroy-RegularItalic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-SemiboldItalic.eot');
    src: local('Gilroy Semibold Italic'), local('Gilroy-SemiboldItalic'),
        url('./font/Gilroy-SemiboldItalic.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-SemiboldItalic.woff2') format('woff2'),
        url('./font/Gilroy-SemiboldItalic.woff') format('woff'),
        url('./font/Gilroy-SemiboldItalic.ttf') format('truetype');
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-HeavyItalic.eot');
    src: local('Gilroy Heavy Italic'), local('Gilroy-HeavyItalic'),
        url('./font/Gilroy-HeavyItalic.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-HeavyItalic.woff2') format('woff2'),
        url('./font/Gilroy-HeavyItalic.woff') format('woff'),
        url('./font/Gilroy-HeavyItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-Extrabold.eot');
    src: local('Gilroy Extrabold'), local('Gilroy-Extrabold'),
        url('./font/Gilroy-Extrabold.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-Extrabold.woff2') format('woff2'),
        url('./font/Gilroy-Extrabold.woff') format('woff'),
        url('./font/Gilroy-Extrabold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-BoldItalic.eot');
    src: local('Gilroy Bold Italic'), local('Gilroy-BoldItalic'),
        url('./font/Gilroy-BoldItalic.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-BoldItalic.woff2') format('woff2'),
        url('./font/Gilroy-BoldItalic.woff') format('woff'),
        url('./font/Gilroy-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-UltraLightItalic.eot');
    src: local('Gilroy UltraLight Italic'), local('Gilroy-UltraLightItalic'),
        url('./font/Gilroy-UltraLightItalic.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-UltraLightItalic.woff2') format('woff2'),
        url('./font/Gilroy-UltraLightItalic.woff') format('woff'),
        url('./font/Gilroy-UltraLightItalic.ttf') format('truetype');
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-LightItalic.eot');
    src: local('Gilroy Light Italic'), local('Gilroy-LightItalic'),
        url('./font/Gilroy-LightItalic.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-LightItalic.woff2') format('woff2'),
        url('./font/Gilroy-LightItalic.woff') format('woff'),
        url('./font/Gilroy-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-Heavy.eot');
    src: local('Gilroy Heavy'), local('Gilroy-Heavy'),
        url('./font/Gilroy-Heavy.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-Heavy.woff2') format('woff2'),
        url('./font/Gilroy-Heavy.woff') format('woff'),
        url('./font/Gilroy-Heavy.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-Thin.eot');
    src: local('Gilroy Thin'), local('Gilroy-Thin'),
        url('./font/Gilroy-Thin.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-Thin.woff2') format('woff2'),
        url('./font/Gilroy-Thin.woff') format('woff'),
        url('./font/Gilroy-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('./font/Gilroy-ThinItalic.eot');
    src: local('Gilroy Thin Italic'), local('Gilroy-ThinItalic'),
        url('./font/Gilroy-ThinItalic.eot?#iefix') format('embedded-opentype'),
        url('./font/Gilroy-ThinItalic.woff2') format('woff2'),
        url('./font/Gilroy-ThinItalic.woff') format('woff'),
        url('./font/Gilroy-ThinItalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
}



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

html {
    font-size: 0.2vw;
}

body {
    background-color: #000000 !important;
}

#snackbar {
    font-size: 20rem;
  font-family: 'Gilroy' !important;
  text-align: center;
  font-weight: 700;
  background-color: #333;
  border-radius: 3rem;
  color: #fff;
  visibility: hidden;
  padding: 2rem 12rem;
  position: fixed;
  z-index: 1;
  left: 50%;
  transform: translateX(-50%);
  bottom: 10rem;
  z-index: 10000;
  width: max-content;
  }
  
  #snackbar.show {
    visibility: visible;
    -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
    animation: fadein 0.5s, fadeout 0.5s 2.5s;
  }
  
  @-webkit-keyframes fadein {
    from {bottom: 0; opacity: 0;}
    to {bottom: 30px; opacity: 1;}
  }
  
  @keyframes fadein {
    from {bottom: 0; opacity: 0;}
    to {bottom: 30px; opacity: 1;}
  }
  
  @-webkit-keyframes fadeout {
    from {bottom: 30px; opacity: 1;}
    to {bottom: 0; opacity: 0;}
  }
  
  @keyframes fadeout {
    from {bottom: 30px; opacity: 1;}
    to {bottom: 0; opacity: 0;}
  }

#preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000000;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;  
    transition: 0.5s;
    opacity: 100%;
}
#preloader .spinner {
    width: 40rem;
    height: 40rem;
    border: 5rem solid #D9D9D9;
    border-top-color: #F55013;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}
@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@keyframes evalFull {
    from {
      opacity: 0;
    }
  
    to {
      opacity: 100;
    }
  }

  @keyframes eval {
    from {
      opacity: 0;
    }
  
    to {
      opacity: 100;
    }
  }

.aText {
    animation-duration: 1.5s;
    animation-name: slidein;
}

.aNumber {
    animation-duration: 4s;
    animation-name: eval;
}

.aWhy {
    animation-duration: 2s;
    animation-name: evalFull;
}

.laptop {
    display: none;
}

.tablet {
    display: none;
}

.phone {
    display: none;
}

.section {
    position: relative;
    height: 234rem;
}

.section-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: 500rem auto;
    background-repeat: no-repeat;
}

.containerS {
    margin: 0 auto;
    height: 100%;
    width: 100%;
}

.title-logo {
    display: flex;
    flex-direction: column;
    width: 80%;
    margin: 0 auto;
    padding-top: 70.31rem;
    font-size: 27.34rem;
    color: white;
    font-family: 'Benzin' !important;
    font-weight: bold;
    font-style: normal;
}

.first-logo {
    display: flex;
    flex-direction: row;
    margin: 0 auto;
}

.second-logo {
    text-align: center;
    font-size: 13.02rem;
    line-height: 12.5rem;
    z-index: 2;
}

.title-second {
    position: relative;
    z-index: 2;
    width: 80%;
    height: 47%;
    margin: 0 auto;
}

.word {
    position: relative;
    z-index: 1;
    margin-left: 23.44rem;
    padding-left: 2.6rem;
}

.letter {
    font-size: 32.03rem;
    position: absolute;
    color: #F55013;
    z-index: 2;
    font-family: 'Good Vibes Pro' !important;
    font-weight: 300;
    font-style: normal;
    left: -27rem;
    top: -3.39rem; 
}

.about-list {
    position: absolute;
    top: 26.04rem;
    left: 48.96rem;
    width: 138.02rem;
    list-style-type: none;
    padding-left: 9.15rem;
}

.about-list-item {
    position: relative;
    font-size: 7.5rem;
    color: #D5D5D5;
    font-family: 'Gilroy' !important;
    font-weight: 500;
    font-style: normal;
}

.about-list-item::before {
    content: "";
    position: absolute;
    top: 1.30rem;
    left: -15.62rem;
    width: 6.51rem;
    height: 6.51rem;
    background-image: url('../img/element.svg');
    background-size: contain; 
    background-repeat: no-repeat;
    margin-right: 2.60rem;
}

.about-list-item:first-child{
    margin-bottom: 14.4rem;
}

.bold {
    color: #F55013;
    font-weight: bold;
}

.title-btn {
    background-color: transparent;
    transition: 0.1s;
    border: 0;
    position: absolute;
    right: 46.42rem;
    top: 35.16rem;
    width: 111.46rem;
    height: 30.21rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.title-btn:hover {
    cursor: pointer;
}

.btn-img {
    transition: 0.1s;
    z-index: 1;
    height: 100%;
}

.main-btn {
    top: -6.8rem;;
    height: 127.2rem;
}

.title-btn:hover .btn-img {
    transform: scale(1.1);
}

/* ABOUT US */

.about-us-container {
    position: relative;
    width: 346.35rem;
    height: 100%;
    margin: 0 auto;
}

.about-us-title {
    box-sizing: border-box;
    height: max-content;
    font-size: 32.03rem;
    color: white;
    text-align: center;
    text-wrap: nowrap;
    margin: 0 auto;
    padding-top: 19.04rem;
    font-size: 20.34rem;
    color: white;
    font-family: 'Benzin' !important;
    font-weight: bold;
    font-style: normal;
}

.about-us-word {
    position: relative;
    text-align: right;
    margin-left: 5.21rem;
}

.about-us-letter {
    position: absolute;
    font-size: 25.26rem;
    position: absolute;
    color: #F55013;
    z-index: 2;
    font-family: 'Good Vibes Pro' !important;
    font-weight: 300;
    font-style: normal;   
    left: 3rem;
    top: -3.5rem;
}

.about-us-reasons {
    position: relative;
    z-index: 3;
    top: 69rem;
    left: 55rem;
    height: 26rem;
}

.reason {
    width: max-content;
    display: flex;
    flex-direction: row;
}

.reason-number {
    position: relative;
    color: white;
    font-family: 'Benzin' !important;
    font-weight: bold;
    font-style: normal;
    font-size: 16.7rem; 
    width: 24.7rem;
    margin-right: 13rem;
    opacity: 0.1;
}

.Rnumber {
    position: absolute;
    top: -3.9rem;
    padding-bottom: 7.8rem;
}

.reason-number::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 1; 
    z-index: 2; 
    border-radius: 2.1rem; 
}

.reason-disc {
    width: 107.6rem;
    height: max-content;
    border-radius: 6.5rem;
    background-color: black;
    border: 0.26rem solid #F55013;
}

.reason-disc-title {
    font-family: 'Gilroy' !important;
    text-align: center;
    font-weight: 700;
    font-style: normal;
    font-size: 6rem;
    text-wrap: nowrap;
    border-radius: 6.5rem;
    padding: 4.2rem 4.9rem;
    background-image: linear-gradient(to bottom, #F55013 0%, #C23907 100%);
}

.reason-disc-info {
    color: white;
    font-family: 'Gilroy' !important;
    font-weight: 200;
    font-style: normal;
    font-size: 5rem;
    border-bottom-left-radius: 6.5rem;
    border-bottom-right-radius: 6.5rem;
    background-color: black;
    padding: 6rem 5.4rem;
    height: 42.9rem;
}

.reason-1 {
    position: absolute;
    top: -47rem;
    left: -53.3rem;
}

.reason-2 {
    position: absolute;
    top: 36.1rem;
    left: -53.3rem;
}

.reason-3 {
    position: absolute;
    top: -47rem;
    left: 144.8rem;
}

.reason-4 {
    position: absolute;
    top: 36.1rem;
    left: 144.8rem;
}

.case-container {
    position: relative;
    width: 351rem;
    height: 100%;
    margin: 0 auto;
}

.case-title {
    box-sizing: border-box;
    height: max-content;
    font-size: 17.64rem;
    color: white;
    text-align: left;
    width: 100%;
    text-wrap: nowrap;
    margin: 0 auto;
    padding-top: 19.53rem;
    color: white;
    font-family: 'Benzin' !important;
    font-weight: bold;
    font-style: normal;
}

.case-title-colored {
    color: #F55013;
}

.case-slider-wrap{
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    margin-left: 8px;
  }
  
  .mySwiperCases{
    width: 100%;
    overflow: visible;
  }
  
  .mySwiperCases .swiper-slide{
    height: auto;
  }



  .case-card{
    position: relative;
    background: #fff;
    border-radius: 28px;
    border: 1px solid #F55013;
    overflow: hidden;
    box-shadow: 0 18px 60px rgba(0,0,0,0.35);
    font-family: 'Gilroy' !important;
  
    display: flex;
    flex-direction: column;
    height: 100%;
  }
  


.case-card::after{
  height: 180px;
  background: linear-gradient(
    to bottom,
    rgba(255,255,255,0),
    rgba(255,255,255,0.7)
  );
}

  .case-card__img{
    height: 220px;
    background: #ddd;
  }
  .case-card__img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  
  .case-card__body{
    padding: 26px 26px 30px;
    display: flex;
    flex-direction: column;
    flex: 1; /* ключевая строка */
  }
  
  .case-card__title{
    text-transform: uppercase;
    font-size: 17px;
    font-weight: 500;
    letter-spacing: 0.02em;
    margin: 0 0 18px;
    position: relative;
    padding-bottom: 14px;
  }

  .case-card__title::after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width: 110px;
    height: 2px;
    background: #111;
    opacity: .85;
  }
  
  .case-card__grid{
    display: flex;
    flex-direction: column;
    gap: 12px 30px;
    margin-top: 14px;
    margin-bottom: 22px;
  }
  
  .case-card__metric{
    display:flex;
    align-items: center;
  }


  .case-card__value{
    display: flex;
    align-self: start;
    align-items: center;
    font-size: 36px;
    font-weight: 600;
    color: #F55013;
    letter-spacing: 0.02em;
    min-width: 200px;
  }

  .case-card__label{
    font-size: 14px;
    color: #111;
    opacity: .8;
    line-height: 1.2;
  }
  
  .case-card__btn{
    margin-top: auto; /* ВАЖНО */
    display:flex;
    justify-content:center;
    align-items:center;
    height: 54px;
    border-radius: 999px;
    border: 2px solid #F55013;
    color: #F55013;
    text-decoration: none;
    font-size: 17px;
    font-weight: 700;
  }
  
  .case-controls{
    display:flex;
    align-items:center;
    justify-content:center;
    gap: 26px;
    margin: 26px 0;
  }
  
  .case-nav{
    width: 44px;
    height: 44px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(0,0,0,.25);
    backdrop-filter: blur(8px);
    cursor:pointer;
    position: relative;
  }
  
  .case-prev::before,
  .case-next::before{
    content:"";
    position:absolute;
    inset:0;
    margin:auto;
    width: 8px;
    height: 8px;
    border-top: 2px solid rgba(255,255,255,.8);
    border-right: 2px solid rgba(255,255,255,.8);
    transform: rotate(-135deg);
    top: 0;
    bottom: 0;
  }
  
  .case-next::before{
    transform: rotate(45deg);
  }
  
  .case-pagination{
    position: static !important;
    width: auto !important;
    display:flex;
    align-items:center;
    gap: 10px;
  }
  
  .case-pagination .swiper-pagination-bullet{
    width: 8px;
    height: 8px;
    background: rgba(255,255,255,.22);
    opacity: 1;
  }
  
  .case-pagination .swiper-pagination-bullet-active{
    background: #F55013;
  }
  
  @media (max-width: 1200px){
    .case-card__grid{ grid-template-columns: 1fr; }
    .case-card__value{ font-size: 40px; }
  }
  

.max-container {
    position: relative;
    width: 351rem;
    height: 100%;
    margin: 0 auto;
}

.max-title {
    top: 39.3rem;
    left: 24.9rem;
    position: absolute;
    color: white;
    font-size: 16.08rem;
    font-family: 'Benzin' !important;
    font-weight: bold;
    font-style: normal;
}

.max-letter {
    position: absolute;
    left: -24.3rem;
    top: -8.4rem;
    color: #F55013;
    font-size: 22.81rem;
    font-family: 'Good Vibes Pro' !important;
    font-weight: 300;
    font-style: normal;
    margin-right: 5.21rem;  
    padding-bottom: 2.60rem; 
}

.max-name {
    position: absolute;
    top: 94rem;
  left: 57.5rem;
    font-size: 14.2rem;
    font-family: 'Gilroy' !important;
    font-weight: bold;
    font-style: normal;
}


.max-spec {
    position: absolute;
    top: 126.3rem;
    left: 8.5rem;
    font-size: 10.02rem;
    color: #D9D9D9;
    font-family: 'Gilroy' !important;
    font-weight: 200;
    font-style: normal;
    list-style-type: none;
}

.max-spec::before {
    content: "";
    position: absolute;
    top: 2.5rem;
    left: -9rem;
    width: 6.51rem;
    height: 6.51rem;
    background-image: url('/img/Elipse.png');
    background-size: contain; 
    background-repeat: no-repeat;
    margin-right: 2.60rem;
}

.max-disc {
    position: absolute;
    top: 162.8rem;
    left: 11rem;
    width: max-content;
    color: white;
    font-size: 10.02rem;
    font-family: 'Gilroy' !important;
    font-weight: 200;
    font-style: normal;
    padding: 7.03rem 8.33rem;
}

.max-disc li {
    position: relative;
    margin: 0 auto;
    width: 125.5rem; 
    list-style-type: none;
}

.max-disc-bold {
    color: #F55013;
    font-weight: 500;
}

.about-list-item {
    position: relative;
    font-size: 7.5rem;
    color: #D5D5D5;
    font-family: 'Gilroy' !important;
    font-weight: 500;
    font-style: normal;
}

.max-disc-bold::before {
    content: "";
    position: absolute;
    top: 2.5rem;
    left: -10.62rem;
    width: 6.51rem;
    height: 6.51rem;
    background-image: url('../img/element.svg');
    background-size: contain; 
    background-repeat: no-repeat;
    margin-right: 2.60rem;
}

.stage-container {
    position: relative;
    width: 351rem;
    height: 100%;
    margin: 0 auto;
}

.stage-letter {
    position: absolute;
    left: 209rem;
    top: -4.4rem;
    font-size: 22.81rem;
    font-family: 'Good Vibes Pro' !important;
    font-weight: 300;
    font-style: normal;
    padding-bottom: 2.60rem; 
}

.stage-title {
    top: 16.3rem;
    left: -0.1rem;
    position: absolute;
    color: white;
    font-size: 16.08rem;
    font-family: 'Benzin' !important;
    font-weight: bold;
    font-style: normal;
}

.stage {
    position: absolute;
    color: #fff;
    font-size: 6rem;
    font-family: 'Gilroy' !important;
    font-weight: 400;
    font-style: normal;
    border: solid 0px;
    background-color: #090909;
    border-radius: 5px;
    padding: 20px;
}

.stage-1 {
    width: 75rem;
    top: 62.5rem;
    left: 6rem;
}

.stage-2 {
    width: 100rem;
    top: 62.5rem;
    left: 110rem;
}

.stage-3 {
    width: 120rem;
    top: 62.5rem;
    left: 238rem;
}

.stage-4 {
    width: 75rem;
    top: 123.5rem;
    left: 6rem;
}

.stage-5 {
    width: 120rem;
    top: 123.5rem;
    left: 110rem;
}

.stage-6 {
    width: 120rem;
    top: 128.5rem;
    left: 238rem;
}

.stage-7 {
    width: 120rem;
    top: 184.5rem;
    left: 6rem;
}

.stage-btn {
    background-color: transparent;
    transition: 0.1s;
    border: 0;
    position: absolute;
    right: 65.4rem;
  top: 168rem;
  height: 38.2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.stage-btn:hover .btn-img {
    transform: scale(1.1);
}

/* ========== BONUS SECTION ========== */

.bonus-container{
  max-width: 1240px;
  margin: 0 auto;
  padding-inline: clamp(14px, 3vw, 24px);
  padding-bottom: clamp(44px, 7vw, 100px);
  box-sizing: border-box;
}

/* TITLE */
.bonus-title-wrap{
  display: flex;
  justify-content: center;
  padding-top: clamp(16px, 3vw, 40px);
}

.bonus-title{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: fit-content;
  max-width: 92vw;

  margin: 0 auto clamp(22px, 5vw, 70px);
  padding: clamp(10px, 2.4vw, 16px) clamp(18px, 4vw, 44px) !important;

  background: #f55013 !important;
  color: #fff !important;

  font-family: 'Benzin', sans-serif !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;

  font-size: clamp(28px, 5.6vw, 64px);
  line-height: 1;

  border-radius: 16px;
  box-shadow: 0 20px 60px rgba(245, 80, 19, 0.18) !important;

  text-align: center;
  white-space: nowrap;
}

/* GRID */
.bonus-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(12px, 2vw, 22px);
  align-items: stretch;
}

/* CARD */
.bonus-card{
  position: relative;
  display: flex;
  gap: 14px;

  padding: clamp(14px, 2.2vw, 18px);
  border-radius: 18px;

  border: 1px solid rgba(245, 80, 19, 0.55);
  background: rgba(0,0,0,0.35);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);

  overflow: hidden;
  box-sizing: border-box;
}

.bonus-card::before{
  content: "";
  position: absolute;
  inset: -2px;
  background: radial-gradient(520px 160px at 12% 10%, rgba(245, 80, 19, 0.22), transparent 60%);
  pointer-events: none;
  opacity: 1;
}

/* ICON */
.bonus-icon{
  width: clamp(44px, 6vw, 56px);
  height: clamp(44px, 6vw, 56px);
  flex: 0 0 clamp(44px, 6vw, 56px);

  display: grid;
  place-items: center;

  border-radius: 16px;
  background: rgba(245, 80, 19, 0.14);
  border: 1px solid rgba(245, 80, 19, 0.65);
  box-shadow: 0 0 30px rgba(245, 80, 19, 0.18);
    fill: white;
}

.bonus-icon img{
  width: clamp(20px, 3vw, 28px);
  height: clamp(20px, 3vw, 28px);
  display: block;
  object-fit: contain;
  filter: invert(1);
}

/* TEXT */
.bonus-content{
  min-width: 0;
}

.bonus-card-title{
  margin: 0 0 8px 0;
  font-family: 'Benzin', sans-serif;
  font-weight: 800;
  color: #fff;
  letter-spacing: 0.02em;

  font-size: clamp(18px, 2.2vw, 28px);
  line-height: 1.1;
}

.bonus-text{
  margin: 0;
  font-family: 'Inter', system-ui, sans-serif;
  color: rgba(255,255,255,0.86);

  font-size: clamp(14px, 1.35vw, 18px);
  line-height: 1.6;
}

.bonus-callout{
  position: relative;
  margin-top: clamp(28px, 3vw, 34px);
  padding: clamp(18px, 2.8vw, 24px);
  border-radius: 22px;

  background: #F55013;
  color: #0b0b0b;

  font-family: 'Inter', system-ui, sans-serif;
  font-size: clamp(14px, 1.35vw, 18px);
  line-height: 1.6;

  box-shadow: 0 18px 50px rgba(245,80,19,0.25);
}

.bonus-callout::before{
  content: "ИТОГ";
  position: absolute;
  top: -12px;
  left: 18px;

  padding: 6px 10px;
  border-radius: 999px;

  background: white;
  color: black;


  font-size: 12px;
  font-weight: 800;
  letter-spacing: .12em;
}

.bonus-callout-accent{
  color: #0b0b0b;
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ========== RESPONSIVE ========== */

/* Tablet */
@media (max-width: 1024px){
  .bonus-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Mobile */
@media (max-width: 640px){
  .bonus-grid{
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .bonus-card{
    flex-direction: column; /* на мобиле иконка сверху, текст снизу */
    gap: 12px;
    border-radius: 16px;
  }

  .bonus-title{
    white-space: normal;
  }
}

/* Super small */
@media (max-width: 380px){
  .bonus-title{
    font-size: 26px;
    padding: 10px 16px !important;
  }
}


.fourth-section {
  position: relative;
  overflow: hidden;
}

/* Градієнт знизу */
.fourth-section::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 180px; /* регулюй силу плавності */
  pointer-events: none;
  z-index: 5;

  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.6) 60%,
    rgba(0, 0, 0, 1) 100%
  );
}

.reviews-container {
    position: relative;
    width: 351rem;
    height: 100%;
    margin: 0 auto;
}

.reviews-title {
    font-family: 'Benzin' !important;
    font-weight: bold;
    font-style: normal;
    color: white;
    position: absolute;
    top: 14rem;
    left: 76rem;
    font-size: 31.01rem;
}

.reviews-slider {
    position: absolute;
    display: flex;
    flex-direction: row;
    top: 67.7rem;
    left: -8rem;
}

.review-slides {
    width: 256.8rem;
    height: 147.6rem;
}

.reviews-slider-slides {
    width: 269.79rem;
    height: 164.58rem;
}

.rev-slid {
  width: 100%;
  height: 100%;
}

.reviews-slider-arrow {
    position: relative;
    width: 46.04rem;
    height: 130.21rem;
    margin: auto 0;
}

.review-left {
    position: relative;
    top: 31rem;
    cursor: pointer;
}

.review-right {
    position: absolute;
    top: 51rem;
    left: 323rem;
    cursor: pointer;
}

.slide-arrow-img {
    width: 36.72rem;   
}

.mail-container {
    position: relative;
    width: 351rem;
    height: 100%;
    margin: 0 auto;
}

.mail-title {
    position: absolute;
    font-size: 19.13rem;
    width: 10rem;
    color: white;
    font-family: 'Benzin' !important;
    font-weight: bold;
    font-style: normal;
    top: 19rem;
    left: 5rem;
}

.mail-letter {
    position: absolute;
    font-size: 28.87rem;
    font-family: 'Good Vibes Pro' !important;
    font-weight: 300;
    font-style: normal;
    color: #F55013;
}

.o {
    position: absolute;
    top: -7rem;
    left: 1.5rem;
} 

.y {
    position: absolute;
    top: 16rem;
    left: 81rem;
}

.mail-disc {
  position: absolute;
  font-size: 9.41rem;
  top: 80rem;
  left: 5rem;
  width: 200rem;

  color: white;
  font-family: 'Gilroy' !important;
  font-weight: 500;
  text-align: left;
}

.mail-bold{
  color:#F55013;
  font-weight:600;
}

.mail-offer{
  display: inline-flex;
  align-items: center;
  gap: 0.1em;

  padding: 0.15em 0.3em;
  margin-left: -0.4em;

  background: rgba(245, 80, 19, 0.10);
  border-radius: 999px;

  color: #F55013;
  font-weight: 600;

  border: 1px solid rgba(245,80,19,0.55);
  box-shadow:
    0 0 6px rgba(245,80,19,0.55),
    0 0 14px rgba(245,80,19,0.45),
    0 0 28px rgba(245,80,19,0.25);

  backdrop-filter: blur(4px);
}


.mail-offer .gift{
  font-size: 1em;
  line-height: 1;
}



/* тримає ВСЕ в одному рядку */
.mail-inline{
  display: inline-flex;
  align-items: center;
  gap: 0.8em;
  white-space: nowrap;   /* 🔴 ВАЖЛИВО */
}





/* емодзі */
.mail-gift{
  font-size: 1.05em;
  line-height: 1;
  transform: translateY(-0.05em);
}


.mail-form {
    position: absolute;
    padding: 8.33rem; 
    top: 21.9rem;
    left: 219.9rem;
    width: 125rem;
    height: 89.58rem;
}

.mail-form-item {
    margin-top: 6rem;
    width: 108.07rem;
    height: 19.84rem;
    border: 0.2rem solid black;
    background-color: rgba(255, 255, 255, 0.05);
    padding: 4.6rem 6.5rem;
    font-size: 9.1rem;
    outline: none; 
    box-shadow: none;
    font-family: 'Gilroy' !important;
    font-weight: 400;
    font-style: normal;
    color: rgb(255, 255, 255);
}

.mail-form-item::placeholder {
    color: rgb(97, 97, 97);
    font-weight: 200;
}

.mail-form-item:first-child {
    margin-top: 0rem;
}

.mail-btn {
    background-color: transparent;
    transition: 0.1s;
    border: 0;
    position: absolute;
    right: 10rem;
    top: 117rem;
    width: 105rem;
    height: 29rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.mail-btn-img {
    transition: 0.1s;
    z-index: 1;
    height: 35rem;
}

.mail-btn-img:hover {
    transition: 0.1s;
    height: 37rem;
    cursor: pointer;
}

@media (max-width: 1280px) {
    .desktop {
        display: none;
    }

    .laptop {
        display:block;
    }

    .tablet {
        display: none;
    }

    .phone {
        display: none;
    }

    .section {
        height: 325rem;
    }
    
    
    .section-bg {
        position: absolute;
        width: 100%;
        height: 100%;
        background-position: center;
        background-repeat: no-repeat;
    }
    
    .title-logo {
        position: relative;
        padding-top: 90rem;
        padding-left: 20rem;
        font-size: 30.34rem;
    }
    
    .second-logo {
        font-size: 14.3rem;
        line-height: 12.5rem;
    }
    
    .word {
        margin-left: 23.44rem;
        padding-left: 2.6rem;
    }
    
    .letter {
        font-size: 32.03rem;
        position: absolute;
        color: #F55013;
        z-index: 2;
        font-family: 'Good Vibes Pro' !important;
        font-weight: 300;
        font-style: normal;
    }
    
    .about-list {
        position: absolute;
        top: 45rem;
        left: 41rem;
        width: 158.02rem;
        list-style-type: none;
        padding-left: 9.15rem;
    }
    
    .about-list-item {
        position: relative;
        font-size: 8.5rem;
        color: #D5D5D5;
        font-family: 'Gilroy' !important;
        font-weight: 500;
        font-style: normal;
    }
    
    .about-list-item::before {
        content: "";
        position: absolute;
        top: 1.30rem;
        left: -15.62rem;
        width: 6.51rem;
        height: 6.51rem;
        background-image: url('../img/element.svg');
        background-size: contain; 
        background-repeat: no-repeat;
        margin-right: 2.60rem;
    }
    
    .about-list-item:first-child{
        margin-bottom: 17.4rem;
    }
    
    .bold {
        color: #F55013;
        font-weight: bold;
    }
    
    .title-btn {
        background-color: transparent;
        transition: 0.1s;
        border: 0;
        position: absolute;
        right: 35.4rem;
        top: 57.2rem;
        width: 111.46rem;
        height: 30.21rem;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .title-btn:hover {
        cursor: pointer;
    }
    
    .btn-img {
        transition: 0.1s;
        z-index: 1;
    }
    
    .title-btn:hover .btn-img {
        transform: scale(1.05);
    }
    
    .about-us-reasons {
        position: relative;
        z-index: 3;
        top: 89rem;
        left: 50rem;
        width: 345rem;
        height: 26rem;
    }
    
    .reason {
        width: max-content;
        display: flex;
        flex-direction: row;
    }
    
    .reason-number {
        position: relative;
        color: white;
        font-family: 'Benzin' !important;
        font-weight: bold;
        font-style: normal;
        font-size: 16.7rem; 
        width: 24.7rem;
        margin-right: 13rem;
        opacity: 0.1;
    }
    
    .Rnumber {
        position: absolute;
        top: -3.9rem;
        padding-bottom: 7.8rem;
    }
    
    .reason-number::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        opacity: 1; 
        z-index: 2; 
        border-radius: 2.1rem; 
    }
    
    .reason-disc {
        width: 120.6rem;
        height: max-content;
        border-radius: 6.5rem;
        background-color: black;
        border: 0.26rem solid #F55013;
    }
    
    .reason-disc-title {
        font-family: 'Gilroy' !important;
        text-align: center;
        font-weight: 700;
        font-style: normal;
        font-size: 6rem;
        text-wrap: nowrap;
        border-radius: 6.5rem;
        padding: 4.2rem 4.9rem;
        background-image: linear-gradient(to bottom, #F55013 0%, #C23907 100%);
    }
    
    .reason-disc-info {
        color: white;
        font-family: 'Gilroy' !important;
        font-weight: 200;
        font-style: normal;
        font-size: 6rem;    
        border-bottom-left-radius: 6.5rem;
        border-bottom-right-radius: 6.5rem;
        background-color: black;
        padding: 6rem 5.4rem;
        height: auto;
    }
    
    .reason-1 {
        position: absolute;
        top: -47rem;
        left: -53.3rem;
    }
    
    .reason-2 {
        position: absolute;
        top: 36.1rem;
        left: -53.3rem;
    }
    
    .reason-3 {
        position: absolute;
        top: -47rem;
        left: 144.8rem;
    }
    
    .reason-4 {
        position: absolute;
        top: 36.1rem;
        left: 144.8rem;
    }
    
    .case-container {
        position: relative;
        width: 391rem;
        height: 100%;
        margin: 0 auto;
    }
    
    .case-title {
        box-sizing: border-box;
        height: max-content;
        font-size: 19.6rem;
        color: white;
        text-align: left;
        width: 100%;
        text-wrap: nowrap;
        margin: 0 auto;
        padding-top: 32.5rem;
        color: white;
        font-family: 'Benzin' !important;
        font-weight: bold;
        font-style: normal;
    }
    
    .case-title-colored {
        color: #F55013;
    }
    
    .case-slider {
        position: absolute;
        display: flex;
        flex-direction: row;
        top: 90.7rem;
        left: 38rem;
    }
    
    .case-slides {
        width: 269.79rem;
        height: 164.58rem;
    }
    
    .case-slider-arrow {
        position: relative;
        width: 26.04rem;
        height: 130.21rem;
        margin: auto 0;
    }
    
    .arrow-img {
        position: absolute;
        top: 39.06rem;
        width: 40.79rem;
        cursor: pointer;
    }
    
    .slid {
        width: 267.71rem; 
        height: 162.50rem;
    }
    
    .right {
        left: 18.23rem;
    }
    
    .left {
        left: -33.85rem;
    }
    
    .max-container {
        position: relative;
        width: 351rem;
        height: 100%;
        margin: 0 auto;
    }
    
    .max-title {
        top: 31.3rem;
        left: 24.9rem;
        position: absolute;
        color: white;
        font-size: 16.08rem;
        font-family: 'Benzin' !important;
        font-weight: bold;
        font-style: normal;
    }
    
    .max-letter {
        position: absolute;
        left: -15.3rem;
        top: -4.4rem;
        color: #F55013;
        font-size: 22.81rem;
        font-family: 'Good Vibes Pro' !important;
        font-weight: 300;
        font-style: normal;
        margin-right: 5.21rem;  
        padding-bottom: 2.60rem; 
    }
    
    .max-name {
        position: absolute;
        top: 97rem;
        left: 62.5rem;
        font-size: 14.2rem;
        font-family: 'Gilroy' !important;
        font-weight: bold;
        font-style: normal;
    }
    
    
    .max-spec {
        position: absolute;
        top: 134.3rem;
        left: 9.5rem;
        font-size: 11.02rem;
        color: #D9D9D9;
        font-family: 'Gilroy' !important;
        font-weight: 200;
        font-style: normal;
        list-style-type: none;
    }
    
    .max-spec::before {
        content: "";
        position: absolute;
        top: 2.5rem;
        left: -9rem;
        width: 6.51rem;
        height: 6.51rem;
        background-image: url('/img/Elipse.png');
        background-size: contain; 
        background-repeat: no-repeat;
        margin-right: 2.60rem;
    }
    
    .max-disc {
        position: absolute;
        top: 196.8rem;
        left: 13rem;
        width: max-content;
        color: white;
        font-size: 10.02rem;
        font-family: 'Gilroy' !important;
        font-weight: 200;
        font-style: normal;
        padding: 7.03rem 8.33rem;
    }
    
    .max-disc li {
        position: relative;
        margin: 0 auto;
        width: 125.5rem; 
        list-style-type: none;
    }
    
    .max-disc-bold {
        color: #F55013;
        font-weight: 500;
    }
    
    .max-disc-bold::before {
        content: "";
        position: absolute;
        top: 2.5rem;
        left: -10.62rem;
        width: 6.51rem;
        height: 6.51rem;
        background-image: url('../img/element.svg');
        background-size: contain; 
        background-repeat: no-repeat;
        margin-right: 2.60rem;
    }
    
    .stage-container {
        position: relative;
        width: 351rem;
        height: 100%;
        margin: 0 auto;
    }
    
    .stage-letter {
        position: absolute;
        left: 260rem;
    top: -2.3rem;
    font-size: 24.8rem;
    font-family: 'Good Vibes Pro' !important;
        font-weight: 300;
        font-style: normal;
        padding-bottom: 2.60rem; 
    }
    
    .stage-title {
        top: 37.3rem;
        left: 0.9rem;
        position: absolute;
        color: white;
        font-size: 20.2rem;
        font-family: 'Benzin' !important;
        font-weight: bold;
        font-style: normal;
        width: 114%;
    }
    
    .stage {
        position: absolute;
        color: #fff;
        font-size: 7rem;
        padding: 20px;
        font-family: 'Gilroy' !important;
        font-weight: 400;
        font-style: normal;
    }
    
    .stage-1 {
        width: 75rem;
        top: 102rem;
        left: 7rem;
    }
    
    .stage-2 {
        width: 100rem;
        top: 102rem;
        left: 109rem;
    }
    
    .stage-3 {
        width: 120rem;
        top: 102rem;
        left: 236rem;
    }
    
    .stage-4 {
        width: 90rem;
        top: 166rem;
        left: 7rem;
    }
    
    .stage-5 {
        width: 120rem;
        top: 166rem;
        left: 109rem;
    }
    
    .stage-6 {
        width: 120rem;
        top: 171rem;
        left: 235rem;
    }
    
    .stage-7 {
        width: 120rem;
        top: 226rem;
        left: 8rem;
    }
    
    .stage-btn {
        background-color: transparent;
        transition: 0.1s;
        border: 0;
        position: absolute;
        right: 66.4rem;
        top: 240rem;
        height: 40.2rem;
        display: flex;
        justify-content: center;
        align-items: center;
        cursor: pointer;
    }
    
    .stage-btn:hover .btn-img {
        transform: scale(1.1);
    }
    
    .bonus-container {
        position: relative;
        width: 351rem;
        height: 100%;
        margin: 0 auto;
    }
    
    .bonus-list {
        font-size: 12rem;
        color: #D9D9D9;
        font-family: 'Gilroy' !important;
        font-weight: 500;
        font-style: normal;
        list-style-type: none;
    }
    
    .bonus-list-item {
        position: relative;
        font-size: 10rem;
    }
    
    .bonus-list-item::before {
        content: "";
        position: absolute;
        top: 2.3rem;
        left: -13.6rem;
        width: 7.5rem;
        height: 7.5rem;
        background-image: url('../img/element.svg');
        background-size: contain; 
        background-repeat: no-repeat;
        margin-right: 2.60rem;
    }
    
    .bonus-1 {
        top: 99rem;
        left: 17rem;
        width: 163rem;
    }
    
    .bonus-2 {
    left: 16rem;
    top: 127rem;
    width: 160rem;
  }
    
  .bonus-3 {
    top: 29rem;
    left: 243rem;
    width: 112rem;
  }

  .bonus-4 {
    top: 116rem;
    left: 193rem;
    width: 155rem;
    font-size: 10.5rem;
  }
    
    .reviews-container {
        position: relative;
        width: 351rem;
        height: 100%;
        margin: 0 auto;
    }
    
    .reviews-title {
        font-family: 'Benzin' !important;
        font-weight: bold;
        font-style: normal;
        color: white;
        position: absolute;
        top: 49rem;
        left: 65rem;
        font-size: 35.0rem;
    }
    
    .reviews-slider {
        position: absolute;
        display: flex;
        flex-direction: row;
        top: 125.7rem;
        left: -5rem;
    }
    
    .review-slides {
        width: 256.8rem;
        height: 147.6rem;
    }
    
    .reviews-slider-slides {
        width: 269.79rem;
        height: 164.58rem;
    }
    .rev-slid {
      width: 100%;
      height: 100%;
    }
    
    .reviews-slider-arrow {
        position: relative;
        width: 46.04rem;
        height: 130.21rem;
        margin: auto 0;
    }
    
    .review-left {
        position: relative;
        top: 31rem;
        cursor: pointer;
    }
    
    .review-right {
        position: absolute;
        top: 51rem;
        left: 323rem;
        cursor: pointer;
    }
    
    .slide-arrow-img {
        width: 36.72rem;   
    }
    
    .mail-container {
        position: relative;
        width: 351rem;
        height: 100%;
        margin: 0 auto;
    }
    
    .mail-title {
        position: absolute;
        font-size: 31.1rem;
        width: 10rem;
        color: white;
        font-family: 'Benzin' !important;
        font-weight: bold;
        font-style: normal;
        top: 10rem;
        left: 5rem;
    }
    
    .mail-letter {
        position: absolute;
        font-size: 43.9rem;
        font-family: 'Good Vibes Pro' !important;
        font-weight: 300;
        font-style: normal;
        color: #F55013;
    }
    
    .o {
        position: absolute;
        top: -10rem;
        left: -7.5rem;
    } 
    
    .y {
        position: absolute;
        top: 29rem;
        left: 133rem;
    }
    
    .mail-disc {
        position: absolute;
        font-size: 9.41rem;
        top: 112rem;
        left: 5rem;
        width: 200rem;
        color: white;
        font-family: 'Gilroy' !important;
        font-weight: 500;
        font-style: normal;
        list-style-type: none;
    }
    
    .mail-bold {
        color: #F55013;
        font-weight: 600;
    }
    
    .mail-form {
        position: absolute;
        padding: 8.33rem; 
        top: 72.9rem;
        left: 214.9rem;
        width: 125rem;
        height: 89.58rem;
    }
    
    .mail-form-item {
        margin-top: 5rem;
        width: 108.07rem;
        height: 18.84rem;
        border: 0.2rem solid black;
        background-color: rgba(255, 255, 255, 0.05);
        padding: 4.6rem 6.5rem;
        font-size: 9.1rem;
        outline: none; 
        box-shadow: none;
        font-family: 'Gilroy' !important;
        font-weight: 200;
        font-style: normal;
        color: black;
    }
    
    .mail-form-item::placeholder {
        color: rgba(0, 0, 0, 1);
    }
    
    .mail-form-item:first-child {
        margin-top: 0rem;
    }
    
    .mail-btn {
        background-color: transparent;
        transition: 0.1s;
        border: 0;
        position: absolute;
        right: 10rem;
        top: 125rem;
        width: 105rem;
        height: 29rem;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .mail-btn-img {
        transition: 0.1s;
        z-index: 1;
        height: 35rem;
    }
    
    .mail-btn-img:hover {
        transition: 0.1s;
        height: 37rem;
        cursor: pointer;
    }
}


@media (max-width: 780px) { 
    .desktop {
        display: none;
    }

    .laptop {
        display: none;
    }

    .tablet {
        display: block;
    }

    .phone {
        display: none;
    }

    .section {
        height: 586rem;
      }

    .section-bg {
        background-size: 499.99rem auto;
    }

    .title-logo {
        transform: scale(1.25);
        padding-top: 136rem;
        padding-left: 7rem;
    }

    .about-list {
        position: absolute;
        top: 111rem;
        left: 141rem;
        transform: scale(1.8);
    }

    .title-btn {
        right: 140.4rem;
        top: 267.2rem;
    }
    .tb {
      margin-top: -65px;
    }

    .main-btn {
        height: 248.2rem;
    }

    .about-us-title { 
        transform: scale(1.42);
    }

    .about-us-title {
        padding-top: 30rem;
        padding-left: 5rem;
    }

    .reason {
     transform: scale(1.55);   
    }

    .reason-1 {
        position: absolute;
        top: -23rem;
        left: -62.3rem;
    }

    .reason-2 {
        position: absolute;
        top: 93rem;
        left: 167.7rem;
    }

    .reason-3 {
        position: absolute;
        top: 195rem;
        left: -62.3rem;
    }

    .reason-4 {
        position: absolute;
        top: 321rem;
        left: 167.7rem;
    }

    .case-container {
        width: 431rem;
    }

    .case-title {
        font-size: 37.6rem;
        text-align: center;
        width: 445rem;
        text-wrap: wrap;
        padding-top: 37.5rem;
        padding-right: 13rem;
    }

    .case-slider {
      position: absolute;
      display: flex;
      flex-direction: row;
      top: 180rem;
      left: -35rem;
      overflow: hidden;
      height: 360rem;
    }
    .case-slides {
      width: 446.8rem;
      height: 250.6rem;
    }
    .slid {
      width: 447.7rem;
      height: 251.5rem;
    }
    .left {
      left: 25.2rem;
      top: 118rem;
    }
    .right {
      left: -75.2rem;
      top: 118rem;
    }
    .arrow-img {
      width: 76rem;
    }
    .fifth-section {
      height: 1170rem;
    }
    .max-title {
      transform: scale(2.1);
      top: 50.3rem;
      left: 108.9rem;
    }
    .max-letter {
      left: -26.3rem;
    }
    .max-name {
      top: 137rem;
      left: 39.5rem;
      font-size: 22.2rem;
    }
    .max-spec {
      font-size: 16.0rem;
      top: 198.3rem;
      left: -44.5rem;
    }
    .max-spec::before {
      top: 4.5rem;
      left: -16rem;
      width: 9.5rem;
      height: 9.5rem;
    }
    .max-disc {
      transform: scale(1.6);
      top: 308rem;
      left: 7rem;
    }

    .stage-title {
        width: 99%;
        text-align: center;
        font-size: 28.2rem;
    }

    .stage-letter {
        left: 125rem;
        top: 43.7rem;
        font-size: 28.8rem;
        font-family: 'Good Vibes Pro' !important;
    }

    .stage {
        font-size: 17.8rem;
    }

    .stage-1 {
        width: 160rem;
        top: 164rem;
        left: -21rem;
    }
    
    .stage-2 {
        width: 210rem;
        top: 267rem;
        left: 177rem;
    }
    
    .stage-3 {
        width: 235rem;
        top: 380rem;
        left: -28rem;
    }
    
    .stage-4 {
        width: 227rem;
        top: 517rem;
        left: 170rem;
    }
    
    .stage-5 {
        width: 236rem;
        top: 633rem;
        left: -28rem;
    }
    
    .stage-6 {
        width: 231rem;
        top: 756rem;
        left: 177rem;
    }
    
    .stage-7 {
        width: 157rem;
        top: 855rem;
        left: -30rem;
    }

    .stage-btn {
        top: 979rem;
        height: 77.2rem;
        right: 58.4rem;
    }

      .bonus-list {
        font-size: 19rem;
      }

      .bonus-list-item {
        font-size: 17rem;
        letter-spacing: 0.3rem;
      }

      .bonus-1 {
        top: 139rem;
        left: 44rem;
        width: 310rem;
      }
      .bonus-2 {
        top: 266rem;
        left: 44rem;
        width: 278rem;
      }
      .bonus-3 {
        top: 112rem;
        left: 45rem;
        width: 197rem;
      }
      .bonus-4 {
        top: 289rem;
        left: 95rem;
        width: 198rem;
        font-size: 13.5rem;
        letter-spacing: -0.2rem;
      }

      .bonus-list-item::before {
        top: 5.3rem;
        left: -23.6rem;
    width: 12.5rem;
    height: 13.5rem;
      }

      .reviews-title {
        top: 56rem;
        left: 15rem;
        font-size: 50rem;
      }

      .reviews-slider {
        top: 163.7rem;
        left: -110rem;
      }

      .reviews-slider-slides {
        width: 470.8rem;
        height: 270.6rem;
      }

      .review-slides {
        width: 470.8rem;
        height: 270.6rem;
      }

      .rev-slid {
        width: 100%;
        height: 100%;
      }
      
      .review-left {
        top: 219rem;
        left: 52rem;
      }

      .review-right {
        top: 289rem;
        left: 430rem;
      }

      .slide-arrow-img {
        width: 75.7rem;
      }

      .mail-title {
        font-size: 43.1rem;
        top: 12rem;
        left: -50rem;
      }

      .mail-letter {
        font-size: 55.9rem;
        font-family: 'Good Vibes Pro' !important;
        font-weight: 300;
        font-style: normal;
      }

      .o {
        top: -10rem;
        left: -15.5rem;
      }

      .y {
        top: 43rem;
        left: 188rem;
      }
      
      .mail-disc{
    font-size: 14.4rem;
    top: 143rem;
    left: -48rem;
    width: 287rem;
    /* position у тебе вже стоїть absolute в базі */
  }

      .mail-form {
        top: 216.9rem;
    left: 158.9rem;
      }

    .mail-form-item:first-child {
        margin-top: 0rem;
    }

      .mail-form-item {
        margin-top: 12rem;
        width: 211.1rem;
        height: 35.8rem;
        padding: 4.6rem 12.5rem;
    font-size: 18.1rem;
      }

      .mail-btn {
        right: -43rem;
    top: 220rem;
      }

      .mail-btn-img {
        transition: 0.1s;
        z-index: 1;
        height: 65rem;
        margin-top: 30px;
    }
    
    .mail-btn-img:hover {
        transition: 0.1s;
        height: 67rem;
        cursor: pointer;
    }
}


@media (max-width: 440px) {
    .section {
        height: 1086.6rem;
    }

    .section-bg {
        background-size: 501rem auto;
    }

    .desktop {
        display: none;
    }

    .laptop {
        display: none;
    }

    .tablet {
        display: none;
    }

    .phone {
        display: block;
    }

    .title-logo {
        transform: scale(1.15);
        padding-top: 280rem;
        padding-left: 5rem;
    }

    .about-list {
        top: 188rem;
        left: 147rem;
        transform: scale(2.3);
    }

    .title-btn {
        right: 140.4rem;
        top: 461.2rem;
    }

    .main-btn {
        height: 280.2rem;
    }

    .about-us-title {
        padding-top: 53rem;
        padding-left: 0rem;
        transform: scale(1.35);
    }

    .reason {
        transform: scale(2.5);
    }

    .reason-1 {
        position: absolute;
        top: 41rem;
        left: 36.7rem;
      }

      .reason-2 {
        position: absolute;
        top: 255rem;
        left: 36.7rem;
      }
      .reason-3 {
        position: absolute;
        top: 500rem;
        left: 36.7rem;
      }
      .reason-4 {
        position: absolute;
        top: 750rem;
        left: 36.7rem;
      }

      .case-title {
        font-size: 33.6rem;
        text-align: center;
        width: 445rem;
        text-wrap: wrap;
        padding-top: 201.5rem;
        padding-right: 13rem;
      }

      .case-slider {
        position: absolute;
        display: flex;
        flex-direction: row;
        top: 444rem;
        left: -35rem;
        overflow: hidden;
        height: 472rem;
      }

      .max-title {
        transform: scale(2);
        top: 73.3rem;
      }

      .max-spec {
        font-size: 24rem;
        top: 241.3rem;
        left: 49.5rem;
      }

      .max-spec::before {
        top: 7.5rem;
        left: -22rem;
        width: 12.5rem;
        height: 12.5rem;
      }

      .max-name {
        top: 185rem;
        left: 138.5rem;
        font-size: 24.2rem;
      }

      .max-disc {
        transform: scale(2);
        top: 333rem;
        left: 128rem;
      }

      .fifth-section {
        height: 2176rem;
      }

      .stage {
        font-size: 19.8rem;
      }

      .stage-1 {
        width: 169rem;
        top: 299rem;
        left: -8rem;
        letter-spacing: 0.3rem;
      }
    
      .stage-2 {
        width: 234rem;
        top: 472rem;
        left: 131rem;
        letter-spacing: 0.3rem;
      }
    
      .stage-3 {
        width: 275rem;
        top: 673rem;
        left: 0rem;
        letter-spacing: 0.25rem;
      }
    
      .stage-4 {
        width: 235rem;
        top: 941rem;
        left: 134rem;
        letter-spacing: 0.3rem;
      }
    
      .stage-5 {
        width: 255rem;
        top: 1172rem;
        left: -8rem;
        letter-spacing: 0.3rem;
      }
    
      .stage-6 {
        width: 231rem;
        top: 1412rem;
        left: 169rem;
        letter-spacing: 0.3rem;
      }
    
      .stage-7 {
        width: 173rem;
        top: 1595rem;
        left: -7rem;
        letter-spacing: 0.3rem;
      }

      .stage-btn {
        top: 1842rem;
        height: 80.2rem;
        right:  9.4rem;
      }

      .stage-title {
        top: 80.3rem;
        left: -32.1rem;
        width: 109%;
        text-align: center;
        font-size: 34.2rem;
      }

      .stage-letter {
        left: 136rem;
        top: 53.7rem;
        font-size: 29.8rem;
        font-family: 'Good Vibes Pro' !important;
      } 

      .bonus-list {
        position: absolute;
        top: 274rem;
        left: -10rem;
        font-size: 19rem;
      }

      .bonus-list-item  {
        font-size: 20rem;
        letter-spacing: 0.5rem;
        line-height: 25rem;
      }
      
      .bonus-list-item::before {
        top: 5.3rem;
        left: -28.6rem;
        width: 15.5rem;
        height: 15.5rem;
      }

      .bonus-1 {
        top: 80rem;
        left: 12rem;
        width: 346rem;
        letter-spacing: 0.5rem;
        line-height: 25rem;
      }

      .bonus-2 {
        top: 231rem;
        left: 12rem;
        width: 338rem;
      }

      .bonus-3 {
        top: 48rem;
        left: 13rem;
        width: 235rem;
        letter-spacing: 0.6rem;
      }

      .bonus-4 {
        top: 342rem;
        left: 83rem;
        width: 262rem;
        font-size: 18.5rem;
        letter-spacing: 0.1rem;
      }

      .reviews-title {
        top: 263rem;
        left: 18rem;
      }
      
      .reviews-slider {
        top: 465.7rem;
        left: -108rem;
      }

      .mail-title {
        top: 57rem;
        left: -9rem;
      }

      .mail-disc {
        font-size: 19.4rem;
        top: 220rem;
        left: -7rem;
        width: 384rem;
      }

      .mail-form {
        top: 382.9rem;
        left: 41.9rem;
      }

      .mail-form-item {
        width: 251.1rem;
        height: 41.8rem;
      }

      .mail-btn {
        right: -62rem;
        top: 276rem;
      }

      .mail-btn-img {
        transition: 0.1s;
        z-index: 1;
        height: 77rem;
      }

      .mail-btn-img:hover {
        transition: 0.1s;
        height: 82rem;
        cursor: pointer;
      }
}


@media (max-width: 440px) {
  .seventh-section.section {
    height: 620rem;
  }

  .seventh-section .reviews-title{
    top: 45rem;
    left: 50rem;
    font-size: 38rem;
  }

  .seventh-section .reviews-slider{
    top: 150rem;
    left: -60rem;
    transform: scale(0.85);
    transform-origin: top left;
  }

  .seventh-section .reviews-slider-slides,
  .seventh-section .review-slides{
    height: auto;
  }
}



:root{
  --bg:#080808;
  --card:#0f0f0f;
  --text:#ffffff;
  --muted:#cfcfcf;
  --orange:#ff4d00;
  --border:rgba(255,255,255,.08);
}

.wrapper{
  max-width:1100px;
  margin:0 auto;
  padding:40px 20px 80px;
}

.card{
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  border:1px solid var(--border);
  border-radius:22px;
  padding:24px;
  font-family: Inter, Arial, sans-serif;
  color:var(--text);
}

.card.grid{
  align-items: center;
}

@media (max-width: 768px){
  .wrapper{
    padding:24px 14px 60px;
  }

  .card{
    padding:18px;
  }
}

.contact-card{
  padding: 26px;
  background:
    radial-gradient(circle at 20% 0%, rgba(255,77,0,.10), transparent 40%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
}

.contact-head{
  margin-bottom: 18px;
}

.contact-title{
  margin: 0 0 10px;
  font-size: 28px;
  letter-spacing: .01em;
}

.contact-desc{
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
  font-size: 16px;
}

.accent{
  color: #fff;
  font-weight: 700;
}

.contact-form{
  margin-top: 18px;
}

.contact-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 14px;
}

.contact-input{
  width: 100%;
  height: 54px !important;
  padding: 0 16px;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: rgba(0,0,0,.35);
  color: #fff;
  outline: none;
  transition: .2s ease;
}

.contact-input::placeholder{
  color: rgba(255,255,255,.55);
}

.contact-input:focus{
  border-color: rgba(255,77,0,.55);
  box-shadow: 0 0 0 4px rgba(255,77,0,.12);
}

.contact-methods{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 12px 0 14px;
}

.contact-right {
  display: flex;
  margin-left: auto;
}

.contact-option{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px !important;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(0,0,0,.28);

  cursor: pointer;
  user-select: none;
  transition: .2s ease;
}

.contact-option input{
  appearance: none;
  width: 18px !important;
  height: 18px !important;
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,.35);
  position: relative;
  display: inline-block;
}

.contact-option input:checked{
  border-color: rgba(255,77,0,.85);
}

.contact-option input:checked::after{
  content:"";
  position:absolute;
  inset: 3px;
  border-radius: 999px;
  background: var(--orange);
}

.contact-option span{
  color: rgba(255,255,255,.85);
  font-size: 14px;
}

.contact-option:hover{
  border-color: rgba(255,77,0,.35);
  transform: translateY(-1px);
}

.contact-btn{
  width: 100%;
  height: 56px;
  margin-top: 12px;
  border-radius: 16px;
  border: 1px solid rgba(255,77,0,.45);
  background: rgba(255,77,0,.14);
  color: #fff;
  font-weight: 700;
  font-size: 15px;
  cursor: pointer;
  transition: .25s ease;
}

.contact-btn:hover{
  background: #ff4d0038;
  transform: translateY(-1px);
}

.contact-note{
  margin-top: 10px;
  font-size: 12px;
  color: rgba(255,255,255,.55);
  line-height: 1.4;
}

.contact-methods-title{
  color: rgba(255,255,255,.75);
  font-size: 16px;
  display: block;
  margin-right: 12px;
  white-space: nowrap;
}

@media (max-width: 768px){

  .contact-methods{
    display: block;
    margin: 12px 0 14px;
  }

  .contact-methods-title{
    margin: 0 0 10px;
    white-space: normal;
  }

  .contact-right{
    margin-left: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  .contact-option{
    width: 100%;
    justify-content: flex-start;
    padding: 12px 12px;
  }

  .contact-option span{
    font-size: 13px;
  }
}





/* ===== HERO LOGO (center + always visible) ===== */
.gm-logo{
  position: relative;
  z-index: 5;                /* щоб текст не ховався під фоном/оверлеями */
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  font-family: 'Benzin' !important;
  width: 100%;
  max-width: 1100px;         /* щоб блок не розтягувався занадто */
  margin-inline: auto;

  padding-top: 200px;         /* замість margin-top */
}

/* верхній рядок: GROW-M   AGENCY */
.gm-logo__top{
  position: relative;
  display: flex;
  align-items: baseline;
  justify-content: center;

  gap: clamp(18px, 6vw, 96px);  /* адаптивний відступ між словами */
  padding-bottom: clamp(10px, 1.6vw, 16px);
}

/* слова */
.gm-logo__word{
  margin: 0;
  padding: 0;
  color: #fff;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1;
  white-space: nowrap;

  /* головне — нормальна адаптація */
  font-size: clamp(30px, 6vw, 85px);
}

.gm-logo__m{ color:#F55013; }

/* підкреслення */
.gm-logo__underline{
  position: absolute;
  left: 50%;
  bottom: 0;

  transform: translateX(-50%);

  width: 100%;
  height: clamp(3px, 0.5vw, 4px);
  background: #F55013;
}

/* підзаголовок */
.gm-logo__sub{
  position: relative;
  z-index: 6;               /* ще раз підстрахуємось */
  margin-top: clamp(10px, 2.2vw, 18px);

  color: #fff;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  line-height: 1.1;

  font-size: clamp(14px, 3.2vw, 44px);
  opacity: 1;               /* щоб точно не був "невидимий" */
}

/* ===== MOBILE OPTIMIZATION ===== */
@media (max-width: 520px){
  .gm-logo{
    padding-top: 200px;
    max-width: 95%;
    font-size: 10px;
  }

  .gm-logo__top{
    gap: 18px;
    padding-bottom: 10px;
  }

  .gm-logo__underline{
    width: 92%;            /* щоб лінія не вилазила за краї */
  }

  .gm-logo__sub{
    letter-spacing: 0.06em;
  }
  .gm-logo__word{
    font-size: 25px;
  }
}

/* ===== VERY SMALL PHONES ===== */
@media (max-width: 360px){
  .gm-logo__word{
    font-size: 20px;
  }
  .gm-logo__sub{
    font-size: 12px;
  }
}



@media (max-width: 440px) {
  .review-left {
    top: 184rem;
    left: 52rem;
  }
}




/* ===== Reviews isolated block (rx- prefix) ===== */
.rx-reviews{
  position:relative;
  overflow:hidden;
  padding: clamp(32px, 4vw, 72px) 0;
}

.rx-reviews__bg{
  position:absolute;
  inset:0;
  background: url("./img/Reviews.png") center/cover no-repeat;
  z-index:0;
}

@media (max-width:1200px){ .rx-reviews__bg{ background-image:url("./img/laptop-reviews.png"); } }
@media (max-width:900px){  .rx-reviews__bg{ background-image:url("./img/tablet-reviews.png"); } }
@media (max-width:600px){  .rx-reviews__bg{ background-image:url("./img/phone-reviews.png"); } }

.rx-reviews__inner{
  position:relative;
  z-index:1;
  width:min(1200px, calc(100% - 32px));
  margin:0 auto;
}

.rx-reviews__title{
  margin:0 0 24px;
  text-align:center;

  font-family:"Benzin", system-ui, sans-serif;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;

  color:#ff6a00;
  font-size:clamp(24px, 3vw, 42px);
}

.rx-reviews__slider{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:16px;
  position:relative;
}

.rx-reviews__swiper{
  width:100%;
  height:420px;
  overflow:hidden; /* чтобы не было “призрачных” слайдов */
}

@media (max-width:900px){ .rx-reviews__swiper{ height:320px; } }
@media (max-width:600px){ .rx-reviews__swiper{ height:240px; } }

.rx-reviews__swiper .swiper-slide{
  width:100% !important;
  height:100%;
  display:flex;
  justify-content:center;
  align-items:center;
}

/* card занимает всю высоту свайпера */
.rx-reviews__card{
  width:100%;
  height:100%;
  border-radius:24px;
  overflow:hidden;

  background: rgba(0,0,0,.15);

  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
}

.rx-reviews__card img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  display:block;
}

/* arrows */
.rx-reviews__nav{
  width:56px;
  height:56px;
  background: rgba(0,0,0,.35);
  border: none !important;

  display:grid;
  place-items:center;
  cursor:pointer;
  user-select:none;
  transition: transform .15s ease, background .15s ease, opacity .15s ease;
}

.rx-reviews__nav img{
  width:70%;
  height:70%;
}

.rx-reviews__nav:hover{ transform:scale(1.05); background:rgba(0,0,0,.5); }
.rx-reviews__nav:active{ transform:scale(.98); }
.rx-reviews__nav.swiper-button-disabled{ opacity:.35; cursor:default; }

/* ===== Mobile: arrows снизу внутри блока ===== */
@media (max-width:700px){
  .rx-reviews{ padding:28px 0 18px; }
  .rx-reviews__inner{ width:calc(100% - 20px); }
  .rx-reviews__title{ margin:0 0 16px; font-size:28px; }

  .rx-reviews__slider{
    grid-template-columns:1fr;
  }

  .rx-reviews__nav{
    position:absolute;
    bottom:-10px;
    width:44px;
    height:44px;
    z-index:5;
  }
  .rx-reviews__nav--prev{ left:12px; }
  .rx-reviews__nav--next{ right:12px; }
}
