/*------------------------------
    Custom Mobile Adjustments
    VastLink Prime
-------------------------------*/

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

    /* Remove outline from mobile menu items */
    .header .mainmenu .navbar .navbar-nav .nav-item .nav-link {
        outline: none !important;
        box-shadow: none !important;
    }

    .header .mainmenu .navbar .navbar-nav .nav-item .nav-link:focus,
    .header .mainmenu .navbar .navbar-nav .nav-item .nav-link:active,
    .header .mainmenu .navbar .navbar-nav .nav-item .nav-link:hover {
        outline: none !important;
        box-shadow: none !important;
    }

    .header .navbar-toggler:focus {
        outline: none !important;
        box-shadow: none !important;
    }

    /* Footer adjustments for mobile */
    .footer .single-widget .about-area .logo img {
        max-width: 120px !important;
        height: auto;
        margin: 0 auto 15px;
        display: block;
    }

    .footer .single-widget .about-area {
        text-align: center !important;
    }

    .footer .single-widget .about-area p {
        text-align: center !important;
        font-size: 14px !important;
        line-height: 22px !important;
    }

    .footer .single-widget .about-area ul {
        text-align: center !important;
        padding-left: 0 !important;
    }

    .footer .single-widget .about-area ul li {
        text-align: center !important;
        font-size: 13px !important;
        line-height: 26px !important;
    }

    .footer .single-widget .about-area h4 {
        text-align: center !important;
        font-size: 18px !important;
        margin-bottom: 20px !important;
    }

    /* Hide Quick Links on mobile */
    .footer .useful-link {
        display: none !important;
    }

    /* Center footer columns */
    .footer .row {
        justify-content: center !important;
    }

    /* Adjust section spacing for mobile */
    .about {
        padding: 50px 0 !important;
    }

    .service {
        padding: 50px 0 !important;
    }

    .multi-section-1 {
        padding: 50px 0 !important;
    }

    /* Contact section mobile spacing */
    .contact-section {
        min-height: auto !important;
        padding: 40px 0 !important;
    }

    .contact-section .container {
        padding: 0 20px !important;
    }

    .contact-section .address-area .single-address {
        margin-bottom: 20px !important;
        padding: 20px 15px !important;
    }

    .contact-section .contact-form {
        padding: 30px 20px !important;
        margin-top: 30px;
    }

    /* Text size adjustments for better readability */
    body,
    p,
    .footer p,
    .about p,
    .service p {
        font-size: 14px !important;
        line-height: 24px !important;
    }

    h1 {
        font-size: 26px !important;
        line-height: 36px !important;
    }

    h2,
    .section-title h2,
    .about h2 {
        font-size: 24px !important;
        line-height: 34px !important;
    }

    h3 {
        font-size: 18px !important;
        line-height: 28px !important;
    }

    h4 {
        font-size: 16px !important;
        line-height: 26px !important;
    }

    h5 {
        font-size: 15px !important;
        line-height: 24px !important;
    }

    /* Banner text adjustments */
    .animation-slide .single-slide .banner-content h2 {
        font-size: 26px !important;
        line-height: 36px !important;
        margin-bottom: 15px !important;
    }

    .animation-slide .single-slide .banner-content p {
        font-size: 14px !important;
        line-height: 24px !important;
        margin-bottom: 20px !important;
    }

    .animation-slide .single-slide .banner-content {
        padding: 100px 0 !important;
    }

    /* Button adjustments */
    .btn,
    button,
    .submit-button {
        font-size: 14px !important;
        padding: 12px 24px !important;
    }

    /* Service cards spacing */
    .service .single-service {
        margin-bottom: 30px !important;
    }

    /* Quote form spacing */
    .multi-section-1 .quote-form {
        padding: 30px 20px 40px !important;
    }

    .multi-section-1 .quote-form h3 {
        font-size: 20px !important;
        margin-bottom: 20px !important;
    }

    /* Contact form inputs */
    .contact-form input,
    .contact-form textarea,
    .contact-form select {
        font-size: 14px !important;
        padding: 12px 15px !important;
    }

    /* Address cards */
    .address-area .single-address h4 {
        font-size: 16px !important;
        margin-bottom: 10px !important;
    }

    .address-area .single-address p,
    .address-area .single-address span {
        font-size: 13px !important;
        line-height: 22px !important;
    }

    /* WhatsApp link styling */
    .whatsapp-text {
        font-size: 12px !important;
    }

    .single-address-card .part-text a.info:hover {
        color: #007bff !important;
        text-decoration: underline !important;
    }

    /* Copyright section */
    .copyright p {
        font-size: 12px !important;
        line-height: 20px !important;
    }

    /* Improve spacing between sections */
    section {
        margin-bottom: 0 !important;
    }

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

/* Extra small devices - 320px to 479px */
@media only screen and (max-width: 479px) {

    /* Even smaller logo on very small screens */
    .footer .single-widget .about-area .logo img {
        max-width: 100px !important;
    }

    /* Smaller banner text */
    .animation-slide .single-slide .banner-content h2 {
        font-size: 22px !important;
        line-height: 32px !important;
    }

    .animation-slide .single-slide .banner-content p {
        font-size: 13px !important;
        line-height: 22px !important;
    }

    /* Tighter padding */
    .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .contact-section .contact-form {
        padding: 25px 15px !important;
    }

    /* Smaller section titles */
    h2,
    .section-title h2 {
        font-size: 20px !important;
        line-height: 30px !important;
    }

    /* Button adjustments */
    .btn,
    button,
    .submit-button {
        font-size: 13px !important;
        padding: 10px 20px !important;
    }
}