/* ========================================
   Enhanced Responsive Styles for All Pages
   ======================================== */

/* Extra Large Devices (1400px and up) */
@media only screen and (min-width: 1400px) {
    .container {
        max-width: 1320px;
    }
}

/* Large Devices (1200px to 1399px) */
@media only screen and (max-width: 1399px) {
    .hero-content h1 {
        font-size: 56px;
    }

    .section-title h2 {
        font-size: 42px;
    }
}

/* Medium-Large Devices (992px to 1199px) */
@media only screen and (max-width: 1199px) {
    .hero-content h1 {
        font-size: 48px;
    }

    .section-title h2 {
        font-size: 36px;
    }

    .navbar-nav .nav-link {
        padding: 8px 15px;
        font-size: 15px;
    }

    .header-btn .btn-default {
        padding: 12px 25px;
        font-size: 14px;
    }
}

/* Tablet Devices (768px to 991px) */
@media only screen and (max-width: 991px) {

    /* Header Adjustments */
    .main-header {
        padding: 15px 0;
    }

    .navbar-brand img {
        max-width: 140px;
    }

    /* Hero Section */
    .hero-content {
        padding: 80px 0;
    }

    .hero-content h1 {
        font-size: 40px;
        line-height: 1.2em;
    }

    .hero-content p {
        font-size: 16px;
        margin-bottom: 25px;
    }

    /* Section Spacing */
    .our-services,
    .why-choose-us,
    .our-projects,
    .our-testimonials,
    .our-blog {
        padding: 60px 0;
    }

    .about-us,
    .about-us-content {
        padding: 10px 0;
    }

    .section-title h2 {
        font-size: 32px;
        margin-bottom: 15px;
    }

    .section-title h3 {
        font-size: 16px;
    }

    /* Service Items */
    .service-item {
        margin-bottom: 30px;
    }

    .service-body {
        padding: 25px 20px;
    }

    .service-content h3 {
        font-size: 20px;
    }

    /* Project Items */
    .project-item {
        margin-bottom: 30px;
    }

    /* Blog Items */
    .blog-item {
        margin-bottom: 30px;
    }

    /* Footer */
    .main-footer {
        padding: 60px 0 30px;
    }

    .footer-links,
    .about-footer,
    .newsletter-form {
        margin-bottom: 30px;
    }
}

/* Mobile Landscape (576px to 767px) */
@media only screen and (max-width: 767px) {

    /* Typography */
    body {
        font-size: 15px;
    }

    h1 {
        font-size: 32px;
    }

    h2 {
        font-size: 28px;
    }

    h3 {
        font-size: 22px;
    }

    /* Header */
    .navbar-brand img {
        max-width: 120px;
    }

    /* Hero Section */
    .hero-content {
        padding: 60px 0;
        text-align: center;
    }

    .hero-content h1 {
        font-size: 32px;
        margin-bottom: 15px;
    }

    .hero-content p {
        font-size: 15px;
        margin-bottom: 20px;
    }

    .hero-content .btn-default {
        padding: 12px 30px;
        font-size: 14px;
    }

    /* Page Header */
    .page-header {
        padding: 120px 0 50px;
    }

    .page-header-box h1 {
        font-size: 32px;
    }

    /* Section Spacing */
    .about-us,
    .our-services,
    .why-choose-us,
    .our-projects,
    .our-testimonials,
    .our-blog,
    .about-us-content,
    .services-grid,
    .projects-showcase,
    .blog-listing,
    .contact-page-content {
        padding: 50px 0;
    }

    .section-row {
        margin-bottom: 30px;
    }

    .section-title {
        margin-bottom: 30px;
    }

    .section-title h2 {
        font-size: 28px;
        line-height: 1.3em;
    }

    .section-title p {
        font-size: 15px;
    }

    /* About Section */
    .about-content {
        margin-bottom: 30px;
    }

    .about-image {
        margin-bottom: 30px;
    }

    /* Service Items */
    .service-item {
        margin-bottom: 25px;
    }

    .service-body {
        padding: 20px 15px;
    }

    .service-content h3 {
        font-size: 18px;
        margin-bottom: 10px;
    }

    .service-content p {
        font-size: 14px;
        line-height: 1.6em;
    }

    /* Why Choose Us */
    .why-choose-item {
        padding: 25px 20px;
        margin-bottom: 20px;
    }

    .why-choose-item .icon-box {
        width: 60px;
        height: 60px;
        margin-bottom: 15px;
    }

    .why-choose-item h3 {
        font-size: 18px;
    }

    /* Project Items */
    .project-item {
        margin-bottom: 25px;
    }

    .project-content {
        padding: 20px 15px;
    }

    .project-content h3 {
        font-size: 18px;
    }

    /* Testimonial Items */
    .testimonial-item {
        padding: 25px 20px;
    }

    .testimonial-content p {
        font-size: 15px;
        line-height: 1.6em;
    }

    /* Blog Items */
    .blog-item .blog-content {
        padding: 20px;
    }

    .blog-item .blog-content h3 {
        font-size: 18px;
    }

    /* Contact Page - New Inline Design */
    .contact-info-bar {
        padding: 30px 25px;
        margin-bottom: 40px;
    }

    .contact-info-inline {
        padding: 15px 0;
    }

    .col-lg-4.col-md-12 .contact-info-inline {
        margin-top: 10px;
    }

    .contact-form {
        margin-bottom: 30px;
    }

    /* Footer */
    .main-footer {
        padding: 50px 0 20px;
    }

    .main-footer-box {
        margin-bottom: 30px;
    }

    .footer-contact-details {
        flex-direction: column;
        gap: 20px;
    }

    .footer-contact-item {
        width: 100%;
    }

    .footer-links h3 {
        font-size: 18px;
        margin-bottom: 15px;
    }

    .footer-copyright {
        padding: 20px 0;
    }

    .footer-copyright-text,
    .footer-privacy-policy {
        text-align: center;
        margin-bottom: 15px;
    }

    .footer-privacy-policy ul {
        justify-content: center;
    }
}

