/* Medium screens (tablets) */
@media (min-width: 768px) {
    .nav {
        display: flex;
    }
    
    .menu-toggle {
        display: none;
    }
    
    .hero-title {
        font-size: 3.75rem;
    }
    
    .hero-subtitle {
        font-size: 1.25rem;
    }
    
    .hero-buttons {
        flex-direction: row;
        max-width: none;
        justify-content: center;
    }
    
    .programs-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .contact-content {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .gallery-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Large screens (desktops) */
@media (min-width: 1024px) {
    .header {
        padding: 1.25rem 3rem;
    }
    
    section {
        padding: 6rem 2rem;
    }
    
    .programs-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .hero-content {
        padding-top: 4rem;
    }
    
    .news-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .staff-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    /* Science Centre Image adjustments for large screens */
    .science-centre-image {
        height: 450px;
    }
}

/* Extra large screens */
@media (min-width: 1280px) {
    .hero-title {
        font-size: 4.5rem;
    }
    
    .hero-subtitle {
        font-size: 1.5rem;
    }
    
    .container {
        padding: 0 2rem;
    }
    
    /* Science Centre Image adjustments for extra large screens */
    .science-centre-image {
        height: 500px;
    }
}

/* Small screens */
@media (max-width: 767px) {
    .header {
        padding: 1rem;
    }
    
    .logo {
        font-size: 1.1rem;
    }
    
    .nav {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: white;
        flex-direction: column;
        padding: 1rem;
        box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    }
    
    .nav.active {
        display: flex;
    }
    
    .menu-toggle {
        display: block;
        background: none;
        border: none;
        font-size: 1.5rem;
        cursor: pointer;
        color: var(--dark-text);
    }
    
    .hero-title {
        font-size: 2.5rem;
    }
    
    .hero-subtitle {
        font-size: 1rem;
    }
    
    section {
        padding: 3rem 1rem;
    }
    
    .about-content {
        grid-template-columns: 1fr;
    }
    
    .mission-vision {
        grid-template-columns: 1fr;
    }
    
    /* Science Centre Image adjustments for small screens */
    .science-centre-image {
        height: 300px;
        margin-top: 1.5rem;
    }
    
    .program-card, .news-card, .staff-card, .faq-item {
        padding: 1.5rem;
    }
    
    .contact-content {
        grid-template-columns: 1fr;
    }
    
    /* Social icons adjustments for small screens */
    .social-icons {
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .social-icon {
        width: 45px;
        height: 45px;
    }
    
    .social-img {
        width: 20px;
        height: 20px;
    }
    
    .footer-social {
        justify-content: center;
    }
    
    .event-sample {
        flex-direction: column;
        text-align: center;
    }
    
    .event-date {
        margin-right: 0;
        margin-bottom: 1rem;
    }
    
    /* Staff photo adjustments for small screens */
    .staff-photo {
        width: 120px;
        height: 120px;
    }
}
