/* ═══════════════════════════════════════════════
   Maanaim Imóveis — Design System CSS
   All @tailwind directives removed (CDN mode).
   Only raw CSS utilities and overrides here.
   ═══════════════════════════════════════════════ */

/* Base reset */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Luxury Typography */
.tracking-ultra {
  letter-spacing: 0.5em;
}

.font-serif-luxury {
  font-family: 'Cinzel', serif;
  font-weight: 500;
}

/* Animations */
.animate-slide-up {
  opacity: 0;
  transform: translateY(30px);
  animation: slideUp 0.8s ease-out forwards;
}

.animate-fade-in {
  opacity: 0;
  animation: fadeIn 0.8s ease-out forwards;
}

@keyframes slideUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeIn {
  to {
    opacity: 1;
  }
}

/* WhatsApp FAB pulse */
@keyframes fabPulse {

  0%,
  100% {
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.5);
  }

  50% {
    box-shadow: 0 0 0 14px rgba(37, 211, 102, 0);
  }
}

.whatsapp-fab {
  animation: fabPulse 2.5s ease-in-out infinite;
}

/* Select custom arrow */
.select-gold {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%23D4AF37' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  padding-right: 40px;
}

/* iOS momentum scrolling */
.scroll-touch {
  -webkit-overflow-scrolling: touch;
}

/* Scrollbar hide */
.scrollbar-hide {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.scrollbar-hide::-webkit-scrollbar {
  display: none;
}


/* ═══════════════════════════════════════════════
   Coastal Luxury Effects — Premium Animations
   ═══════════════════════════════════════════════ */

/* Wave Motion Animation */
@keyframes waveMotion {
  0%, 100% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(10px);
  }
}

/* Golden Shimmer Effect */
@keyframes shimmer {
  from {
    background-position: -100% 0;
  }
  to {
    background-position: 200% 0;
  }
}

/* Tide In Animation */
@keyframes tideIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Pearl Glow Pulse */
@keyframes pearlGlow {
  0%, 100% {
    opacity: 0.7;
  }
  50% {
    opacity: 1;
  }
}

/* Float Up Animation */
@keyframes floatUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Glassmorphism Utilities */
.glass-ocean {
  background: rgba(15, 52, 96, 0.6);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid rgba(59, 130, 172, 0.3);
}

.glass-sand {
  background: rgba(250, 245, 235, 0.8);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid rgba(212, 196, 170, 0.5);
}

/* Ocean Gradient Text */
.text-gradient-ocean {
  background: linear-gradient(to right, #5b9bd5, #7dd3c0);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Golden Gradient Text */
.text-gradient-gold {
  background: linear-gradient(to right, #d4af37, #b8941f);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Wave Animation Class */
.animate-wave {
  animation: waveMotion 3s ease-in-out infinite;
}

/* Shimmer Animation Class */
.animate-shimmer {
  background-size: 200% 100%;
  animation: shimmer 2s ease-in-out infinite;
}

/* Hover Lift Effect */
.hover-lift {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover-lift:hover {
  transform: translateY(-8px);
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

/* Hover Glow Effect */
.hover-glow {
  transition: box-shadow 0.3s ease;
}

.hover-glow:hover {
  box-shadow: 0 0 30px rgba(212, 175, 55, 0.3);
}

/* Tide In Animation Class */
.animate-tide-in {
  opacity: 0;
  animation: tideIn 0.8s ease-out forwards;
}

/* Pearl Glow Animation Class */
.animate-pearl-glow {
  animation: pearlGlow 3s ease-in-out infinite;
}

/* Float Up Animation Class */
.animate-float-up {
  opacity: 0;
  animation: floatUp 0.6s ease-out forwards;
}

/* Text Selection Coastal Theme */
::selection {
  background: rgba(91, 155, 213, 0.3);
  color: #0f3460;
}

/* Fade In Up Animation */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-in-up {
  opacity: 0;
  animation: fadeInUp 0.5s ease-out forwards;
}
::-moz-selection {
  background: rgba(91, 155, 213, 0.3);
  color: #0f3460;
}