/**
 * Pema Responsive Stylesheet
 * @package Pema
 */

/* Extra Large Devices (1200px and up) */
@media (min-width: 1200px) {
    .container {
        max-width: 1140px;
    }
}

/* Large Devices (992px and up) */
@media (max-width: 1199.98px) {
    .container {
        max-width: 960px;
    }
}

/* Medium Devices (768px and up) */
@media (max-width: 991.98px) {
    .container {
        max-width: 720px;
    }
    
    .hero-section {
        padding: 40px 0;
    }
    
    .hero-title {
        font-size: 2.5rem;
    }
    
    .hero-subtitle {
        font-size: 1.3rem;
    }
}

/* Small Devices (576px and up) */
@media (max-width: 767.98px) {
    .container {
        max-width: 540px;
    }
    
    .hero-section {
        padding: 30px 0;
    }
    
    .hero-title {
        font-size: 2rem;
    }
    
    .hero-subtitle {
        font-size: 1.2rem;
    }
    
    .hero-description {
        font-size: 1rem;
    }
    
    .hero-buttons {
        flex-direction: column;
    }
    
    .btn {
        width: 100%;
    }
    
    .col-6 {
        width: 100%;
    }
}

/* Extra Small Devices (575.98px and down) */
@media (max-width: 575.98px) {
    .container {
        max-width: 100%;
        padding: 0 15px;
    }
    
    .hero-section {
        padding: 20px 0;
    }
    
    .hero-title {
        font-size: 1.8rem;
    }
    
    .hero-subtitle {
        font-size: 1.1rem;
    }
    
    .hero-description {
        font-size: 0.95rem;
    }
    
    .btn-lg {
        padding: 12px 30px;
        font-size: 1rem;
    }
}

/* Print Styles */
@media print {
    .slideshow-section,
    .hero-buttons,
    .hero-image {
        display: none;
    }
}