/* ============================================
   RAFAEL ARANZÁLES - LANDING PAGE STYLES
   Organized CSS Architecture
   ============================================ */

/* Base Styles */
@import './base/variables.css';
@import './base/reset.css';
@import './base/animations.css';

/* Layout */
@import './layout/navbar.css';
@import './layout/footer.css';

/* Components */
@import './components/buttons.css';
@import './components/cards.css';
@import './components/accordion.css';
@import './components/carousel.css';
@import './components/forms.css';

/* Sections */
@import './sections/libro.css';
@import './sections/publications.css';

/* Additional utility classes */
.counter {
    font-variant-numeric: tabular-nums;
}

.timeline-dot {
    position: relative;
}

.skill-bar {
    width: 0;
    transition: width 1.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.skill-bar.loaded {
    width: var(--skill-width);
}

/* Para pantallas móviles en general */
@media (max-width: 767px) {
    #inicio>div:first-child {
        background-position: center 35% !important;
        background-attachment: scroll !important;
    }
}

/* Para iPhones específicamente (pantallas más altas) */
@media (max-width: 767px) and (min-aspect-ratio: 9/19) {
    #inicio>div:first-child {
        background-position: center 40% !important;
    }
}

/* Para tablets */
@media (min-width: 768px) and (max-width: 1024px) {
    #inicio>div:first-child {
        background-position: center center !important;
    }
}

/* Para desktop */
@media (min-width: 1025px) {
    #inicio>div:first-child {
        background-position: center center !important;
        background-attachment: fixed !important;
    }
}