/**
 * Main Stylesheet - 3DAYS GC Design System
 *
 * Este es el archivo principal que importa todos los módulos del Design System.
 * Orden de importación:
 * 1. Tokens (variables)
 * 2. Base (reset + base styles)
 * 3. Components (botones, cards, forms, etc.)
 * 4. Utilities (clases utilitarias)
 *
 * Version: 1.0.0
 * Author: 3DAYS GC Team
 */


/* ========================================
   GOOGLE FONTS
   ======================================== */
/* NOTA: Google Fonts se cargan desde enqueue-assets.php para evitar duplicación */
/* @import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Open+Sans:wght@300;400;500;600;700&family=Montserrat:wght@400;500;600;700&family=Poppins:wght@400;500;600;700&family=Roboto:wght@300;400;500&display=swap'); */


/* ========================================
   DESIGN TOKENS
   ======================================== */
@import './tokens.css';


/* ========================================
   BASE STYLES
   ======================================== */
@import './base.css';


/* ========================================
   COMPONENTS
   ======================================== */
@import './components/buttons.css';
@import './components/cards.css';
@import './components/forms.css';


/* ========================================
   UTILITIES
   ======================================== */
@import './utilities.css';


/* ========================================
   CUSTOM ANIMATIONS
   ======================================== */

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

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

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }

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

@keyframes slideInLeft {
  from {
    opacity: 0;
    transform: translateX(-20px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(20px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes pulse {

  0%,
  100% {
    opacity: 1;
  }

  50% {
    opacity: 0.5;
  }
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}


/* Animation utility classes */
.animate-fade-in {
  animation: fadeIn 0.3s ease-in-out;
}

.animate-slide-up {
  animation: slideUp 0.6s ease-out;
}

.animate-slide-down {
  animation: slideDown 0.6s ease-out;
}

.animate-slide-in-left {
  animation: slideInLeft 0.6s ease-out;
}

.animate-slide-in-right {
  animation: slideInRight 0.6s ease-out;
}

.animate-pulse {
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

.animate-spin {
  animation: spin 1s linear infinite;
}


/* ========================================
   SMOOTH SCROLL
   ======================================== */

html {
  scroll-behavior: smooth;
}

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

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

.video,
.video iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
}