/* Components */

.btn,
#gform_submit_button_1 {
    display: flex;
    align-items: center;
    text-align: center;
    max-width: fit-content;
    padding: clamp(1rem, 0.9114rem + 0.378vw, 1.365rem) clamp(1.25rem, 0.9466rem + 1.2945vw, 2.5rem);
    background-color: var(--accent);
    font-size: var(--font-size-28);
    color: var(--primary);
    text-decoration: none;
    border-radius: 999px;
    font-weight: var(--font-weight-medium);
    box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.2);
    transition: all 0.3s ease;
    text-transform: capitalize;
    cursor: pointer;
}

.btn:hover,
#gform_submit_button_1:hover {
    box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.3);
    background-color: #57db85;
}

.btn-group {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.btn--sm {
    font-size: clamp(0.875rem, 0.784rem + 0.3883vw, 1.25rem);
    padding: clamp(0.625rem, 0.534rem + 0.3883vw, 1rem) 1.5rem;
}

/* Google Rating */

.google-stars {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: .75rem;
    margin-bottom: 1.25rem;
}

.google-stars span {
    display: flex;
    gap: .75rem;
}

/* Gravity Forms */

.gform_required_legend,
.gfield_required.gfield_required_asterisk {
    display: none;
}

.gform_wrapper form .gform-body.gform_body label {
    font-size: var(--font-size-24);
    font-weight: var(--font-weight-medium);
    color: var(--primary);
}

.gform_wrapper form .gform-body.gform_body input {
    border: 2px solid #E6E6E6;
    border-radius: 14px;
    min-height: 68px;
    font-size: var(--font-size-24);
}

.gform_wrapper form .gform-body.gform_body .gfield_checkbox {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.gform_wrapper form .gform-body.gform_body .gfield_checkbox input.gfield-choice-input {
    width: 28px;
    height: 28px;
    min-height: 0;
    display: flex;
    align-items: center;
    border-radius: 6px;
}

.divider {
    display: block;
}

.google-rating {
    display: flex;
    align-items: center;
    gap: .75rem;
    font-size: clamp(1rem, 0.8786rem + 0.5178vw, 1.5rem);
    margin-bottom: 2.5rem;
}

.google-rating img {
    max-width: clamp(6.5rem, 5.8629rem + 2.7184vw, 9.125rem);
}

.star-rating {
    width: clamp(10rem, 8.9381rem + 4.5307vw, 14.375rem);
    margin-bottom: clamp(0.75rem, 0.6286rem + 0.5178vw, 1.25rem);
}

.accreditations img {
    width: 100%;
}

/* Hero */

.hero {
    position: relative;
    width: 100%;
    overflow: hidden;
    background-color: var(--background);
    z-index: 0;
}

.hero__image {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.hero__image.tablet,
.hero__image.mobile {
    display: none;
}

.hero__wrapper {
    padding-block: clamp(0.4375rem, -0.3976rem + 3.1438vw, 3.375rem);
    min-height: 705px;
    max-width: 737px;
    width: 50%;
}

.hero__subheading {
    margin-block: clamp(0.625rem, 0.2696rem + 1.3378vw, 1.875rem) clamp(1.5625rem, 1.1183rem + 1.6722vw, 3.125rem);
}


.hero.contact .hero__wrapper {
    min-height: 360px;
    max-width: 100%;
    width: 100%;
}

.hero.contact .hero__image {
    height: auto;
}

.hero.contact .hero__subheading {
    padding-bottom: 4rem;
}

@media screen and (max-width: 768px) {
    .hero__wrapper {
        min-height: 626px;
        width: 100%;
    }

    .hero__subheading {
        max-width: 380px;
    }

    .hero__image.desktop,
    .hero__image.mobile {
        display: none;
    }

    .hero__image.tablet {
        display: block;
    }

    .hero.contact .hero__wrapper {
        min-height: 208px;
    }

    .hero.contact .hero__subheading {
        padding-bottom: 0;
        max-width: 530px;
    }

}

@media screen and (max-width: 430px) {
    .hero__wrapper {
        min-height: 546px;
    }

    .hero__image {
        position: absolute;
        aspect-ratio: 1/1;
        bottom: 0;
    }

    .hero__image.desktop,
    .hero__image.tablet {
        display: none;
    }

    .hero__image.mobile {
        display: block;
        height: auto;
        aspect-ratio: unset;
    }

    .hero.contact .hero__wrapper {
        min-height: 150px;
    }
}

/* Fold */

.fold {
    padding-block: 1.625rem clamp(3.375rem, 2.7834rem + 2.5243vw, 5.8125rem);
}

.fold__wrapper {
    align-items: center;
}

.fold__col .grid {
    gap: clamp(0.875rem, 0.6626rem + 0.9061vw, 1.75rem);
}

.fold__col.text {
    max-width: 870px;
}

.fold__col.accreditations {
    gap: clamp(0.875rem, 0.6626rem + 0.9061vw, 1.75rem);
    margin-top: clamp(1.25rem, 0.9921rem + 1.1003vw, 2.3125rem);
}

@media screen and (max-width: 768px) {

    .fold.solar .grid--2 {
        grid-column: span 3;
    }

    .fold.solar .grid--2:nth-child(4),
    .fold.solar .grid--2:nth-child(5) {
        grid-row: 2;
    }

    .fold.solar .grid--2:nth-child(1) {
        grid-column: 2/5;
        transform: translateX(clamp(0.875rem, 0.6626rem + 0.9061vw, 1.75rem));
    }
    .fold.solar .grid--2:nth-child(2) {
        grid-column: 5/8;
        transform: translateX(clamp(0.875rem, 0.6626rem + 0.9061vw, 1.75rem));
    }
    .fold.solar .grid--2:nth-child(3) {
        grid-column: 8/11;
        transform: translateX(clamp(0.875rem, 0.6626rem + 0.9061vw, 1.75rem));
    }

    .fold.solar .grid--2:nth-child(4) {
        grid-column: 4/7;
    }

    .fold.solar .grid--2:nth-child(5) {
        grid-column: 7/10;
    }

}

/* Features */

.features {
    padding-bottom: clamp(4.25rem, 3.6584rem + 2.5243vw, 6.6875rem);
}

.features .grid {
    gap: clamp(2rem, 0.6044rem + 5.9547vw, 7.75rem);
}

.feature.bg--yellow {
    padding-bottom: 2rem;
}

.feature.bg--white{
    padding-bottom: 4.5rem;
}

.feature img {
    box-shadow: 0 31px 36px 0 rgba(0, 0, 0, 0.2);
    border-radius: clamp(0.5rem, 0.318rem + 0.7767vw, 1.25rem);
    z-index: 1;
}

.feature.bg--yellow img,
.feature.bg--white img {
    margin-top: -120px;
}

.feature.bg--green img,
.feature.bg--grey img {
    margin-top: 88px;
    margin-bottom: -120px;
}

.feature__col.text {
    padding-top: clamp(2.25rem, 0.824rem + 6.0841vw, 8.125rem);
}

.feature__divider {
    position: relative;
    z-index: -1;
}

@media screen and (max-width: 768px) { 

    .feature .grid--6 {
        grid-column: span 6;
    }

    .feature.bg--yellow
    .feature.bg--white {
        margin-top: 50px;
    }

    .feature.bg--yellow img,
    .feature.bg--white img {
        margin-top: -50px;
    }

    .feature.bg--green img,
    .feature.bg--grey img {
        margin-top: 46px;
        margin-bottom: 0;
}

}

@media screen and (max-width: 430px) { 

    .features .grid {
        gap: 0;
    }

    .feature .grid--6 {
        grid-column: span 12;
    }

    .feature.bg--yellow,
    .feature.bg--green,
    .feature.bg--grey {
        margin-top: 65px;
    }

    .feature.bg--white {
        margin-top: 85px
    }

    .feature.bg--yellow img,
    .feature.bg--white img,
    .feature.bg--green img,
    .feature.bg--grey img {
        margin-top: -65px;
    }

    .feature.bg--yellow .feature__col.image,
    .feature.bg--green .feature__col.image {
        order: -1;
    }

}

/* Call to action */

.call-to-action {
    padding-block: clamp(3.25rem, 3.0073rem + 1.0356vw, 4.25rem) clamp(3.75rem, 3.3708rem + 1.6181vw, 5.3125rem);
}

.call-to-action__wrapper {
    max-width: 1120px;
}

.call-to-action.narrow .call-to-action__wrapper {
    max-width: 1082px;
}

.call-to-action__wrapper h2 {
    max-width: 956px;
}

.call-to-action__wrapper .btn {
    margin-top: clamp(1.25rem, 0.7949rem + 1.9417vw, 3.125rem);
}

/* Contact Form */

.contact-form {
    padding-block: clamp(4.25rem, 4.068rem + 0.7767vw, 5rem);

}

.contact-form .text {
    max-width: 534px;
    margin-bottom: 3.2rem;
}

.contact-form__locations {
    margin-top: clamp(3.125rem, 2.6804rem + 1.933vw, 5rem);
}

@media screen and (max-width: 430px) {

    .contact-form.contact .contact-form__wrapper {
        row-gap: 2rem;
    }

    .contact-form.contact .form {
        order: -1;
    }

}

/* Process */

.process {
    padding-block: clamp(2.8125rem, 2.054rem + 3.2362vw, 5.9375rem) 3.375rem;
}

.process-grid {
    gap: clamp(1.25rem, 1.1286rem + 0.5178vw, 1.75rem);
    margin-block: clamp(2.5rem, 2.2573rem + 1.0356vw, 3.5rem);
}

.process-grid__item {
    padding: 2.5rem clamp(2.5rem, 2.3483rem + 0.6472vw, 3.125rem) clamp(1.25rem, 1.1286rem + 0.5178vw, 1.75rem);
    border-radius: 1.25rem;
}

.process-grid__item .icon {
    max-width: clamp(4.375rem, 3.9199rem + 1.9417vw, 6.25rem);
    margin-bottom:  clamp(1.25rem, 0.9921rem + 1.1003vw, 2.3125rem);
}

.about-us.process .grid {
    grid-template-columns: repeat(15, 1fr);
}

.about-us .process__info {
    max-width: 1140px;
}

.page-id-28 .process-grid__item {
    color: var(--body);
    background-color: var(--background);
}

@media screen and (max-width: 1024px) {
    .about-us.process .grid {
        grid-template-columns: repeat(12, 1fr);
    }

    .about-us.process .grid--3 {
        grid-template-columns: span 6;
    }

    .about-us.process .grid--3:last-of-type {
        grid-column: 4/10;
    }
}

@media screen and (max-width: 768px) {
    .process-grid .grid--3 {
        grid-column: span 6;
    }
}

@media screen and (max-width: 430px) {
    .process-grid .grid--3,
    .about-us.process .grid--3:last-of-type {
        grid-column: span 12;
    }
}

/* Ratings */

.rating {
    padding-block: 3.75rem clamp(2.125rem, 1.1238rem + 4.2718vw, 6.25rem);
}

.rating-quotes {
    margin-block: clamp(2.5rem, 2.1966rem + 1.2945vw, 3.75rem) 2.5rem;
}

.rating-quotes__item {
    margin-bottom: clamp(1.25rem, 1.1286rem + 0.5178vw, 1.75rem);
    background-color: var(--white);
    border-radius: 1.25rem;
    padding: clamp(3.125rem, 2.9733rem + 0.6472vw, 3.75rem) clamp(1.875rem, 0.4794rem + 5.9547vw, 7.625rem);
}

/* Video */

.video .video__col {
    max-width: 1140px;
    padding-top: clamp(0rem, -3.2502rem + 13.8675vw, 5.625rem);
    justify-self: center;
}

.video .video__col video {
    margin-top: -207px;
    position: relative;
    border: clamp(0.3125rem, 0.1456rem + 0.712vw, 1rem) solid var(--white);
    border-radius: clamp(0.375rem, 0.1626rem + 0.9061vw, 1.25rem);
    box-shadow: 0 23px 26px 0 rgba(0, 0, 0, 0.2);
}

.video.solar .video__col video {
    margin-top: -77px;
    margin-bottom: -100px;
}

@media screen and (max-width: 1024px) {
    .video .video__col video {
        margin-top: -134px;
    }

    .video.solar .video__col video {
        margin-bottom: -60px;
    }

}

@media screen and (max-width: 425px) {
    .video .video__col video {
        margin-top: -60px;
    }

    .video.solar .video__col video {
        margin-top: -30px;
        margin-bottom: -60px;
    }
}

/* Centrefold */

.centrefold {
    padding-block: clamp(4.25rem, 3.6276rem + 2.7062vw, 6.875rem);
}

.centrefold__text {
    max-width: 880px;
}

.grid.centrefold-items {
    gap: clamp(1.25rem, 0.79rem + 2vw, 1.75rem);
    margin-top: clamp(2.8125rem, 2.6495rem + 0.7088vw, 3.5rem);
}

.centrefold-item {
    padding: 2.5rem clamp(2.5rem, 2.3518rem + 0.6443vw, 3.125rem);
    border-radius: 1.25rem;
}

.centrefold-item .icon {
    margin-bottom: clamp(1.875rem, 1.7713rem + 0.451vw, 2.3125rem);
    max-width: 100px;
    object-fit: contain;
}

.centrefold .btn {
    margin-top: clamp(2rem, 1.8814rem + 0.5155vw, 2.5rem);
    margin-inline: auto;
}

.centrefold.solar .centrefold__text {
    max-width: 1080px;
}

.centrefold.maintenance .centrefold__text {
    max-width: 920px;
}

.centrefold.solar .centrefold-item,
.centrefold.heatpumps .centrefold-item {
    display: flex;
    align-items: flex-start;
    gap: 2.5rem;
}

.centrefold.solar .centrefold-item .icon {
    margin-bottom: 0;
}

@media screen and (max-width: 1024px) {
    .centrefold-items .grid--3 {
        grid-column: span 6;
    }
}

@media screen and (max-width: 430px) {
    .centrefold-items .grid--3 {
        grid-column: span 12;
    }

    .centrefold.solar .centrefold-item,
    .centrefold.heatpumps .centrefold-item {
        display: block;
    }

}