@media(max-width:991px){

h1{

font-size:42px;

}

h2{

font-size:34px;

}

}

@media(max-width:768px){

body{

font-size:16px;

}

h1{

font-size:34px;

}

h2{

font-size:28px;

}

.chp-section{

padding:60px 0;

}

}

/* =====================================
   SERVICE PAGE RESPONSIVE POLISH
===================================== */

@media (max-width: 900px) {

    /* Service hero */

    .service-hero {
        padding: 70px 0;
    }

    .service-hero-inner {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .service-hero-left {
        text-align: center;
    }

    .service-hero-left h1 {
        font-size: 46px;
        line-height: 1.15;
    }

    .service-hero-left p {
        margin-left: auto;
        margin-right: auto;
    }

    .service-hero-buttons {
        justify-content: center;
    }

    .service-hero-right {
        max-width: 650px;
        width: 100%;
        margin: 0 auto;
    }

    /* Overview */

    .overview-grid {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    /* Cost / service cards */

    .cost-grid,
    .service-grid,
    .brands-grid,
    .contractor-grid {
        grid-template-columns: repeat(2, 1fr);
    }

}


@media (max-width: 600px) {

    /* General section spacing */

    .service-page section {
        padding-top: 65px;
        padding-bottom: 65px;
    }

    /* Hero */

    .service-hero {
        padding: 55px 0;
    }

    .service-hero-left h1 {
        font-size: 36px;
        line-height: 1.15;
    }

    .service-hero-left p {
        font-size: 16px;
        line-height: 1.7;
    }

    .service-hero-buttons {
        flex-direction: column;
        width: 100%;
    }

    .service-hero-buttons a {
        width: 100%;
        box-sizing: border-box;
        text-align: center;
    }

    .service-hero-right img {
        width: 100%;
        height: auto;
    }

    /* Section headings */

    .section-heading h2 {
        font-size: 30px;
        line-height: 1.2;
    }

    .section-heading p {
        font-size: 16px;
    }

    /* One column cards */

    .cost-grid,
    .service-grid,
    .brands-grid,
    .contractor-grid {
        grid-template-columns: 1fr;
    }

    /* Overview */

    .overview-card {
        padding: 25px;
    }

    /* FAQ */

    .faq-wrapper {
        margin-top: 35px;
    }

    /* Quote CTA */

    .quote-cta-inner {
        padding: 40px 22px;
    }

    .quote-cta-content h2 {
        font-size: 29px;
    }

}

/* =====================================
   MOBILE HEADER / MENU FIX
===================================== */

@media (max-width: 768px) {

    /* Keep the header in normal document flow */
    .site-header,
    .chp-header,
    header {
        position: relative !important;
        z-index: 1000;
    }

    /* Mobile navigation should not cover page content */
    .main-navigation {
        position: relative !important;
        height: auto !important;
        max-height: none !important;
    }

    .main-navigation ul {
        position: relative !important;
        height: auto !important;
    }

    /* Make mobile menu items stack properly */
    .main-navigation .main-nav ul {
        display: block;
    }

    .main-navigation .main-nav li {
        display: block;
        width: 100%;
    }

    .main-navigation .main-nav li a {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }

    /* Prevent the service content from sitting underneath header */
    .service-page {
        position: relative;
        z-index: 1;
    }

}