/* Mobile Portrait (up to 575px) */
@media only screen and (max-width: 575px) {

    /* Typography */
    body {
        font-size: 14px;
    }

    h1 {
        font-size: 28px;
    }

    h2 {
        font-size: 24px;
    }

    h3 {
        font-size: 18px;
    }

    /* Container Padding */
    .container {
        padding-left: 20px;
        padding-right: 20px;
    }

    /* Header */
    .main-header {
        padding: 0;
    }

    .navbar {
        padding: 5px 0;
    }

    .navbar-brand img {
        max-width: 80px;
    }

    /* Hero Section */
    .hero {
        padding: 120px 0 60px !important;
        min-height: auto !important;
    }

    .hero-content {
        padding: 30px 0;
    }

    .hero-content h1 {
        font-size: 26px;
        margin-bottom: 12px;
        line-height: 1.3em;
    }

    .hero-content p {
        font-size: 14px;
        margin-bottom: 18px;
        line-height: 1.6em;
    }

    .hero-content .btn-default {
        padding: 10px 25px;
        font-size: 13px;
    }

    .hero-image {
        margin-bottom: 0;
        margin-top: 30px;
    }

    .hero.hero-slider-layout .swiper-button-next,
    .hero.hero-slider-layout .swiper-button-prev {
        width: 40px;
        height: 40px;
    }

    .hero.hero-slider-layout .swiper-button-next:after,
    .hero.hero-slider-layout .swiper-button-prev:after {
        font-size: 16px;
    }

    /* Page Header */
    .page-header {
        padding: 100px 0 40px;
    }

        .page-header-box h1 {
            font-size: 26px;
            margin-bottom: 10px;
        }

        .breadcrumb {
            padding: 8px 15px;
            font-size: 12px;
        }

        /* Hide About Section Images on Mobile */
        .about-img-1,
        .about-img-2 {
            display: none !important;
        }

        /* Remove space from about-us-images container when images are hidden */
        .about-us-images {
            display: none !important;
        }

    .our-projects,
    .our-testimonials,
    .our-blog,
    .about-us-content,
    .services-grid,
    .projects-showcase,
    .blog-listing,
    .contact-page-content {
        padding: 40px 0;
    }

    .about-us,
    .about-us-content {
        padding: 10px 0;
    }

    .section-row {
        margin-bottom: 25px;
    }

    .section-title h2 {
        font-size: 24px;
        line-height: 1.3em;
        margin-bottom: 12px;
    }

    .section-title h3 {
        font-size: 14px;
        margin-bottom: 10px;
    }

    .section-title p {
        font-size: 14px;
        line-height: 1.6em;
    }

    /* Buttons */
    .btn-default {
        padding: 10px 25px;
        font-size: 13px;
    }

    .readmore-btn {
        font-size: 13px;
    }

    /* Service Items */
    .service-item {
        margin-bottom: 20px;
    }

    .service-body {
        padding: 18px 15px;
    }

    .service-body .icon-box {
        width: 50px;
        height: 50px;
        margin-bottom: 12px;
    }

    .service-content h3 {
        font-size: 17px;
        margin-bottom: 8px;
    }

    .service-content p {
        font-size: 13px;
        line-height: 1.5em;
        margin-bottom: 12px;
    }

    /* Why Choose Us */
    .why-choose-item {
        padding: 20px 15px;
        margin-bottom: 15px;
    }

    .why-choose-item .icon-box {
        width: 60px;
        height: 60px;
        margin-bottom: 12px;
    }

    .why-choose-item h3 {
        font-size: 16px;
        margin-bottom: 8px;
    }

    .why-choose-item p {
        font-size: 13px;
    }

    /* Project Items */
    .project-item {
        margin-bottom: 20px;
    }

    .project-content {
        padding: 0px 15px;
    }

    .project-content h3 {
        font-size: 17px;
    }

    .project-meta {
        font-size: 12px;
    }

    /* Testimonial Items */
    .testimonial-item {
        padding: 20px 15px;
    }

    .testimonial-content p {
        font-size: 14px;
        line-height: 1.5em;
    }

    .testimonial-author h4 {
        font-size: 16px;
    }

    .testimonial-author span {
        font-size: 12px;
    }

    /* Blog Items */
    .blog-item .blog-image img {
        height: 200px;
    }

    .blog-item .blog-content {
        padding: 18px 15px;
    }

    .blog-item .blog-meta {
        gap: 12px;
        margin-bottom: 10px;
    }

    .blog-item .blog-meta span {
        font-size: 12px;
    }

    .blog-item .blog-content h3 {
        font-size: 16px;
        margin-bottom: 10px;
    }

    .blog-item .blog-content p {
        font-size: 13px;
        margin-bottom: 12px;
    }

    /* Contact Page - New Inline Design */
    .contact-info-bar {
        padding: 25px 20px;
        margin-bottom: 30px;
    }

    .contact-info-inline {
        padding: 15px 0;
        flex-direction: row;
        gap: 15px;
    }

    .contact-icon {
        width: 50px;
        height: 50px;
        min-width: 50px;
    }

    .contact-icon i {
        font-size: 20px;
    }

    .contact-label {
        font-size: 12px;
    }

    .contact-value {
        font-size: 15px;
    }

    .contact-time {
        font-size: 11px;
    }

    .contact-form {
        padding: 20px 15px;
        margin-bottom: 25px;
    }

    .contact-form h3 {
        font-size: 20px;
        margin-bottom: 20px;
    }

    .contact-form .form-control {
        padding: 12px 15px;
        font-size: 14px;
    }

    .contact-image {
        min-height: 250px;
    }

    /* Footer */
    .main-footer {
        padding: 40px 0 15px;
    }

    .footer-logo img {
        max-width: 90px;
    }

    .footer-contact-item {
        padding: 15px;
        margin-bottom: 15px;
    }

    .footer-contact-item h3 {
        font-size: 16px;
    }

    .footer-contact-item p {
        font-size: 12px;
    }

    .footer-links h3 {
        font-size: 16px;
        margin-bottom: 12px;
    }

    .footer-links ul li {
        margin-bottom: 8px;
    }

    .footer-links ul li a {
        font-size: 13px;
    }

    .footer-social-links ul li {
        width: 35px;
        height: 35px;
    }

    .footer-social-links ul li a {
        font-size: 14px;
    }

    .newsletter-form .form-control {
        padding: 10px 15px;
        font-size: 13px;
    }

    .footer-copyright {
        padding: 15px 0;
    }

    .footer-copyright-text p {
        font-size: 12px;
    }

    .footer-privacy-policy ul li a {
        font-size: 12px;
    }

    /* Extra Small Devices (up to 400px) */
    @media only screen and (max-width: 400px) {
        .hero-content h1 {
            font-size: 22px;
        }

        .section-title h2 {
            font-size: 20px;
        }

        .page-header-box h1 {
            font-size: 22px;
        }

        .service-content h3,
        .project-content h3,
        .blog-item .blog-content h3 {
            font-size: 15px;
        }

        .contact-info-item h3 {
            font-size: 15px;
        }
    }

    /* Landscape Orientation Fixes */
    @media only screen and (max-height: 600px) and (orientation: landscape) {
        .hero-content {
            padding: 40px 0;
        }

        .page-header {
            padding: 80px 0 30px;
        }
    }

    /* Print Styles */
    @media print {
        .main-header,
        .hero,
        .footer-social-links,
        .newsletter-form,
        .btn-default,
        .readmore-btn {
            display: none;
        }

        body {
            font-size: 12pt;
            color: #000;
        }

        .container {
            max-width: 100%;
        }
    }
}