/* ==========================================================================
   ROSA COSTANTINO - RITUALI D'AUTORE
   Custom Stylesheet (Modern & Responsive UI)
   ========================================================================== */

/* 1. Custom Fonts & Background */
.font-script-callout {
  font-family: 'Italianno', cursive;
  letter-spacing: 0.05em;
}

.glow-bg {
  background: radial-gradient(circle at 50% 30%, rgba(217, 171, 162, 0.18) 0%, rgba(252, 248, 245, 0) 70%);
}

/* 2. Keyframes & Animations */
@keyframes float {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-10px);
  }
}

@keyframes pulseSubtle {
  0%, 100% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(1.04);
    opacity: 0.92;
  }
}

.animate-float-slow {
  animation: float 6s ease-in-out infinite;
}

.animate-pulse-subtle {
  animation: pulseSubtle 3s ease-in-out infinite;
}

/* 3. Header Dynamic Transitions */
#main-header {
  transition: all 0.3s ease;
}

#main-header.scrolled {
  background-color: rgba(252, 248, 245, 0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05);
  border-bottom-color: rgba(244, 236, 230, 0.9);
}

/* 4. Desktop Navigation Underline Animation */
.nav-link {
  position: relative;
  transition: color 0.25s ease;
}

.nav-link::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 0;
  height: 1.5px;
  background-color: #4A2328;
  transition: width 0.3s ease;
}

.nav-link:hover::after {
  width: 100%;
}

/* 5. Fullscreen Mobile Navigation Drawer */
#mobile-menu {
  transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

#mobile-menu.open {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}

/* 6. Card & Image Hover Micro-interactions */
.ritual-card {
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s ease;
}

.ritual-card:hover {
  transform: translateY(-8px);
}

.card-image-zoom {
  transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

.ritual-card:hover .card-image-zoom {
  transform: scale(1.05);
}

/* 7. Utilities */
.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
html, body {
  width: 100%;
  max-width: 100vw;
  overflow-x: hidden !important;
  position: relative;
}

/* Evita lo sbordamento laterale delle animazioni su schermi piccoli */
[data-aos] {
  overflow-x: hidden !important;
}