/* ==========================================
   ESTILOS GENERALES - HOTEL MAGLA (PREMIUM)
   ========================================== */

:root {
    /* Paleta Corporativa */
    --color-wine: #6A1B1F;       
    --color-wine-light: #8a2b30; 
    
    /* Beige Crema (Cálido) */
    --color-beige: #FDF6E3;      
    --color-beige-dark: #F5EBD0; 
    
    /* Textos y Fondos Base */
    --color-text: #333333;       
    --color-gray-soft: #666666;
    --bg-body: #ffffff;
    --bg-card: #ffffff;
}

body {
    font-family: 'Inter', sans-serif;
    background-color: var(--bg-body);
    color: var(--color-text);
    /* Se elimina la transición de modo oscuro */
}

/* Tipografía Premium */
h1, h2, h3, h4, .font-serif {
    font-family: 'Playfair Display', serif;
}

/* Colores Utilitarios */
.text-wine { color: var(--color-wine); }
.bg-wine { background-color: var(--color-wine); }
.border-wine { border-color: var(--color-wine); }
.bg-beige-section { background-color: var(--color-beige); }

/* --- SOMBRAS Y PROFUNDIDAD --- */
.text-shadow-sm { text-shadow: 0 2px 4px rgba(0,0,0,0.5); }
.text-shadow-md { text-shadow: 0 4px 8px rgba(0,0,0,0.6); }
.text-shadow-xl { text-shadow: 0 4px 15px rgba(0,0,0,0.8); } /* Hero Legibility */

/* --- TEXTURAS SUTILES (Magla Café) --- */
.bg-texture-dots {
    background-color: var(--color-beige);
    /* Patrón de puntos sutil en color vino claro */
    background-image: radial-gradient(var(--color-wine-light) 0.5px, transparent 0.5px);
    background-size: 20px 20px;
    opacity: 1;
}

/* --- SEPARADORES DE DEGRADADO (Mejorados) --- */
.gradient-connector {
    width: 100%;
    height: 100px; /* Altura estándar para transiciones suaves entre secciones */
    display: block;
    position: relative;
    z-index: 2;
    pointer-events: none;
}

/* Blanco -> Beige */
.white-to-beige { 
    background: linear-gradient(to bottom, #ffffff 0%, var(--color-beige) 100%); 
}

/* Beige -> Blanco */
.beige-to-white { 
    background: linear-gradient(to bottom, var(--color-beige) 0%, #ffffff 100%); 
}

/* Hero Connector (Imagen -> Beige) */
.hero-to-beige {
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, var(--color-beige) 100%);
    margin-top: -100px; /* Pull-up effect */
    height: 100px;
    position: relative;
    z-index: 10;
}

/* Hero Connector (Imagen -> Blanco) - Nuevo para Habitaciones */
.hero-to-white {
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, #ffffff 100%);
    margin-top: -100px;
    height: 100px;
    position: relative;
    z-index: 10;
}

/* --- ANIMACIONES Y MICRO-INTERACCIONES --- */
.fade-in-up {
    animation: fadeInUp 0.8s ease-out forwards;
    opacity: 0;
    transform: translateY(20px);
}

@keyframes fadeInUp {
    to { opacity: 1; transform: translateY(0); }
}

/* Tarjetas de Servicios (Mejoradas) */
.service-card {
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    border-top: 4px solid var(--color-wine);
    background-color: var(--bg-card);
    position: relative;
    overflow: hidden;
}

.service-card:hover {
    transform: translateY(-8px); /* Elevación suave */
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); /* Sombra difusa premium */
    border-bottom: 2px solid var(--color-wine);
}

.service-card i {
    transition: transform 0.4s ease;
    color: var(--color-wine); 
}

.service-card:hover i {
    transform: scale(1.15) rotate(5deg); /* Pequeño giro dinámico */
}