/* ======================= Home second section start =========================*/

/* =========================================
   ZYLOX ABOUT SECTION
   TABLET
========================================= */

@media (max-width: 1024px) {

    .zylox-about-section {
        padding: 80px 0;
    }


    .zylox-about-container {
        width: 90%;

        grid-template-columns: 1fr 0.9fr;

        gap: 40px;
    }


    .zylox-about-content h2 {
        font-size: 32px;
    }


    .zylox-about-content p {
        font-size: 14px;

        line-height: 1.7;
    }


    .zylox-image-box img {
        height: 480px;
    }


    .zylox-feature-card {
        min-height: 68px;

        padding: 10px 12px;

        gap: 10px;
    }


    .zylox-feature-card p {
        font-size: 11px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 768px) {

    .zylox-about-section {
        padding: 60px 0;
    }


    .zylox-about-container {
        width: 90%;

        grid-template-columns: 1fr;

        gap: 40px;
    }


    /* LEFT */

    .zylox-about-content h2 {
        font-size: 30px;

        line-height: 1.25;
    }


    .zylox-about-content p {
        font-size: 14px;

        line-height: 1.75;
    }


    .zylox-about-highlights {
        margin-top: 25px;
    }


    .zylox-about-highlights li {
        font-size: 13px;

        margin-bottom: 12px;
    }


    /* IMAGE */

    .zylox-image-box {
        border-radius: 22px;

        margin-bottom: 15px;
    }


    .zylox-image-box img {
        height: 360px;
    }


    /* CARDS */

    .zylox-feature-grid {
        grid-template-columns: repeat(2, 1fr);

        gap: 10px;
    }


    .zylox-feature-card {
        min-height: 70px;

        padding: 10px;

        gap: 8px;

        border-radius: 14px;
    }


    .zylox-feature-icon {
        width: 32px;
        height: 32px;
    }


    .zylox-feature-icon .material-symbols-outlined {
        font-size: 23px;
    }


    .zylox-feature-card p {
        font-size: 11px;

        line-height: 1.4;
    }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 480px) {

    .zylox-about-section {
        padding: 50px 0;
    }


    .zylox-about-container {
        width: 92%;

        gap: 32px;
    }


    .zylox-section-label {
        font-size: 12px;

        margin-bottom: 12px;
    }


    .zylox-about-content h2 {
        font-size: 25px;

        margin-bottom: 20px;
    }


    .zylox-about-content p {
        font-size: 13px;

        line-height: 1.7;
    }


    .zylox-image-box img {
        height: 300px;
    }


    .zylox-feature-grid {
        grid-template-columns: 1fr 1fr;

        gap: 8px;
    }


    .zylox-feature-card {
        min-height: 65px;

        padding: 8px;
    }


    .zylox-feature-icon {
        width: 28px;
        height: 28px;
    }


    .zylox-feature-icon .material-symbols-outlined {
        font-size: 20px;
    }


    .zylox-feature-card p {
        font-size: 10px;
    }

}

/* =================================== second section end ========================= */

/* =================================== third section start ========================= */

/* =========================================
   POWERING INDUSTRIES
   TABLET
========================================= */

@media (max-width: 1024px) {

    .zylox-industries-section {
        padding: 80px 0;
    }


    .zylox-industries-container {
        width: 90%;
    }


    .zylox-industries-heading {
        margin-bottom: 30px;
    }


    .zylox-industries-heading .zylox-section-label {
        font-size: 32px;
        line-height: 44px;
    }


    .zylox-industry-grid {
        grid-template-columns: repeat(3, 1fr);
    }


    .zylox-industry-card {
        min-height: 160px;

        padding: 25px 15px;
    }


    .zylox-industry-card h3 {
        font-size: 17px;
    }


    /* Reset borders */

    .zylox-industry-card:nth-child(5n) {
        border-right: 1px solid rgba(255, 255, 255, 0.15);
    }


    .zylox-industry-card:nth-child(3n) {
        border-right: none;
    }


    .zylox-industry-card:nth-last-child(-n + 5) {
        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    }


    .zylox-industry-card:nth-last-child(-n + 3) {
        border-bottom: none;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 768px) {

    .zylox-industries-section {
        padding: 60px 0;
    }


    .zylox-industries-container {
        width: 92%;
    }


    .zylox-industries-heading {
        margin-bottom: 25px;
    }


    .zylox-industries-heading .zylox-section-label {
        font-size: 26px;

        line-height: 1.32;

        font-weight: 600;
    }


    .zylox-industries-heading p {
        font-size: 16px;

        line-height: 1.35;
    }


    .zylox-industry-grid {
        grid-template-columns: repeat(2, 1fr);

        border-radius: 18px;
    }


    .zylox-industry-card {
        min-height: 145px;

        padding: 22px 12px;

        gap: 14px;

        border-right: 1px solid rgba(255, 255, 255, 0.15);

        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    }


    .zylox-industry-card:nth-child(3n) {
        border-right: 1px solid rgba(255, 255, 255, 0.15);
    }


    .zylox-industry-card:nth-child(5n) {
        border-right: 1px solid rgba(255, 255, 255, 0.15);
    }


    .zylox-industry-card:nth-child(even) {
        border-right: none;
    }


    .zylox-industry-card:nth-last-child(-n + 3) {
        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    }


    .zylox-industry-card:nth-last-child(-n + 2) {
        border-bottom: none;
    }


    .zylox-industry-card i {
        font-size: 30px;
    }


    .zylox-industry-card h3 {
        max-width: 150px;

        font-size: 16px;

        font-weight: 500;

        line-height: 1.45;
    }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 480px) {

    .zylox-industries-section {
        padding: 50px 0;
    }


    .zylox-industries-container {
        width: 92%;
    }


    .zylox-industries-heading .zylox-section-label {
        font-size: 26px;

        line-height: 1.32;
    }


    .zylox-industries-heading p {
        font-size: 15px;

        line-height: 1.5;
    }


    .zylox-industry-grid {
        grid-template-columns: 1fr 1fr;

        border-radius: 16px;
    }


    .zylox-industry-card {
        min-height: 135px;

        padding: 18px 8px;

        gap: 11px;
    }


    .zylox-industry-card i {
        font-size: 26px;
    }


    .zylox-industry-card h3 {
        max-width: 135px;

        font-size: 15px;

        line-height: 1.4;
    }

}

/* ================================ third section end ========================= */

/* ================================ fourth section start ========================= */

/* =========================================
   OUR SERVICES
   TABLET
========================================= */

@media (max-width: 1024px) {

    .zylox-services-section {
        padding: 80px 0;
    }


    .zylox-services-container {
        width: 90%;
    }


    .zylox-services-grid {
        grid-template-columns: repeat(2, 1fr);

        gap: 15px;
    }


    .zylox-service-card {
        min-height: 320px;

        padding: 30px;
    }


    .zylox-service-card h3 {
        font-size: 24px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 768px) {

    .zylox-services-section {
        padding: 60px 0;
    }


    .zylox-services-container {
        width: 92%;
    }


    .zylox-services-heading {
        margin-bottom: 25px;
    }


    .zylox-services-heading .zylox-section-label {
        font-size: 14px;
    }


    .zylox-services-heading h2 {
        font-size: 26px;

        line-height: 1.32;
    }


    .zylox-services-grid {
        grid-template-columns: 1fr;

        gap: 15px;
    }


    .zylox-service-card {
        min-height: auto;

        padding: 30px;
    }


    .zylox-card-icon {
        font-size: 45px;
    }


    .zylox-service-card h3 {
        font-size: 22px;

        line-height: 1.35;
    }


    .zylox-service-card p {
        font-size: 16px;

        line-height: 1.35;
    }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 480px) {

    .zylox-services-section {
        padding: 50px 0;
    }


    .zylox-services-container {
        width: 92%;
    }


    .zylox-service-card {
        padding: 25px;

        border-radius: 18px 0 18px 0;
    }


    .zylox-card-badge {
        width: 95px;
        height: 95px;

        top: -32px;
        right: -32px;

        padding-left: 24px;
        padding-bottom: 21px;

        font-size: 18px;
    }


    .zylox-card-icon {
        font-size: 42px;
    }


    .zylox-service-card h3 {
        font-size: 22px;
    }


    .zylox-service-card p {
        font-size: 16px;

        line-height: 1.35;
    }

}

/* ======================= fourth section end ========================= */
/* ======================== Our Product Range section start ========================== */

/* =========================================
   PRODUCT RANGE
   TABLET
========================================= */

@media (max-width: 1024px) {

    .zylox-products-section {
        padding: 80px 0;
    }


    .zylox-products-container {
        width: 90%;
    }


    .zylox-product-card-grid {
        grid-template-columns: repeat(2, 1fr);
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 768px) {

    .zylox-products-section {
        padding: 60px 0;
    }


    .zylox-products-container {
        width: 92%;
    }


    .zylox-products-heading {
        margin-bottom: 25px;
    }


    .zylox-products-heading .zylox-section-label {
        font-size: 14px;
    }


    .zylox-products-heading p {
        font-size: 16px;

        line-height: 1.35;
    }


    /* TABS */

    .zylox-product-tabs {
        flex-wrap: nowrap;

        overflow-x: auto;

        margin-bottom: 25px;

        scrollbar-width: thin;
    }


    .zylox-tab-btn {
        flex-shrink: 0;

        padding: 14px 18px;

        font-size: 16px;
    }


    /* PRODUCTS */

    .zylox-product-card-grid {
        grid-template-columns: 1fr;
    }


    .zylox-product-card {
        min-height: 55px;

        font-size: 16px;

        line-height: 1.35;
    }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 480px) {

    .zylox-products-section {
        padding: 50px 0;
    }


    .zylox-products-container {
        width: 92%;
    }


    .zylox-products-heading p {
        font-size: 15px;

        line-height: 1.5;
    }


    .zylox-tab-btn {
        padding: 13px 16px;

        font-size: 15px;
    }


    .zylox-product-card {
        padding: 10px 14px;

        border-radius: 16px;

        font-size: 15px;
    }

}

/* ============================== Our Product Range section end ========================= */
/* ======================== Custom Technology Procurement section start ========================= */

/* =========================================
   CUSTOM TECHNOLOGY PROCUREMENT
   TABLET
========================================= */

@media (max-width: 1024px) {

    .zylox-sourcing-section {
        padding: 80px 0;
    }


    .zylox-sourcing-container {
        width: 90%;

        grid-template-columns: 0.8fr 1.2fr;

        gap: 40px;
    }


    .zylox-sourcing-card {
        min-height: 500px;

        padding: 50px 30px;
    }


    .zylox-sourcing-card h2 {
        font-size: 32px;
    }


    .zylox-sourcing-card p {
        font-size: 15px;
    }


    .zylox-sourcing-content p {
        font-size: 15px;

        line-height: 1.7;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 768px) {

    .zylox-sourcing-section {
        padding: 60px 0;
    }


    .zylox-sourcing-container {
        width: 92%;

        grid-template-columns: 1fr;

        gap: 40px;
    }


    /* LEFT CARD */

    .zylox-sourcing-card {
        min-height: auto;

        padding: 50px 25px;

        border-radius: 24px;
    }


    .zylox-sourcing-icon-box {
        width: 100px;
        height: 100px;

        margin-bottom: 25px;

        border-radius: 18px;
    }


    .zylox-sourcing-icon-box img {
        width: 75px;
        height: 75px;
    }


    .zylox-sourcing-card h2 {
        font-size: 32px;

        line-height: 1.2;
    }


    .zylox-sourcing-card p {
        max-width: 400px;

        font-size: 16px;

        line-height: 1.6;
    }


    /* RIGHT CONTENT */

    .zylox-sourcing-content h3 {
        font-size: 22px;

        line-height: 1.35;

        margin-bottom: 20px;
    }


    .zylox-sourcing-content p {
        font-size: 16px;

        line-height: 1.6;

        margin-bottom: 18px;
    }


    /* FEATURES */

    .zylox-sourcing-features {
        grid-template-columns: 1fr 1fr;

        column-gap: 20px;

        row-gap: 8px;
    }


    .zylox-sourcing-features li {
        font-size: 14px;

        line-height: 28px;
    }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 480px) {

    .zylox-sourcing-section {
        padding: 50px 0;
    }


    .zylox-sourcing-container {
        width: 92%;

        gap: 30px;
    }


    .zylox-sourcing-card {
        padding: 40px 20px;

        border-radius: 22px;
    }


    .zylox-sourcing-icon-box {
        width: 90px;
        height: 90px;

        margin-bottom: 22px;
    }


    .zylox-sourcing-icon-box img {
        width: 65px;
        height: 65px;
    }


    .zylox-sourcing-card h2 {
        font-size: 30px;
    }


    .zylox-sourcing-card p {
        font-size: 15px;

        line-height: 1.6;
    }


    .zylox-sourcing-content h3 {
        font-size: 22px;
    }


    .zylox-sourcing-content p {
        font-size: 15px;

        line-height: 1.6;
    }


    .zylox-sourcing-features {
        grid-template-columns: 1fr;
    }


    .zylox-sourcing-features li {
        font-size: 14px;
    }

}

/* ================================= Custom Technology Procurement section end ========================= */
/* ================================= WHY CHOOSE ZYLOX section start ========================= */

/* =========================================
   WHY CHOOSE ZYLOX
   TABLET
========================================= */

@media (max-width: 1024px) {

    .zylox-why-section {
        padding: 80px 0;
    }


    .zylox-why-container {
        width: 90%;

        grid-template-columns: 0.8fr 1.2fr;

        gap: 40px;
    }


    .zylox-why-image {
        height: 560px;
    }


    .zylox-why-heading h2 {
        font-size: 32px;

        line-height: 44px;
    }


    .zylox-why-list {
        gap: 12px;
    }


    .zylox-why-item {
        min-height: 115px;

        padding: 20px;
    }


    .zylox-why-item h3 {
        font-size: 17px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 768px) {

    .zylox-why-section {
        padding: 60px 0;
    }


    .zylox-why-container {
        width: 92%;

        grid-template-columns: 1fr;

        gap: 35px;
    }


    /* IMAGE */

    .zylox-why-image {
        height: 400px;

        border-radius: 22px;
    }


    /* HEADING */

    .zylox-why-heading {
        margin-bottom: 25px;
    }


    .zylox-why-heading .zylox-section-label {
        font-size: 14px;
    }


    .zylox-why-heading h2 {
        font-size: 26px;

        line-height: 1.32;
    }


    /* LIST */

    .zylox-why-list {
        grid-template-columns: 1fr 1fr;

        gap: 10px;
    }


    .zylox-why-item {
        min-height: 130px;

        padding: 18px;

        border-radius: 14px;
    }


    .zylox-why-number {
        width: 38px;

        height: 38px;

        font-size: 12px;
    }


    .zylox-why-item h3 {
        font-size: 16px;

        line-height: 1.35;
    }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 480px) {

    .zylox-why-section {
        padding: 50px 0;
    }


    .zylox-why-container {
        width: 92%;

        gap: 28px;
    }


    .zylox-why-image {
        height: 320px;

        border-radius: 20px;
    }


    .zylox-why-heading h2 {
        font-size: 26px;

        line-height: 1.32;
    }


    .zylox-why-list {
        grid-template-columns: 1fr;

        gap: 10px;
    }


    .zylox-why-item {
        min-height: 100px;

        padding: 18px;

        flex-direction: row;

        align-items: center;

        gap: 15px;
    }


    .zylox-why-item h3 {
        font-size: 16px;

        line-height: 1.35;
    }

}

/* ============================== WHY CHOOSE ZYLOX section end ========================= */
/* ============================= oru vision section start ========================= */

/* =========================================
   OUR VISION
   TABLET
========================================= */

@media (max-width: 1024px) {

    .zylox-vision-section {
        padding: 80px 0;
    }


    .zylox-vision-container {
        grid-template-columns: 0.4fr 0.6fr;

        min-height: 380px;
    }


    .zylox-vision-panel {
        padding: 45px 35px;
    }


    .zylox-vision-panel h2 {
        font-size: 42px;
    }


    .zylox-vision-content {
        padding: 50px 45px;
    }


    .zylox-vision-content p {
        font-size: 17px;

        line-height: 1.8;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 768px) {

    .zylox-vision-section {
        padding: 60px 0;
    }


    .zylox-vision-container {
        width: 92%;

        grid-template-columns: 1fr;

        min-height: auto;

        border-radius: 22px;
    }


    /* LEFT */

    .zylox-vision-panel {
        min-height: 220px;

        padding: 40px 30px;
    }


    .zylox-vision-panel h2 {
        font-size: 38px;
    }


    .zylox-vision-panel-line {
        width: 45px;

        height: 3px;

        margin-bottom: 18px;
    }


    /* RIGHT */

    .zylox-vision-content {
        padding: 40px 30px;
    }


    .zylox-vision-mark {
        height: 45px;

        font-size: 75px;
    }


    .zylox-vision-content p {
        margin-top: 8px;

        font-size: 16px;

        line-height: 1.7;
    }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 480px) {

    .zylox-vision-section {
        padding: 50px 0;
    }


    .zylox-vision-container {
        width: 92%;
    }


    .zylox-vision-panel {
        min-height: 190px;

        padding: 35px 25px;
    }


    .zylox-vision-panel h2 {
        font-size: 34px;
    }


    .zylox-vision-content {
        padding: 35px 22px;
    }


    .zylox-vision-mark {
        font-size: 65px;
    }


    .zylox-vision-content p {
        font-size: 15px;

        line-height: 1.65;
    }

}

/* ============================= oru vision section end ========================= */