body {
    background-color: var(--color-white);
}

#primary {
    margin: 0 !important;
}

.section-heatable-bg {
    background: var(--boiler-heatable-color);
}

/* Hero Banner */
.header-content {
    padding: 70px 40px;
    border-radius: 50px;
    margin-bottom: 230px;
}

.boiler-block {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 50px;
}

.new-boiler {
    color: var(--color-black);
    font-size: var(--font-title);
    line-height: 1.25;
    margin-top: 0;
    margin-bottom: 0;
}

.boiler-offer {
    color: var(--color-black);
    font-size: var(--font-subheading);
    font-weight: var(--font-regular);
    margin-top: 10px;
    margin-bottom: 0;
}

.plan-details ul li {
    position: relative;
    font-size: var(--font-lg);
    line-height: 1.2;
    padding-left: 30px;
    margin-bottom: 5px;
    color: var(--color-white);
}

.plan-details ul li::before {
    content: "";
    width: 20px;
    height: 20px;
    position: absolute;
    top: 0;
    left: 0;
    background: url(/__prelive/wp-content/uploads/2023/03/new-tick-20by20.svg);
}

.boiler-form {
    max-width: 450px;
}

.quote-form {
    text-align: center;
    background-color: var(--color-light);
    padding: 20px; 
    border-radius: 30px;
    box-shadow: 0px 4px 16.5px 6px #00000040;
    margin-bottom: -230px;
}

.quote-form .gform_title {
    font-size: var(--font-subheading);
    color: var(--color-black);
    margin-top: 0;
    margin-bottom: 25px;
}

.quote-form .gform_wrapper .gfield {
    text-align: left;
}

.quote-form .gform_wrapper .gfield .gfield_label {
    color: var(--color-black);
    font-weight: var(--font-regular);
}

.quote-form .gform_wrapper .gfield .gfield_label .gfield_required_text {
    font-size: 0;
    font-style: normal;
}

.quote-form .gform_wrapper .gfield .gfield_label .gfield_required_text::after {
    content: "*";
    font-size: var(--font-md);
}

.quote-form .gform_wrapper .gfield input {
    border: 1px solid var(--color-bg);
    border-radius: 5px;
    padding: 15px !important;
    outline: none;
}

.quote-form .gform_wrapper .gform_footer .gform_button {
    width: 100%;
    font-size: var(--font-lg);
    background: var(--color-primary) !important;
    margin-bottom: 0;
}

.quote-form .gform_wrapper .gform_footer .gform_button:hover {
    background: var(--color-black) !important;
    border-color: var(--color-black);
}

.quote-form .gform_wrapper .gform_validation_errors,
.quote-form .gform_wrapper .gfield .validation_message {
    display: none !important;
}

.quote-form-disclaimer {
    font-size: var(--font-xxs);
    text-align: left;
    margin-top: 30px;
}
 
.quote-form-disclaimer a {
    text-decoration: underline;
    text-underline-position: under;
}
/* /Hero Banner */


/* How it Works */
.how-works-section p {
    margin: 0 auto;
    text-align: center;
    color: var(--color-black);
    font-size: var(--font-xxl);
    font-weight: 600;
}

.steps-img img {
   display: none;
}

.horizontal-img {
    margin: auto;
}

.quote-img {
    max-width: 250px;
}

.quote-img img {
    width: 60%;
}

.boiler-steps-one {
    display: flex;
    max-width: 80%;
    margin: 30px auto 0;
    align-items: center;
    text-align: center;
}

.quote-one {
    text-align: center;
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.quote-one h3 {
    margin-bottom: 0;
}

.upgrade-button {
    max-width: fit-content;
    margin: auto;
    padding-bottom: 20px;
}
/* /How it Works */

.plusheat-faqs .section-primary-bg.text-light {
    background: var(--boiler-heatable-color);
    color: var(--color-black);
}


@media (max-width: 768px) {
    .boiler-block {
        flex-direction: column;
        text-align: center;
        gap: 40px;
    }

    .boiler-form {
        margin: 0 auto;
    }
    
    .horizontal-img {
        display: block;
    }

    .upgrade-button {
        padding-bottom: 15px;
    }
}

@media (max-width: 680px) {
    .header-content {
        padding: 40px 25px;
        border-radius: 20px;
    }

    .boiler-block {
        gap: 30px;
    }

    .new-boiler {
        font-size: 3.2rem;
    }

    .quote-form .gform_wrapper .gfield input {
        padding: 10px !important;
    }

    .quote-form .gform_wrapper .gform_footer .gform_button {
        font-size: var(--font-md);
        padding: 10px;
    }

    .quote-form-disclaimer {
        margin-top: 20px;
    }

    .quote-one {
        display: block;
    }

    .quote-img img {
        width: 100%;
    }

    .quote-one h3 {
        text-align: left;
    }

    .quote-one p {
        text-align: left;
    }

    .upgrade-button {
        padding-bottom: 15px;
    }

    .boiler-offer {
        font-size: 21px;
    }

    .steps-img {
        min-width: 40px;
    }

    .steps-img img {
        height: 680px;
        display: block;
    }

    .quote-one {
        padding: 0;
    }

    .boiler-steps-one {
        max-width: 100%;
        flex-direction: column;
        margin: 0 10px;
    }

    .boiler-steps-align {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .horizontal-img {
        display: none;
    }
}

@media (max-width: 600px) {
    .boiler-form {
        max-width: 95%;
    }
}

@media (max-width: 500px) {
    .new-boiler {
        font-size: 2.2rem;
    }

    .boiler-offer {
        font-size: 19px;
    }    
}