@font-face {
  font-family: 'Playfair Display';
  src: url("fonts/PlayfairDisplay-BoldItalic.eot");
  src: local("Playfair Display Bold Italic"), local("PlayfairDisplay-BoldItalic"), url("fonts/PlayfairDisplay-BoldItalic.eot?#iefix") format("embedded-opentype"), url("fonts/PlayfairDisplay-BoldItalic.woff2") format("woff2"), url("fonts/PlayfairDisplay-BoldItalic.woff") format("woff"), url("fonts/PlayfairDisplay-BoldItalic.ttf") format("truetype");
  font-weight: bold;
  font-style: italic; }
:root {
  font-size: 30px; }

ul, li {
  margin: 0;
  padding: 0;
  display: block; }

a {
  transition: .3s all;
  outline: none;
  text-decoration: none; }
  a:hover {
    text-decoration: none; }

button {
  transition: .6s all;
  border: none;
  outline: none;
  background: none;
  padding: 0; }

h1, h2, h3, h4, h5, p {
  margin: 0; }

input {
  outline: none;
  border-radius: 0; }
  input.error {
    color: red !important;
    border-color: red !important; }

html {
  scroll-behavior: smooth; }

body {
  font-family: 'Playfair Display', serif;
  font-size: 1.35rem;
  color: #fff;
  font-weight: 700;
  font-style: italic;
  letter-spacing: 0.02em; }

::-webkit-scrollbar {
  width: .5rem;
  height: 0.5rem; }

