/* -------------------------------------------------------------------------- */
/* Sasa Cooling System                                                        */
/* Responsive Stylesheet                                                      */
/* -------------------------------------------------------------------------- */

/* -------------------------------------------------------------------------- */
/* Large Desktops & Laptops (adjustments if needed from premium_theme)      */
/* (Screens < 1400px, if specific styles were made for >1400px)              */
/* -------------------------------------------------------------------------- */
@media (max-width: 1399.98px) {
    /* Example: If container max-width for 1400px was too large for slightly smaller screens */
    /* .container { max-width: 1140px; } // Already handled in main_style.css */

    /* Adjust very large hero font sizes if needed */
    .hero-title {
        /* font-size: 4.5rem; // Example adjustment */
    }
}

/* -------------------------------------------------------------------------- */
/* Desktops & Laptops (Screens < 1200px)                                      */
/* -------------------------------------------------------------------------- */
@media (max-width: 1199.98px) {
    .container {
        /* max-width: 960px; // Handled by main_style.css container logic */
    }

    /* Adjust hero font sizes further if needed */
    .hero-title {
        font-size: calc(2rem + 2.8vw); /* Further reduce responsive scaling */
    }
    .hero-subtitle {
        font-size: calc(0.9rem + 0.4vw);
    }

    .section-title-elegant h2 { font-size: calc(1.4rem + 1.3vw); }
    .section-title-elegant .title-description { font-size: 1rem; }

    .cta-title { font-size: calc(1.5rem + 1.6vw); }

    .service-card-title { font-size: 1.3rem; }
    .feature-title { font-size: 1.15rem; }
}


/* -------------------------------------------------------------------------- */
/* Tablets (Screens < 992px)                                                  */
/* -------------------------------------------------------------------------- */
@media (max-width: 991.98px) {
    /* .container { max-width: 720px; } // Handled by main_style.css */

    /* Header & Navigation for Tablets */
    .site-header-premium .header-container-premium {
        position: relative; /* For positioning mobile menu */
    }

    .nav-toggler-premium {
        display: flex; /* Show hamburger icon */
        flex-direction: column;
        justify-content: space-around;
        width: 30px;
        height: 24px; /* Height of the icon */
        background: transparent;
        border: none;
        cursor: pointer;
        padding: 0;
        z-index: 10; /* Above menu items initially */
    }
    .nav-toggler-premium span {
        display: block;
        width: 100%;
        height: 3px;
        background-color: var(--color-dark);
        border-radius: 3px;
        transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); /* Smooth animation */
    }
    /* Hamburger animation to X */
    .nav-toggler-premium.active span:nth-child(1) {
        transform: translateY(7.5px) rotate(45deg); /* Adjusted for 24px height */
    }
    .nav-toggler-premium.active span:nth-child(2) {
        opacity: 0;
    }
    .nav-toggler-premium.active span:nth-child(3) {
        transform: translateY(-10.5px) rotate(-45deg); /* Adjusted for 24px height */
    }

    .nav-menu-premium {
        display: none; /* Hide desktop menu items container by default */
        flex-direction: column;
        position: absolute;
        top: 100%; /* Position below header */
        left: 0;
        width: 100%;
        background-color: var(--color-white);
        box-shadow: var(--box-shadow-md);
        padding: var(--spacing-unit) 0;
        border-top: 1px solid var(--color-bg-medium);
    }
    .nav-menu-premium.active {
        display: flex; /* Show when toggler is active */
    }
    .nav-item-premium {
        margin-left: 0;
        width: 100%;
        text-align: center; /* Or left */
    }
    .nav-link-premium {
        display: block;
        padding: calc(var(--spacing-unit) * 0.8) var(--spacing-unit); /* 12.8px 16px */
        border-bottom: 1px solid var(--color-bg-light);
    }
    .nav-item-premium:last-child .nav-link-premium {
        border-bottom: none;
    }
    .nav-link-premium::after { /* Remove underline effect for mobile items or restyle */
        display: none;
    }
    .nav-item-premium.active .nav-link-premium,
    .nav-link-premium:hover {
        background-color: var(--color-bg-light);
        color: var(--color-primary);
    }
    .nav-item-cta-premium { /* Adjust CTA button in mobile menu */
        padding: var(--spacing-unit) 0;
    }
    .nav-item-cta-premium .btn-primary-premium {
        width: auto; /* Or 80% and margin auto for centered button */
        display: inline-block;
    }


    /* General Font Sizes & Layout for Tablets */
    .hero-title { font-size: calc(1.8rem + 2.5vw); }
    .hero-subtitle { font-size: calc(0.8rem + 0.3vw); }
    .hero-section-premium { min-height: 550px; height: auto; padding: 100px 0; } /* Adjust hero height */


    h1 { font-size: 2.8rem; }
    h2 { font-size: 2.2rem; }
    .section-title-elegant h2 { font-size: calc(1.3rem + 1vw); }


    /* Stack columns in sections - using generic approach */
    /* If using Bootstrap-like col classes, they often handle this. Otherwise: */
    .row {
        /* flex-direction: column; // Can cause issues if some rows shouldn't stack */
    }
    .col-lg-6, .col-lg-4, .col-lg-3,
    .col-md-6 /* md usually stacks below this point */ {
        flex: 0 0 100%; /* Make columns full width */
        max-width: 100%;
        margin-bottom: var(--spacing-unit) * 1.5; /* Add space between stacked items */
    }
    .about-snippet-section .col-lg-6:last-child {
        margin-top: var(--spacing-unit) * 2; /* Space after image on tablet */
    }
    .key-services-section .row .col-lg-4:last-child, /* Remove margin for last items if needed */
    .why-choose-us-section .row .col-lg-3:last-child {
        margin-bottom: 0;
    }


    .service-card-premium, .feature-item-premium {
        margin-bottom: var(--spacing-unit) * 1.5;
    }

    /* Footer widgets stacking */
    .footer-widgets-premium .col-lg-4,
    .footer-widgets-premium .col-lg-3,
    .footer-widgets-premium .col-lg-2 {
        text-align: center; /* Center footer content when stacked */
        margin-bottom: var(--spacing-unit) * 2;
    }
    .footer-widgets-premium .col-lg-4:last-child,
    .footer-widgets-premium .col-lg-3:last-child,
    .footer-widgets-premium .col-lg-2:last-child {
        margin-bottom: 0;
    }
    .widget-title-premium::after { /* Center title underline */
        margin-left: auto;
        margin-right: auto;
    }
    .footer-widget-premium ul {
        padding-left: 0;
    }
}


