@media (max-width: 1400px) {
    .hero-title img {
        max-width: 90%;
    }

    .case-study-box-items .thumb img {
        width: 100%;
        height: auto;
    }
}

/* Large devices (desktops, 992px to 1199px) */
@media (max-width: 1199px) {
    /* Hero Section */
    .hero-content h1 {
        font-size: 55px;
    }

    .hero-title img {
        max-width: 80%;
    }

    .video-right {
        margin-top: 30px;
    }

    /* Service Section */
    .service-box-items {
        padding: 30px 20px;
    }

    /* About Section */
    .circle-progress-bar-wrapper {
        flex-wrap: wrap;
        gap: 20px;
    }

    /* Case Study Section */
    .case-study-box-items .post-box-items ul li a {
        font-size: 14px;
    }

    .case-study-box-items .project-title a {
        font-size: 20px;
    }

    /* Pricing Section */
    .pricing-box-items {
        padding: 25px;
    }

    .pricing-header h2 {
        font-size: 32px;
    }

    /* Testimonial Section */
    .testimonial-box-items {
        padding: 30px;
    }

    /* News Section */
    .news-box-items .news-content h5 a {
        font-size: 18px;
    }

    /* Footer */
    .single-footer-widget {
        margin-bottom: 30px;
    }
}

/* Medium devices (tablets, 768px to 991px) */
@media (max-width: 991px) {
    /* General */
    .section-padding {
        padding: 60px 0;
    }

    .section-title h2 {
        font-size: 32px;
    }

    /* Hero Section */
    .hero-content {
        text-align: center;
        margin-bottom: 30px;
    }

    .hero-content h1 {
        font-size: 45px;
    }

    .hero-title {
        text-align: center;
        margin-bottom: 20px;
    }

    .hero-title img {
        max-width: 70%;
    }

    .hero-image {
        text-align: center;
    }

    .hero-image img {
        max-width: 80%;
    }

    .video-right {
        text-align: center;
        margin-top: 30px;
    }

    .video-right .video-btn {
        margin: 0 auto 20px;
    }

    .client-items {
        justify-content: center;
    }

    /* Service Section */
    .section-title-area {
        text-align: center;
        margin-bottom: 40px;
    }

    .service-box-items {
        margin-bottom: 30px;
    }

    /* About Section */
    .about-image {
        margin-bottom: 40px;
    }

    .about-image img {
        width: 100%;
        max-width: 500px;
        margin: 0 auto;
        display: block;
    }

    .about-content {
        text-align: center;
    }

    .circle-progress-bar-wrapper {
        justify-content: center;
    }

    /* Case Study Section */
    .section-title-area {
        flex-direction: column;
        text-align: center;
    }

    .section-title-area .main-button {
        margin-top: 20px;
    }

    .case-study-box-items {
        margin-bottom: 40px;
    }

    .case-study-box-items .thumb {
        min-height: auto;
    }

    .case-study-box-items .post-box-items {
        position: relative;
        margin-top: 20px;
        flex-wrap: wrap;
        gap: 20px;
    }

    /* Audience Section */
    .audience-content {
        text-align: center;
        margin-bottom: 40px;
    }

    .audience-content .client-items {
        justify-content: center;
    }

    .audience-right {
        text-align: center;
    }

    .audience-img img {
        width: 100%;
        height: auto;
    }

    .counter-box-area {
        flex-direction: column;
        gap: 30px;
    }

    .counter-box {
        text-align: center;
    }

    /* Team Section */
    .team-image {
        margin-bottom: 40px;
        text-align: center;
    }

    .team-image img {
        max-width: 80%;
    }

    .team-content {
        text-align: center;
    }

    .list-items {
        justify-content: center;
    }

    /* Pricing Section */
    .pricing-content {
        text-align: center;
        margin-bottom: 40px;
    }

    .pricing-tab-header {
        display: inline-flex;
        justify-content: center;
    }

    .pricing-box-items {
        margin-bottom: 30px;
    }

    /* Testimonial Section */
    .testimonial-wrapper .section-title-area {
        text-align: center;
        margin-bottom: 40px;
    }

    .testimonial-left {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 30px;
    }

    .testimonial-left .client-img {
        margin-bottom: 0;
    }

    /* Contact Section */
    .contact-section .section-title-area {
        text-align: center;
    }

    .contact-form-area {
        margin-bottom: 40px;
    }

    .contact-map {
        height: 400px;
    }

    .contact-info-wrapper {
        width: 90%;
        left: 5%;
        right: auto;
        padding: 20px;
    }

    .contact-info-wrapper h2 {
        font-size: 24px;
    }

    /* News Section */
    .news-box-items {
        margin-bottom: 30px;
    }

    /* CTA Section */
    .cta-wrapper {
        text-align: center;
        padding: 40px 20px;
    }

    .cta-img {
        margin: 0 auto 20px;
        text-align: center;
    }

    .cta-wrapper h2 {
        font-size: 28px;
        margin-bottom: 20px;
    }

    /* Footer */
    .footer-wrapper {
        flex-direction: column;
        text-align: center;
        gap: 15px;
    }

    .footer-menu {
        justify-content: center;
    }

    .footer-input {
        max-width: 300px;
        margin: 20px auto 0;
    }
}

