/* Main CSS - Imports all stylesheets */

@import url('variables.css');
@import url('reset.css');
@import url('layout.css');
@import url('components.css');

/* Additional responsive rules */
@media (max-width: 768px) {
    .sidebar {
        width: 280px;
        left: -280px;
    }
    
    .menu-toggle {
        top: 10px;
        left: 10px;
        padding: 12px 16px;
        font-size: 16px;
    }
    
    .booking-form {
        padding: 20px;
    }
    
    .calendar-container {
        padding: 15px;
    }
    
    .info-grid,
    .committee-grid {
        grid-template-columns: 1fr;
    }
    
    .pool-images-half {
        grid-template-columns: 1fr;
    }
    
    .timeline::before {
        left: 15px;
    }
    
    .timeline-item {
        padding-left: 60px;
    }
    
    .timeline-year {
        width: 40px;
        height: 40px;
        font-size: 0.9em;
    }
}

@media (max-width: 480px) {
    .hero-title {
        font-size: 2em;
    }
    
    .hero-subtitle {
        font-size: 0.9em;
        letter-spacing: 2px;
    }
    
    .calendar-day-header {
        font-size: 0.7em;
        padding: 5px;
    }
}