@font-face {
	font-family: 'OldStandardTt-Regular';
	src: url('old_standard_tt_regular.eot'); /* IE 9 Compatibility Mode */
	src: url('old_standard_tt_regular.eot?#iefix') format('embedded-opentype'), /* IE < 9 */
		url('old_standard_tt_regular.woff2') format('woff2'), /* Super Modern Browsers */
		url('old_standard_tt_regular.woff') format('woff'), /* Firefox >= 3.6, any other modern browser */
		url('old_standard_tt_regular.ttf') format('truetype'), /* Safari, Android, iOS */
		url('old_standard_tt_regular.svg#old_standard_tt_regular') format('svg'); /* Chrome < 4, Legacy iOS */
}

@font-face {
	font-family: 'PrincessDiana-Regular';
	src: url('princessdiana.eot'); /* IE 9 Compatibility Mode */
	src: url('princessdiana.eot?#iefix') format('embedded-opentype'), /* IE < 9 */
		url('princessdiana.woff2') format('woff2'), /* Super Modern Browsers */
		url('princessdiana.woff') format('woff'), /* Firefox >= 3.6, any other modern browser */
		url('princessdiana.ttf') format('truetype'), /* Safari, Android, iOS */
		url('princessdiana.svg#princessdiana') format('svg'); /* Chrome < 4, Legacy iOS */
}

@font-face {
  font-family: "Annabelle-Regular";
  src: url("ofont.ru_Annabelle.woff2") format("woff2"),
       url("ofont.ru_Annabelle.woff") format("woff"),
       url("ofont.ru_Annabelle.ttf") format("truetype");
  font-weight: 400;
}

::-webkit-input-placeholder{
  color: white;
}
body {
  overflow-x: hidden;
}
/* Выбираем все прямые дочерние элементы внутри вашего блока */
.i-phone-13-14-85 > * {
  opacity: 1;
  transform: translateY(30px);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
  will-change: opacity, transform;
}

/* Состояние видимости */
.i-phone-13-14-85 > *.is-visible {
  opacity: 1;
  transform: translateY(0);
}




/* Конверт/обертка плавно уходит наверх */
.envelope-wrapper {
  transition: transform 1s ease-in-out, opacity 0.8s ease-in-out;
  will-change: transform, opacity;
}

/* Класс скрытия после клика */
.envelope-wrapper.hide {
  transform: translateY(-120vh); /* Улетает вверх за пределы экрана */
  opacity: 0;
}

/* Полный уход из потока */
.envelope-wrapper.is-hidden {
  display: none !important;
}




/* Базовое состояние для текста — скрыт и смещен вниз */
.fade-item {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
  will-change: opacity, transform;
}

/* Задержки проявления для эффекта очереди */
.delay-1 { transition-delay: 3.2s; }
.delay-2 { transition-delay: 3.6s; }
.delay-3 { transition-delay: 4.0s; }
.delay-4 { transition-delay: 4.4s; }

/* Состояние ПОСЛЕ появления */
.open .fade-item {
  opacity: 1;
  transform: translateY(0);
}

/* Анимация покачивания запускается для кнопки */
.open .floating-btn {
  animation: float 2s ease-in-out infinite;
  animation-delay: 4.2s; /* Начинает покачиваться только после появления */
}

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

.curtain-center {
    position: absolute; top: 0; width: 105vw; height: 107vh; left: 50%; transform: translateX(-50%);
    filter: brightness(0.1);
    transition: filter 4.0s ease-in-out 2s;
  }
  
  /* 2. Левая: уезжает влево (задержка 1.5s) */
  .curtain-left {
    position: absolute; top: 0; height: 100vh; left: 0;
    will-change: transform;
    transition: transform 2s ease-in-out 1.5s;
  }
  
  /* 3. Правая: уезжает вправо (задержка 2s, чуток асинхронно) */
  .curtain-right {
    position: absolute; top: 0; height: 100vh; right: 0;
    will-change: transform;
    transition: transform 2.0s ease-in-out 1.4s;
  }

  /* Экшн по классу */
  .open .curtain-center { filter: brightness(0.4); }
  .open .curtain-left   { transform: translateX(-100%); }
  .open .curtain-right  { transform: translateX(100%); }


