body { 
    background-color: #0a0d1d; 
    scroll-behavior: smooth; 
}

.main-wrapper { 
    background-color: #f6f7f9; 
    border-bottom-left-radius: 2rem; 
    border-bottom-right-radius: 2rem; 
    overflow: hidden; 
    box-shadow: 0 10px 30px rgba(0,0,0,0.1); 
    position: relative; 
    z-index: 10; 
    padding-bottom: 3rem; 
    min-height: 100vh; 
}

/* Personalización del Scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }

/* MAGIA DEL GLASSMORPHISM AL HACER SCROLL */
.header-wrapper { transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); }
.header-inner { transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); }

/* Cuando el usuario baja, se estira hasta los bordes y se vuelve cristal */
.scrolled .header-wrapper { padding: 0 !important; }
.scrolled .header-inner {
    max-width: 100% !important;
    border-radius: 0 !important;
    background-color: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: blur(24px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(180%) !important;
    border-color: rgba(226, 232, 240, 0.6) !important;
    border-top-color: transparent !important;
    border-left-color: transparent !important;
    border-right-color: transparent !important;
    box-shadow: 0 4px 20px -2px rgba(0, 0, 0, 0.05) !important;
}