/* -------------------------------------------------------------------------- */
/* Small Tablets & Landscape Mobiles (Screens < 768px)                       */
/* -------------------------------------------------------------------------- */
@media (max-width: 767.98px) {
    /* .container { max-width: 540px; } // Handled by main_style.css */

    .section-padding-premium {
        padding-top: calc(var(--spacing-unit) * 3);    /* 48px */
        padding-bottom: calc(var(--spacing-unit) * 3); /* 48px */
    }

    .hero-title { font-size: 2.5rem; }
    .hero-subtitle { font-size: 1rem; }
    .hero-section-premium { padding: 80px 0; min-height: 480px; }
    .hero-cta-group .btn-premium {
        display: block; /* Stack buttons */
        width: 80%;
        margin: 0.5rem auto;
    }

    h1 { font-size: 2.2rem; }
    h2 { font-size: 1.8rem; }
    .section-title-elegant h2 { font-size: 1.8rem; }
    .section-title-elegant .title-description { font-size: 0.95rem; }

    .testimonial-quote p { font-size: 1rem; }
    .testimonial-author { flex-direction: column; text-align: center; }
    .author-img { margin-right: 0; margin-bottom: 0.5rem; }

    .cta-title { font-size: 2rem; }
    .cta-text { font-size: 1rem; }

    /* Ensure all columns are stacked if not already */
    .col-md-6 {
        margin-bottom: var(--spacing-unit) * 1.5;
    }
    .key-services-section .row .col-md-6:nth-last-child(-n+2):not(:last-child), /* Handle pairs of cards if they were 2 per row */
    .key-services-section .row .col-md-6:last-child {
        margin-bottom: 0; /* Ensure last items or last pair have correct margin */
    }
    .key-services-section .row .col-md-6 { margin-bottom: var(--spacing-unit) * 1.5; } /* general rule */
    .key-services-section .row .col-md-6:last-of-type { margin-bottom: 0; } /* specific for very last */



    /* Footer: Ensure single column for widgets, center content */
    .footer-widgets-premium .col-md-6 {
        text-align: center;
        margin-bottom: var(--spacing-unit) * 2;
    }
     .footer-widgets-premium .col-md-6:last-child {
        margin-bottom: 0;
    }
}


/* -------------------------------------------------------------------------- */
/* Portrait Mobiles (Screens < 576px)                                        */
/* -------------------------------------------------------------------------- */
@media (max-width: 575.98px) {
    /* .container { padding-right: 10px; padding-left: 10px; } // Slightly reduce container padding */

    .site-header-premium {
        padding: calc(var(--spacing-unit) * 0.5) 0;
    }
    .site-header-premium.scrolled {
        padding: calc(var(--spacing-unit) * 0.4) 0;
    }
    .site-logo-premium { max-height: 40px; }
    .site-header-premium.scrolled .site-logo-premium { max-height: 35px; }


    .hero-title { font-size: 2rem; }
    .hero-subtitle { font-size: 0.9rem; max-width: 90%; }
    .hero-section-premium { padding: 60px 0; min-height: 400px; }
    .hero-cta-group .btn-premium { font-size: 0.85rem; padding: 0.7rem 1.2rem; }


    h1 { font-size: 1.8rem; }
    h2 { font-size: 1.6rem; }
    .section-title-elegant h2 { font-size: 1.6rem; }
    .section-title-elegant .subtitle-premium { font-size: 0.8rem; }
    .section-title-elegant::after { width: 50px; height: 2px; }

    .service-card-premium, .feature-item-premium {
        padding: var(--spacing-unit) * 1.2;
    }
    .service-card-icon { font-size: 2.5rem; }
    .service-card-title { font-size: 1.2rem; }
    .service-card-text { font-size: 0.9rem; }

    .btn-premium.btn-lg {
        font-size: 0.9rem;
        padding: 0.8rem 1.5rem;
    }

    .cta-title { font-size: 1.7rem; }

    .footer-widgets-premium {
        text-align: center; /* Ensure all footer content is centered */
    }
     .footer-widget-premium {
        margin-bottom: calc(var(--spacing-unit) * 2);
    }
    .footer-widget-premium:last-child {
        margin-bottom: 0;
    }
    .footer-contact-info-premium p, .footer-widget-premium li { font-size: 0.9rem; }
    .footer-bottom-premium p { font-size: 0.85rem; }

    .back-to-top-premium {
        width: 35px;
        height: 35px;
        font-size: 1rem;
        bottom: 15px;
        right: 15px;
    }
}