html, body {
  overflow: hidden;
  height: 100vh; /* Чтобы страница не прыгала */
}


  .video-bg {
      position: fixed; /* чтобы не скролилось */
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      overflow: hidden;
      z-index: -1; /* чтобы было под контентом */
      filter: brightness(0.40);
    }

    .video-bg video {
      width: 100%;
      height: 100%;
      object-fit: cover; /* заполняет экран */
    }
.i-phone-13-14-85,
.i-phone-13-14-85 * {
  box-sizing: border-box;
}
.i-phone-13-14-85 {
  display: flex;
  flex-direction: column;
  gap: 0vw;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  overflow: hidden;
}
.bf-7-f-4716-3804-4-aef-ad-57-a-4-f-2-b-1203-a-88-1 {
  flex-shrink: 0;
  width: 104.533vw;
  height: 185.6vw;
  position: relative;
  object-fit: cover;
  aspect-ratio: 392/696;
}
.frame-391 {
  display: flex;
  flex-direction: row;
  gap: 1.867vw;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  margin-top: -12vw;
    animation: float 2s ease-in-out infinite;
  
  /* Рекомендуется добавить для плавности отрисовки видеокартой */
  will-change: transform;
  
}

@keyframes float {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-4vw); /* Насколько высоко поднимается объект */
  }
  100% {
    transform: translateY(0);
  }
}
.text-01 {
  color: #ffffff;
  text-align: center;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 4.267vw;
  line-height: 8vw;
  font-weight: 400;
  position: relative;
}
.vector {
  flex-shrink: 0;
  width: 3.096vw;
  height: 1.629vw;
  position: relative;
  overflow: visible;
}
.text-02 {
  color: #ffffff;
  text-align: center;
  font-family: "PrincessDiana-Regular", sans-serif;
  font-size: 11.2vw;
  line-height: 10.667vw;
  font-weight: 400;
  position: relative;
  margin-top: 17vw;
  
}
.text-03 {
  color: #ffffff;
  text-align: center;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 6.4vw;
  line-height: 8vw;
  font-weight: 400;
  position: relative;
  margin-top: 15vw;
  
}
.text-04 {
  color: #ffffff;
  text-align: center;
  font-family: "PrincessDiana-Regular", sans-serif;
  font-size: 11.2vw;
  font-weight: 400;
  position: relative;
  margin-top: 17vw;
  
}
.text-05 {
  color: #ffffff;
  text-align: center;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 6.4vw;
  line-height: 8vw;
  font-weight: 400;
  position: relative;
  margin-top: 10vw;
  
}
.text-06 {
  color: #ffffff;
  text-align: center;
  font-family: "PrincessDiana-Regular", sans-serif;
  font-size: 10.667vw;
  line-height: 8vw;
  font-weight: 400;
  position: relative;
  margin-top: 10vw;
  
}
.frame-381 {
  background: rgba(73, 12, 16, 0);
  border-radius: 5.333vw;
  border-style: solid;
  border-color: #ffffff;
  border-width: 0.267vw;
  padding: 2.667vw 13.6vw 1.6vw 13.333vw;
  display: flex;
  flex-direction: row;
  gap: 2.667vw;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 67.733vw;
  height: 9.6vw;
  position: relative;
  margin-top: 10vw;
  
}
.text-07 {
  color: #ffffff;
  text-align: center;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 4.267vw;
  letter-spacing: 0.06em;
  font-weight: 400;
  position: relative;
  text-wrap: nowrap;
}
.f-847-e-33138-b-403-a-3496-afe-8661913-c-92374319030808-a-52111035-d-76-cc-0-b-08-a-0-photoroom-1 {
  flex-shrink: 0;
  width: 147.733vw;
  height: 118.4vw;
  position: relative;
  object-fit: cover;
  aspect-ratio: 554/444;
  margin-top: -20vw;
  pointer-events: none;
  
}
.rectangle-373 {
  background: #f8f6ef;
  display: flex;
  flex-direction: column;
  padding: 27.8vw 0 29.6vw 0;
  border-radius: 53.333vw 53.333vw 0vw 0vw;
  flex-shrink: 0;
  width: 100vw;
  position: relative;
  margin-top: -32vw;
  
}
.text-08 {
  color: #710f1e;
  text-align: center;
  font-family: "PrincessDiana-Regular", sans-serif;
  font-size: 14.4vw;
  font-weight: 400;
  position: relative;
}
.frame-382 {
  display: flex;
  flex-direction: column;
  gap: 0vw;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
  margin-top: 10vw;
  
}
.text-09 {
  color: #710f1e;
  text-align: center;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 6.4vw;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
.text-10 {
  color: #710f1e;
  text-align: center;
  font-family: "PrincessDiana-Regular", sans-serif;
  font-size: 8.533vw;
  font-weight: 400;
  position: relative;
  align-self: stretch;
  margin-top: -2vw;
  
}
.frame-383 {
  display: flex;
  flex-direction: column;
  gap: 0vw;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
  margin-top: 4vw;
  
}
.text-11 {
  color: #710f1e;
  text-align: center;
  font-family: "PrincessDiana-Regular", sans-serif;
  font-size: 8.533vw;
  font-weight: 400;
  position: relative;
  margin-top: -2vw;
  
}
.text-12 {
  color: #710f1e;
  text-align: center;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 6.4vw;
  font-weight: 400;
  position: relative;
}
.frame-384 {
  display: flex;
  flex-direction: column;
  gap: 0vw;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.text-13 {
  color: #710f1e;
  text-align: center;
  font-family: "PrincessDiana-Regular", sans-serif;
  font-size: 8.533vw;
  font-weight: 400;
  position: relative;
  margin-top: -4vw;
  
}
.text-14 {
  color: #710f1e;
  text-align: center;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 6.4vw;
  font-weight: 400;
  position: relative;
  margin-top: 4vw;
  
}
.text-15 {
  color: #ffffff;
  text-align: center;
  font-family: "PrincessDiana-Regular", sans-serif;
  font-size: 14.4vw;
  font-weight: 400;
  position: relative;
  margin-top: 17vw;
  
}
.text-16 {
  color: #fffaf2;
  text-align: center;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 4.267vw;
  line-height: 5.867vw;
  font-weight: 400;
  position: relative;
  margin-top: 5vw;
  
}
.text-17 {
  color: #ffffff;
  text-align: center;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 4.267vw;
  line-height: 5.867vw;
  font-weight: 400;
  position: relative;
  margin-top: 5vw;
  
}
.frame-387 {
  display: flex;
  flex-direction: column;
  gap: 5.867vw;
  align-items: flex-start;
  justify-content: flex-start;
  position: relative;
  align-self: flex-start;
  margin-left: 9.067vw;
  margin-top: 7vw;
  
  
}
.frame-386 {
  background: rgba(255, 255, 255, 0);
  border-style: solid;
  border-color: #ffffff;
  border-width: 0.267vw;
  padding: 2.667vw 0 2.4vw 2.4vw;
  display: flex;
  flex-direction: row;
  gap: 2.667vw;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 72.533vw;
  height: 10.4vw;
  position: relative;
}
.text-18 {
  color: #ffffff;
  text-align: start;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 4.267vw;
  font-weight: 400;
  position: relative;
  text-wrap: nowrap;
}
.text-19 {
  color: #ffffff;
  text-align: left;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 4.267vw;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
.text-20 {
  color: #ffffff;
  text-align: left;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 3.733vw;
  line-height: 5.6vw;
  font-weight: 400;
  position: relative;
}
.text-21 {
  color: #ffffff;
  text-align: left;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 4.267vw;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
.text-22 {
  color: #ffffff;
  text-align: left;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 3.733vw;
  line-height: 5.6vw;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
.frame-385 {
  background: rgba(111, 1, 9, 0);
  border-style: solid;
  border-color: #ffffff;
  border-width: 0.267vw;
  padding: 2.667vw 13.067vw 2.4vw 9.867vw;
  display: flex;
  flex-direction: row;
  gap: 2.667vw;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 42.933vw;
  height: 10.4vw;
  position: relative;
  cursor: pointer;
}
.text-23 {
  color: #ffffff;
  text-align: center;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 4.267vw;
  font-weight: 400;
  position: relative;
}
.text-24 {
  color: #ffffff;
  text-align: center;
  font-family: "PrincessDiana-Regular", sans-serif;
  font-size: 14.4vw;
  font-weight: 400;
  position: relative;
  margin-top: 17vw;
  
}
.text-25 {
  color: #fdfcf8;
  text-align: center;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 4.267vw;
  line-height: 5.867vw;
  font-weight: 400;
  position: relative;
  margin-top: 7vw;
  
}
.frame-388 {
  display: flex;
  flex-direction: row;
  gap: 2.133vw;
  align-items: flex-end;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
  margin-top: 10vw;
  
}
.photo-2026-03-23-22-39-35-3 {
  flex-shrink: 0;
  width: 37.867vw;
  height: 56.8vw;
  position: relative;
  object-fit: cover;
  aspect-ratio: 142/213;
  
  
}
.photo-2026-03-23-22-39-29-3 {
  flex-shrink: 0;
  width: 52.267vw;
  height: 78.4vw;
  position: relative;
  object-fit: cover;
  aspect-ratio: 196/294;
  margin-bottom: -5vw;
}
.frame-389 {
  display: flex;
  flex-direction: row;
  gap: 2.133vw;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
  margin-top: 10vw;
  
}
.photo-2026-03-23-22-39-35-4 {
  flex-shrink: 0;
  width: 37.867vw;
  height: 56.8vw;
  position: relative;
  object-fit: cover;
  aspect-ratio: 142/213;
}
.d-947-df-9-f-abe-6-43-b-3-822-d-2704-b-032-c-99-a-1 {
  flex-shrink: 0;
  width: 51.733vw;
  height: 40.267vw;
  position: relative;
  object-fit: contain;
  aspect-ratio: 194/151;
}
.text-26 {
  color: #ffffff;
  text-align: center;
  font-family: "PrincessDiana-Regular", sans-serif;
  font-size: 14.4vw;
  font-weight: 400;
  position: relative;
  margin-top: 17vw;
  
}
.text-27 {
  color: #fdfcf8;
  text-align: center;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 4.267vw;
  line-height: 5.867vw;
  font-weight: 400;
  position: relative;
  margin-top: 7vw;
  
}
.frame-390 {
  background: rgba(73, 12, 16, 0);
  border-radius: 5.333vw;
  border-style: solid;
  border-color: #ffffff;
  border-width: 0.267vw;
  padding: 2.667vw 25.867vw 1.6vw 26.4vw;
  display: flex;
  flex-direction: row;
  gap: 2.667vw;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 67.733vw;
  height: 9.6vw;
  position: relative;
  margin-top: 5vw;
  
}
.text-28 {
  color: #ffffff;
  text-align: center;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 4.267vw;
  letter-spacing: 0.06em;
  font-weight: 400;
  position: relative;
}
.text-29 {
  color: #fdfcf8;
  text-align: left;
  font-family: "OldStandardTt-Regular", sans-serif;
  font-size: 6.4vw;
  line-height: 8vw;
  font-weight: 400;
  position: relative;
  margin-top: 17vw;
  
}
.text-30 {
  color: #ffffff;
  text-align: center;
  font-family: "PrincessDiana-Regular", sans-serif;
  font-size: 14.4vw;
  font-weight: 400;
  position: relative;
  margin-top: -9vw;
  margin-left: 31vw;
  
  margin-bottom: 15vw;
      animation: float 2s ease-in-out infinite;
  
  /* Рекомендуется добавить для плавности отрисовки видеокартой */
  will-change: transform;
  
}