/* Обнуление */
*,
*::before,
*::after {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

a {
  text-decoration: none;
}



img {
  vertical-align: top;
  -webkit-user-drag: none;
  -moz-user-drag: none;
  user-drag: none;
}

/* Типографика */
h1, h2, h3, h4, h5, h6 {
  font-weight: inherit;
  font-size: inherit;
}

h2 {
  font-family: 'Dela Gothic One', sans-serif;
  font-size: 74px;
  margin-bottom: 20px;
  text-transform: uppercase;
}


p {
  font-size: 20px;
  line-height: 150%; /* примерно 30px */
  font-weight: 300;
}



/* Глобальные стили */
body {
  background-color: #000;
  color: #fff;
  margin: 0;
  font-family: 'Montserrat', sans-serif;
  overflow-x: hidden;
}


html {
  overflow-x: hidden;
}


/* Фон вверху */
.top-background {
  position: absolute;
  top: -400px;
  left: 500px;
  width: 100vw;
  height: 1500px;
  background-image: url('/img/1/background.svg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
  z-index: -1;
  pointer-events: none;
}


.top-background2 {
  position: absolute;
  top: 2050px;
  right: 0;
  width: 837px;
  height: 335px;
  background-image: url('/img/3/bp.webp');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
  z-index: 1;
  pointer-events: none;
}


.top-background3 {
  position: absolute;
  top: 4519px;
  width: 100vw;
  height: 115%;
  background-image: url('/img/5/ellipse.svg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
  z-index: -1;
  pointer-events: none;
}



/* Контейнер */
.container {
  max-width: 1746px;
  margin: 0 auto;
  padding: 40px 0px;
}

/* Сетка для hero */
.hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas:
    "logo parallax"
    "text parallax"
    "button parallax";
  align-items: center;
  gap: 20px;
}



.hero2{

}





/* Элементы hero */
.hero-item {
  /* Общие настройки, при мобильном варианте порядок будет естественным */
}

.logo-container {
  grid-area: logo;
  display: flex;
  align-items: center;
}

.logo {
  max-width: 100%;
  height: auto;
}

.parallax-container-wrapper {
  grid-area: parallax;
}

.parallax-container {
  position: relative;
  width: 100%;
  height: 500px; /* можно корректировать под контент */
  perspective: 1000px;
}

.parallax-layer {
  position: absolute;
  top: 70%;
  left: 50%;
  transform: translate(-50%, -50%);
  will-change: transform;
  max-width: 100%;
  height: auto;
  pointer-events: none;
  transition: transform 0.9s ease-out;
}






.text-container {
  grid-area: text;
}

.main-title {
  margin-top: 130px;
  margin-bottom: 28px;
  font-size: 96px;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-family: 'Dela Gothic One', sans-serif;
}

.main-title .indent {
  display: inline-block;
  margin-left: 83px;
}

.main-title .indent2 {
  color: #DBFF00;
}

.description {
  max-width: 70%;
  font-size: 20px;
  line-height: 1.6;
  margin-bottom: 0;
}
.text-with-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 40px;
  gap: 20px;
  flex-wrap: wrap; /* Чтобы на мобилках всё красиво складывалось */
}

.text-with-button p {
  font-size: 20px;
  line-height: 1.6;
  margin: 0;

}

.start-button {
  padding: 14px 32px;
  border: 1px solid #DBFF00;
  background-color: transparent;
  color: #DBFF00;
  text-decoration: none;
  font-weight: 500;
  font-size: 20px;
  border-radius: 23px;
  transition: all 0.3s ease;
  font-family: 'Montserrat', sans-serif;
  text-align: center;
  min-width: 290px;
}

.start-button:hover {
  background-color: #DBFF00;
  color: #000;
}




.arrow-block {
  position: relative;
  width: 100%;
  max-width: 1746px;
  margin: 100px auto;
  border-radius: 75px;
  background: rgba(180, 180, 180, 0.14);
  padding: 90px 60px 90px 530px;
  overflow: visible;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  z-index: 0; /* важно для псевдоэлемента */
}

.arrow-block::before {
  content: '';
  position: absolute;
  inset: 0;
  padding: 1px; /* толщина градиентной рамки */
  border-radius: 75px;
  background: linear-gradient(210deg, rgba(255, 255, 255, 0.671), rgba(255, 255, 255, 0));
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
  z-index: 1;
}



.arrow-content {
  position: relative; /* При необходимости можно задавать стили текста */
  z-index: 1;
}

.arrow-img {
  position: absolute; /* Абсолютное позиционирование относительно .arrow-block */
  top: -20px;  /* Отступ сверху – подберите значение под дизайн */
  left: -20px; /* Отступ слева */
  width: 578px; /* Размер изображения – подберите нужное значение */
  z-index: 2; /* Чтобы изображение было поверх подложки */
}












.cards-section {
  padding: 80px 0;
  background-color: #000;
  color: #fff;
}

.cards-container {
  display: flex;
  gap: 40px;
  justify-content: space-between;
  flex-wrap: wrap;

}







.card1 {
  flex: 1;
  min-width: 280px;
  background-color: #111;
  border-radius: 75px;
  background: linear-gradient(44deg, rgba(45, 45, 45, 0.50) 4.35%, rgba(49, 53, 27, 0.50) 50.88%, rgba(31, 31, 31, 0.50) 92.14%);
  transition: transform 0.3s ease;
}

.card1:hover {
  background: linear-gradient(44deg, rgba(45, 45, 45, 0.50) 4.35%, rgba(65, 69, 39, 0.50) 50.88%, rgba(44, 46, 29, 0.50) 92.14%);
  
}

.card1 h3 {
  font-size: 40px;
  margin-bottom: 16px;
  font-family: 'Montserrat', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  color: #DBFF00;
  padding: 40px 40px 10px 40px;
}

.card1 p {
  font-size: 20px;
  line-height: 1.6;
  font-family: 'Montserrat', sans-serif;
  padding: 0px 40px 20px 40px;
}


.card1-image {
  width: 100%;
  height: auto;
  margin-top: 20px;
  border-radius: 75px;
  object-fit: cover;
  padding: 0px 40px 40px 40px;
}



.timer-content{
  padding-left: 120px;
}


.timer-clock{
  top: -200px;
  left: 1100px;
}


.clock-row {
  display: flex;
  align-items: flex-end;
  gap: 20px;
  margin-top: 20px;
}

.clock-item {
  text-align: left;

}

.clock-number {
  color: #C9E714;

  font-family: "Dela Gothic One";
  font-size: 128px;
  font-style: normal;
  font-weight: 400;
  line-height: 120%; /* 153.6px */
  text-transform: uppercase;

}

.clock-label {
  font-size: 40px;
  color: #fff;
  margin-top: 8px;
  text-transform: lowercase;
}

.clock-separator {
  font-size: 80px;
  color: #DBFF00;
  margin-bottom: 77px;
}


.timeline {
  width: 100%;
  padding: 40px 0 40px 0;
}












.card {
  flex: 1;
  min-width: 280px;
  background-color: #111;
  border-radius: 75px;
  background: linear-gradient(44deg, rgba(45, 45, 45, 0.50) 4.35%, rgba(49, 53, 27, 0.50) 50.88%, rgba(31, 31, 31, 0.50) 92.14%);
  transition: transform 0.3s ease;
}

.card:hover {
  background: linear-gradient(44deg, rgba(45, 45, 45, 0.50) 4.35%, rgba(65, 69, 39, 0.50) 50.88%, rgba(44, 46, 29, 0.50) 92.14%);
  
}

.card h3 {
  font-size: 40px;
  margin-bottom: 16px;
  font-family: 'Montserrat', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  color: #DBFF00;
  padding: 40px 40px 10px 40px;
}

.card p {
  font-size: 20px;
  line-height: 1.6;
  font-family: 'Montserrat', sans-serif;
  padding: 40px 40px 60px 40px;
}



.card-image {
  width: 100%;
  height: auto;
  margin-top: 20px;
  border-radius: 75px;
  object-fit: cover;
  z-index: 10;
}










/* CSS */
.portfolio-section {
  position: relative;
  background-color: #000;
  color: #fff;
  overflow: hidden;
  margin-bottom: 60px;

}

.portfolio-title {
  text-align: left;
  font-family: 'Dela Gothic One', sans-serif;
  text-transform: uppercase;
  margin-bottom: 60px;
  line-height: 1.2;
}

.portfolio-title span {
  color: #DBFF00;
}

.portfolio-slider-wrapper {
  overflow: hidden;
  width: 100%;

}

.portfolio-slider {
  overflow: hidden;
  cursor: grab;

}

.portfolio-slider.grabbing {
  cursor: grabbing;
  
}

.portfolio-track {
  display: flex;
  transition: transform 0.5s ease;
}

.portfolio-slide {
  flex: 0 0 50%;
  box-sizing: border-box;
  padding: 0 20px;

}

.portfolio-slide img {
  width: 100%;
  border-radius: 75px;

}

/* Стрелки */
.slider-btn {
  position: absolute;
  top: 60%;
  transform: translateY(-50%);
  width: 60px;
  height: 60px;
  background-image: url('/img/3/arrow.svg');
  background-repeat: no-repeat;
  background-size: contain;
  background-color: transparent;
  border: none;
  cursor: pointer;
  z-index: 10;
  transition: background-image 0.3s ease;
}

.slider-btn:hover {
  background-image: url('/img/3/arrow-hover.svg');
}

.slider-btn.prev {
  left: 20px;
  transform: translateY(-50%) rotate(180deg);
}

.slider-btn.next {
  right: 20px;
  transform: translateY(-50%);
}

.slider-btn.disabled {
  opacity: 0.5;
  pointer-events: none;
}





.card-image {
  position: relative;
  overflow: hidden;
    z-index: 10;
}

/* Оба изображения занимают всю ширину контейнера */
.card-image img {
  display: block;
  width: 100%;
}

/* Основное изображение остаётся на заднем плане */
.card-image .main-image {
  position: relative;
  transition: opacity 0.5s ease;
}

/* Превью изначально располагается ниже видимой области */
.card-image .preview-image {
  position: absolute;
  top: 0%;
  left: 0;
  width: 100%;
  transition: transform 10s linear;
}

/* При наведении на контейнер карточки:
   - Превью сдвигается вверх, чтобы полностью занять область карточки.
   - Основное изображение постепенно исчезает (опционально) */
.card-image:hover .preview-image {
  transform: translateY(-1200px);
}

.card-image:hover .main-image {
  opacity: 0;
}









.marquee {
  overflow: hidden;
  position: relative;
  width: 100%;
}

.marquee__inner {
  display: flex;
  /* Дублированное изображение, чтобы бегущая строка была непрерывной */
  animation: marquee 40s linear infinite;
}

.marquee__inner img {
  /* Если нужно, можно задать высоту или адаптивность */
  max-width: none;
  height: 240px;
}

@keyframes marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-5070px);
  }
}


