/* public_html/assets/css/style.css */

/* --- VARIABLES DE COLORES Y FUENTES --- */
:root {
    --brand-dark: #1E2D5A;
    --brand-navy: #2B3D75;
    --brand-blue: #40569A;
    --brand-cyan: #38BDF8;
    --brand-gold: #D4AF37;
    --white: #FFFFFF;
    --gray-light: #F8FAFC;
    --gray-medium: #E2E8F0;
    --gray-dark: #94A3B8;
}

/* --- ESTILOS GENERALES --- */
html {
    scroll-behavior: smooth;
}

body {
    background-color: var(--brand-dark);
    color: var(--white);
    font-family: 'Poppins', sans-serif;
    min-height: 100vh;
    overflow-x: hidden;
}

/* --- CLASES DE SOPORTE --- */
.text-serif {
    font-family: 'Playfair Display', serif;
}

/* --- ILUMINACIÓN Y GLOWS --- */
.glow-effect {
    position: absolute;
    width: 500px;
    height: 500px;
    background: rgba(56, 189, 248, 0.1);
    border-radius: 50%;
    filter: blur(120px);
    pointer-events: none;
    z-index: 0;
}

/* --- LOGO Y MENÚ --- */
.logo-container {
    background-color: var(--brand-dark);
    border: 2px solid var(--brand-gold);
    border-radius: 0.75rem;
    box-shadow: 0 4px 6px -1px rgba(212, 175, 55, 0.1);
    transition: all 0.3s ease;
}

.logo-container:hover {
    border-color: var(--brand-cyan);
}

/* --- BOTONES Y ENLACES --- */
.btn-gold {
    background-color: var(--brand-gold);
    color: var(--brand-dark);
    font-weight: 800;
    transition: all 0.3s ease;
}

.btn-gold:hover {
    background-color: var(--white);
    transform: translateY(-2px);
}

.btn-border-gold {
    border: 2px solid rgba(212, 175, 55, 0.4);
    color: var(--white);
    transition: all 0.3s ease;
}

.btn-border-gold:hover {
    border-color: var(--white);
    background-color: rgba(255, 255, 255, 0.05);
}

/* --- TARJETAS DE LA BIBLIOTECA --- */
.card-library {
    background-color: var(--brand-navy);
    border: 2px solid rgba(212, 175, 55, 0.3);
    border-radius: 1rem;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.card-library:hover {
    border-color: var(--brand-gold);
    transform: translateY(-4px);
    box-shadow: 0 10px 20px -10px rgba(212, 175, 55, 0.2);
}

/* --- EL OBJETO LIBRO --- */
.book-container {
    background-color: var(--brand-navy);
    border: 4px solid var(--brand-gold);
    border-radius: 1rem;
    box-shadow: 0 20px 25px -5px rgba(212, 175, 55, 0.1);
    transition: all 0.5s ease;
}

.book-container:hover {
    transform: rotate(0deg) scale(1.02);
}

/* --- REDES SOCIALES TOP BAR --- */
.social-icon {
    color: var(--gray-light);
    font-size: 0.875rem;
    transition: all 0.3s ease;
}

.social-icon:hover {
    color: var(--brand-gold);
    transform: scale(1.1);
}