/*
 * CSS Variables and Custom Properties
 * 
 * @package Viva_Magenta_V1
 */

:root {
  /* Colors */
  --primary-color: #d63384;
  --primary-dark: #b02a5b;
  --secondary-color: #f8f9fa;
  --accent-color: #ffc107;
  --text-dark: #212529;
  --text-light: #6c757d;
  --text-white: #ffffff;
  --background-light: #ffffff;
  --background-gray: #f8f9fa;
  --background-gray-dark: #f1f3f5; /* slightly más oscuro para contraste en bodas */
  --border-color: #e9ecef;

  /* Typography */
  --font-heading: "Playfair Display", serif;
  --font-body: "Inter", sans-serif;

  /* Spacing */
  --header-height: 80px;
  --section-padding: 90px 0;
  --container-max-width: 1200px;
  --border-radius: 8px;

  /* Shadows */
  --shadow-light: 0 2px 10px rgba(0, 0, 0, 0.1);
  --shadow-medium: 0 4px 20px rgba(0, 0, 0, 0.15);
  --shadow-heavy: 0 8px 30px rgba(0, 0, 0, 0.2);

  /* Transitions */
  --transition: all 0.3s ease;

  /* Z-Index Scale */
  --z-header: 1000;
  --z-mobile-menu: 999;
  --z-hero-content: 3;
  --z-hero-overlay: 2;
  --z-hero-media: 1;
}