.portfolio-slider-wrapper{
  margin-bottom: 40px;

}


.link {
  font-size: 20px;
  text-decoration: none;
  color:#DBFF00;
  font-weight: 300;
  margin-left: 20px;
  /* Чтобы псевдоэлемент располагался корректно по вертикали, можно добавить line-height */
  line-height: 1.2;
}

.link::after {
  content: "";
  display: inline-block;
  width: 20px;   /* Подберите нужную ширину иконки */
  height: 20px;  /* Подберите нужную высоту иконки */
  background: url('/img/3/link.svg') no-repeat center center;
  background-size: contain;
  margin-left: 20px;  /* Отступ между текстом и иконкой */
margin-bottom: 7px;
  vertical-align: middle;  /* Выравнивание по центру относительно текста */
}




@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.pac-title::after {
  content: "";
  display: inline-block;
  width: 77px;
  height: 77px;
  background: url('/img/5/Star2.svg') no-repeat center center;
  background-size: contain;
  margin-left: 14px;
  margin-bottom: 15px;
  vertical-align: middle;
  animation: rotate 6s linear infinite; /* вращение: 3 секунды, линейно, бесконечно */
}













.paket-wrapper {
  display: flex;
  gap: 60px;
  justify-content: center;
  padding: 0 80px;
  padding-bottom: 90px;
}

