@media (min-width: 768px) {

    /* NAV */
    .nav-bar {
        width: 40%;
    }

    .services-nav {
        width: 40%;
    }

    /* HERO */
    .home-hero {
        padding: 160px 80px 0px 80px;
        height: 80vh;
    }

    .home-hero-content h1 {
        font-size: 42px;
    }

    .home-hero-content p {
        font-size: 18px;
    }

    .home-hero-cta {
        flex-direction: row-reverse;
        justify-content: center;
        gap: 20px;
    }

    /* TRUST */
    .home-trust {
        justify-content: center;
        gap: 20px;
    }

    .home-trust p {
        width: 45%;
    }

    /* SERVICES */
    .home-service-content {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .home-service-content-card {
        width: 48% !important;
    }

    /* HOW IT WORKS */
    .home-how-content-left {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .home-how-step {
        width: 48%;
    }

    /* SHOP */
    .home-shop {
        background-size: cover;
    }

    /* ABOUT */
    .home-about {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 40px;
        align-items: center;
    }

    .home-about h1 {
        margin-top: 0;
    }

    /* FOOTER */
    .footer-content {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 40px;
    }

    .footer-first,
    .footer-second,
    .footer-third {
        width: 45%;
    }

    .footer-third {
        align-items: flex-start;
    }

    /* ---------------------------------------------------------------------------------------------------------------------------------
                                                    SHOP PAGE
    --------------------------------------------------------------------------------------------------------------------------------- */

    .shop-hero {
        height: 70vh;
        padding: 160px 40px 80px;
        background-size: cover;
    }

    .shop-hero h1 {
        font-size: 42px;
    }

    .shop-hero p {
        font-size: 18px;
    }

    .modal-content {
        width: 50%;
        text-align: center;
    }

    #modalDesc {
        text-align: center;
    }

    .shop-product {
        padding: 80px 40px;
    }

    .shop-product h1 {
        font-size: 32px;
        text-align: center;
        margin-bottom: 30px;
    }

    /* FILTER */
    .filter-bar {
        justify-content: space-between;
        flex-wrap: nowrap;
    }

    .filter-bar select,
    .filter-bar input {
        width: 48%;
    }

    /* PRODUCTS GRID */
    .products {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .product-card {
        margin-bottom: 0;
    }

    .product-image-container {
        height: 220px;
    }

    /* TRUST SECTION */
    .shop-trust-content div {
        width: 30%;
    }

    /* ---------------------------------------------------------------------------------------------------------------------------------
                                                              SERVICES PAGE
    --------------------------------------------------------------------------------------------------------------------------------- */
    .services-hero {
        height: 70vh;
        padding: 160px 40px 80px;
        background-size: cover;
    }

    .services-hero h1 {
        font-size: 42px;
        width: 80%;
        margin: auto;
    }

    .services-hero p {
        font-size: 18px;
        margin-top: 20px;
    }

    /* ---------------------------------------------------------------------------------------------------------------------------------
                                                             INSTALLATION PAGE
    --------------------------------------------------------------------------------------------------------------------------------- */
    .install-hero {
        height: 60vh;
        padding: 100px 40px;
    }

    .install-hero h1 {
        font-size: 42px;
    }

    .install-hero p {
        font-size: 18px;
    }

    /* INTRO */
    .install-intro {
        padding: 100px 60px;
    }

    .install-intro h2 {
        font-size: 32px;
    }

    .install-intro p {
        font-size: 18px;
        max-width: 700px;
        margin: 0 auto;
    }

    /* BENEFITS */
    .benefits-grid h1 {
        width: 48%;
        font-size: 18px;
        padding: 20px;
    }

    .benefits-grid span {
        font-size: 36px;
    }

    /* PRICING */
    .install-pricing {
        padding: 80px 40px;
    }

    .price-box {
        width: 48%;
        display: inline-block;
        vertical-align: top;
    }

    /* PROCESS */
    .process-steps-box {
        width: 48%;
        padding: 30px;
    }

    .process-steps-box h3 {
        font-size: 24px;
    }

    .process-steps-box p {
        font-size: 17px;
    }

    /* CTA */
    .install-cta {
        padding: 100px 40px;
    }

    .install-cta h2 {
        font-size: 32px;
    }

    .install-cta p {
        font-size: 18px;
    }

    /* ---------------------------------------------------------------------------------------------------------------------------------
                                                        ACTIVATION PAGE
    --------------------------------------------------------------------------------------------------------------------------------- */

    /* HERO */
    .activation-hero {
        height: 60vh;
        padding: 100px 40px;
    }

    .activation-hero h1 {
        font-size: 42px;
    }

    .activation-hero p {
        font-size: 18px;
    }

    /* WHY */
    .activation-why {
        padding: 80px 40px;
    }

    .activation-why h2 {
        font-size: 32px;
    }

    .activation-why-grid {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .activation-why-grid div {
        width: 48%;
        font-size: 17px;
        padding: 20px;
    }

    /* PRICING */
    .activation-pricing {
        padding: 80px 40px;
    }

    .plans {
        justify-content: space-between;
    }

    .plan-card {
        width: 48%;
    }

    .plan-card.highlight {
        width: 48%;
    }

    /* TABLE */
    table th,
    table td {
        font-size: 16px;
        padding: 15px;
    }

    /* LINKS */
    .external-links {
        flex-direction: row;
        justify-content: center;
        gap: 30px;
    }

    /* HOW IT WORKS */
    .activation-how {
        padding: 80px 40px;
    }

    .activation-steps div {
        width: 48%;
        padding-left: 15px;
    }

    /* INFO */
    .activation-info {
        padding: 80px 40px;
    }

    .activation-info p {
        max-width: 700px;
        margin: 0 auto 20px;
        font-size: 17px;
    }

    /* TERMS */
    .activation-terms {
        padding: 80px 40px;
        text-align: center;
    }

    .activation-terms p {
        font-size: 18px;
    }

    /* FINAL CTA */
    .activation-final-cta {
        padding: 100px 40px;
        text-align: center;
    }

    .activation-final-cta h2 {
        font-size: 32px;
    }

    /* --------------------------------------------------------------------------------------------------------------------------------
                                                         MAINTENANCE PAGE
    -------------------------------------------------------------------------------------------------------------------------------- */


    /* HERO */
    .maintenance-hero {
        padding: 150px 40px;
        height: 80vh;
        background-size: cover;
    }

    .maintenance-hero h1 {
        font-size: 42px;
    }

    .maintenance-hero p {
        font-size: 18px;
        width: 70%;
    }

    /* PROBLEMS */
    .maintenance-problem-card {
        width: 30%;
        padding: 25px 15px;
    }

    .maintenance-problem-card p {
        font-size: 17px;
    }

    /* SERVICES */
    .maintenance-service-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .maintenance-service-card h3 {
        font-size: 20px;
    }

    /* PRICING */
    .maintenance-pricing-grid {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }

    .maintenance-pricing-card {
        width: 45%;
    }

    /* CTA */
    .maintenance-cta h2 {
        font-size: 32px;
    }

    /* --------------------------------------------------------------------------------------------------------------------------------
                                                         DISTRIBUTION PAGE
    -------------------------------------------------------------------------------------------------------------------------------- */
    .distribution-hero {
        padding: 140px 40px;
    }

    .distribution-hero h1 {
        font-size: 36px;
    }

    .distribution-hero p {
        font-size: 18px;
        max-width: 600px;
        margin: auto;
    }

    .distribution-about {
        padding: 80px 40px;
    }

    .distribution-about p {
        font-size: 17px;
    }

    .usecase-grid {
        justify-content: center;
        gap: 20px;
    }

    .usecase {
        width: 45%;
    }

    .features-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .distribution-pricing {
        justify-content: center;
    }

    .service-card {
        width: 45%;
    }

    .process-steps {
        gap: 15px;
    }

    /* --------------------------------------------------------------------------------------------------------------------------------
                                                            ABOUT PAGE
    -------------------------------------------------------------------------------------------------------------------------------- */
    .about-hero {
        padding: 140px 40px;
    }

    .about-hero h1 {
        font-size: 36px;
    }

    .about-hero p {
        font-size: 18px;
        max-width: 600px;
        margin: auto;
    }

    .about-intro {
        padding: 80px 40px;
        max-width: 700px;
        margin: auto;
        text-align: center;
    }

    .about-intro p {
        font-size: 17px;
    }

    .advantage-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .about-location {
        padding: 100px 40px;
    }

    .location-box {
        max-width: 600px;
        margin: 20px auto;
        text-align: center;
    }

    .about-trust {
        padding: 100px 40px;
        max-width: 700px;
        margin: auto;
        text-align: center;
    }

    .about-trust ul {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .about-cta-btn {
        font-size: 16px;
    }

    /* --------------------------------------------------------------------------------------------------------------------------------
                                                       CONTACT PAGE
    -------------------------------------------------------------------------------------------------------------------------------- */
    .contact-hero {
        padding: 80px 15px;
    }

    .contact-hero h1 {
        font-size: 24px;
    }

    .contact-hero p {
        font-size: 14px;
    }

    /* STACK CONTACT CONTENT */
    .contact-container {
        flex-direction: column;
        padding: 40px 15px;
    }

    .contact-container h2 {
        font-size: 22px;
        margin-bottom: 25px;
    }

    .contact-form {
        width: 100%;
        padding: 18px;
    }

    .contact-form input,
    .contact-form select,
    .contact-form textarea {
        font-size: 14px;
        padding: 10px;
    }

    .contact-form button {
        padding: 12px;
        font-size: 14px;
    }

    /* MAP */
    .contact-map {
        padding: 40px 15px;
    }

    .contact-map h2 {
        font-size: 22px;
    }

    .contact-map p {
        font-size: 14px;
    }

    .map-box {
        height: 220px;
    }

}

@media (min-width: 1024px) {

    /* HEADER */
    header {
        padding: 10px 80px;
    }

    .menu-toggle {
        display: none;
    }

    .nav-bar {
        position: static;
        height: auto;
        width: auto;
        background: none;
        backdrop-filter: none;
        padding: 0;
        right: 0;
    }

    .nav-bar ul {
        flex-direction: row;
        gap: 40px;
        align-items: center;
        padding: 10px 0;

    }

    .nav-bar ul li {
        border: none;
        padding: 0;
    }

    .nav-bar ul li a:hover {
        color: #015984;
        padding-left: 0;
    }

    .page-active {
        border-bottom: 1px dashed #015984 !important;
        text-align: center !important;
        border-left: none;
        margin: 0 !important;
        padding: 0;
    }

    .services-nav {
        display: none;
        /* optional: convert to dropdown later */
    }

    .body {
        position: relative;
    }

    .mobile-services {
        display: none;
    }

    .services-dropdown {
        display: block;
        /* height: auto; */
    }

    .services-nav {
        display: none !important;
    }


    .services-dropdown>a {
        display: flex;
        align-items: center;
        gap: 5px;
        text-decoration: none;
        font-weight: 700;
        color: #000;
    }

    .services-dropdown svg {
        width: 14px;
        transition: 0.3s ease;
    }

    /* Dropdown box */
    .dropdown-menu {
        position: absolute;
        top: 1;
        right: 15%;
        background: #fff;
        border-radius: 10px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
        padding: 15px 0;
        min-width: 230px;
        opacity: 0;
        visibility: hidden;
        transform: translateY(10px);
        transition: all 0.3s ease;
        z-index: 999;
    }

    .dropdown-menu a {
        display: block;
        padding: 12px 20px;
        font-size: 14px;
        text-decoration: none;
        color: #000;
        transition: 0.2s ease;
        text-transform: uppercase;
    }

    .dropdown-menu a:hover {
        background: #f5f5f5;
        color: #015984;
        padding-left: 25px!important;
    }

    /* Hover trigger */
    .services-dropdown:hover .dropdown-menu {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    /* Rotate arrow */
    .services-dropdown:hover svg {
        transform: rotate(180deg);
    }

    /* -----------------------------------------------------------------------------------------------------------------------------
                                                          HOME PAGE
        ----------------------------------------------------------------------------------------------------------------------------- */


    /* HERO */
    .home-hero {
        display: flex;
        align-items: center;
        height: 90vh;
        padding: 0 100px;
    }

    .home-hero-content {
        text-align: left;
        max-width: 600px;
    }

    .home-hero-content h1 {
        font-size: 56px;
        margin-top: 20px;
    }

    .home-hero-content p {
        font-size: 20px;
    }

    .home-hero-cta {
        width: 100%;
        justify-content: left;
        align-items: initial;
        gap: 20px;
    }

    .home-hero-cta a {
        width: auto;
        /* border: 1px solid white; */
        margin: 0;
    }

    .home-service-content {
        width: 100% !important;
        row-gap: 30px;
        column-gap: 3%;
        justify-content: center !important;
    }

    .home-service-head {
        font-size: 32px;
    }

    .home-service-content-card {
        width: 30% !important;

    }

    .home-how-content {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .home-how-head {
        font-size: 32px;
    }

    .home-how-content-left {
        flex-direction: column;
        width: 48%;
    }

    .home-how-content-right {
        display: block;
        width: 48%;
        height: 90vh !important;
        overflow: hidden;
        border-radius: 20px;
        box-shadow: 0 0 10px rgb(66, 55, 55);
    }

    .home-how-content-right img {
        width: 100%;
        height: 100%;
    }

    .home-how-step {
        width: 100% !important;
        display: flex;
        gap: 20px;
        align-items: center;
        padding: 30px 0px 30px 20px;
        /* border: 1px solid red; */
    }

    /* TRUST */
    .home-trust {
        justify-content: space-between;
    }

    .home-trust p {
        width: 23%;
    }

    /* SERVICES */
    .home-service {
        padding: 120px 80px;
    }

    .home-service-content {
        justify-content: space-between;
    }

    .home-service-content-card {
        width: 23%;
    }

    /* HOW */
    .home-how {
        padding: 120px 80px;
    }

    .home-how-step {
        width: 23%;
    }

    /* SHOP */
    .home-shop {
        padding: 140px 80px;
        text-align: left;
        background-size: 100% 180%;
        min-height: 120vh;
    }

    .home-shop h1 {
        font-size: 42px;
        margin-bottom: 40px;
    }

    .home-shop p {
        font-size: 20px;
        margin-bottom: 70px;
    }

    .home-shop a {
        margin: 0;
        font-size: 18px;
    }

    /* AREA */
    .home-area {
        padding: 120px 80px;
    }

    .home-area h1 {
        font-size: 42px;
        text-align: center;
    }

    .home-area p {
        font-size: 18px;
        width: 70%;
        margin: auto;
        text-align: center;
    }

    /* ABOUT */
    .home-about {
        padding: 120px 80px;
    }

    .home-about-content h1 {
        font-size: 32px;
    }

    .home-about-img img {
        border-radius: 12px;
    }

    /* CTA */
    .whatsapp-cta {
        padding: 140px 80px;
    }

    .whatsapp-cta h1 {
        text-transform: uppercase;
        font-size: 40px;
    }

    .whatsapp-cta p {
        font-size: 18px;
    }

    /* FOOTER */
    footer {
        padding: 100px 80px;
    }

    .footer-content {
        flex-wrap: nowrap;
        /* border: 1px solid red; */
        align-items: baseline;
        justify-content: space-between;
    }

    .footer-first {
        width: 30%;
    }

    .footer-contact-box h1 {
        font-size: 22px;
    }

    .footer-contact-head {
        font-size: 22px;
        font-weight: 700;
    }

    .footer-contact-box a {
        font-size: 16px;
    }

    .footer-second {
        width: 30%;
    }

    .footer-third {
        width: 15%;
    }

    .footer-third h1 {
        text-transform: uppercase;
        font-size: 24px;
    }

    .footer-fourth {
        width: 15%;
    }

    .footer-second a {
        display: block;
    }

    /* ---------------------------------------------------------------------------------------------------------------------------------
                                                      SHOP PAGE
    --------------------------------------------------------------------------------------------------------------------------------- */

    .shop-page-desktop {
        display: flex;
        align-items: center;
        gap: 20px;
        flex-direction: row-reverse;
    }

    .shop-hero {
        height: 90vh;
        padding: 180px 80px 100px;
    }

    .shop-hero h1 {
        font-size: 56px;
        text-align: left;
        width: 60%;
    }

    .shop-hero p {
        text-align: left;
        font-size: 20px;
    }

    .shop-product {
        padding: 100px 80px;
    }

    /* 3 COLUMN GRID */
    .products {
        grid-template-columns: repeat(3, 1fr);
        gap: 25px;
    }

    .view-details:hover {
        background-color: #013f5c;
    }

    .quantity button:hover {
        opacity: 0.8;
    }

    .product-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    }

    .product-image-container {
        height: 240px;
    }

    /* FILTER BAR */
    .filter-bar {
        max-width: 600px;
        margin: auto;
        margin-bottom: 40px;
    }

    .modal-content {
        width: 40%;
    }

    /* TRUST */
    .shop-trust {
        padding: 80px;
    }

    .shop-trust h1 {
        font-size: 26px;
    }

    .shop-trust-content {
        justify-content: space-between;
    }

    .shop-trust-content div {
        width: 30%;
    }

    /* ---------------------------------------------------------------------------------------------------------------------------------
                                                          SERVICE PAGE
    --------------------------------------------------------------------------------------------------------------------------------- */
    .services-hero {
        height: 90vh;
        padding: 180px 80px 100px;
    }

    .services-hero h1 {
        font-size: 56px;
        text-align: left;
        width: 70%;
        margin: 0;
    }

    .services-hero p {
        font-size: 18px;
        margin: 0;
        text-align: left;
    }

    .services-overview-section {
        grid-template-columns: repeat(4, 1fr);
    }

    .service-cards {
        padding: 25px;
    }

    .service-cards h2 {
        font-size: 22px;
    }

    .service-cards p {
        font-size: 15px;
    }

    .service-why {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 80px;
    }

    .service-why-content {
        width: 48%;
    }

    .service-why-img {
        width: 48%;
    }

    .service-why-content h2 {
        font-size: 32px;
    }

    .service-coverage h2,
    .service-cta h2 {
        font-size: 42px;
        text-align: center;
    }

    .service-coverage p,
    .service-cta p {
        font-size: 18px;
    }

    .service-cta a {
        font-size: 18px;
        padding: 14px 20px;
    }

    /* ---------------------------------------------------------------------------------------------------------------------------------
                                                        INSTALLATION PAGE
    --------------------------------------------------------------------------------------------------------------------------------- */

    /* HERO */
    .install-hero {
        height: 90vh;
        padding: 180px 80px 100px;
    }

    .install-hero h1 {
        font-size: 56px;
        text-align: left;
        width: 70%;
        margin: 0;
    }

    .install-hero p {
        font-size: 18px;
        margin: 0;
        margin-top: 30px;
        text-align: left;
    }

    /* INTRO */
    .install-intro {
        padding: 120px 80px;
    }

    .install-intro h2 {
        font-size: 36px;
    }

    .install-intro p {
        font-size: 18px;
        max-width: 800px;
    }

    .install-benefits {
        padding: 10px 80px 80px 80px;
    }

    .install-benefits h2 {
        font-size: 36px;
        margin-bottom: 50px;
    }

    .install-pricing-head {
        font-size: 36px;
    }

    /* BENEFITS GRID → 3 columns */
    .benefits-grid {
        justify-content: space-between;
    }

    .benefits-grid h1 {
        width: 32%;
        font-size: 18px;
    }

    /* PRICING → side-by-side centered */
    .install-pricing {
        padding: 100px 80px;
        text-align: center;
    }

    .price-box {
        width: 40%;
        margin: 0 20px 30px 20px;
        min-height: 25vh;
    }

    /* PROCESS → 4 columns */
    .install-process {
        padding: 80px;
    }

    .install-process h2 {
        font-size: 36px;
    }

    .process-steps {
        justify-content: space-between;
    }

    .process-steps-box {
        width: 23%;
        padding: 30px;
    }

    .process-steps-box h3 {
        font-size: 20px;
    }

    .process-steps-box p {
        font-size: 16px;
    }

    /* CTA */
    .install-cta {
        padding: 120px 80px;
    }

    .install-cta h2 {
        font-size: 42px;
    }

    .install-cta p {
        font-size: 18px;
    }

    .install-cta .cta-btn {
        font-size: 18px;
        padding: 18px 30px;
    }

    /* ------------------------------------------------------------------------------------------------------------------------------------
                                                             ACTIVATION PAGE
---------------------------------------------------------------------------------------------------------------------------- */

    /* HERO */
    .activation-hero {
        height: 90vh;
        padding: 180px 80px 100px;
    }

    .activation-hero h1 {
        font-size: 56px;
        text-align: left;
        width: 70%;
        margin: 0;
    }

    .activation-hero p {
        font-size: 18px;
        margin: 0;
        margin-top: 30px;
        text-align: left
    }

    .activation-hero a {
        display: block;
        width: fit-content;
    }

    /* WHY → 4 columns */
    .activation-why h2 {
        font-size: 36px;
    }

    .activation-why-grid {
        justify-content: space-between;
    }

    .activation-why-grid div {
        width: 23%;
        font-size: 16px;
    }

    /* PRICING → centered cards */
    .activation-pricing h2 {
        font-size: 36px;
    }

    .plans {
        justify-content: center;
        gap: 40px;
    }

    .plan-card {
        width: 320px;
    }

    .plan-card.highlight {
        transform: scale(1.05);
    }

    /* TABLE */
    .activation-comparison h2 {
        font-size: 36PX;
    }

    table {
        max-width: 800px;
        margin: 0 auto;
    }

    table th,
    table td {
        font-size: 17px;
    }

    .note {
        text-align: center;
    }

    /* LINKS */
    .external-links {
        justify-content: center;
    }

    /* HOW IT WORKS → 4 columns */
    .activation-how {
        padding: 80px;
    }

    .activation-how h2 {
        font-size: 36px;
    }

    .activation-how-container {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .activation-how-img {
        display: block;
        width: 48%;
        border-radius: 20px;
        overflow: hidden;
    }

    .activation-how-img img {
        width: 100%;
    }

    .activation-steps {
        width: 48%;
        flex-direction: column;
    }


    .activation-steps div {
        width: 100%;
        border-left: 2px solid #b4b4b4;
        padding-top: 20px;
        text-align: center;
        align-items: center;
        display: flex;
        gap: 20px;
    }

    .activation-steps h1 {
        font-size: 36px;
    }

    /* INFO */
    .activation-info {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .activation-info-img {
        display: block;
        width: 48%;
        border-radius: 20px;
        overflow: hidden;
    }

    .activation-info-img {
        width: 48%;
    }

    .activation-info-img img {
        width: 100%;
    }

    .activation-info-content {
        width: 48%;
    }

    .activation-info p {
        max-width: 800px;
    }

    .activation-info ul {
        max-width: 600px;
        margin: 20px auto;
    }

    /* TERMS */
    .activation-terms {
        max-width: 700px;
        margin: auto;
    }

    /* CTA */
    .activation-final-cta {
        padding: 120px 80px;
    }

    .activation-final-cta h2 {
        font-size: 36px;
    }

    .activation-cta-btn {
        font-size: 18px;
        padding: 15px 30px;
    }

    /* --------------------------------------------------------------------------------------------------------------------------------
                                                        MAINTENACE PAGE 
    ------------------------------------------------------------------------------------------------------------------------------- */

    /* HERO */
    .maintenance-hero {
        height: 90vh;
        padding: 180px 80px 100px;
    }

    .maintenance-hero h1 {
        font-size: 56px;
        text-align: left;
        width: 70%;
        margin: 0;
    }

    .maintenance-hero p {
        font-size: 18px;
        margin: 0;
        margin-top: 30px;
        text-align: left;
    }

    .maintenance-hero a {
        display: block;
        width: fit-content;
    }

    /* PROBLEMS */
    .maintenance-problem {
        padding: 80px;
    }

    .maintenance-problem h2 {
        font-size: 36px;
    }

    .maintenance-problem-content {
        column-gap: 2%;
    }

    .maintenance-problem-card {
        width: 28%;
    }

    /* SERVICES */
    .maintenance-service h2 {
        font-size: 36px;
    }

    .maintenance-service-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    /* PRICING */
    .maintenance-pricing-card {
        width: 30%;
    }

    /* CTA */
    .maintenance-cta h2 {
        font-size: 36px;
    }

    .maintenance-cta {
        padding: 120px 20px;
    }

    /* --------------------------------------------------------------------------------------------------------------------------------
                                                       DISTRIBUTION PAGE 
    -------------------------------------------------------------------------------------------------------------------------------- */
    .distribution-hero {
        height: 90vh;
        padding: 180px 80px 100px;
    }

    .distribution-hero h1 {
        font-size: 56px;
        text-align: left;
        width: 70%;
        margin: 0;
    }

    .distribution-hero p {
        font-size: 18px;
        margin: 0;
        margin-top: 30px;
        text-align: left;
    }

    .distribution-hero a {
        display: block;
        width: fit-content;
        margin-top: 20px;
    }

    .usecase {
        width: 22%;
    }

    .features-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .distribution-pricing {
        gap: 30px;
    }

    .service-card {
        width: 30%;
    }

    .distribution-about {
        max-width: 900px;
    }

    .distribution-about h2,
    .distribution-usecases h2,
    .distribution-features h2,
    .distribution-process h2,
    .distribution-cta h2 {
        font-size: 36px;
        margin-bottom: 30px;
    }

    .distribution-process {
        padding: 80px;
    }

    /* --------------------------------------------------------------------------------------------------------------------------------
                                                        ABOUT PAGE
    -------------------------------------------------------------------------------------------------------------------------------- */
    .about-hero {
        height: 90vh;
        padding: 180px 80px 100px;
    }

    .about-hero h1 {
        font-size: 56px;
        text-align: left;
        width: 60%;
    }

    .about-hero p {
        text-align: left;
        font-size: 20px;
        margin: 0;
    }

    .about-intro {
        max-width: 800px;
    }

    .about-intro h2,
    .about-advantage h2,
    .about-location h2,
    .about-trust h2,
    .about-cta h2 {
        font-size: 36px;
    }

    .advantage {
        text-align: center;
    }

    .advantage-grid {
        grid-template-columns: repeat(4, 1fr);
    }

    .about-location {
        display: flex;
        justify-content: center;
        gap: 40px;
        text-align: left;
    }

    .location-box {
        max-width: 400px;
        margin: 0;
    }

    .about-trust {
        max-width: 800px;
    }

    .about-trust ul {
        grid-template-columns: repeat(2, 1fr);
    }

    .about-cta {
        padding: 100px 20px;
    }

    /* --------------------------------------------------------------------------------------------------------------------------------
                                                            CONTACT PAGE
    -------------------------------------------------------------------------------------------------------------------------------- */

    .contact-hero {
        height: 90vh;
        padding: 180px 80px 100px;
    }

    .contact-hero h1 {
        font-size: 56px;
        text-align: left;
        width: 60%;
        ;
    }

    .contact-hero p {
        text-align: left;
        font-size: 20px;
        margin: 0;
    }

    /* CONTACT SECTION */
    .contact-container {
        gap: 20px;
        padding: 50px 180px;
    }

    .contact-container h2,
    .contact-map h2 {
        font-size: 36px;
        margin-bottom: 30px;
    }

    .contact-form {
        padding: 20px;
    }

    /* MAP */
    .contact-map p {
        font-size: 20px;
    }

    .map-box {
        height: 260px;
    }

    /* FOOTER */
    .footer-content {
        gap: 20px;
    }

}