/* Small devices (landscape phones, 576px to 767px) */
@media (max-width: 767px) {
    /* General */
    .section-padding {
        padding: 50px 0;
    }

    .section-title h2 {
        font-size: 28px;
    }

    .sub-title span {
        font-size: 14px;
        padding: 5px 15px;
    }

    /* Hero Section */
    .hero-content h1 {
        font-size: 36px;
    }

    .hero-content span {
        font-size: 14px;
    }

    .hero-content p {
        font-size: 14px;
    }

    .hero-title img {
        max-width: 90%;
    }

    /* Service Section */
    .service-box-items {
        padding: 25px 15px;
    }

    .service-box-items h4 a {
        font-size: 20px;
    }

    /* About Section */
    .brand-wrapper {
        flex-direction: column;
        text-align: center;
        gap: 20px;
    }

    .brand-title {
        margin-bottom: 0;
    }

    .about-content h2 {
        font-size: 24px;
    }

    .single-circle-bar {
        width: 120px;
    }

    .single-circle-bar .content h6 {
        font-size: 14px;
    }

    /* Case Study Section */
    .case-study-box-items .project-title a {
        font-size: 18px;
    }

    .case-study-box-items .number {
        font-size: 60px;
        right: 15px;
        bottom: 15px;
    }

    .main-box .box {
        padding: 20px;
    }

    .main-box .box h3 a {
        font-size: 18px;
    }

    /* Audience Section */
    .audience-content h2 {
        font-size: 24px;
    }

    .counter-box h2 {
        font-size: 36px;
    }

    .counter-box h4 {
        font-size: 18px;
    }

    /* Team Section */
    .team-content h2 {
        font-size: 24px;
    }

    .list-items ul li {
        font-size: 14px;
    }

    /* Pricing Section */
    .pricing-header h2 {
        font-size: 28px;
    }

    .pricing-header h4 {
        font-size: 18px;
    }

    .price-list li {
        font-size: 14px;
        flex-wrap: wrap;
    }

    /* Testimonial Section */
    .testimonial-box-items {
        text-align: center;
        padding: 20px;
    }

    .testimonial-box-items .testimonial-img {
        margin: 20px auto;
    }

    .testimonial-box-items .content p {
        font-size: 14px;
    }

    /* Contact Section */
    .contact-form-area h3 {
        font-size: 24px;
    }

    .form-clt input,
    .form-clt textarea,
    .form-clt select {
        padding: 12px 15px;
    }

    .contact-info-wrapper {
        position: relative;
        transform: none;
        top: auto;
        width: 100%;
        left: 0;
        margin-top: 20px;
    }

    .contact-map {
        height: 500px;
        display: flex;
        flex-direction: column;
    }

    .contact-map iframe {
        height: 300px;
    }

    /* News Section */
    .news-box-items .news-content h5 a {
        font-size: 16px;
    }

    .post-cat li {
        font-size: 12px;
    }

    /* CTA Section */
    .cta-wrapper h2 {
        font-size: 24px;
    }

    /* Footer */
    .single-footer-widget {
        text-align: center;
    }

    .social-icon {
        justify-content: center;
    }

    .recent-post-items {
        flex-direction: column;
        text-align: center;
    }

    .recent-post-items .thumb {
        margin: 0 auto 10px;
    }

    .contact-info {
        justify-content: center;
    }

    .footer-input {
        width: 100%;
        max-width: 100%;
    }
}