.paket {
  background: linear-gradient(44deg, rgba(45, 45, 45, 0.50) 4.35%, rgba(49, 53, 27, 0.50) 50.88%, rgba(31, 31, 31, 0.50) 92.14%);
  border: 1px solid;
  padding: 60px;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-radius: 75px;
}

.paket:hover {
  background: linear-gradient(44deg, rgba(45, 45, 45, 0.50) 4.35%, rgba(92, 92, 92, 0.50) 50.88%, rgba(31, 31, 31, 0.50) 92.14%);
  box-shadow: 0px 4px 214px 0px rgba(161, 0, 255, 0.42);


}




.paket h3 {
  margin-top: 0;
  font-size: 20px;
  text-transform: uppercase;
  font-size: 40px;

}


.paket-yellow h3 {
color: #C9E714;
}

.paket-cyan h3 {
  color: #03FBD2;
  }

  .paket-white h3 {
    color: #ffffff;
    }




.paket ul {
  padding-left: 20px;
  margin-top: 10px;
  margin-bottom: 40px;
  font-weight: 300;
  margin-top: 30px;
}

.paket ul li {
  margin-bottom: 6px;
  font-size: 20px;
  margin-bottom: 20px;
}

.paket-price-block {
  margin-top: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.paket-price {
  font-size: 20px;
  font-weight: 300;

}

.paket-button {
  padding: 8px 16px;
  border: none;
  cursor: pointer;
  font-weight: bold;
}

.paket-button:hover {
  background-color: #C9E714!important;
  color: #000;
}


.paket-yellow {
  border-color: #DAFB03;
}

.paket-button {
  border-radius: 23px;
  padding: 18px 32px;
  font-size: 20px;
  font-family: 'Montserrat', sans-serif;
}


.paket-yellow .paket-button {
  background-color: #DAFB03;
  color: #000;
}

.paket-cyan {
  border-color: #03FBD2;
}

.paket-cyan .paket-button {
  background-color: #03FBD2;
  color: #000;
}

.paket-white {
  border-color: #FFFFFF;
}

.paket-white .paket-button {
  background-color: #FFFFFF;
  color: #000;
}


.old-price {
  font-size:30px;
  color: #62506C;
margin-bottom: 30px;
}





.footer-line {
  border-top: 1px solid #fff; /* белая линия сверху */
  margin: 0 80px 20px 80px;
}

.footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: auto 80px;
  padding: 20px 0; /* немного отступов сверху и снизу */
}

