/* ===================================
   Responsive Styles - Fully Fixed
   =================================== */

/* Large Desktop */
@media (min-width: 1400px) {
    .container { max-width: 1320px; }
    .home-banner-text h1 { font-size: 4rem; }
}

/* Desktop */
@media (min-width: 1200px) and (max-width: 1399px) {
    .container { max-width: 1140px; }
    .home-banner-text h1 { font-size: 3.5rem; }
}

/* Tablet Landscape */
@media (min-width: 992px) and (max-width: 1199px) {
    .container { max-width: 960px; }
    .home-banner-text h1 { font-size: 3rem; }
}

/* Tablet Portrait */
@media (min-width: 768px) and (max-width: 991px) {
    .container { max-width: 720px; }

    /* Banner */
    .home-banner-section { padding: 50px 0 60px; }
    .home-banner-text { text-align: center; }
    .home-banner-text h1 { font-size: 2.4rem; }
    .home-banner-text p { font-size: 1rem; }
    .home-banner-button { justify-content: center !important; }
    .banner-img-content { margin-top: 35px; text-align: center; }
    .banner-img-content .banner-img img { max-width: 85%; margin: 0 auto; display: block; }

    /* Sections */
    .interaction-section,
    .solutions-section,
    .customer-base-section,
    .services-section,
    .talent-section,
    .review-section { padding: 60px 0; }

    .interaction-section-text { text-align: center; margin-top: 30px; }
    .interaction-section-img-content img { max-width: 80%; margin: 0 auto; display: block; }

    .interaction-section-text h2,
    .solutions-section-inner h2,
    .services-section-inner h2,
    .talent-section-box h2,
    .review-section-box h2,
    .customer-base-section-text h2 { font-size: 2rem; }

    /* Customer Base */
    .customer-base-section-text { text-align: center; margin-bottom: 35px; }
    .customer-base-sectin-listing { text-align: left; }
    .customer-base-section-btn-outer { text-align: center; }
    .customer-base-section-img-content img { max-width: 85%; margin: 0 auto; display: block; }

    /* Pricing - fix scale on tablet */
    .card[style*="transform:scale(1.05)"],
    .card[style*="transform: scale(1.05)"] {
        transform: scale(1) !important;
    }

    /* Services */
    .services-card { margin-bottom: 25px; }

    /* Talent */
    .talent-section-box { text-align: center; }
    .talent-section-box p { margin-left: auto; margin-right: auto; }

    /* Footer */
    .footer-section { padding: 60px 0 0; }
    .footer-about { margin-bottom: 30px; }
}

/* Mobile Landscape */
@media (min-width: 576px) and (max-width: 767px) {
    .container { max-width: 540px; }

    /* Banner */
    .home-banner-section { padding: 40px 0 50px; }
    .home-banner-text { text-align: center; }
    .home-banner-text h1 { font-size: 1.9rem; }
    .home-banner-text p { font-size: 0.95rem; }
    .home-banner-button { justify-content: center !important; }
    .banner-img-content { margin-top: 30px; text-align: center; }
    .banner-img-content .banner-img img { max-width: 75%; margin: 0 auto; display: block; }

    /* Sections */
    .interaction-section,
    .solutions-section,
    .customer-base-section,
    .services-section,
    .talent-section,
    .review-section { padding: 50px 0; }

    .interaction-section-text { text-align: center; margin-top: 25px; }
    .interaction-section-img-content img { max-width: 75%; margin: 0 auto; display: block; }

    .interaction-section-text h2,
    .solutions-section-inner h2,
    .services-section-inner h2,
    .talent-section-box h2,
    .review-section-box h2,
    .customer-base-section-text h2 { font-size: 1.7rem; }

    /* Customer Base */
    .customer-base-section-text { text-align: center; margin-bottom: 30px; }
    .customer-base-sectin-listing { text-align: left; }
    .customer-base-section-btn-outer { text-align: center; }
    .customer-base-section-img-content img { max-width: 75%; margin: 0 auto; display: block; }

    /* Pricing */
    .card[style*="transform:scale(1.05)"],
    .card[style*="transform: scale(1.05)"] {
        transform: scale(1) !important;
        margin-bottom: 20px;
    }
    .card { margin-bottom: 20px; }

    /* Services */
    .services-card { padding: 30px 20px; margin-bottom: 20px; }
    .services-icon-wrapper { width: 75px; height: 75px; }
    .services-icon-wrapper img { width: 40px; height: 40px; }

    /* Talent */
    .talent-section-box { text-align: center; }
    .talent-section-box p { margin-left: auto; margin-right: auto; }

    /* Review */
    .review-section-inner { padding: 30px 20px; }
    .review-section-review-img-1 img { width: 80px; height: 80px; }

    /* Footer */
    .footer-section { padding: 50px 0 0; }
    .footer-about { text-align: center; margin-bottom: 30px; }
    .footer-about h2 { font-size: 22px !important; }
    .col-lg-2 h5 span,
    .col-lg-3 h5 span { left: 50% !important; transform: translateX(-50%) !important; }

    /* Newsletter */
    .footer-section form { flex-direction: column; }
    .footer-section form input { min-width: 100% !important; }
    .footer-section form button { width: 100%; }
}