/* Extra small devices (portrait phones, 480px and down) */
@media (max-width: 480px) {
    /* General */
    .section-title h2 {
        font-size: 24px;
    }

    .container-fluid {
        padding-left: 15px;
        padding-right: 15px;
    }

    /* Hero Section */
    .hero-content h1 {
        font-size: 28px;
    }

    .hero-title img {
        max-width: 100%;
    }

    .hero-image img {
        max-width: 100%;
    }

    .video-right .video-btn {
        width: 150px;
        height: 150px;
    }

    .video-right .video-btn img {
        width: 100%;
    }

    .video-right p {
        font-size: 13px;
    }

    /* Service Section */
    .service-box-items .icon img {
        width: 50px;
    }

    .service-box-items h4 a {
        font-size: 18px;
    }

    .service-box-items p {
        font-size: 13px;
    }

    /* About Section */
    .about-content h2 {
        font-size: 20px;
    }

    .about-content p {
        font-size: 13px;
    }

    .circle-progress-bar-wrapper {
        gap: 15px;
    }

    .single-circle-bar {
        width: 100px;
    }

    .single-circle-bar canvas {
        width: 80px !important;
        height: 80px !important;
    }

    .single-circle-bar .content h6 {
        font-size: 12px;
    }

    /* Case Study Section */
    .case-study-box-items .post-box-items {
        flex-direction: column;
        gap: 10px;
    }

    .case-study-box-items .post-box-items ul {
        width: 100%;
    }

    .case-study-box-items .project-title a {
        font-size: 16px;
    }

    .main-box .box .title-items {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .main-box .box .number {
        position: relative;
        top: auto;
        right: auto;
    }

    /* Team Section */
    .list-items {
        flex-direction: column;
        gap: 15px;
    }

    .list-items ul {
        width: 100%;
    }

    /* Pricing Section */
    .pricing-box-items {
        padding: 20px;
    }

    .pricing-header {
        flex-direction: column;
        text-align: center;
        gap: 15px;
    }

    .price-list li {
        font-size: 13px;
    }

    /* Testimonial Section */
    .testimonial-left {
        flex-direction: column;
        gap: 20px;
    }

    .testimonial-box-items .client-info h5 {
        font-size: 18px;
    }

    /* Contact Section */
    .contact-info-wrapper h2 {
        font-size: 20px;
    }

    .contact-info .content h3 {
        font-size: 14px;
    }

    .form-check-label {
        font-size: 12px;
    }

    /* Footer */
    .footer-content p {
        font-size: 13px;
    }

    .list-area li a {
        font-size: 14px;
    }

    .recent-post-items .content h6 a {
        font-size: 14px;
    }

    .footer-bottom p,
    .footer-menu li a {
        font-size: 12px;
    }

    .footer-menu {
        flex-wrap: wrap;
        gap: 10px;
    }
}

/* Fix for marquee section on mobile */
@media (max-width: 768px) {
    .marquee-section-1 {
        overflow: hidden;
    }

    .cmn-textslide {
        font-size: 14px;
        white-space: nowrap;
    }

    .cmn-textslide img {
        width: 16px;
        margin-right: 8px;
    }
}

/* Fix for circle progress bar responsiveness */
@media (max-width: 576px) {
    .circle-progress-bar-wrapper {
        justify-content: center;
    }
}

/* Fix for brand slider */
@media (max-width: 768px) {
    .brand-slider .swiper-slide {
        text-align: center;
    }

    .brand-img img {
        max-width: 120px;
        margin: 0 auto;
    }
}

/* Fix for back to top button on mobile */
@media (max-width: 768px) {
    .back-to-top {
        width: 40px;
        height: 40px;
        line-height: 40px;
        font-size: 16px;
        right: 15px;
        bottom: 15px;
    }
}

/* Fix for preloader on mobile */
@media (max-width: 576px) {
    .txt-loading .letters-loading {
        font-size: 30px;
    }

    .preloader p {
        font-size: 14px;
    }
}

/* Fix for offcanvas on mobile */
@media (max-width: 576px) {
    .offcanvas__info {
        width: 85%;
    }

    .offcanvas__contact h4 {
        font-size: 18px;
    }

    .offcanvas__contact-text a {
        font-size: 13px;
    }
}

/* Fix for nice select on mobile */
@media (max-width: 768px) {
    .nice-select {
        width: 100%;
    }

    .nice-select .list {
        width: 100%;
    }
}

/* Fix for swiper navigation buttons on mobile */
@media (max-width: 576px) {
    .array-button {
        justify-content: center;
    }

    .testimonial-slider {
        padding-bottom: 40px;
    }
}

/* Fix for header on mobile */
@media (max-width: 991px) {
    .header-main {
        padding: 15px 0;
    }

    .logo img {
        max-width: 120px;
    }

    .header-right .main-button .theme-btn {
        padding: 8px 15px;
        font-size: 13px;
    }

    .header-right .main-button .arrow-btn {
        width: 30px;
        height: 30px;
        line-height: 30px;
    }

    .search-icon {
        width: 35px;
        height: 35px;
        line-height: 35px;
    }
}

/* Fix for CTA section rocket shape on mobile */
@media (max-width: 768px) {
    .rokect-shape {
        display: none;
    }
}

/* Fix for various floating shapes on mobile (hide some for better performance) */
@media (max-width: 768px) {
    .left-shape.float-bob-y,
    .right-shape.float-bob-y,
    .left-shape.float-bob-x,
    .right-shape.float-bob-x,
    .arrow-shape,
    .arrow-shape-2,
    .energy-shape,
    .rocket-shape,
    .mike-shape,
    .overlay-shape,
    .grap-shape,
    .box-shape,
    .emoji-shape,
    .bg-shape {
        display: none;
    }
}

/* Improve touch targets on mobile */
@media (max-width: 768px) {
    .main-button a,
    .link-btn,
    .price-button a,
    .theme-btn,
    .nav-link,
    .footer-menu li a,
    .list-area li a,
    .social-icon a {
        cursor: pointer;
    }

    button,
    .array-prev,
    .array-next,
    .back-to-top {
        cursor: pointer;
    }
}

/* Ensure images are responsive */
img {
    max-width: 100%;
    height: auto;
}

/* Improve form elements on mobile */
@media (max-width: 768px) {
    input,
    select,
    textarea,
    button {
        font-size: 16px !important; /* Prevents zoom on iOS */
    }
}

/* Fix for table on mobile if any */
@media (max-width: 768px) {
    .table-responsive {
        overflow-x: auto;
        display: block;
    }
}
