/* GBS AC & RO SERVICES - Responsive Layout Stylesheet */

@media (max-width: 1200px) {
    .hero-title {
        font-size: 3.2rem;
    }
}

@media (max-width: 992px) {
    .py-6 {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }
    .hero-slider {
        height: 65vh;
    }
    .hero-title {
        font-size: 2.5rem;
    }
    .hero-subtitle {
        font-size: 1.1rem;
        margin-bottom: 25px;
    }
    .process-line {
        display: none;
    }
}

@media (max-width: 768px) {
    .section-title {
        font-size: 1.5rem !important;
    }
    .hero-slider {
        height: 60vh;
        min-height: 480px;
    }
    .hero-title {
        font-size: 1.8rem !important;
    }
    .hero-subtitle {
        font-size: 0.95rem;
    }
    .hero-buttons .btn {
        padding: 10px 20px;
        font-size: 14px;
    }
    .about-image-frame {
        height: 300px;
        margin-bottom: 20px;
    }
    .contact-page-section .p-5 {
        padding: 30px !important;
    }
    .card,
    .contact-page-section .card,
    .contact-page-section .p-5,
    .contact-page-section .p-4 {
        padding: 24px !important;
    }
    
    /* Floating button responsive fixes */
    .floating-btn {
        width: 50px !important;
        height: 50px !important;
        right: 16px !important;
        font-size: 22px !important;
        z-index: 99999 !important;
    }
    .floating-btn:hover {
        transform: none !important;
    }
    .floating-whatsapp {
        bottom: 80px !important;
        right: 16px !important;
    }
    .floating-call {
        bottom: 140px !important;
        right: 16px !important;
    }
    .floating-btn svg {
        width: 24px !important;
        height: 24px !important;
    }
    .floating-btn .btn-tooltip {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
    }
    
    @keyframes pulseGlowMobile {
        0% {
            transform: scale(0.95);
            opacity: 0.85;
        }
        100% {
            transform: scale(1.4);
            opacity: 0;
        }
    }
    .floating-btn .pulse-ring {
        animation: pulseGlowMobile 1.8s infinite ease-out !important;
    }

    /* Convert horizontal slide animations to vertical on mobile to prevent layout expansion */
    .animate-slide-left {
        transform: translateY(20px) !important;
    }
    .animate-slide-right {
        transform: translateY(20px) !important;
    }
    .animate-slide-left.revealed,
    .animate-slide-right.revealed {
        transform: translateY(0) !important;
    }

    /* Prevent g-5 negative margin from overflowing the container boundaries on mobile */
    .row.g-5 {
        margin-right: -12px !important;
        margin-left: -12px !important;
    }
    .row.g-5 > [class*="col-"] {
        padding-right: 12px !important;
        padding-left: 12px !important;
    }

    /* Global email and select dropdown responsiveness fixes */
    a[href^="mailto:"] {
        word-break: break-all !important;
        font-size: 14px !important;
    }
    .contact-page-section .fw-semibold {
        font-size: 14px !important;
    }
    .form-select, .form-control {
        font-size: 14px !important;
        padding-right: 2.5rem !important; /* Prevent text from overlapping the dropdown arrow */
    }
    .form-floating > label {
        font-size: 14px !important;
    }
}

@media (max-width: 576px) {
    .hero-slider {
        height: 55vh;
        min-height: 420px;
    }
    .hero-title {
        font-size: 1.4rem !important;
        line-height: 1.25 !important;
    }
    .hero-subtitle {
        font-size: 0.85rem;
        margin-bottom: 20px;
    }
    .section-title {
        font-size: 1.3rem !important;
        padding-bottom: 10px;
    }
    h2 {
        font-size: 1.3rem !important;
    }
    h3 {
        font-size: 1.2rem !important;
    }
    h4 {
        font-size: 1.1rem !important;
    }
    .card-title {
        font-size: 1.1rem !important;
    }
    .back-to-top {
        width: 44px;
        height: 44px;
        font-size: 16px;
        bottom: 25px;
        left: 20px;
    }
    .card,
    .contact-page-section .card,
    .contact-page-section .p-5,
    .contact-page-section .p-4 {
        padding: 18px !important;
    }
    .hero-buttons {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        max-width: 350px;
    }
    .hero-buttons .btn {
        width: 100% !important;
        margin-right: 0 !important;
        margin-bottom: 0 !important;
        text-align: center;
    }
    .service-card .card-body .d-flex,
    .service-detail-card .card-body .d-flex {
        flex-direction: column !important;
        gap: 10px !important;
    }
    .service-card .card-body .btn,
    .service-detail-card .card-body .btn {
        width: 100% !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
    }
}