/* styles.css - Eli Coach Transformacional */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=DM+Serif+Display:ital@0;1&display=swap');

:root {
  /* Brand Palette */
  --color-purple: #482851;
  --color-dark-purple: #371545;
  --color-soft-pink: #F5EEF7;
  --color-lilac: #D6BBDD;
  --color-cream: #FFFDF6;
  --color-warm-cream: #FFF2CC;
  --color-light-cream: #FFF9E5;
  --color-gold: #FFD65C;

  /* Typography */
  --font-heading: 'DM Serif Display', serif;
  --font-body: 'DM Sans', sans-serif;
}

/* Base Styles */
body {
  background-color: var(--color-cream);
  color: var(--color-purple);
  font-family: var(--font-body);
  overflow-x: hidden;
  scroll-behavior: smooth;
}

h1, h2, h3, h4 {
  font-family: var(--font-heading);
}

/* Navbar Components */
.navbar-fixed {
  position: fixed;
  top: 1rem;
  left: 50%;
  transform: translateX(-50%);
  width: 95%;
  max-width: 900px;
  z-index: 100;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  border-radius: 100px;
  background-color: transparent;
}

.navbar-scrolled {
  background-color: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(214, 187, 221, 0.3);
  box-shadow: 0 10px 30px -10px rgba(72, 40, 81, 0.2);
  top: 0.5rem;
}

/* Animations */
.wing-float {
  animation: float 6s ease-in-out infinite;
}

@keyframes float {
  0%, 100% { transform: translateY(0px) rotate(-15deg); }
  50% { transform: translateY(-20px) rotate(-10deg); }
}

.halo-glow {
  box-shadow: 0 0 40px 10px rgba(255, 214, 92, 0.15);
}

.js-card {
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.js-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 25px -5px rgba(72, 40, 81, 0.1);
  border-color: var(--color-lilac);
}

/* Utilities */
.text-brand-purple { color: var(--color-purple); }
.bg-brand-purple { background-color: var(--color-purple); }

/* Material Symbols */
.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48;
}

/* Responsive Overrides */
@media (max-width: 768px) {
  .navbar-fixed {
    display: none;
  }
}