/* Mobile Portrait */
@media (max-width: 575px) {
    .container {
        max-width: 100%;
        padding-left: 15px;
        padding-right: 15px;
    }

    /* Banner */
    .home-banner-section { padding: 30px 0 40px; }
    .home-banner-text { text-align: center; }
    .home-banner-text h1 { font-size: 1.55rem !important; line-height: 1.3; }
    .home-banner-text p { font-size: 0.9rem; }
    .home-banner-button { justify-content: center !important; }
    .home-banner-button .free-outer .free { padding: 12px 28px; font-size: 0.95rem; }
    .banner-img-content { margin-top: 25px; text-align: center; }
    .banner-img-content .banner-img img { max-width: 85% !important; margin: 0 auto; display: block; border-radius: 20px; }

    /* Sections */
    .interaction-section,
    .solutions-section,
    .customer-base-section,
    .services-section,
    .talent-section,
    .review-section { padding: 40px 0; }

    /* Interaction */
    .interaction-section-img-content { margin-bottom: 25px; }
    .interaction-section-img-content img { max-width: 80%; margin: 0 auto; display: block; }
    .interaction-section-text { text-align: center; margin-top: 0; }
    .interaction-section-text h2 { font-size: 1.45rem; }
    .interaction-section-text .main-text { font-size: 0.9rem; }
    .interaction-section-listing-inner { padding: 15px; }
    .interaction-section-listing-inner h4 { font-size: 1rem; }
    .interaction-section-listing-inner p { font-size: 0.9rem !important; }

    /* Customer Base */
    .customer-base-section-text { text-align: center; margin-bottom: 25px; }
    .customer-base-section-text h2 { font-size: 1.45rem; }
    .customer-base-section-text p { font-size: 0.9rem; }
    .customer-base-sectin-listing { text-align: left; }
    .customer-base-sectin-listing li { font-size: 0.9rem; }
    .customer-base-section-btn-outer { text-align: center; }
    .customer-base-section-btn-outer .hover-effect { padding: 12px 25px; font-size: 0.9rem; }
    .customer-base-section-img-content { text-align: center; margin-top: 25px; }
    .customer-base-section-img-content img { max-width: 80%; margin: 0 auto; display: block; }

    /* Pricing */
    .py-5 { padding-top: 35px !important; padding-bottom: 35px !important; }
    .card[style*="transform:scale(1.05)"],
    .card[style*="transform: scale(1.05)"] {
        transform: scale(1) !important;
        margin-bottom: 20px;
    }
    .card { margin-bottom: 20px; }
    .card h3 { font-size: 1.2rem; }
    .card h2 { font-size: 1.9rem; }
    .card .btn { width: 100%; }

    /* Services */
    .services-section-inner h2 { font-size: 1.45rem; }
    .services-subtitle { font-size: 0.9rem; }
    .services-card { padding: 25px 18px; margin-bottom: 18px; }
    .services-icon-wrapper { width: 70px; height: 70px; }
    .services-icon-wrapper img { width: 38px; height: 38px; }
    .services-card h4 { font-size: 1.1rem; }
    .services-card p { font-size: 0.9rem; }

    /* Talent */
    .talent-section-box { text-align: center; }
    .talent-section-box h2 { font-size: 1.45rem; }
    .talent-section-box p { font-size: 0.9rem; margin-left: auto; margin-right: auto; }
    .talent-section-button-outer .career { padding: 12px 28px; font-size: 0.95rem; }

    /* Review */
    .review-section-inner { padding: 22px 15px; }
    .review-section-review-img-1 img { width: 70px; height: 70px; }
    .review-section-inner p { font-size: 0.95rem; }
    .review-section-inner .name { font-size: 1rem; }

    /* img-fluid height fix on mobile */
    .img-fluid { height: auto !important; border-radius: 20px; }

    /* Footer */
    .footer-section { padding: 40px 0 0; }
    .footer-about { text-align: center; margin-bottom: 25px; }
    .footer-about h2 { font-size: 20px !important; }
    .footer-about p { font-size: 0.9rem; }
    .col-lg-2 h5,
    .col-lg-3 h5 { text-align: center; }
    .col-lg-2 h5 span,
    .col-lg-3 h5 span { left: 50% !important; transform: translateX(-50%) !important; }
    .col-lg-2 ul li a,
    .col-lg-3 .contact-item { justify-content: center; }
    .contact-item { flex-direction: row; }
    .footer-bottom .col-md-6 { text-align: center !important; }
    .footer-bottom p { font-size: 0.85rem; }

    /* Newsletter */
    .footer-section form { flex-direction: column; }
    .footer-section form input { min-width: 100% !important; }
    .footer-section form button { width: 100%; }

    /* Floating call button spacing on small screens */
    .floating-call-btn { bottom: 20px; right: 20px; width: 52px; height: 52px; }
    .floating-call-btn i { font-size: 20px; }
}

/* Print */
@media print {
    .main-header, .home-banner-button, .footer-section, .footer-bar, .floating-call-btn { display: none; }
    body { font-size: 12pt; }
    .container { max-width: 100%; }
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* ===================================
   Floating Call Button
   =================================== */
.floating-call-btn {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 58px;
    height: 58px;
    background: linear-gradient(135deg, #14b8a6 0%, #06b6d4 100%);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 20px rgba(20, 184, 166, 0.5);
    z-index: 9999;
    transition: all 0.3s ease;
    text-decoration: none;
}

.floating-call-btn:hover {
    transform: scale(1.12);
    box-shadow: 0 10px 30px rgba(20, 184, 166, 0.65);
    color: #fff;
    text-decoration: none;
}

.floating-call-btn i {
    font-size: 22px;
    animation: ring 2s ease-in-out infinite;
}

@keyframes ring {
    0%, 100% { transform: rotate(0deg); }
    10%       { transform: rotate(-15deg); }
    20%       { transform: rotate(15deg); }
    30%       { transform: rotate(-10deg); }
    40%       { transform: rotate(10deg); }
    50%       { transform: rotate(0deg); }
}