.footer img {
  margin-top: -12px;
}

.ft-link {
  color: #fff;
  font-family: 'Montserrat', sans-serif;
  font-weight: 300;
  font-size: 16px;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 8px; /* расстояние между иконкой и текстом */
}

.mail-icon {
  width: 52px;
  height: 52px;
  padding-top: 10px;
}




.police {
font-size: 40px;
margin-top: 60px;
margin-bottom: 30px;
text-transform: uppercase;
}

.police-text{
text-align: left!important;
}








    /* Стили для модального окна */
    .modal {
      display: none; /* Скрыто по умолчанию */
      position: fixed;
      z-index: 100;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      overflow: auto;
      background-color: rgba(0,0,0,0.9);
    }
    .modal-content {
      background: linear-gradient(328deg, #371B3F 2.12%, #161616 41.93%, #1E0F22 88.36%);
      margin: 10% auto;
      padding: 20px 40px 60px 40px;
      border-radius:75px;
      border: 1px solid #888;
      width: 90%;
      max-width: 800px;
      position: relative;
    }


    .close {
      position: absolute;
      right: -10px;
      top: -10px;
      font-size: 32px;
      font-weight: 200;
      cursor: pointer;
    }
    .contact-options label {
      margin-right: 20px;
    }
    input[type="text"],
    input[type="tel"],
    textarea {
      width: 100%;
      margin: 10px 0;
      box-sizing: border-box;
    }

    input[type="text"],
    input[type="tel"]{
      background-color: #361B3E;
      border: 1px solid #643971;
      font-size: 16px;
      border-radius: 23px;
      padding: 20px;
      height: 50px;
      color: #FFFFFF;
    }

    input[type="checkbox"]{
      margin-bottom: -4px;
    }


    textarea {
      resize: vertical;    
      background-color: #361B3E;
      border: 1px solid #643971;
      font-size: 16px;
      border-radius: 23px;
      padding: 20px;
      color: #FFFFFF;
      font-family: 'Montserrat', sans-serif;
    }


    label a {
    color: #FFFFFF;
    text-decoration: underline;
    }


 
    .pop-btn{
      width: 100%;
      margin-top: 50px;
    }



    input[type="checkbox"] {
      -webkit-appearance: none;
      appearance: none;
      width: 20px;
      height: 20px;
      border: 2px solid #ccc;
      border-radius: 3px;
      outline: none;
      cursor: pointer;
      position: relative;
      margin-right: 8px;
    }
    
    /* Оформление для отмеченного чекбокса */
    input[type="checkbox"]:checked {
      border-color: #DAFB03;
      background-color: #ffffff00; /* фон можно оставить белым или задать другой */
    }
    
    /* Зеленая галочка */
    input[type="checkbox"]:checked::after {
      content: '';
      position: absolute;
      left: 6px;
      top: 2px;
      width: 5px;
      height: 10px;
      border: solid #DAFB03;
      border-width: 0 2px 2px 0;
      transform: rotate(45deg);
    }


    .how-p {
    margin-bottom: 10px;
    margin-top: 20px;
    }

    .phone-pole {
    margin-top: 20px!important;
    }



    .thank {
      min-height: 740px;
    }



























@media (max-width: 1919px) {
.all{
  margin: auto 40px;
}

.slider-btn.prev {
  left: 0px;
}

.slider-btn.next {
  right: 0px;
}

.card1 h3{
font-size: 28px;
}



.arrow-block{
margin-bottom: 0;}


}


@media (max-width: 1600px) {

  h2{
    font-size: 40px;
    }

  .main-title{
    font-size: 64px;
  }


  .timer-clock {
  left: 970px;
  }


  .paket-wrapper {
    gap: 20px;

    }
  

    .paket h3 {
    font-size: 24px;
    }

    .old-price {
      font-size: 20px;
    }

    .paket-price {
    margin-bottom: 0;}


.top-background3 {
  top: 3950px;
}


.card-image:hover .preview-image {
  transform: translateY(-940px);
}


.top-background2 {
top: 1820px;
   }
 

    

}




/* Мобильные стили */
@media (max-width: 768px) {
  .hero {
    grid-template-columns: 1fr;
    grid-template-areas:
      "logo"
      "parallax"
      "text"
      "button";
  }

  .all{
    margin: auto 0px;
  }


  .top-background2 {
 display: none;
  }


  .container{
  padding-left: 20px;
  padding-right: 20px;

}
  
  .main-title {
    font-size: 36px;
    margin-top: 20px;
    margin-bottom: 20px;
  }
  
  .description {
    font-size: 14px;
    max-width: 100%;
  }
  
  .start-button {
    min-width: auto;
    padding: 10px 20px;
    font-size: 14px;
  }
  
  /* При необходимости можно изменить высоту блока с параллаксом */
  .parallax-container {
    height: 700px;
  }


  .top-background {
    top: -400px;
    left: 0;
    width: 100vw;
    height: 1500px;
    background-image: url('/img/1/background.svg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top;
    z-index: -1;
    pointer-events: none;
  }

  .text-with-button{
  margin-top: 0;}

  .text-with-button p{
  font-size: 14px;}

  .main-title .indent{
  margin-left: 0;}


  .parallax-container {
    top: -50px;
  }

  .start-button {
    width: 100%;
  }


h2{
font-size: 24px;}

p {
  font-size: 14px;
}



.arrow-block {
  position: relative;
  width: 90%;         /* или фиксированное значение, например: width: 800px; */
  max-width: 1746px;
  margin: 40px 20px;      /* автоматически задаёт отступы, чтобы блок оказался по центру */
  border-radius: 23px;
background: rgba(180, 180, 180, 0.14);
padding: 30px 20px 30px 20px;
  overflow: visible;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px); /* Safari */
}

  
  .arrow-img {
    position: absolute; /* Абсолютное позиционирование относительно .arrow-block */
    top: -10px;  /* Отступ сверху – подберите значение под дизайн */
    left: 250px; /* Отступ слева */
    width: 145px; /* Размер изображения – подберите нужное значение */
    z-index: 2; /* Чтобы изображение было поверх подложки */
  }
  




  .card1 h3 {
    font-size: 16px;
  }



.card1:hover {
  background: none;
  
}





  .cards-section {
    padding: 20px 0;
  }
  
  .cards-container {
    gap: 50px;
  }
  
  .card1 {
    flex: 1;
    max-width: 100%;
    padding: 0px;
    border-radius: 75px;
    border: none;
    background: none;
  }

  .card1 p {
  font-size: 14px;
  }
  


  .card1 h3 {
    padding: 20px 20px 0px 0px;
  }
  
  .card1 p {
    padding: 0px 20px 0px 0px;
  }
  
  .card1-image {
  padding:0 ;}





  .card {
    border-radius: 23px;
  }

  .card-image, .portfolio-slide img {
   border-radius: 23px;
   z-index: 10;
}

.portfolio-slide{
padding-left: 0;}

.slider-btn{
display: none;}


.card p {
font-size: 14px;
padding: 20px 16px 30px 16px;
}

.portfolio-title{
  margin-bottom: 10px;
}




.portfolio-track {
  touch-action: pan-y;
}


.portfolio-section {
  margin-bottom: 0px;
}








.marquee__inner {
  display: flex;
  /* Дублированное изображение, чтобы бегущая строка была непрерывной */
  animation: marquee 80s linear infinite;
}

.marquee__inner img {
  /* Если нужно, можно задать высоту или адаптивность */
  max-width: none;
  height: 100px;
}








.link {
  font-size: 14px;
  margin-left: 0px;
}

.link::after {
  width: 16px;   /* Подберите нужную ширину иконки */
  height: 16px;  /* Подберите нужную высоту иконки */
  margin-left: 16px;  /* Отступ между текстом и иконкой */
margin-bottom: 7px;

}

.container-logo {
padding-bottom: 20px;
}


.arrow-block {
margin-bottom: 0;}

.arrow-block::before {

  border-radius: 23px;
}



.clock-number{
font-size: 24px;
}
.clock-separator {
  font-size: 24px;
  margin-bottom: 24px;
}

.clock-label{
font-size: 12px;
}

.timeline {
width: 100%;
padding-bottom: 10px;
padding-top: 20px;
}

.timer-clock{
  top: -50px;
  left: 210px;
}









.pac-title::after{
  content: "";
  display: inline-block;
  width: 24px;   /* Подберите нужную ширину иконки */
  height: 24px;  /* Подберите нужную высоту иконки */
  background: url('/img/5/Star2.svg') no-repeat center center;
  background-size: contain;
  margin-left: 4px;  /* Отступ между текстом и иконкой */
margin-bottom: 6px;
  vertical-align: middle;  /* Выравнивание по центру относительно текста */
}















.paket-wrapper {
  display: block;
  gap: 60px;
  justify-content: center;
  padding: 0 20px;
  padding-bottom: 0;
  margin-bottom: 20px;
}







.paket {
border-radius: 23px;
padding: 20px;
margin-bottom: 20px;
}

.paket h3 {
font-size: 20px;
margin-bottom: 0;
}

.paket ul{
margin-bottom: 0;
margin-top: 20px;
}

.paket ul li{
font-size: 12px;
}

.paket-wrapper {
gap: 20px;
margin-bottom: 40px;
}

.paket-price{
font-size: 12px;
margin-bottom: 0;
}

.paket-price-block{
  margin-top: 10px;
  margin-bottom: 0px;
}


.paket-button{
font-size: 14px;
padding: 12px 30px;
}






.top-background3 {
  position: absolute;
  top: 2970px;
  width: 100vw;
  height: 100%;
  background-image: url('/img/5/ellipse.svg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
  z-index: -1;
  pointer-events: none;
}



.old-price {
  font-size:14px;
  color: #84718f;
margin-bottom: 30px;
}










.footer-line {
  border-top: 1px solid #fff; /* белая линия сверху */
  margin: 0 20px 20px 20px;
}

.footer {
  display: block;
  justify-content: space-between;
  align-items: center;
  margin: auto 20px;
  padding: 20px 0; /* немного отступов сверху и снизу */
}

.ft-logo {
  margin-top: -12px;
  width: 60%;
}

.footer a {
  margin-top: 16px;
  margin-bottom: 16px;
}

.ft-link {
  color: #b8b8b8;
  font-family: 'Montserrat', sans-serif;
  font-weight: 300;
  font-size: 12px;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 6px; /* расстояние между иконкой и текстом */
}

.mail-icon {
  width: 32px;
  height: 42px;
  padding-top: 10px;
}







.police {
  font-size: 24px;
  margin-top: 60px;
  margin-bottom: 30px;
  }









  .modal-content {
  padding: 20px;
  border-radius: 23px;
}

  .police {
    margin-top:20px;
  }

  .close{
    top: 5px;
    right: 10px;
  }

  .contact-options label{
    font-size: 12px;
  }

  input[type="text"], input[type="tel"] {
  font-size: 16px;
  }


  input[type="checkbox"] {
    margin-right: 4px;
  }


  label a {
font-size: 12px;
    }

    .police-ok {
      font-size: 12px;
    }




    .contact-options label {
      display: block;
      margin-bottom: 10px;}


      .paket-button{
        margin-top: 20px;
        margin-bottom: 10px;
        background-color: #fff;
        color: #000;
      }






      .card-image:hover .preview-image {
        transform: translateY(-410px);
      }


}















@media (max-width: 440px) {

  .parallax-container-wrapper{
  min-height: 350px;}

  .parallax-container {
    top: -20px;
    height: 300px;
  }


}