.contact {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
  background: #050505 !important;
  scroll-snap-align: start;
}

#contact .contact-bg-photo,
#contact .contact-portrait,
.contact[data-enhanced='true'] .contact-bg-photo,
.contact[data-enhanced='true'] .contact-portrait {
  display: none !important;
}

.contact-video-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 70% center;
  opacity: 0.78;
  filter: blur(0.75px) saturate(1.08) contrast(1.2) brightness(0.84);
  transform: scale(1.03);
  animation: contactCinematicZoom 18s ease-in-out infinite alternate;
}

.contact-video-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.86) 0%, rgba(0, 0, 0, 0.46) 42%, rgba(0, 0, 0, 0.82) 100%),
    radial-gradient(circle at 58% 34%, rgba(255, 255, 255, 0.18), transparent 24%),
    radial-gradient(circle at 72% 58%, rgba(208, 164, 95, 0.22), transparent 30%),
    linear-gradient(180deg, rgba(0, 0, 0, 0.12), #050505 94%);
}

.contact-liquid-field {
  position: absolute;
  inset: 8% 5% 10%;
  z-index: 2;
  pointer-events: none;
  background:
    linear-gradient(115deg, transparent 12%, rgba(255, 255, 255, 0.16) 28%, transparent 42%),
    linear-gradient(72deg, transparent 34%, rgba(208, 164, 95, 0.26) 50%, transparent 68%),
    radial-gradient(ellipse at 56% 46%, rgba(255, 255, 255, 0.18), transparent 42%);
  filter: blur(30px);
  opacity: 0.56;
  mix-blend-mode: screen;
  transform: skewX(-8deg);
  animation: contactLiquidField 7.5s ease-in-out infinite alternate;
}

.contact-glass-rings {
  position: absolute;
  inset: 9% 8%;
  z-index: 2;
  pointer-events: none;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background:
    repeating-linear-gradient(112deg, rgba(255, 255, 255, 0.1) 0 1px, transparent 1px 44px),
    conic-gradient(from 210deg at 62% 50%, transparent 0deg, rgba(208, 164, 95, 0.24) 74deg, transparent 142deg, rgba(255, 255, 255, 0.14) 226deg, transparent 330deg);
  mask-image: radial-gradient(ellipse at 62% 48%, transparent 0 28%, #000 38%, transparent 76%);
  opacity: 0.62;
  mix-blend-mode: screen;
  animation: contactRingsDrift 9s ease-in-out infinite alternate;
}

.contact-motion-grid {
  z-index: 2 !important;
  opacity: 0.32 !important;
  mix-blend-mode: screen;
}

.contact-light-beam {
  left: 38% !important;
  z-index: 3 !important;
  width: 24% !important;
  background:
    linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.28), rgba(208, 164, 95, 0.2), transparent),
    linear-gradient(115deg, transparent 18%, rgba(255, 255, 255, 0.16) 48%, transparent 72%) !important;
  filter: blur(26px) !important;
  mix-blend-mode: screen;
}

.contact-grid {
  position: relative;
  z-index: 5 !important;
  grid-template-columns: minmax(520px, 900px) minmax(160px, 260px) !important;
  gap: clamp(28px, 5vw, 84px) !important;
  justify-content: center;
  min-height: 100vh;
  padding: 96px 0 !important;
}

.contact-main {
  margin-left: 0 !important;
  padding: clamp(42px, 5vw, 72px) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 34px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.045) 24%, rgba(5, 5, 5, 0.58) 48%, rgba(208, 164, 95, 0.13)),
    radial-gradient(circle at 14% 12%, rgba(255, 255, 255, 0.28), transparent 28%),
    radial-gradient(circle at 90% 16%, rgba(208, 164, 95, 0.26), transparent 34%),
    radial-gradient(circle at 72% 92%, rgba(255, 255, 255, 0.1), transparent 30%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.42),
    inset 0 -1px 0 rgba(208, 164, 95, 0.22),
    inset 28px 0 80px rgba(255, 255, 255, 0.045),
    0 40px 120px rgba(0, 0, 0, 0.58),
    0 0 0 1px rgba(208, 164, 95, 0.16),
    0 0 70px rgba(208, 164, 95, 0.08) !important;
  -webkit-backdrop-filter: blur(32px) saturate(1.38) contrast(1.06) !important;
  backdrop-filter: blur(32px) saturate(1.38) contrast(1.06) !important;
}

.contact-logo-word {
  z-index: 5;
}

@keyframes contactCinematicZoom {
  from {
    transform: scale(1.03) translate3d(0, 0, 0);
  }

  to {
    transform: scale(1.08) translate3d(-1.5%, 1%, 0);
  }
}

@keyframes contactLiquidField {
  from {
    opacity: 0.34;
    transform: translate3d(-3%, -2%, 0) skewX(-10deg) scale(1);
  }

  50% {
    opacity: 0.68;
  }

  to {
    opacity: 0.46;
    transform: translate3d(4%, 3%, 0) skewX(-4deg) scale(1.08);
  }
}

@keyframes contactRingsDrift {
  from {
    opacity: 0.38;
    transform: translate3d(-18px, 10px, 0) rotate(-1.5deg) scale(0.98);
  }

  50% {
    opacity: 0.7;
  }

  to {
    opacity: 0.5;
    transform: translate3d(22px, -12px, 0) rotate(1.5deg) scale(1.02);
  }
}

@media (max-width: 720px) {
  .contact-video-bg {
    object-position: 68% center;
    opacity: 0.68;
    filter: blur(0.85px) saturate(1.08) contrast(1.16) brightness(0.78);
  }

  .contact-grid {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
    min-height: 100vh;
    padding: 82px 0 96px !important;
  }

  .contact-main {
    padding: 34px 22px !important;
    border-radius: 24px !important;
  }

  .contact-logo-word {
    min-height: 120px !important;
    justify-self: center;
    opacity: 0.42;
    transform: none !important;
  }

  .contact-logo-word img {
    width: min(52vw, 220px) !important;
    transform: none !important;
  }

  .contact-liquid-field,
  .contact-glass-rings {
    inset: 8% 16px;
    opacity: 0.34;
  }
}