html {
  scroll-behavior: smooth;
}

body {
  text-rendering: optimizeLegibility;
}

.site-header {
  transition: background-color 180ms ease, box-shadow 180ms ease, backdrop-filter 180ms ease;
}

.site-header.is-scrolled {
  background: rgba(6, 6, 6, 0.86);
  backdrop-filter: blur(18px);
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.18);
}

.site-header.is-scrolled > div {
  border-color: rgba(255, 255, 255, 0.16);
}

.menu-drawer-link {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.55rem;
  line-height: 1.12;
  transition: color 180ms ease;
}

.menu-drawer-link:hover {
  color: #d8c8ad;
}

.drawer-scroll {
  overscroll-behavior: contain;
  scrollbar-color: rgba(255, 255, 255, 0.7) rgba(255, 255, 255, 0.05);
  scrollbar-gutter: stable;
  scrollbar-width: thin;
}

.drawer-scroll::-webkit-scrollbar {
  width: 4px;
}

.drawer-scroll::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.08);
}

.drawer-scroll::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.7);
  border-radius: 9999px;
}

.marquee-track {
  animation: marquee-ltr 28s linear infinite;
  display: flex;
  gap: 3.5rem;
  width: max-content;
}

.marquee-track span {
  color: #4b4b46;
  flex: 0 0 auto;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 2rem;
  line-height: 1;
  white-space: nowrap;
}

.marquee:hover .marquee-track {
  animation-play-state: paused;
}

@keyframes marquee-ltr {
  from {
    transform: translateX(-50%);
  }

  to {
    transform: translateX(0);
  }
}

.social-icon {
  align-items: center;
  border-style: solid;
  border-width: 1px;
  display: inline-flex;
  height: 2.75rem;
  justify-content: center;
  transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease;
  width: 2.75rem;
}

.social-icon svg {
  fill: currentColor;
  height: 1.1rem;
  width: 1.1rem;
}

.social-icon i {
  font-size: 1rem;
}

.video-play {
  align-items: center;
  border: 3px solid currentColor;
  border-radius: 9999px;
  color: #ffffff;
  display: inline-flex;
  font-size: 2rem;
  height: 5.25rem;
  justify-content: center;
  line-height: 1;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.45);
  transition: color 180ms ease, transform 180ms ease;
  width: 5.25rem;
}

.video-play i {
  margin-left: 0.18em;
}

.video-play--small {
  font-size: 1.35rem;
  height: 3.75rem;
  width: 3.75rem;
}

.video-play--mini {
  border-width: 2px;
  font-size: 0.95rem;
  height: 2.65rem;
  width: 2.65rem;
}

.group:hover .video-play {
  color: #ffffff;
  transform: scale(1.04);
}

.property-carousel-thumb {
  opacity: 0.58;
  transition: border-color 180ms ease, opacity 180ms ease, transform 180ms ease;
}

.property-carousel-thumb:hover,
.property-carousel-thumb.is-active {
  border-color: rgba(255, 255, 255, 0.95);
  opacity: 1;
}

.property-carousel-thumb.is-active {
  transform: translateY(-6px);
}

::selection {
  background: #d8c8ad;
  color: #151515;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }

  .marquee-track {
    animation: none;
    transform: translateX(0);
  }
}
