* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
@font-face {
  font-family: "5ka Sans Design";
  src: url("5kaSansDesign-Regular.eot");
  src: local("5ka Sans Design Regular"), local("5kaSansDesign-Regular"),
    url("5kaSansDesign-Regular.eot?#iefix") format("embedded-opentype"),
    url("5kaSansDesign-Regular.woff2") format("woff2"),
    url("5kaSansDesign-Regular.woff") format("woff"),
    url("5kaSansDesign-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "5ka Sans Design";
  src: url("5kaSansDesign-Thin.eot");
  src: local("5ka Sans Design Thin"), local("5kaSansDesign-Thin"),
    url("5kaSansDesign-Thin.eot?#iefix") format("embedded-opentype"),
    url("5kaSansDesign-Thin.woff2") format("woff2"),
    url("5kaSansDesign-Thin.woff") format("woff"),
    url("5kaSansDesign-Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "5ka Sans Design Cond";
  src: url("5kaSansDesign-Condensed.eot");
  src: local("5ka Sans Design Condensed Regular"),
    local("5kaSansDesign-Condensed"),
    url("5kaSansDesign-Condensed.eot?#iefix") format("embedded-opentype"),
    url("5kaSansDesign-Condensed.woff2") format("woff2"),
    url("5kaSansDesign-Condensed.woff") format("woff"),
    url("5kaSansDesign-Condensed.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "5ka Sans Design";
  src: url("5kaSansDesign-Black.eot");
  src: local("5ka Sans Design Black"), local("5kaSansDesign-Black"),
    url("5kaSansDesign-Black.eot?#iefix") format("embedded-opentype"),
    url("5kaSansDesign-Black.woff2") format("woff2"),
    url("5kaSansDesign-Black.woff") format("woff"),
    url("5kaSansDesign-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "5ka Sans Design Cond";
  src: url("5kaSansDesign-CondensedBold.eot");
  src: local("5ka Sans Design Condensed Bold"),
    local("5kaSansDesign-CondensedBold"),
    url("5kaSansDesign-CondensedBold.eot?#iefix") format("embedded-opentype"),
    url("5kaSansDesign-CondensedBold.woff2") format("woff2"),
    url("5kaSansDesign-CondensedBold.woff") format("woff"),
    url("5kaSansDesign-CondensedBold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "5ka Sans Design Ultra";
  src: url("5kaSansDesign-Ultra.eot");
  src: local("5ka Sans Design Ultra"), local("5kaSansDesign-Ultra"),
    url("5kaSansDesign-Ultra.eot?#iefix") format("embedded-opentype"),
    url("5kaSansDesign-Ultra.woff2") format("woff2"),
    url("5kaSansDesign-Ultra.woff") format("woff"),
    url("5kaSansDesign-Ultra.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "5ka Sans Design";
  src: url("5kaSansDesign-SemiBold.eot");
  src: local("5ka Sans Design SemiBold"), local("5kaSansDesign-SemiBold"),
    url("5kaSansDesign-SemiBold.eot?#iefix") format("embedded-opentype"),
    url("5kaSansDesign-SemiBold.woff2") format("woff2"),
    url("5kaSansDesign-SemiBold.woff") format("woff"),
    url("5kaSansDesign-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "5ka Sans Design";
  src: url("5kaSansDesign-Light.eot");
  src: local("5ka Sans Design Light"), local("5kaSansDesign-Light"),
    url("5kaSansDesign-Light.eot?#iefix") format("embedded-opentype"),
    url("5kaSansDesign-Light.woff2") format("woff2"),
    url("5kaSansDesign-Light.woff") format("woff"),
    url("5kaSansDesign-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "5ka Sans Design Comp";
  src: url("5kaSansDesign-Compressed.eot");
  src: local("5ka Sans Design Compressed Regular"),
    local("5kaSansDesign-Compressed"),
    url("5kaSansDesign-Compressed.eot?#iefix") format("embedded-opentype"),
    url("5kaSansDesign-Compressed.woff2") format("woff2"),
    url("5kaSansDesign-Compressed.woff") format("woff"),
    url("5kaSansDesign-Compressed.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

.font-5ka {
  font-family: "5ka Sans Design";
}

@layer base {
  body {
    font-family: "5ka Sans Design";
  }
}

body {
  cursor: url("./images/Cursor/Vector.png"), auto;
  overflow-x: hidden;
  text-decoration: none;
  width: 100%;
  max-width: 100%;
}

/* .w-\[100vw\] {
    width: 100% !important;
} */

a {
  text-decoration: none !important;
}

/* Общие стили для модалок */

/* Улучшение отображения на мобильных */
@media (max-width: 768px) {
  .modal-dialog {
    margin: 10px auto;
    max-width: 95%;
  }

  .modal-body {
    padding: 15px;
  }

  .btn-close {
    top: 10px !important;
    right: 10px !important;
  }
}

/* Кастомный скроллбар для модалок */
.modal-body::-webkit-scrollbar {
  width: 5px;
}

.modal-body::-webkit-scrollbar-thumb {
  background-color: #169b48;
  border-radius: 5px;
}

/* Конечный класс для девочки в акция */

.girl-image {
  transform: translateX(-100%);
  transition: all 0.7s ease; /* на всякий случай, если Tailwind не подхватил */
}

.girl-image.visible {
  transform: translateX(0);
  opacity: 1;
}

/* Контейнер для позиционирования абсолютных элементов */

/* Анимации для листиков в Видео мобилка */
@keyframes fadeInLeft {
  0% {
    opacity: 0;
    transform: translateX(-150%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    transform: translateX(150%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

.fade-on-scroll {
  opacity: 0;
}

.animate-fade-in-left {
  animation: fadeInLeft 1.2s ease-out forwards;
}

.animate-fade-in-right {
  animation: fadeInRight 1.2s ease-out forwards;
}

@keyframes skateAlive {
  0%,
  100% {
    transform: translateX(15px) translateY(0px) rotate(0deg) scale(1);
  }
  20% {
    transform: translateX(17px) translateY(-3px) rotate(-1.5deg) scale(1.02);
  }
  40% {
    transform: translateX(19px) translateY(1px) rotate(1.5deg) scale(1);
  }
  60% {
    transform: translateX(17px) translateY(-2px) rotate(-1deg) scale(1.01);
  }
  80% {
    transform: translateX(15px) translateY(0px) rotate(0.5deg) scale(1);
  }
}

.animate-skateAlive {
  scale: 0.9;
  animation: skateAlive 4s ease-in-out infinite;
}

@keyframes leafSway {
  0%,
  100% {
    transform: rotate(0deg) translateY(0px);
  }
  20% {
    transform: rotate(6deg) translateY(-4px);
  }
  40% {
    transform: rotate(-5deg) translateY(3px);
  }
  60% {
    transform: rotate(4deg) translateY(-3px);
  }
  80% {
    transform: rotate(-3deg) translateY(2px);
  }
}

.leaf-wind {
  animation: leafSway 2.5s ease-in-out infinite;
}

@keyframes leafSway1 {
  0%,
  100% {
    transform: rotate(0deg) translateY(0);
  }
  25% {
    transform: rotate(4deg) translateY(-3px);
  }
  50% {
    transform: rotate(-4deg) translateY(2px);
  }
  75% {
    transform: rotate(3deg) translateY(-2px);
  }
}

@keyframes leafSway2 {
  0%,
  100% {
    transform: rotate(0deg) translateY(0);
  }
  20% {
    transform: rotate(6deg) translateY(-4px);
  }
  50% {
    transform: rotate(-5deg) translateY(3px);
  }
  80% {
    transform: rotate(4deg) translateY(-2px);
  }
}

@keyframes leafSway3 {
  0%,
  100% {
    transform: rotate(0deg) translateY(0);
  }
  30% {
    transform: rotate(3deg) translateY(-2px);
  }
  60% {
    transform: rotate(-3deg) translateY(1px);
  }
  90% {
    transform: rotate(2deg) translateY(-1px);
  }
}

@keyframes leafSway4 {
  0%,
  100% {
    transform: rotate(0deg) translateY(0);
  }
  15% {
    transform: rotate(5deg) translateY(-4px);
  }
  45% {
    transform: rotate(-4deg) translateY(3px);
  }
  75% {
    transform: rotate(3deg) translateY(-2px);
  }
}

/* Классы с разными анимациями */
.leaf-wind-1 {
  animation: leafSway1 2.7s ease-in-out infinite;
}
.leaf-wind-2 {
  animation: leafSway2 3.1s ease-in-out infinite;
}
.leaf-wind-3 {
  animation: leafSway3 2.3s ease-in-out infinite;
}
.leaf-wind-4 {
  animation: leafSway4 3.5s ease-in-out infinite;
}

@keyframes wind-sway {
  0% {
    transform: translateX(0) rotate(0deg);
  }
  25% {
    transform: translateX(-2px) rotate(-2deg);
  }
  50% {
    transform: translateX(2px) rotate(2deg);
  }
  75% {
    transform: translateX(-1px) rotate(-0.5deg);
  }
  100% {
    transform: translateX(0) rotate(0deg);
  }
}

.wind-animation {
  animation: wind-sway 2s ease-in-out infinite;
}

@keyframes flower-wind {
  0% {
    transform: rotate(0deg) translateX(0);
  }
  25% {
    transform: rotate(2deg) translateX(1px);
  }
  50% {
    transform: rotate(0deg) translateX(0);
  }
  75% {
    transform: rotate(-2deg) translateX(-1px);
  }
  100% {
    transform: rotate(0deg) translateX(0);
  }
}

.wind-motion {
  animation: flower-wind 3.5s ease-in-out infinite;
  transform-origin: right center;
}

@keyframes windLeaves {
  0% {
    transform: rotate(0deg) translate(0px, 0px);
  }
  20% {
    transform: rotate(1.5deg) translate(0px, -5px);
  }
  40% {
    transform: rotate(-1.2deg) translate(0px, 3px);
  }
  60% {
    transform: rotate(1deg) translate(0px, 0);
  }
  80% {
    transform: rotate(-0.8deg) translate(0px, -3px);
  }
  100% {
    transform: rotate(0deg) translate(0px, 0px);
  }
}

.wind-leaves-animation {
  animation: windLeaves 4s ease-in-out infinite;
  will-change: transform;
}

@keyframes windLeftBranch {
  0% {
    transform: translateY(0) rotate(0deg);
  }
  25% {
    transform: translateY(-5px) rotate(-5deg);
  }
  50% {
    transform: translateY(1.5px) rotate(1deg);
  }
  75% {
    transform: translateY(-1px) rotate(-0.5deg);
  }
  100% {
    transform: translateY(0) rotate(0deg);
  }
}

.wind-left-branch {
  animation: windLeftBranch 5s ease-in-out infinite;
  will-change: transform;
  transform-origin: left center;
}

.wind-left-branch1 {
  animation: windLeftBranch 5s ease-in-out infinite;
  will-change: transform;
  transform-origin: left center;
}

@keyframes windRightFlowers {
  0% {
    transform: translateY(0px) rotate(0deg);
  }
  25% {
    transform: translateY(-10px) rotate(1deg);
  }
  50% {
    transform: translateY(2px) rotate(-1deg);
  }
  75% {
    transform: translateY(-10px) rotate(0.5deg);
  }
  100% {
    transform: translateY(0px) rotate(0deg);
  }
}

.wind-right-flowers {
  animation: windRightFlowers 5.5s ease-in-out infinite;
  will-change: transform;
}

@keyframes windSwayLeftPartners {
  0% {
    transform: translateX(0) rotate(0deg);
  }
  25% {
    transform: translateX(-10px) rotate(-1deg);
  }
  50% {
    transform: translateX(2px) rotate(1deg);
  }
  75% {
    transform: translateX(5px) rotate(-0.5deg);
  }
  100% {
    transform: translateX(0) rotate(0deg);
  }
}

@keyframes windSwayRightPartners {
  0% {
    transform: translateY(0) rotate(0deg);
  }
  25% {
    transform: translateY(-2px) rotate(0.5deg);
  }
  50% {
    transform: translateY(10px) rotate(-5deg);
  }
  75% {
    transform: translateY(-1px) rotate(0.2deg);
  }
  100% {
    transform: translateY(0) rotate(0deg);
  }
}

.wind-left {
  animation: windSwayLeftPartners 6s ease-in-out infinite;
  will-change: transform;
}

.wind-right {
  animation: windSwayRightPartners 4s ease-in-out infinite;
  will-change: transform;
}

@keyframes girlWindSway {
  0% {
    transform: translateY(0px) rotate(0deg);
  }
  25% {
    transform: translateY(-2px) rotate(5deg);
  }
  50% {
    transform: translateY(2px) rotate(-5deg);
  }
  75% {
    transform: translateY(-1px) rotate(0.5deg);
  }
  100% {
    transform: translateY(0px) rotate(0deg);
  }
}

.girl-wind {
  animation: girlWindSway 6s ease-in-out infinite;
  will-change: transform;
}