::-webkit-scrollbar-track {
  background: #ddd; }

::-webkit-scrollbar-thumb {
  background: #000;
  border: 1px solid #ddd; }

.lazy {
  opacity: 0; }

.disabled {
  pointer-events: none; }

@property --angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false; }
@property --glowColor {
  syntax: "<color>";
  initial-value: #BD9C60; }
@keyframes rotate {
  0% {
    --angle: 0deg;
    --glowColor: #fff; }
  100% {
    --angle: 360deg;
    --glowColor: #fff; } }
@keyframes blur {
  0% {
    text-shadow: 0 0 100px #fff;
    opacity: 0; }
  15% {
    text-shadow: 0 0 90px #fff; }
  25% {
    opacity: 1; }
  40% {
    text-shadow: 0 0 0px #fff;
    color: transparent; }
  95% {
    text-shadow: 0 0 0px #fff; }
  100% {
    opacity: 1;
    color: #fff; } }
.main {
  position: relative;
  height: 100svh;
  z-index: 1;
  background: url("../img/bg-blur.jpg") center center no-repeat;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center; }
  .main audio {
    display: none; }
  .main__title {
    font-size: 1.7rem;
    line-height: 1.5; }
    .main__title span {
      display: block;
      color: transparent; }
    .main__title.active span {
      animation: blur 3s ease-out forwards; }
      .main__title.active span:nth-child(1) {
        animation-delay: 1s; }
      .main__title.active span:nth-child(2) {
        animation-delay: 2s; }
      .main__title.active span:nth-child(3) {
        animation-delay: 3s; }
      .main__title.active span:nth-child(4) {
        animation-delay: 4s; }
  .main__bg {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    position: absolute;
    z-index: -1; }
    .main__bg img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover; }
  .main__btn {
    width: 17rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin-top: 1.6rem;
    color: #fff;
    background: #BD9C60;
    font-size: 1.05rem;
    transition: all .18s ease-in-out;
    transform: translate3d(0, 0, 0);
    padding: 1px; }
    .main__btn:after, .main__btn:before {
      content: "";
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-size: 100% 100%;
      z-index: -1;
      background-position: 0px 0px;
      background-image: conic-gradient(from var(--angle) at 50% 50%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 33%, var(--glowColor) 50%, rgba(0, 0, 0, 0) 66%, rgba(0, 0, 0, 0) 100%);
      animation: rotate 2s infinite linear; }
    .main__btn:before {
      animation: rotate 2s infinite linear;
      filter: blur(20px); }
    .main__btn span {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 0.7rem 0 .9rem;
      width: 100%;
      color: #fff;
      background: #BD9C60;
      z-index: 1;
      transition: all .3s ease;
      backface-visibility: hidden; }
    .main__btn:hover span {
      background: #907747; }
  .main-btn__wrap {
    opacity: 0;
    transition: 1s all;
    transform: scale(1.2); }
    .main-btn__wrap.active {
      opacity: 1;
      transform: none; }
  .main-info {
    display: none; }
  .main__text {
    line-height: 1.4;
    margin: 2rem 0 2.9rem; }
    .main__text p {
      margin-bottom: 2rem; }
      .main__text p:last-child {
        margin-bottom: 0;
        margin-top: 3rem; }
      .main__text p span {
        color: transparent; }
        .main__text p span.active {
          animation: blur 5s ease-out forwards; }
  .main-location {
    opacity: 0;
    transition: 1s all;
    transform: scale(1.2); }
    .main-location.active {
      opacity: 1;
      transform: none; }
    .main-location__btn {
      display: inline-flex;
      align-items: center;
      color: #fff;
      gap: .7rem; }
      .main-location__btn:hover {
        color: #D2AE6D; }

@media (max-width: 2800.98px) {
  :root {
    font-size: 26px; } }
@media (max-width: 2600.98px) {
  :root {
    font-size: 24px; } }
@media (max-width: 2300.98px) {
  :root {
    font-size: 22px; } }
@media (max-width: 2100.98px) {
  :root {
    font-size: 20px; } }
@media (max-width: 1800.98px) {
  :root {
    font-size: 19px; } }
@media (max-width: 1700.98px) {
  :root {
    font-size: 18px; } }
@media (max-width: 1600.98px) {
  :root {
    font-size: 17px; } }
@media (max-width: 1500.98px) {
  :root {
    font-size: 16px; } }
@media (max-width: 1400.98px) {
  :root {
    font-size: 15px; } }
@media (max-width: 1300.98px) {
  :root {
    font-size: 14px; } }
@media (max-width: 1200.98px) {
  :root {
    font-size: 13px; } }
@media (max-width: 1100.98px) {
  :root {
    font-size: 12px; } }
@media (max-width: 1000.98px) {
  :root {
    font-size: 11px; } }
@media (max-width: 900.98px) {
  :root {
    font-size: 10px; } }
@media (max-width: 767.98px), (max-width: 1080px) and (orientation: portrait) {
  :root {
    font-size: 19px; }

  body {
    font-size: 1.15rem; }

  .main {
    background-image: url("../img/bg-blur-mob.jpg"); }
    .main__title {
      font-size: 1.4rem; }
    .main__btn {
      margin-top: 2.6rem; }
    .main__text {
      margin: 1rem 0 2.8rem; }
      .main__text p {
        margin-bottom: 1.4rem; }
        .main__text p:last-child {
          margin-bottom: 0;
          margin-top: 2.5rem; }
      .main__text span {
        display: block; }
      .main__text br {
        display: none; }
    .main-uz {
      font-size: 1.05rem; }
      .main-uz .main__text {
        margin: .85rem 0 1.5rem; }
        .main-uz .main__text p {
          margin-bottom: 1.1rem; }
          .main-uz .main__text p:last-child {
            margin-bottom: 0;
            margin-top: 1.5rem; } }
@media (max-width: 390.98px) {
  :root {
    font-size: 17px; } }
@media (max-width: 320.98px) {
  :root {
    font-size: 16px; } }
@media (max-width: 1000px) and (orientation: landscape) {
  :root {
    font-size: 8.5px; } }
@media (max-width: 700px) and (orientation: landscape) {
  :root {
    font-size: 8px; } }

/*# sourceMappingURL=main.css.map */