/*
 Theme Name:   Woodmart Child
 Description:  Woodmart Child Theme
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
*/

@font-face {
  font-family: 'Inter';
  src: url('fonts/Inter-VariableFont_opsz,wght.woff2') format('woff2-variations'),
       url('fonts/Inter-VariableFont_opsz,wght.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* The Inter file above declares weights 100-900 but contains no weight axis
   (every weight from 200 to 900 renders as Regular - and because the range
   is declared, browsers don't fake-bold it either). This is a proper Inter
   variable font (Google Fonts, latin subset, OFL); being declared later it
   wins for the characters it covers, giving real 500/600/700 weights. The
   original face still covers everything outside the latin range. */
@font-face {
  font-family: 'Inter';
  src: url('fonts/Inter-latin-wght.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Inter';
  src: url('fonts/Inter-Italic-VariableFont_opsz,wght.woff2') format('woff2-variations'),
       url('fonts/Inter-Italic-VariableFont_opsz,wght.woff2') format('woff2');
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Poppins';
  src: url('fonts/Poppins-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Poppins';
  src: url('fonts/Poppins-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Poppins';
  src: url('fonts/Poppins-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Poppins';
  src: url('fonts/Poppins-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

.whb-top-bar-inner .info-svg-wrapper {
    width: 20px !important;
    height: 20px !important;
}

.whb-column.whb-col-right.whb-column7.whb-visible-lg {
    gap: 5px;
}

.wd-content-layout {
    padding: 0px !important;
}

.sec-1 {
    background: url(../../uploads/2026/09/Background-2.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    padding-block: 190px;
}

.sec-1 h1 {
    font-size: 60px;
    color: #fff;
    line-height: 1.1;
    font-family: 'poppins';
}

.sec-1 span.sub-head {
    font-size: 17px;
    color: #fff;
    border: 1px solid;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding-inline: 20px;
    border-radius: 50px;
    font-family: 'Inter';
    padding-block: 6px;
}

.sec-1 span.sub-head::before {
    content: '';
    background: #44cf6c;
    width: 10px;
    height: 10px;
    display: block;
    border-radius: 10px;
}

.sec-1 p {
    color: #fff;
    font-size: 19px;
    width: 540px;
    font-family: 'Inter';
}

.sec-1 .vc_row.wpb_row.vc_row-fluid .vc_row.wpb_row.vc_inner.vc_row-fluid .wpb_wrapper {
    display: flex;
    gap: 20px;
    padding-top: 30px;
}

a.btn.btn-style-default.btn-shape-rectangle.btn-size-default.btn.theme-btn {
    background: #44cf6c;
    text-transform: capitalize;
    font-size: 18px;
    border-radius: 30px;
    padding-inline: 40px;
    padding-block: 15px !important;
    color: #fff;
    font-family: 'Inter';
    gap: 10px;
}

.sec-1 .vc_row.wpb_row.vc_row-fluid .vc_row.wpb_row.vc_inner.vc_row-fluid .wpb_wrapper .wd-button-wrapper:first-child {}

.sec-1 .vc_row.wpb_row.vc_row-fluid .vc_row.wpb_row.vc_inner.vc_row-fluid .wpb_wrapper .wd-button-wrapper:last-child a {background: #44cf6c;color: #fff;}

/* --- Responsive -------------------------------------------------------
   .sec-1 p had a hardcoded 540px width (fine on desktop, but wider than
   a phone screen) and the button row never wrapped, so the WhatsApp
   button ran off the right edge of the viewport. */

@media (max-width: 1024px) {
    .sec-1 h1 {
        font-size: 46px;
    }

    .sec-1 p {
        width: 100%;
        max-width: 480px;
    }
}

@media (max-width: 767px) {
    .sec-1 {
        padding-block: 130px 60px;
    }

    .sec-1 h1 {
        font-size: 36px;
    }

    .sec-1 p {
        width: 100%;
        max-width: 100%;
        font-size: 16px;
    }

    .sec-1 span.sub-head {
        font-size: 14px;
    }

    .sec-1 .vc_row.wpb_row.vc_row-fluid .vc_row.wpb_row.vc_inner.vc_row-fluid .wpb_wrapper {
        flex-wrap: wrap;
        row-gap: 12px;
    }
}

ul#menu-header-nav {
    width: 100%;
    justify-content: center;
    gap: 30px;
}

span.nav-link-text {
    font-size: 16px;
    text-transform: capitalize;
    font-weight: 500;
    color: #000;
    font-family: 'Inter';
}

a.btn.btn-style-default.btn-shape-round.btn-size-default.btn.theme-btn {
    text-transform: capitalize;
    font-size: 18px;
    border-radius: 30px;
    padding-inline: 40px;
    padding-block: 17px  16px !important;
    color: #fff;
    background: #44cf6c;
    line-height: 1;
    font-family: 'Inter';
}

.about-sec {
    padding-block: 120px;
    display: flex;
    align-items: center;
}

.info-box-subtitle.subtitle-color-default.wd-fontsize-xs.subtitle-style-default, .sub-head {
    font-size: 18px;
    font-family: 'Poppins';
    color: #1770D4;
}

h2.info-box-title.title.box-title-style-default.wd-fontsize-m , h2 {
    font-size: 40px;
    font-family: 'Poppins';
    color: #000;
}

p {
    font-size: 18px;
    color: #000;
    font-family: 'Inter';
}

.about-sec img.vc_single_image-img.attachment-full {
    border-radius: 20px;
    height: 580px;
    object-fit: cover;
}

/* --- Responsive -------------------------------------------------------
   .about-sec is itself the WPBakery row (display:flex, align-items:center,
   nowrap). The image column has no width of its own - only the img's
   fixed height:580px - so at narrow widths the flex row squeezed the
   image column down to a sliver while the text column overflowed past
   it. Stack the two columns instead of fighting the fixed image height. */

@media (max-width: 1024px) {
    .about-sec {
        flex-direction: column;
        align-items: stretch;
        padding-block: 70px;
        gap: 30px;
    }

    .about-sec .vc_col-sm-6 {
        width: 100%;
        flex: 0 0 100%;
    }

    .about-sec img.vc_single_image-img.attachment-full {
        height: 320px;
        width: 100%;
    }
}

@media (max-width: 767px) {
    .about-sec {
        padding-block: 48px;
        gap: 24px;
    }

    .about-sec img.vc_single_image-img.attachment-full {
        height: 220px;
    }

    .about-sec h2.info-box-title.title.box-title-style-default.wd-fontsize-m {
        font-size: 21px;
    }
}

a.btn.btn-style-default.btn-shape-round.btn-size-default {
    text-transform: capitalize;
    font-size: 18px;
    border-radius: 30px;
    padding-inline: 40px;
    padding-block: 16px 16px !important;
    color: #fff;
    background: #44cf6c;
    line-height: 1;
    font-family: 'Inter';
    gap: 10px;
}
.sec-topup .wd-info-box {
    flex-direction: column;
    background: linear-gradient(110.36deg, #1770d4 -0.03%, #59a0f0 100.03%);
    border-radius: 20px;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding-block: 60px;
    padding-inline: 20px;
}

.sec-topup .wd-info-box .info-svg-wrapper {
    width: 45px !important;
    height: 45px !important;
    background: #ffffff30;
    border-radius: 40px;
}

.sec-topup .wd-info-box .info-svg-wrapper img {
    filter: brightness(0) invert(1);
    padding: 10px;
}

.sec-topup .wd-info-box h4.info-box-title.title.box-title-style-default.wd-fontsize-m {
    color: #fff;
    font-family: 'Poppins';
    font-size: 21px;
}

.sec-topup .wd-info-box p {
    color: #fff;
    font-size: 15px;
}

.sec-topup {
    padding-bottom: 90px;
}

.sec-3 .wd-info-box {
    padding: 20px;
    background: linear-gradient(110.36deg, #1770d4 -0.03%, #59a0f0 100.03%);
    border-radius: 20px;
    transition: 0.5s;
}

.sec-3 .wd-info-box img.attachment-800x600.size-800x600 {
    border-radius: 10px;
}

.sec-3 .wd-info-box h3.info-box-title.title.box-title-style-default.wd-fontsize-m {
    font-size: 23px;
    font-family: 'Inter';
    color: #fff;
}

.sec-3 .wd-info-box a.btn.btn-style-default.btn-shape-rectangle.btn-size-default {
    width: 100%;
    font-size: 15px;
    min-height: auto;
    text-transform: capitalize;
    font-family: 'Inter';
    padding-block: 13px;
    border-radius: 10px;
    background: #44cf6c;
    color: #fff;
    box-shadow: 0 10px 30px 0 #44cf6cc4;
    background: linear-gradient(94.62deg, #44cf6c, #44cf6c 98.96%);
}

.sec-3 .wd-info-box:hover {transform: scale(1.1) translateY(0px);}

.sec-3 {
    padding-bottom: 120px;
    background: linear-gradient(180deg, rgba(237, 244, 251, 0.65) 0%, rgba(237, 244, 251, 0.65) 0%);
    padding-top: 110px;
    margin-bottom: 120px;
}

.sec-3 .wpb_column.vc_column_container.vc_col-sm-12 a.btn.btn-style-default.btn-shape-round.btn-size-default.btn.theme-btn {
    margin-top: 20px;
}

.sec-4 img.attachment-800x600.size-800x600 {
    width: 120px;
    height: 120px;
    object-fit: contain;
}

.sec-4 .wd-info-box {
    border: 1px solid;
    padding-block: 20px;
    border-radius: 10px;
    gap: 3px !important;
    transition: 0.5s;
}

.sec-4 .wd-info-box h3.info-box-title.title.box-title-style-default.wd-fontsize-m {
    font-size: 22px;
    color: #000;
    font-family: 'Inter';
    font-weight: 400;
}

.sec-4 .wd-info-box:hover {
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.sec-4 {
    padding-bottom: 100px;
}

.sec-5 .vc_row.wpb_row.vc_row-fluid {
    display: flex;
    align-items: center;
}

.sec-5 img.vc_single_image-img.attachment-full {
    border-radius: 20px;
}

.sec-5 .vc_row.wpb_row.vc_row-fluid .wpb_column.vc_column_container.vc_col-sm-12 .wpb_wrapper {
    display: flex;
    gap: 20px;
}

.sec-5 .vc_row.wpb_row.vc_row-fluid .wpb_column.vc_column_container.vc_col-sm-12 .wpb_wrapper a.btn.btn-style-default.btn-shape-rectangle.btn-size-default.btn.theme-btn {
    background: linear-gradient(110.36deg, #1770d4 -0.03%, #59a0f0 100.03%);
    color: #fff;
    gap: 10px;
}

.sec-5 > .vc_row.wpb_row.vc_row-fluid {border: 1px solid #ddd;border-radius: 20px;padding-inline: 20px;padding-block: 30px;background: #fff;box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;margin-bottom: 120px;}

.wpb_single_image.wpb_content_element.vc_align_center {
    margin: 0px !important;
}

a.btn.btn-style-default.btn-shape-round.btn-size-default::after {
    content: "\f120";
    font-family: "woodmart-font";
    font-weight: 400;
}

.sec-5 .vc_row.wpb_row.vc_row-fluid .wpb_column.vc_column_container.vc_col-sm-12 .wpb_wrapper a.btn.btn-style-default.btn-shape-rectangle.btn-size-default.btn.theme-btn::after {
    content: "\f120";
    font-family: "woodmart-font";
    font-weight: 400;
}

.sec-5 .vc_row.wpb_row.vc_row-fluid .wpb_column.vc_column_container.vc_col-sm-12 .wpb_wrapper .wd-button-wrapper:last-child a.btn.btn-style-default.btn-shape-rectangle.btn-size-default.btn.theme-btn::after {
    display: none !important;
}

.why-sec ul li {
    border: 1px solid #fff;
    color: #fff;
    font-size: 17px;
    font-family: 'Inter';
    padding-inline: 20px;
    padding-block: 19px;
}

.why-sec {
    display: flex;
    align-items: center;
}

.why-sec h2.info-box-title.title.box-title-style-default.wd-fontsize-m {
    color: #fff;
    padding-block: 2px 19px;
}

.why-sec ul {
    padding: 0;
    list-style: none;
}


.why-sec {
    background: #44cf6c;
    padding-block: 120px 90px;
}

.testimonial-inner {
    display: flex;
    flex-direction: column-reverse;
    background: linear-gradient(110.36deg, #3b8de8 -0.03%, #83b5ef 100.03%);
    padding: 30px;
    border-radius: 20px;
    border: 1px solid #003283;
}

.testimon-style-info-top .wd-testimon-text:before {
    display: none;
}

.wd-testimon-text.reset-last-child {
    background: none !important;
    padding: 0px !important;
    margin: 0px !important;
    border-bottom: 1px solid #fff;
    margin-bottom: 30px !important;
    display: flex;
    flex-direction: column-reverse;
    gap: 7px;
}

.testimonial-inner p {
    color: #fff;
    margin-bottom:  8px !important;
}

.testimon-style-info-top .wd-testimon-thumb img {
    width: 10px !important;
    max-width: 10px !important;
    min-width: 50px !important;
}

.wd-testimon-name.title {
    color: #fff;
    font-family: 'Inter';
    margin-bottom: 0px !important;
    font-size: 17px;
}

.wd-testimon-pos {
    font-size: 14px;
    color: #fff;
}

.wd-testimon-text.reset-last-child::after {
    content: url(../../uploads/2026/09/Vector.png);
}

.testi-section p br {
    display: none;
}

.testi-section {
    display: flex;
    align-items: center;
}

.testi-section {
    padding-block: 110px;
}

.area {
    display: flex;
    align-items: center;
    background: linear-gradient(180deg, rgba(237, 244, 251, 0.65) 0%, rgba(237, 244, 251, 0.65) 0%);
    padding-block: 80px 80px;
}

.area  ul {
    list-style: none;
    padding: 0;
    display: flex;
    gap: 0px;
    flex-wrap: wrap;
    row-gap: 5px;
    column-gap: 15px;
    margin-top: 20px;
}

.area ul li {
    background: #fff;
    padding: 10px;
    height: 50px;
    display: flex;
    align-items: center;
    text-align: center;
    width: 150px;
    justify-content: center;
    border-radius: 50px;
    font-size: 14px;
    font-family: 'Inter';
    border: 1px solid rgba(16, 24, 44, 0.08);
    color: #000;
}

.area .info-box-subtitle.subtitle-color-default.wd-fontsize-xs.subtitle-style-default {
    margin-bottom: 16px;
}

.testimonial-inner::before {
    content: "\f148 \f148 \f148 \f148 \f148";
    font-family: "woodmart-font";
    font-weight: 400;
    position: absolute;
    top: 26px;
    font-size: 28px;
    right: 45px;
    color: #F5C103;
}

/* --- Responsive -------------------------------------------------------
   .why-sec, .testi-section and .area are each their own WPBakery row
   (display:flex, nowrap) holding two vc_col-sm-6 children - same pattern
   as .about-sec above. Without a media query they never stack, so on a
   phone the second column gets squeezed by the flex row: the why-choose
   image overlapped the list, the testimonial card ran off the right
   edge, and worst of all the "Areas Covered" leaflet map was squeezed to
   0px wide (present in the DOM, completely invisible). */

@media (max-width: 1024px) {
    .why-sec {
        flex-direction: column;
        align-items: stretch;
        padding-block: 70px;
        gap: 30px;
    }

    .why-sec .vc_col-sm-6 {
        width: 100%;
        flex: 0 0 100%;
    }

    .testi-section {
        flex-direction: column;
        align-items: stretch;
        padding-block: 70px;
        gap: 30px;
    }

    .testi-section .vc_col-sm-6 {
        width: 100%;
        flex: 0 0 100%;
    }

    .area {
        flex-direction: column;
        align-items: stretch;
        padding-block: 60px;
        gap: 30px;
    }

    .area .vc_col-sm-6 {
        width: 100%;
        flex: 0 0 100%;
    }

    .area [id^="custom-leaflet-map"] {
        height: 320px !important;
        width: 100% !important;
    }
}

@media (max-width: 767px) {
    .why-sec h2.info-box-title.title.box-title-style-default.wd-fontsize-m {
        font-size: 21px;
    }

    .testi-section {
        padding-block: 40px 50px;
        gap: 0;
    }

    .area {
        padding-block: 8px 10px;
    }

    .area [id^="custom-leaflet-map"] {
        height: 260px !important;
    }
}

.blog-row {
    padding-block: 120px 90px;
}

.blog-row .wpb_column.vc_column_container.vc_col-sm-6 {
    padding-bottom: 20px;
}

.blog-row h3.wd-post-title.wd-entities-title.title.post-title {
    width: 100% !important;
    text-align: left;
    min-height: 61px;
}

.blog-row .wd-post-author {
    display: none !important;
}

.blog-row .wd-post-meta {
    display: none !important;
}

.blog-row .wd-post-excerpt.entry-content {
    text-align: left;
}

.blog-row .wd-post-read-more.wd-style-link.read-more-section {
    width: 100%;
    text-align: left;
}

.blog-row .wd-post-cat.wd-style-with-bg.meta-post-categories {
    width: 100%;
    text-align: left;
    background: none !important;
    margin: 0px !important;
    color: #1770D4;
    padding: 0px !important;
    letter-spacing: 1px;
    pointer-events: none !important;
}

.blog-row .wd-post-cat.wd-style-with-bg.meta-post-categories a {
    color: #1770D4;
    font-family: 'Inter';
    font-size: 14px;
}

.blog-row h3.wd-post-title.wd-entities-title.title.post-title a {
    font-family: 'Inter';
    font-size: 25px;
    line-height: 1;
    color: #000;
}

.blog-row .wd-post-excerpt.entry-content {
    color: #000;
    font-family: 'Inter';
}

.blog-row .wd-post-img.post-img-wrapp {
}

.blog-row img.attachment-medium.size-medium {
    min-height: 258px;
    object-fit: cover;
}

.wd-post-inner.article-inner {
    box-sha]none: !;
    border-radius: 20px !important;
}

article#post-87 {
}

.wd-post-content.article-body-container {background: none !important;}

.blog-design-masonry.blog-style-bg .wd-post-thumb {
    border-top-left-radius: 20px !important;
    border-top-right-radius: 20px !important;
}

.wd-post-read-more.wd-style-link.read-more-section a {
    color: #000;
    text-transform: capitalize;
    font-family: 'Inter';
    font-size: 14px;
}

.wd-post-read-more.wd-style-link.read-more-section a::after {
    content: "\f120";
    font-family: "woodmart-font";
    font-weight: 400;
}

.wd-post-read-more.wd-style-link.read-more-section a {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #1770D4;
}

.wd-post-read-more.wd-style-link.read-more-section a,
.wd-post-read-more.wd-style-link.read-more-section a::after {
    transition: color .2s ease, gap .2s ease, transform .2s ease;
}

.wd-post-read-more.wd-style-link.read-more-section a:hover {
    color: #103a68;
    gap: 13px;
}

.wd-post-read-more.wd-style-link.read-more-section a:hover::after {
    transform: translateX(3px);
}

.blog-row img.attachment-medium.size-medium {
    transition: transform .4s ease;
}

.blog-row .wd-post-img.post-img-wrapp {
    overflow: hidden;
    display: block;
    border-radius: 20px 20px 0 0;
}

.blog-row .wd-post-inner.article-inner:hover img.attachment-medium.size-medium {
    transform: scale(1.05);
}

.wd-post-inner.article-inner {
    transition: box-shadow .3s ease, transform .3s ease;
}

.wd-post-inner.article-inner:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 30px rgba(17, 30, 54, .12);
}

.final-cta {
    background: url(../../uploads/2026/09/banner-cta.png);
    background-repeat: repeat;
    padding-block: 100px;
    background-size: 100% 100%;
    border-radius: 20px;
    margin-bottom: 100px;
    background-position: right;
    margin: 0;
    margin-bottom: 70px !important;
}

.final-cta .info-box-subtitle.subtitle-color-default.wd-fontsize-xs.subtitle-style-default {
    color: #44cf6c;
}

.final-cta h2 {
    color: #fff !important;
}

.final-cta p {
    color: #44cf6c;
}

.final-cta .vc_row.wpb_row.vc_inner.vc_row-fluid .wpb_wrapper {
    display: flex;
    justify-content: flex-start;
    gap: 20px;
}

/* --- Responsive -------------------------------------------------------
   This is the site-wide pre-footer CTA (appears on every page via
   get_footer()). Its button row never wrapped, so on a phone the
   WhatsApp button ran off the right edge - the long-flagged "pre-footer
   CTA mobile bug" from the category-page work, now fixed at the root. */

@media (max-width: 1024px) {
    .final-cta .vc_row.wpb_row.vc_inner.vc_row-fluid .wpb_wrapper {
        flex-wrap: wrap;
        row-gap: 12px;
    }
}

@media (max-width: 767px) {
    .final-cta {
        padding-block: 56px;
    }

    .final-cta .wpb_column.vc_column_container.vc_col-sm-6:last-child {
        padding-left: 0;
    }

    /* banner-cta.png is a wide (3:1) studio shot with the car crammed into
       the left half and empty grey space on the right - background-size:
       100% 100% stretches the whole thing (car included) directly behind
       the text once the columns stack, instead of just showing the empty
       side as it does on desktop. Swap it for a plain backdrop on mobile
       so the heading/paragraph stay legible. */
    .final-cta {
        background-image: none;
        background-color: #eef0f3;
        padding-block: 40px !important;
    }

    .final-cta h2,
    .final-cta .info-box-subtitle {
        color: #0B1220 !important;
    }

    .final-cta p {
        color: #3a6b4d;
    }
}

.footer-column.footer-column-2.wd-grid-col {
    --wd-col-lg: 3;
}

.footer-column.footer-column-2.wd-grid-col {
    --wd-col: 2;
}

.footer-column.footer-column-1.wd-grid-col {
    --wd-col: 4;
}

img.image.wp-image-98.attachment-full.size-full {
    filter: brightness(0) invert(1);
}

.footer-column p {
    color: #fff;
}

div#media_image-2 {
    padding-bottom: 0px !important;
    margin-left: 0px;
}

.footer-column p a {
}

.footer-column .am-footer__contact-links a {
    color: #fff;
    font-family: 'Inter';
    font-size: 17px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.am-footer__contact-links {
    display: flex;
    gap: 20px;
}

/* Icons via CSS background-image data-URIs, matched by href prefix, rather
   than inline <svg> in the widget text - this is a Text widget rendered
   through wp_kses_post at *display* time (not just on save), so any real
   <svg> tag placed in the widget content gets stripped every page load
   regardless of how it was saved (same reason page content can't have
   inline svg either - see the KSES gotcha noted elsewhere in this file). */
.footer-column .am-footer__contact-links a::before {
    content: '';
    width: 18px;
    height: 18px;
    flex: none;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.footer-column .am-footer__contact-links a[href^="tel:"]::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
}

.footer-column .am-footer__contact-links a[href*="whatsapp.com"]::before,
.footer-column .am-footer__contact-links a[href^="https://wa.me"]::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M17.6 6.32A7.85 7.85 0 0 0 12.05 4a7.94 7.94 0 0 0-6.9 11.9L4 20l4.2-1.1a7.93 7.93 0 0 0 3.85 1h.01a7.94 7.94 0 0 0 5.54-13.58zm-5.55 12.2h-.01a6.6 6.6 0 0 1-3.36-.92l-.24-.14-2.5.65.67-2.43-.16-.25a6.6 6.6 0 0 1 10.24-8.2 6.55 6.55 0 0 1 1.94 4.67 6.6 6.6 0 0 1-6.58 6.62zm3.62-4.95c-.2-.1-1.17-.58-1.35-.64-.18-.07-.32-.1-.45.1-.13.19-.51.64-.63.78-.11.13-.23.15-.43.05a5.4 5.4 0 0 1-1.6-.98 5.99 5.99 0 0 1-1.1-1.37c-.12-.2 0-.3.09-.4.09-.1.2-.24.29-.36.1-.12.13-.2.2-.33.06-.13.03-.25-.02-.35-.05-.1-.45-1.08-.61-1.48-.16-.39-.33-.33-.45-.34h-.38c-.13 0-.35.05-.53.25s-.7.68-.7 1.66.72 1.93.82 2.06c.1.13 1.4 2.15 3.42 3.01.48.2.85.33 1.14.42.48.15.91.13 1.26.08.38-.06 1.17-.48 1.34-.94.16-.46.16-.86.11-.94-.05-.09-.18-.14-.38-.24z'/%3E%3C/svg%3E");
}

.footer-column .am-footer__contact-links a[href^="mailto:"]::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 6-10 7L2 6'/%3E%3C/svg%3E");
}

h5.widget-title {
    color: #fff;
    font-family: 'Inter';
    text-transform: capitalize;
    font-size: 23px;
}

.footer-column li a {
    font-family: 'Inter';
    color: #fff !important;
    font-size: 15px;
    font-weight: 400 !important;
    display: flex !important;
    align-items: center;
    gap: 10px;
}

.container.main-footer {
    border-bottom: 1px solid #fff;
}

footer.wd-footer.footer-container {
    padding-top: 50px;
    position: relative;
}

aside.footer-sidebar.widget-area.wd-grid-g {
    padding-bottom: 80px !important;
}

.wd-copyrights.copyrights-wrapper.wd-layout-two-columns {
    text-align: center;
}

.wd-col-start.reset-last-child {
    font-family: 'Inter';
    color: #fff;
    font-size: 14px;
}

.why-sec img.vc_single_image-img.attachment-full {
  --s: 50px;
  border: 8px solid #ffffff;
  padding: 10px;
  background: #f2f2f2 content-box;
  mask: 
    conic-gradient(#000 0 0) content-box,
    conic-gradient(at var(--s) var(--s),#0000 75%,#000 0) 
    0 0/calc(100% - var(--s)) calc(100% - var(--s));
  }



.why-sec .info-box-subtitle.subtitle-color-default.wd-fontsize-xs.subtitle-style-default {
    color: #fff;
}


.final-cta h2.info-box-title.title.box-title-style-default.wd-fontsize-m {
    color: #44cf6c !important;
}

.final-cta .wd-info-box {
    align-items: start !important;
    text-align: left;
}

.final-cta .wpb_column.vc_column_container.vc_col-sm-6:last-child {
    padding-left: 60px;
}

.contact-us .info-svg-wrapper {
    width: 50px !important;
    height: 50px !important;
}

.contact-us {
    padding-block: 70px 100px;
}

.contact-us p {
    font-size: 16px;
}

.wpb_text_column.wpb_content_element {
    margin-bottom: 0px !important;
}

div#wpforms-127 {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

.contact-us .wpb_column.vc_column_container.vc_col-sm-6:last-child {
    border: 1px solid #1f98d6;
    border-radius: 20px;
    padding: 30px 20px;
    background: #1f98d6;
}

.contact-us .info-box-inner.reset-last-child {
    margin-top: 0px !important;
}

.contact-us h4.info-box-title.title.box-title-style-default.wd-fontsize-m {
    font-family: 'Inter';
}

.contact-us h2.info-box-title.title.box-title-style-default.wd-fontsize-m {
    padding-bottom: 9px;
}

.contact-us p {
    color: #000;
}

.wpforms-field-container input::placeholder , textarea::placeholder{
    font-family:'Inter';
}

.wpforms-field-container input , textarea {
    height: 52px !important;
    border-radius: 10px !important;
    border: 1px solid #ddd!important;
}

label.wpforms-field-label  {
    font-family: 'Poppins' !important;
    font-weight: 500 !important;
    margin-bottom: 10px !important;
    color: #fff !important;
}

.contact-us .wpb_text_column.wpb_content_element h2 {
    font-weight: 500;
    font-size: 29px;
    padding-bottom: 10px;
    color: #fff !important;
}

textarea#wpforms-127-field_6 {
    height: 100px !important;
}

button#wpforms-submit-127 {
    width: 100%;
    background: #000 !important;
    font-family: 'Poppins';
    font-size: 18px;
    padding-block: 27px;
    border-radius: 50px;
}

.contact-us p a {
    color: #000;
}

.page-id-18 .area {
    padding-top: 70px !important;
    margin-bottom: 100px;
}

.sec-3  .wpb_column.vc_column_container.vc_col-sm-6 {
    padding-bottom: 40px !important;
}

.sec-3 .wd-info-box a.btn.btn-style-default.btn-shape-rectangle.btn-size-default::before {
    content: "\f175";
    font-family: "woodmart-font";
    font-weight: 400;
    font-size: 21px;
}

.sec-3 a.btn.btn-style-default.btn-shape-rectangle.btn-size-default {
    gap: 11px;
}

.sec-4 .wpb_column.vc_column_container.vc_col-sm-6 {
    padding-bottom: 40px;
}

.single-post .wd-content-area.site-content {
    padding-top: 60px;
    width: 80%;
    margin-inline: auto;
}

div#respond {
    display: none !important;
}

.single-post .wd-content-area.site-content .wd-post-meta {
    display: none !important;
}

.wd-post-cat.wd-style-with-bg a {
    pointer-events: none !important;
    font-family: 'Inter';
}

.wd-post-cat.wd-style-with-bg {
    width: 100%;
    text-align: left;
    background: none !important;
    padding: 0px !important;
}

.wd-post-cat.wd-style-with-bg a {
    color: #2099d6 !important;
    text-transform: capitalize;
    font-size: 16px;
}

.single-post h1.wd-entities-title.wd-post-title.title {
    width: 100% !important;
    text-align: left;
    font-size: 40px;
    color: #000 !important;
}

/* The old step-1 card styling (blue borders, fixed 170px images) and the green
   form frame were replaced by the "Find Your Car" block at the end of this file. */

div#wpforms-159 span.wpforms-page-indicator-page-title-sep {
    font-size: 29px;
}

div#wpforms-159 span.wpforms-page-indicator-steps {
    font-size: 26px;
    color: #000;
    font-family: 'Inter';
}

/* Page/submit buttons for form 159 are styled in the "Find Your Car" block. */

body .wpforms-field-radio ul li input {
    min-height: auto !important;
    height: auto !important;
    border: none !important;
}

legend.wpforms-field-label {
    font-family: 'Inter';
    font-size: 17px !important;
    margin-bottom: 0px !important;
}

div#wpforms-159 .wpforms-layout-column  select {
    border: 1px solid #000000;
    color: #000;
    font-family: 'Inter';
    border-radius: 7px;
    height: 50px !important;
}

div#wpforms-159 .wpforms-field-text  input {
    border: 1px solid #44cf6c !important;
    color: #000 !important;
}

div#wpforms-159 input::placeholder {
    color: #0000008a !important;
    opacity: 1 !important;
}
body {
    --wpforms-button-background-color: #1c9ad9;
}

label.wpforms-field-label-inline {
    font-family: 'Inter';
}

.choices__item.choices__placeholder.choices__item--selectable {
    font-family: 'Inter';
    color: #0000008a !important;
    opacity: 1 !important;
}

.choices__inner {
    border: 1px solid #44cf6c !important;
    height: 56px !important;
    border-radius: 10px !important;
}

div.wpforms-container-full .wpforms-form .wpforms-field.wpforms-field-select-style-modern .choices[data-type*="select-one"] .choices__button {
    opacity: 1 !important;
    top: 18px;
    font-weight: 700 !important;
}

div#media_image-2 img.image.wp-image-192.attachment-full.size-full {
    width: 330px !important;
}

/* ==========================================================================
   Reference-design pass
   Both the body-type and featured-cars sections share .sec-3, so each one is
   targeted by its own section id instead: #browse-body, #our-brands, #used-cars.
   ========================================================================== */

/* --- Shared: section header (heading left, text link right) --------------- */

#browse-body .vc_col-sm-6 .wd-button-wrapper,
#our-brands .vc_col-sm-6 .wd-button-wrapper,
#used-cars .vc_col-sm-6 .wd-button-wrapper {
    text-align: right;
    margin-top: 18px;
}

#browse-body .vc_col-sm-6 a.btn,
#our-brands .vc_col-sm-6 a.btn,
#used-cars .vc_col-sm-6 a.btn {
    background: none !important;
    background-image: none !important;
    box-shadow: none !important;
    color: #1770D4 !important;
    padding: 0 !important;
    min-height: auto !important;
    font-size: 15px;
    font-weight: 600;
    font-family: 'Inter';
    text-transform: capitalize;
    gap: 8px;
}

#browse-body .sub-head,
#our-brands .sub-head,
#used-cars .sub-head {
    text-transform: uppercase;
    letter-spacing: 1.2px;
    font-size: 13px;
    font-weight: 600;
}

#browse-body h2,
#our-brands h2,
#used-cars h2 {
    color: #111E36;
}

/* --- Browse by Body Type: white cards, title + link on one row ------------ */

#browse-body .vc_col-sm-4 .vc_column-inner {
    padding-inline: 10px;
}

/* .adams-slider is built by adams_card_sliders() in functions.php, which
   merges each section's card-only builder rows into one wrapper right after
   the header - shared by #browse-body, #our-brands and #used-cars.

   - #browse-body has no grid of its own (its 3-per-row layout comes from
     plain Bootstrap floats), so `display:contents` on desktop/tablet is
     structurally invisible and the unwrapped columns just float/wrap
     3-per-row exactly as they did in their original rows (the -15px margin
     stands in for the two rows' own vc_row-fluid gutter, since that row box
     is now gone).
   - #our-brands/#used-cars already are `display:grid` at the section level
     (their old per-row `display:contents` flattening rules still exist in
     the CSS below but now match nothing, since those row elements get
     removed - harmless dead rules, left alone rather than risk deleting the
     wrong thing). `.adams-slider` being `display:contents` there flattens
     its cards into that same grid exactly as the old rows did.

   Only past the 767px breakpoint does it become an actual swipeable,
   scroll-snapping slider (`grid-column:1/-1` is needed for the grid
   sections so the slider takes the whole row instead of one grid cell). */
.adams-slider {
    display: contents;
}

@media (min-width: 768px) {
    #browse-body .adams-slider {
        display: block;
        margin-inline: -15px;
    }

    #browse-body .adams-slider::after {
        content: '';
        display: table;
        clear: both;
    }
}

@media (max-width: 767px) {
    #browse-body .adams-slider,
    #our-brands .adams-slider,
    #used-cars .adams-slider {
        display: flex;
        grid-column: 1 / -1;
        overflow-x: auto;
        gap: 14px;
        padding: 4px 0 16px;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    #browse-body .adams-slider::-webkit-scrollbar,
    #our-brands .adams-slider::-webkit-scrollbar,
    #used-cars .adams-slider::-webkit-scrollbar {
        display: none;
    }

    #browse-body .adams-slider > .wpb_column,
    #used-cars .adams-slider > .wpb_column {
        flex: 0 0 76% !important;
        max-width: 76% !important;
        padding-inline: 0 !important;
        scroll-snap-align: center;
    }

    /* brand logo cards are much smaller than the photo cards, so show more
       than one at a time (~2.4 visible) rather than one-per-screen */
    #our-brands .adams-slider > .wpb_column {
        flex: 0 0 40% !important;
        max-width: 40% !important;
        padding-inline: 0 !important;
        scroll-snap-align: center;
    }

    .adams-slider .vc_column-inner {
        padding-inline: 0;
    }

    #browse-body .wd-info-box,
    #used-cars .wd-info-box,
    #our-brands .wd-info-box {
        margin-bottom: 4px;
    }
}

#browse-body .wd-info-box {
    background: #fff;
    background-image: none;
    border: 1px solid #E9EFF6;
    border-radius: 12px;
    padding: 0;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(17, 30, 54, .05);
    margin-bottom: 20px;
}

#browse-body .wd-info-box:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 26px rgba(17, 30, 54, .10);
}

#browse-body .box-icon-wrapper,
#browse-body .info-box-icon {
    margin: 0;
    width: 100%;
    display: block;
}

#browse-body .info-box-icon img {
    width: 100%;
    height: 185px;
    object-fit: contain;
    border-radius: 0;
    padding: 18px 18px 0;
}

/* title on the left, "Explore Cars" link on the right */
#browse-body .info-box-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 20px 18px;
}

#browse-body .info-box-inner {
    display: none;
}

#browse-body .info-box-title {
    font-size: 17px;
    font-weight: 600;
    font-family: 'Inter';
    color: #111E36;
    margin: 0;
}

#browse-body .info-btn-wrapper {
    margin: 0;
    flex: none;
}

#browse-body .info-btn-wrapper a.btn {
    width: auto;
    background: none !important;
    background-image: none !important;
    box-shadow: none !important;
    color: #1770D4 !important;
    padding: 0 !important;
    min-height: auto !important;
    font-size: 15px;
    font-weight: 500;
    font-family: 'Inter';
    gap: 8px;
}

/* --- Shop by Brand: all eight logos on a single row ----------------------- */

/* The builder splits the eight logos across two rows of four. Flattening those
   rows with display:contents lets one grid on the section lay all eight out. */
#our-brands {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    align-items: start;
}

#our-brands > .vc_row-fluid:first-of-type {
    grid-column: 1 / -1;
}

#our-brands > .vc_row-fluid:nth-of-type(2),
#our-brands > .vc_row-fluid:nth-of-type(3) {
    display: contents;
}

/* the rows' clearfix pseudo-elements would otherwise become grid items */
#our-brands > .vc_row-fluid:nth-of-type(2)::before,
#our-brands > .vc_row-fluid:nth-of-type(2)::after,
#our-brands > .vc_row-fluid:nth-of-type(3)::before,
#our-brands > .vc_row-fluid:nth-of-type(3)::after {
    display: none;
}

#our-brands .vc_col-sm-3 {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    min-width: 0;
    padding-inline: 0;
}

#our-brands .vc_col-sm-3 .vc_column-inner {
    padding-inline: 0 !important;
}

#our-brands .wd-info-box {
    border: 1px solid #EAEFF5;
    border-radius: 10px;
    padding: 18px 8px;
    gap: 8px !important;
    box-shadow: 0 1px 4px rgba(17, 30, 54, .04);
}

#our-brands img.attachment-800x600.size-800x600 {
    width: 105px;
    height: 105px;
}

#our-brands .info-box-title {
    font-size: 19px;
    font-weight: 400;
    font-family: 'Inter';
    color: #3D4B5C;
    margin: 0;
}

/* --- Featured Used Cars: four white listing cards per row ----------------- */

/* Same flattening trick: two builder rows of three become one four-up grid. */
#used-cars {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    align-items: start;
}

#used-cars > .vc_row-fluid:first-of-type,
#used-cars > .vc_row-fluid:last-of-type {
    grid-column: 1 / -1;
}

#used-cars > .vc_row-fluid:nth-of-type(2),
#used-cars > .vc_row-fluid:nth-of-type(3) {
    display: contents;
}

#used-cars > .vc_row-fluid:nth-of-type(2)::before,
#used-cars > .vc_row-fluid:nth-of-type(2)::after,
#used-cars > .vc_row-fluid:nth-of-type(3)::before,
#used-cars > .vc_row-fluid:nth-of-type(3)::after {
    display: none;
}

#used-cars .vc_col-sm-4 {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    min-width: 0;
    padding-inline: 0;
}

#used-cars .vc_col-sm-4 .vc_column-inner {
    padding-inline: 0 !important;
}

#used-cars .wd-info-box {
    background: #fff;
    background-image: none;
    border: 1px solid #E9EFF6;
    border-radius: 10px;
    padding: 0;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(17, 30, 54, .05);
    height: 100%;
}

#used-cars .wd-info-box:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 26px rgba(17, 30, 54, .10);
}

#used-cars .box-icon-wrapper,
#used-cars .info-box-icon {
    margin: 0;
    width: 100%;
    display: block;
}

#used-cars .info-box-icon img {
    width: 100%;
    height: 190px;
    object-fit: contain;
    background: #fff;
    border-radius: 0;
    padding: 16px 16px 0;
}

#used-cars .info-box-content {
    padding: 18px 20px 20px;
    text-align: left;
}

#used-cars .info-box-title {
    font-size: 17px;
    font-weight: 600;
    font-family: 'Inter';
    color: #111E36;
    margin: 0 0 8px;
}

/* vehicle specs ("Petrol | Automatic", "28,500 miles") once added in the builder */
#used-cars .info-box-inner {
    font-size: 14px;
    line-height: 1.6;
    color: #5B6B7C;
    font-family: 'Inter';
}

#used-cars .info-box-inner p {
    font-size: 14px;
    color: #5B6B7C;
    margin: 0;
}

#used-cars .info-btn-wrapper {
    margin-top: 14px;
}

#used-cars .info-btn-wrapper a.btn {
    width: auto;
    background: none !important;
    background-image: none !important;
    box-shadow: none !important;
    color: #1770D4 !important;
    padding: 0 !important;
    min-height: auto !important;
    font-size: 15px;
    font-weight: 600;
    font-family: 'Inter';
    gap: 8px;
}

/* ==========================================================================
   Interactive hover animations
   None of the home page's pill/rectangle CTA buttons had a hover state at
   all (theme-btn classes are global, so this also benefits every other
   page using them), and the card hovers that did exist (#browse-body,
   #used-cars) had no `transition`, so they snapped instead of animating.
   ========================================================================== */

/* --- Pill/rectangle CTA buttons (hero, sec-5, final-cta, card buttons) --- */

a.btn.btn-style-default.btn-shape-rectangle.btn-size-default.btn.theme-btn,
a.btn.btn-style-default.btn-shape-round.btn-size-default.btn.theme-btn,
a.btn.btn-style-default.btn-shape-round.btn-size-default {
    transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
}

a.btn.btn-style-default.btn-shape-rectangle.btn-size-default.btn.theme-btn:hover,
a.btn.btn-style-default.btn-shape-round.btn-size-default.btn.theme-btn:hover,
a.btn.btn-style-default.btn-shape-round.btn-size-default:hover {
    transform: translateY(-3px);
    filter: brightness(1.06);
    box-shadow: 0 14px 28px rgba(11, 20, 32, .2);
}

a.btn.btn-style-default.btn-shape-rectangle.btn-size-default.btn.theme-btn:active,
a.btn.btn-style-default.btn-shape-round.btn-size-default.btn.theme-btn:active,
a.btn.btn-style-default.btn-shape-round.btn-size-default:active {
    transform: translateY(-1px);
    filter: brightness(1);
    transition-duration: .1s;
}

a.btn.btn-style-default.btn-shape-round.btn-size-default::after {
    transition: transform .25s ease;
}

a.btn.btn-style-default.btn-shape-round.btn-size-default:hover::after {
    transform: translateX(4px);
}

.sec-5 .vc_row.wpb_row.vc_row-fluid .wpb_column.vc_column_container.vc_col-sm-12 .wpb_wrapper a.btn.btn-style-default.btn-shape-rectangle.btn-size-default.btn.theme-btn::after {
    transition: transform .25s ease;
}

.sec-5 .vc_row.wpb_row.vc_row-fluid .wpb_column.vc_column_container.vc_col-sm-12 .wpb_wrapper a.btn.btn-style-default.btn-shape-rectangle.btn-size-default.btn.theme-btn:hover::after {
    transform: translateX(4px);
}

/* the hero's "Browse Cars" icon (real <span class="wd-btn-icon">, not ::after) */
a.btn.theme-btn .wd-btn-icon {
    transition: transform .25s ease;
}

a.btn.theme-btn:hover .wd-btn-icon {
    transform: translateX(4px);
}

/* --- Text-link buttons: "Explore Cars" / "WhatsApp Us" / "View All ..." -- */

#browse-body .vc_col-sm-6 a.btn,
#our-brands .vc_col-sm-6 a.btn,
#used-cars .vc_col-sm-6 a.btn,
#browse-body .info-btn-wrapper a.btn,
#used-cars .info-btn-wrapper a.btn {
    transition: color .2s ease, gap .2s ease;
}

#browse-body .vc_col-sm-6 a.btn:hover,
#our-brands .vc_col-sm-6 a.btn:hover,
#used-cars .vc_col-sm-6 a.btn:hover,
#browse-body .info-btn-wrapper a.btn:hover,
#used-cars .info-btn-wrapper a.btn:hover {
    color: #103a68 !important;
    gap: 12px;
}

/* --- Card hovers: lift + soft zoom on the photo/logo ---------------------- */

#browse-body .wd-info-box,
#used-cars .wd-info-box,
#our-brands .wd-info-box {
    transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}

#browse-body .info-box-icon,
#used-cars .info-box-icon {
    position: relative;
    overflow: hidden;
}

#browse-body .info-box-icon img,
#used-cars .info-box-icon img {
    transition: transform .4s ease;
}

#browse-body .wd-info-box:hover .info-box-icon img,
#used-cars .wd-info-box:hover .info-box-icon img {
    transform: scale(1.06);
}

/* diagonal light streak that sweeps across the car photo on hover */
#browse-body .info-box-icon::after,
#used-cars .info-box-icon::after {
    content: '';
    position: absolute;
    top: 0;
    left: -150%;
    width: 55%;
    height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255, 255, 255, .55), transparent);
    transform: skewX(-20deg);
    transition: left .75s ease;
    pointer-events: none;
}

#browse-body .wd-info-box:hover .info-box-icon::after,
#used-cars .wd-info-box:hover .info-box-icon::after {
    left: 150%;
}

#our-brands .wd-info-box {
    transform: translateY(0);
}

#our-brands .wd-info-box:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 24px rgba(17, 30, 54, .10);
    border-color: #1770D4;
}

/* logos sit muted grey until you hover the card, then snap to full colour */
#our-brands img.attachment-800x600.size-800x600 {
    filter: grayscale(100%) opacity(.7);
    transition: transform .3s ease, filter .3s ease;
}

#our-brands .wd-info-box:hover img.attachment-800x600.size-800x600 {
    transform: scale(1.08);
    filter: grayscale(0%) opacity(1);
}

/* --- Feature/benefit cards (Multi-Brand Choice, etc.) - subtle polish ---- */

.sec-topup .wd-info-box {
    transition: transform .3s ease, box-shadow .3s ease;
}

.sec-topup .wd-info-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 16px 32px rgba(11, 20, 32, .18);
}

.sec-topup .wd-info-box .info-svg-wrapper {
    transition: transform .3s ease;
}

.sec-topup .wd-info-box:hover .info-svg-wrapper {
    transform: scale(1.12);
}

/* ==========================================================================
   Richer motion pass: scroll-reveal, hero Ken Burns zoom, pulsing "live"
   dot, floating CTA car. All decorative animation is skipped for
   prefers-reduced-motion (the reveal script bails out entirely; the CSS
   loops below are additionally wrapped so they don't run either).
   ========================================================================== */

@media (prefers-reduced-motion: no-preference) {

    /* --- Scroll reveal: adams_home_scroll_reveal() in functions.php adds
       .adams-reveal (this hidden starting state) then .is-visible once each
       element crosses into view. JS-off/IntersectionObserver-less browsers
       never get .adams-reveal added in the first place, so content there
       stays fully visible by default - this is additive, not a requirement. */
    .adams-reveal {
        opacity: 0;
        transform: translateY(28px);
        transition: opacity .7s ease, transform .7s cubic-bezier(.16, .84, .44, 1);
    }

    .adams-reveal.is-visible {
        opacity: 1;
        transform: none;
    }

    /* --- Hero: slow background zoom/pan behind the content ---------------- */
    .sec-1 {
        position: relative;
        overflow: hidden;
    }

    .sec-1::before {
        content: '';
        position: absolute;
        inset: -20px;
        background: url(../../uploads/2026/09/Background-2.jpg) center / cover no-repeat;
        animation: adams-hero-zoom 18s ease-in-out infinite alternate;
        z-index: 0;
    }

    .sec-1 > * {
        position: relative;
        z-index: 1;
    }

    @keyframes adams-hero-zoom {
        from { transform: scale(1); }
        to   { transform: scale(1.08); }
    }

    /* --- Hero: pulsing "we're live" dot on the eyebrow pill ---------------- */
    .sec-1 span.sub-head::before {
        animation: adams-pulse-dot 1.8s ease-in-out infinite;
    }

    @keyframes adams-pulse-dot {
        0%   { box-shadow: 0 0 0 0 rgba(68, 207, 108, .6); }
        70%  { box-shadow: 0 0 0 8px rgba(68, 207, 108, 0); }
        100% { box-shadow: 0 0 0 0 rgba(68, 207, 108, 0); }
    }

    /* --- "Can't Find..." CTA: the floating car gently bobs. Combined with
       (not replacing) the existing translateY(-50%) centering, since a CSS
       animation's transform overwrites the whole property per frame. ------ */
    .sec-5 img.vc_single_image-img.attachment-full {
        animation: adams-float 4.5s ease-in-out infinite;
    }

    @keyframes adams-float {
        0%, 100% { transform: translateY(-50%) translateY(0); }
        50%      { transform: translateY(-50%) translateY(-10px); }
    }
}

/* --- Can't Find What You're Looking For: white card, text left, product
   photo floating on a green panel to the right. The photo (SUV.png) has no
   real transparency (checked - it's a flat 24bpp file, near-pure-white
   background throughout), so mix-blend-mode:multiply is used instead: white
   pixels leave whatever is behind them unchanged (invisible on both the
   white card and the green panel), which reads as a proper cutout without
   any image editing. -------------------------------------------------- */

.sec-5 > .vc_row.wpb_row.vc_row-fluid {
    position: relative;
    align-items: center;
    background: #fff;
    border: 1px solid #EEF2F7;
    border-radius: 24px;
    padding: 0;
    box-shadow: 0 18px 40px rgba(17, 30, 54, .08);
    margin-bottom: 120px;
    overflow: hidden;
}

.sec-5 .vc_col-sm-6:first-child .vc_column-inner {
    padding: 0px 0px 0px 20px;
}

/* image column: a rounded green panel behind the floating car. The panel is
   sized smaller than the column so it stays visible all around/behind the
   car rather than being fully covered by it, and the photo is positioned
   independently (not flow-laid-out) so it can overlap the panel and bleed
   slightly past its top-right corner onto the white card, like the
   reference. */
/* The green panel is a real DOM element (.sec-5-panel, injected by JS - see
   functions.php) rather than a ::before pseudo-element: for reasons unclear
   even after fairly thorough isolation testing (identical CSS in a bare
   standalone page worked fine, and a plain `background` on this element
   without a pseudo-element also worked - see git history), a ::before/
   ::after with this exact selector chain silently failed to paint at all on
   this specific page. A real element sidesteps the mystery entirely and
   also gets proper border-radius, which a background-image insert can't. */
.sec-5 .vc_col-sm-6:last-child .vc_column-inner {
    position: relative;
    min-height: 380px;
    padding: 30px 30px 30px 0;
}

.sec-5-panel {
    position: absolute;
    z-index: 0;
    left: 2%;
    right: 24%;
    top: 16%;
    bottom: 16%;
    background: #2FC46C;
    border-radius: 20px;
}

.sec-5 img.vc_single_image-img.attachment-full {
    position: absolute;
    z-index: 1;
    right: 2%;
    top: 50%;
    transform: translateY(-50%);
    width: 90%;
    height: auto;
    max-width: 660px;
    object-fit: contain;
    /* car.png (attachment 400) is a real cutout with alpha transparency -
       no mix-blend-mode needed (that trick was only for the earlier plain
       studio photo). A drop-shadow reads well now that the car has no
       background of its own to anchor it visually. */
    filter: drop-shadow(0 18px 22px rgba(11, 18, 32, .22));
}

.sec-5 .sub-head {
    color: #2FC46C !important;
    text-transform: uppercase;
    letter-spacing: 1.6px;
    font-size: 13px;
    font-weight: 600;
}

.sec-5 h2 {
    color: #0B1220;
    font-size: 38px;
    line-height: 1.15;
    margin-bottom: 14px;
}

.sec-5 p {
    color: #5B6B7C;
    font-size: 17px;
    line-height: 1.6;
}

/* primary button: solid green */
.sec-5 .wd-button-wrapper:first-child a.btn {
    background: #2FC46C !important;
    background-image: none !important;
    color: #fff !important;
    border-radius: 30px;
    padding: 15px 28px !important;
    font-size: 16px;
    font-weight: 600;
    box-shadow: none !important;
}

/* secondary button: outlined, white */
.sec-5 .wd-button-wrapper:last-child a.btn {
    background: #fff !important;
    background-image: none !important;
    color: #0B1220 !important;
    border: 1.5px solid #E3EAF2;
    border-radius: 30px;
    padding: 15px 28px !important;
    font-size: 16px;
    font-weight: 600;
    box-shadow: none !important;
}

/* --- The reference shows a single link per section header, so the duplicate
       full-width buttons under the card grids are hidden. Delete this block
       to bring them back. ------------------------------------------------- */

#browse-body .vc_col-sm-12 .wd-button-wrapper,
#used-cars .vc_col-sm-12 .wd-button-wrapper {
    display: none;
}

/* --- Responsive ----------------------------------------------------------- */

@media (max-width: 1024px) {
    #our-brands {
        grid-template-columns: repeat(4, 1fr);
    }

    #used-cars {
        grid-template-columns: repeat(2, 1fr);
    }

    .sec-5 h2 {
        font-size: 30px;
    }

    .sec-5 .vc_col-sm-6:first-child .vc_column-inner {
        padding-inline: 20px;
    }
}

@media (max-width: 767px) {
    #our-brands {
        grid-template-columns: repeat(2, 1fr);
    }

    #used-cars {
        grid-template-columns: 1fr;
    }

    #browse-body .vc_col-sm-6 .wd-button-wrapper,
    #our-brands .vc_col-sm-6 .wd-button-wrapper,
    #used-cars .vc_col-sm-6 .wd-button-wrapper {
        text-align: left;
        margin-top: 10px;
    }

    .sec-5 > .vc_row.wpb_row.vc_row-fluid {
        flex-direction: column;
        margin-bottom: 60px;
    }

    .sec-5 .vc_col-sm-6:last-child .vc_column-inner {
        min-height: 240px;
        padding: 16px;
    }

    .sec-5 img.vc_single_image-img.attachment-full {
        max-width: 260px;
    }

    .sec-5 .vc_col-sm-6:first-child .vc_column-inner {
        padding: 32px 20px 8px;
    }

    .sec-5 .wd-button-wrapper:first-child a.btn,
    .sec-5 .wd-button-wrapper:last-child a.btn {
        white-space: nowrap;
    }

    .sec-5 .vc_row.wpb_row.vc_row-fluid .vc_row.wpb_row.vc_inner.vc_row-fluid .wpb_wrapper {
        flex-wrap: wrap;
        flex-direction: row;
        gap: 10px;
    }
}


footer.wd-footer.footer-container::before {
    content: '';
    background: #fc0000;
    height: 100px;
    position: absolute;
    top: 0;
    width: 180px;
    aspect-ratio: 1/cos(30deg);
    clip-path: polygon(50% 100%,100% 0,0 0);
    background: linear-gradient(45deg, #39a558, #2dcb5a);
}
.triangle {
    width: 180px;
    aspect-ratio: 1/cos(30deg);
    clip-path: polygon(50% 100%,100% 0,0 0);
    background: linear-gradient(45deg,#FA6900,#C02942);
};
.triangle {
    width: 180px;
    aspect-ratio: 1/cos(30deg);
    clip-path: polygon(50% 100%,100% 0,0 0);
    background: linear-gradient(45deg,#FA6900,#C02942);
};
.triangle {
    width: 180px;
    aspect-ratio: 1/cos(30deg);
    clip-path: polygon(50% 100%,100% 0,0 0);
    background: linear-gradient(45deg,#FA6900,#C02942);
};
.triangle {
    width: 180px;
    aspect-ratio: 1/cos(30deg);
    clip-path: polygon(50% 100%,100% 0,0 0);
    background: linear-gradient(45deg,#FA6900,#C02942);
};
    
.triangle {
    width: 180px;
    aspect-ratio: 1/cos(30deg);
    clip-path: polygon(50% 100%,100% 0,0 0);
    background: linear-gradient(45deg,#FA6900,#C02942);
};
}

footer.wd-footer.footer-container::after {
    right: 0;
    top: unset;
    bottom: 0;
    rotate: 180deg;
    background: #00aafb;
}

.footer-column li a::before {
    content: "\f120";
    font-family: "woodmart-font";
    font-weight: 400;
    color: #00acfb;
}

/* ==========================================================================
   Find Your Car (page 165) - banner + step 1 of form 159
   Everything is scoped to .page-id-165 so other forms are untouched.
   ========================================================================== */

/* --- Banner --------------------------------------------------------------- */

.page-id-165 .fyc-banner {
    background: #EFF7FE;
    padding: 0;
    overflow: hidden;
}

.page-id-165 .fyc-banner > .vc_row {
    display: flex;
    align-items: center;
}

.page-id-165 .fyc-banner .vc_col-sm-6:first-child .vc_column-inner {
    padding: 70px 40px 110px 60px;
}

.page-id-165 .fyc-banner .vc_col-sm-6:last-child .vc_column-inner {
    padding: 0;
}

.page-id-165 .fyc-eyebrow {
    display: block;
    color: #1770D4;
    font-family: 'Poppins';
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.page-id-165 h1.fyc-title {
    font-family: 'Poppins';
    font-size: 56px;
    line-height: 1.05;
    font-weight: 700;
    color: #111E36;
    margin: 0 0 18px;
}

.page-id-165 p.fyc-lead {
    font-family: 'Inter';
    font-size: 17px;
    line-height: 1.65;
    color: #3D4B5C;
    max-width: 470px;
    margin: 0 0 30px;
}

.page-id-165 .fyc-banner .vc_col-sm-6:first-child {
    width: 57%;
}

.page-id-165 .fyc-banner .vc_col-sm-6:last-child {
    width: 43%;
}

.page-id-165 ul.fyc-usps {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: nowrap;
    gap: 18px;
}

.page-id-165 ul.fyc-usps li {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Icons are drawn on li::before instead of a markup <span>: WPBakery/KSES
   strips inline <svg> (and the unstyled wrapper <span> around it) out of
   vc_column_text content on save, so a markup-based icon keeps disappearing.
   A CSS background-image survives that pipeline untouched. */
.page-id-165 ul.fyc-usps li::before {
    content: '';
    flex: none;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 20px 20px;
    box-shadow: 0 3px 10px rgba(17, 30, 54, .08);
}

/* 1: Quick & Easy - chat bubble */
.page-id-165 ul.fyc-usps li:nth-child(1)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231770D4'%3E%3Cpath d='M12 2C6.48 2 2 5.94 2 10.8c0 2.77 1.47 5.24 3.77 6.85-.13.98-.5 2.53-1.42 3.86-.15.22.02.51.28.47 1.94-.28 3.6-1.13 4.68-1.8.86.2 1.76.31 2.69.31 5.52 0 10-3.94 10-8.8S17.52 2 12 2z'/%3E%3C/svg%3E");
}

/* 2: Personal Support - two people */
.page-id-165 ul.fyc-usps li:nth-child(2)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231770D4'%3E%3Cpath d='M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z'/%3E%3C/svg%3E");
}

/* 3: No Obligation - shield check */
.page-id-165 ul.fyc-usps li:nth-child(3)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231770D4'%3E%3Cpath d='M12 1 3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4zm-2 16-4-4 1.41-1.41L10 14.17l6.59-6.59L18 9l-8 8z'/%3E%3C/svg%3E");
}

.page-id-165 .fyc-usp-txt {
    display: flex;
    flex-direction: column;
    line-height: 1.35;
}

.page-id-165 .fyc-usp-txt strong {
    font-family: 'Inter';
    font-size: 15px;
    font-weight: 600;
    color: #111E36;
}

.page-id-165 .fyc-usp-txt span {
    font-family: 'Inter';
    font-size: 13px;
    color: #5B6B7C;
}

/* showroom photo bleeds off the right edge and fades into the banner */
.page-id-165 .fyc-banner-img img {
    width: 100%;
    height: 460px;
    object-fit: cover;
    object-position: center;
    display: block;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 20%);
    mask-image: linear-gradient(90deg, transparent 0%, #000 20%);
}

.page-id-165 .fyc-banner-img .wpb_wrapper,
.page-id-165 .fyc-banner-img figure,
.page-id-165 .fyc-banner-img .vc_single_image-wrapper {
    margin: 0 !important;
    display: block;
}

/* --- Form card ------------------------------------------------------------ */

.page-id-165 .fyc-form-row {
    position: relative;
    z-index: 2;
    margin-top: -70px;
}

body.page-id-165 div.wpforms-container {
    background: #fff;
    border: none;
    border-radius: 16px;
    box-shadow: 0 16px 40px rgba(17, 30, 54, .10);
    padding: 34px 38px 38px;
    width: 100%;
    max-width: 1080px;
    margin: 0 auto !important;
}

/* --- Step indicator ------------------------------------------------------- */

body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator.connector {
    display: flex;
    align-items: flex-start;
    border: none;
    background: none;
    padding: 0 0 26px;
    margin: 0 0 26px;
    border-bottom: 1px solid #EDF2F8;
}

body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    flex: 1 1 0;
    min-width: 0 !important;
    background: none !important;
    /* right padding reserves the room the connector line sits in */
    padding: 0 66px 0 0 !important;
}

body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page:last-child {
    padding-right: 0 !important;
}

/* connector line between the circles */
body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page:not(:last-child)::after {
    content: '';
    position: absolute;
    right: 10px;
    top: 20px;
    width: 46px;
    height: 2px;
    background: #E3EAF2;
}

body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page-number {
    position: relative;
    z-index: 1;
    flex: none;
    width: 42px !important;
    height: 42px !important;
    border-radius: 50%;
    background: #E8EEF5 !important;
    color: #8291A7 !important;
    font-family: 'Inter' !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 42px !important;
    text-align: center;
    text-indent: 0 !important;
    display: block;
    margin: 0 !important;
    overflow: visible;
}

body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page.active .wpforms-page-indicator-page-number {
    background: #2FC46C !important;
    color: #fff !important;
}

/* the connector style's arrow decoration is not part of this design */
body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page-triangle {
    display: none !important;
}

body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page-title {
    display: flex !important;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    padding-top: 2px;
    font-family: 'Inter';
    font-size: 15px;
    font-weight: 600;
    color: #8291A7;
}

body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page.active .wpforms-page-indicator-page-title {
    color: #111E36;
}

/* Sub-labels are not output by WPForms, so they are set here.
   Edit the strings below to change them. */
body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page-title::after {
    font-size: 12.5px;
    font-weight: 400;
    color: #8291A7;
    margin-top: 3px;
}

body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page-1 .wpforms-page-indicator-page-title::after {
    content: 'Choose your vehicle type';
}

body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page-2 .wpforms-page-indicator-page-title::after {
    content: 'Select your preferred make and model';
}

body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page-3 .wpforms-page-indicator-page-title::after {
    content: 'Tell us a bit more';
}

/* --- Step 1: heading, description, then the cards ------------------------- */

body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-1 .wpforms-field-checkbox fieldset {
    display: flex;
    flex-direction: column;
    border: none;
    padding: 0;
    margin: 0;
}

body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-1 .wpforms-field-checkbox legend.wpforms-field-label {
    order: 1;
    font-family: 'Poppins';
    font-size: 27px;
    font-weight: 700;
    color: #111E36;
    margin: 0 0 10px !important;
    padding: 0;
}

/* WPForms prints the description after the choices; the design wants it above */
body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-1 .wpforms-field-checkbox .wpforms-field-description {
    order: 2;
    font-family: 'Inter';
    font-size: 15px;
    color: #7A879A;
    margin: 0 0 22px;
}

body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-1 .wpforms-field-checkbox ul.wpforms-image-choices {
    order: 3;
}

/* "STEP 1 OF 3" label above the heading */
body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-1 .wpforms-field-checkbox legend.wpforms-field-label::before {
    content: 'STEP 1 OF 3';
    display: block;
    font-family: 'Poppins';
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: 1.4px;
    color: #1770D4;
    margin-bottom: 10px;
}

body.page-id-165 div.wpforms-container .wpforms-form .wpforms-required-label {
    display: none;
}

/* --- Body type cards (field 2, step 1) ------------------------------------ */

body.page-id-165 div.wpforms-container-full .wpforms-form [data-field-id="2"] ul.wpforms-image-choices-modern {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
}

body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern li.wpforms-image-choices-item {
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    float: none !important;
    display: block;
}

body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern li label.wpforms-field-label-inline {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 16px 12px 14px;
    background: #fff;
    border: 1px solid #E3EAF2;
    border-radius: 10px;
    cursor: pointer;
    transition: border-color .2s, background-color .2s, box-shadow .2s;
    height: 100%;
}

body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern li label:hover {
    border-color: #B9D4EE;
    box-shadow: 0 4px 14px rgba(17, 30, 54, .07);
}

body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern .wpforms-image-choices-image {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    border: none;
}

body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern .wpforms-image-choices-image img {
    width: 100%;
    height: 82px;
    object-fit: contain;
    display: block;
}

body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern .wpforms-image-choices-label {
    font-family: 'Inter';
    font-size: 13.5px;
    font-weight: 600;
    color: #111E36;
    text-align: center;
    padding: 0;
    background: none;
    line-height: 1.1;
    margin-top: 0px !important;
}

/* selected state */
body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern li.wpforms-selected label.wpforms-field-label-inline,
body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern li:has(input:checked) label.wpforms-field-label-inline {
    border: 2px solid #24CF69;
    background: #F1FBF5;
    padding: 15px 11px 13px;
    box-shadow: 0 4px 16px rgba(36, 207, 105, .16);
}

body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern li.wpforms-selected label::after,
body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern li:has(input:checked) label::after {
    content: '';
    position: absolute;
    top: 8px;
    right: 8px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #24CF69 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
}

/* WPForms' own modern-style tick would sit on top of the one above */
body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern li.wpforms-selected .wpforms-image-choices-image::after,
body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern li:has(input:checked) .wpforms-image-choices-image::after,
body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern li.wpforms-selected label::before {
    display: none !important;
}

/* --- Continue button ------------------------------------------------------ */

body.page-id-165 div.wpforms-container .wpforms-form .wpforms-pagebreak-right {
    text-align: right;
    padding-top: 28px;
}

body.page-id-165 div.wpforms-container .wpforms-form button.wpforms-page-button {
    background: #2FC46C;
    border: none;
    border-radius: 30px;
    color: #fff;
    font-family: 'Inter';
    font-size: 16px;
    font-weight: 600;
    padding: 16px 34px;
    line-height: 1;
    cursor: pointer;
    transition: background-color .2s, opacity .2s;
    gap: 0;
}

body.page-id-165 div.wpforms-container .wpforms-form button.wpforms-page-next::after {
    content: '\2192';
    margin-left: 10px;
    font-weight: 400;
}

body.page-id-165 div.wpforms-container .wpforms-form button.wpforms-page-button:hover {
    background: #27B461;
}

body.page-id-165 div.wpforms-container .wpforms-form button.wpforms-page-button.wpforms-disabled,
body.page-id-165 div.wpforms-container .wpforms-form button.wpforms-page-button[aria-disabled="true"] {
    background: #C7D2DE !important;
    cursor: not-allowed;
}

body.page-id-165 div.wpforms-container .wpforms-form button.wpforms-page-prev {
    background: #fff;
    color: #111E36;
    border: 1px solid #D9E2EC;
    margin-right: 10px;
}

/* --- Help box under the form ---------------------------------------------- */

.page-id-165 .fyc-help-row {
    margin-top: 24px;
    margin-bottom: 90px;
    margin-inline: 0 !important;
}

.page-id-165 .fyc-help {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    background: #EFF6FE;
    border-radius: 12px;
    padding: 22px 26px;
    margin: 0 !important;
}

.page-id-165 .fyc-help-main {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

/* Same story as the USP icons above: the markup <span class="fyc-help-ico">
   gets stripped from vc_column_text content on save, so the icon is drawn
   here instead - info icon, "i" in a circle. */
.page-id-165 .fyc-help-main::before {
    content: '';
    flex: none;
    width: 30px;
    height: 30px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231770D4'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z'/%3E%3C/svg%3E") center / 30px 30px no-repeat;
}

.page-id-165 .fyc-help-txt {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.page-id-165 .fyc-help-txt strong {
    font-family: 'Poppins';
    font-size: 18px;
    font-weight: 600;
    color: #111E36;
}

.page-id-165 .fyc-help-txt span {
    font-family: 'Inter';
    font-size: 15px;
    color: #5B6B7C;
}

.page-id-165 a.fyc-help-btn {
    flex: none;
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    border: 1px solid #CFE0F3;
    border-radius: 10px;
    padding: 12px 20px;
    text-decoration: none;
    transition: border-color .2s, box-shadow .2s;
}

.page-id-165 a.fyc-help-btn:hover {
    border-color: #1770D4;
    box-shadow: 0 4px 14px rgba(23, 112, 212, .12);
}

/* WhatsApp icon - see the fyc-help-main note above for why this is CSS-drawn. */
.page-id-165 a.fyc-help-btn::before {
    content: '';
    flex: none;
    width: 24px;
    height: 24px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231770D4'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.149-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51a12.8 12.8 0 0 0-.57-.01c-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 0 1-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 0 1-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 0 1 2.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0 0 12.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 0 0 5.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 0 0-3.48-8.413'/%3E%3C/svg%3E") center / 24px 24px no-repeat;
}

.page-id-165 .fyc-help-btn-txt {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

.page-id-165 .fyc-help-btn-txt strong {
    font-family: 'Inter';
    font-size: 15px;
    font-weight: 600;
    color: #111E36;
}

.page-id-165 .fyc-help-btn-txt span {
    font-family: 'Inter';
    font-size: 13px;
    color: #5B6B7C;
}

/* --- Responsive ----------------------------------------------------------- */

@media (max-width: 1200px) {
    body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern,
    body.page-id-165 div.wpforms-container-full .wpforms-form [data-field-id="2"] ul.wpforms-image-choices-modern {
        grid-template-columns: repeat(4, 1fr);
    }

    .page-id-165 h1.fyc-title {
        font-size: 44px;
    }
}

@media (max-width: 1024px) {
    .page-id-165 .fyc-banner > .vc_row {
        flex-direction: column-reverse;
    }

    .page-id-165 .fyc-banner .vc_col-sm-6 {
        width: 100%;
    }

    .page-id-165 .fyc-banner .vc_col-sm-6:first-child .vc_column-inner {
        padding: 34px 16px 90px;
    }

    .page-id-165 .fyc-banner-img img {
        height: 260px;
        -webkit-mask-image: none;
        mask-image: none;
    }

    .page-id-165 .wpforms-container {
        padding: 26px 20px 30px;
    }

    body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern,
    body.page-id-165 div.wpforms-container-full .wpforms-form [data-field-id="2"] ul.wpforms-image-choices-modern {
        grid-template-columns: repeat(3, 1fr);
    }

    body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page-title::after {
        display: none;
    }
}

@media (max-width: 767px) {
    .page-id-165 h1.fyc-title {
        font-size: 34px;
    }

    body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern,
    body.page-id-165 div.wpforms-container-full .wpforms-form [data-field-id="2"] ul.wpforms-image-choices-modern {
        grid-template-columns: repeat(2, 1fr);
    }

    body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-1 .wpforms-field-checkbox legend.wpforms-field-label {
        font-size: 22px;
    }

    /* Squeezing all 3 steps into one tight horizontal row never reads well
       under ~500px - even once nothing technically overflows, the labels
       wrap awkwardly and the connector line crosses right through the
       text. Stack the steps as a simple vertical list instead: each one is
       its own row (number circle + label), one below the other, joined by
       a short vertical connector instead of a horizontal one. */
    body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator.connector {
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
    }

    body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page {
        flex: none;
        width: 100%;
        align-items: center;
        gap: 12px;
        padding: 0 !important;
    }

    body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page:not(:last-child)::after {
        left: 17px;
        right: auto;
        top: 34px;
        width: 2px;
        height: 16px;
    }

    body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page-number {
        width: 34px !important;
        height: 34px !important;
        line-height: 34px !important;
        font-size: 14px !important;
    }

    body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page-title {
        flex-direction: row;
        align-items: center;
        font-size: 15px;
        padding-top: 0;
    }

    /* the descriptive subtitle ("Choose your vehicle type", etc.) has room
       to breathe on a roomy desktop row but is just clutter stacked 3x in
       a narrow phone list - keep the compact number + label only */
    body.page-id-165 div.wpforms-container .wpforms-form .wpforms-page-indicator-page-title::after {
        display: none;
    }

    .page-id-165 .fyc-help {
        flex-direction: column;
        align-items: stretch;
    }

    .page-id-165 a.fyc-help-btn {
        justify-content: center;
    }

    .page-id-165 .fyc-form-row {
        margin-top: -50px;
    }
}


.fyc-banner {
    padding-right: 0px !important;
}

.wpb_single_image.wpb_content_element.vc_align_left.fyc-banner-img {
    margin: 0px !important;
}

/* ==========================================================================
   Find Your Car - Step 2 (Make & Model)
   Field 7 is the single shared "Make" field (image choices, same 8 brands
   for every body type). Fields 60-67 are its 8 per-brand "Model" fields
   (plain radio, styled as pills), each conditioned on field 7.
   ========================================================================== */

/* --- Intro block ------------------------------------------------------
   A <legend> always renders first inside its <fieldset> in every browser,
   ignoring flex `order` on it - so unlike a normal div, it can't be pushed
   below the description. Rather than fight that, the legend itself IS the
   big heading here (its real field label = "Choose a make and model"),
   the description (real field description, which WPForms renders with
   wp_kses_post so basic HTML survives) holds the intro paragraph right
   after it, and "1. Choose a make" is injected above the choices via
   ::before on the <ul> - all in natural DOM order, no reordering needed. */

body.page-id-165 div.wpforms-container [data-field-id="7"] fieldset {
    display: flex;
    flex-direction: column;
    border: none;
    padding: 0;
    margin: 0;
}

/* legend is always first no matter what `order` says (a long-standing
   browser quirk for <legend>), but the description and choices list DO
   still reorder relative to each other, so this swaps their natural
   legend->choices->description DOM order to legend->description->choices. */
body.page-id-165 div.wpforms-container [data-field-id="7"] .wpforms-field-description {
    order: 1;
}

body.page-id-165 div.wpforms-container [data-field-id="7"] ul.wpforms-image-choices {
    order: 2;
}

body.page-id-165 div.wpforms-container [data-field-id="7"] legend.wpforms-field-label {
    display: block;
    font-family: 'Poppins';
    font-size: 27px;
    font-weight: 700;
    color: #111E36;
    margin: 0 0 10px !important;
    padding: 0;
}

body.page-id-165 div.wpforms-container [data-field-id="7"] legend.wpforms-field-label::before {
    content: 'STEP 2 OF 3';
    display: block;
    font-family: 'Poppins';
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: 1.4px;
    color: #1770D4;
    margin-bottom: 10px;
}

body.page-id-165 div.wpforms-container [data-field-id="7"] .wpforms-field-description {
    font-family: 'Inter';
    font-size: 15px;
    color: #7A879A;
    margin: 0 0 24px;
}

/* "1. Choose a make", between the intro paragraph and the logo row. It sits
   on the description div's ::after (not the <ul>'s ::before) because the
   <ul> itself is display:flex for the logo row - a pseudo-element on a flex
   container becomes a flex ITEM, not a heading sitting above it. */
body.page-id-165 div.wpforms-container [data-field-id="7"] .wpforms-field-description::after {
    content: '1. Choose a make';
    display: block;
    font-family: 'Inter';
    font-size: 15px;
    font-weight: 700;
    color: #111E36;
    margin-top: 24px;
}

/* --- Make row (field 7): single scrollable row of brand-logo cards ------- */

body.page-id-165 div.wpforms-container-full .wpforms-form [data-field-id="7"] ul.wpforms-image-choices-modern {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 12px;
    margin: 0 0 34px;
    padding: 0 0 6px;
    list-style: none;
}

body.page-id-165 div.wpforms-container-full .wpforms-form [data-field-id="7"] li.wpforms-image-choices-item {
    flex: 0 0 108px;
}

body.page-id-165 div.wpforms-container-full .wpforms-form [data-field-id="7"] .wpforms-image-choices-image img {
    height: 46px;
}

/* the "I'm not sure" choice has no logo - give it a placeholder mark so its
   card stays the same height as the others */
body.page-id-165 div.wpforms-container-full .wpforms-form [data-field-id="7"] .wpforms-image-choices-image:empty {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 46px;
}

body.page-id-165 div.wpforms-container-full .wpforms-form [data-field-id="7"] .wpforms-image-choices-image:empty::before {
    content: '?';
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #EDF2F8;
    color: #8291A7;
    font-family: 'Inter';
    font-size: 16px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* --- Model row (fields 60-67): pill buttons, no images ------------------- */

body.page-id-165 div.wpforms-container [data-field-id^="6"] fieldset {
    border: none;
    padding: 0;
    margin: 0;
}

body.page-id-165 div.wpforms-container [data-field-id^="6"] legend.wpforms-field-label {
    display: block;
    font-family: 'Inter';
    font-size: 15px;
    font-weight: 700;
    color: #111E36;
    margin: 0 0 14px !important;
    padding: 0;
}

body.page-id-165 div.wpforms-container [data-field-id^="6"] ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 8px;
    padding: 0;
    list-style: none;
}

body.page-id-165 div.wpforms-container [data-field-id^="6"] ul li {
    margin: 0 !important;
    padding: 0 !important;
}

body.page-id-165 div.wpforms-container [data-field-id^="6"] ul li input[type="radio"] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

body.page-id-165 div.wpforms-container [data-field-id^="6"] ul li label.wpforms-field-label-inline {
    position: relative;
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 11px 20px;
    background: #fff;
    border: 1px solid #E3EAF2;
    border-radius: 30px;
    font-family: 'Inter';
    font-size: 14.5px;
    font-weight: 600;
    color: #111E36;
    cursor: pointer;
    transition: border-color .2s, background-color .2s, box-shadow .2s;
}

body.page-id-165 div.wpforms-container [data-field-id^="6"] ul li label:hover {
    border-color: #B9D4EE;
}

body.page-id-165 div.wpforms-container [data-field-id^="6"] ul li input:checked + label {
    border: 2px solid #24CF69;
    background: #F1FBF5;
    padding: 10px 19px;
    padding-right: 34px;
}

body.page-id-165 div.wpforms-container [data-field-id^="6"] ul li input:checked + label::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 10px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    transform: translateY(-50%);
    background: #24CF69 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / 9px 9px no-repeat;
}

@media (max-width: 767px) {
    body.page-id-165 div.wpforms-container-full .wpforms-form [data-field-id="7"] li.wpforms-image-choices-item {
        flex-basis: 92px;
    }

    body.page-id-165 h2.fyc-step2-title {
        font-size: 22px;
    }
}

/* ==========================================================================
   Find Your Car - Step 3 (Budget & Preferences)
   Field 68 holds the intro heading (its <input> is hidden - text field just
   to get a plain <label>+description pair without the legend-order quirk).
   Field 55 = budget/year layout, field 69 = transmission/fuel layout,
   field 72 = additional requirements textarea, plus a JS-built selection
   summary panel (see functions.php) inserted before the submit button.
   ========================================================================== */

/* --- Intro heading --------------------------------------------------------- */

body.page-id-165 div.wpforms-container [data-field-id="68"] input {
    display: none;
}

body.page-id-165 div.wpforms-container [data-field-id="68"] label.wpforms-field-label {
    display: block;
    font-family: 'Poppins';
    font-size: 27px;
    font-weight: 700;
    color: #111E36;
    margin: 0 0 6px;
}

body.page-id-165 div.wpforms-container [data-field-id="68"] label.wpforms-field-label::before {
    content: 'STEP 3 OF 3';
    display: block;
    font-family: 'Poppins';
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: 1.4px;
    color: #1770D4;
    margin-bottom: 10px;
}

body.page-id-165 div.wpforms-container [data-field-id="68"] .wpforms-field-description {
    font-family: 'Inter';
    font-size: 15px;
    color: #7A879A;
    margin: 0 0 28px;
}

/* --- Budget / Year layout row ---------------------------------------------- */

body.page-id-165 div.wpforms-container [data-field-id="55"] .wpforms-field-layout-row,
body.page-id-165 div.wpforms-container [data-field-id="69"] .wpforms-field-layout-row {
    display: flex;
    gap: 20px;
    margin-bottom: 22px;
}

body.page-id-165 div.wpforms-container [data-field-id="55"] .wpforms-layout-column,
body.page-id-165 div.wpforms-container [data-field-id="69"] .wpforms-layout-column {
    flex: 1 1 0;
    min-width: 0;
}

body.page-id-165 div.wpforms-container [data-field-id="56"] label.wpforms-field-label,
body.page-id-165 div.wpforms-container [data-field-id="57"] label.wpforms-field-label,
body.page-id-165 div.wpforms-container [data-field-id="70"] legend.wpforms-field-label,
body.page-id-165 div.wpforms-container [data-field-id="71"] legend.wpforms-field-label,
body.page-id-165 div.wpforms-container [data-field-id="72"] label.wpforms-field-label {
    display: block;
    font-family: 'Inter';
    font-size: 14.5px;
    font-weight: 600;
    color: #111E36;
    margin: 0 0 8px;
    padding: 0;
}

body.page-id-165 div.wpforms-container [data-field-id="56"] .choices__inner,
body.page-id-165 div.wpforms-container [data-field-id="57"] .choices__inner {
    border: 1px solid #E3EAF2 !important;
    border-radius: 10px !important;
    height: 50px !important;
    display: flex;
    align-items: center;
}

body.page-id-165 div.wpforms-container [data-field-id="56"] .choices__list--single,
body.page-id-165 div.wpforms-container [data-field-id="57"] .choices__list--single {
    padding: 0 32px 0 14px;
}

body.page-id-165 div.wpforms-container [data-field-id="56"] .choices__item,
body.page-id-165 div.wpforms-container [data-field-id="57"] .choices__item {
    font-family: 'Inter';
    font-size: 14.5px;
    color: #111E36;
}

/* --- Transmission / Fuel type pills ---------------------------------------- */

body.page-id-165 div.wpforms-container [data-field-id="70"] fieldset,
body.page-id-165 div.wpforms-container [data-field-id="71"] fieldset {
    border: none;
    padding: 0;
    margin: 0;
}

body.page-id-165 div.wpforms-container [data-field-id="70"] ul,
body.page-id-165 div.wpforms-container [data-field-id="71"] ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

body.page-id-165 div.wpforms-container [data-field-id="70"] ul li,
body.page-id-165 div.wpforms-container [data-field-id="71"] ul li {
    margin: 0 !important;
    padding: 0 !important;
}

body.page-id-165 div.wpforms-container [data-field-id="70"] ul li input[type="radio"],
body.page-id-165 div.wpforms-container [data-field-id="71"] ul li input[type="radio"] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

body.page-id-165 div.wpforms-container [data-field-id="70"] ul li label.wpforms-field-label-inline,
body.page-id-165 div.wpforms-container [data-field-id="71"] ul li label.wpforms-field-label-inline {
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 11px 18px;
    background: #fff;
    border: 1px solid #E3EAF2;
    border-radius: 10px;
    font-family: 'Inter';
    font-size: 14.5px;
    font-weight: 600;
    color: #111E36;
    cursor: pointer;
    transition: border-color .2s, background-color .2s;
}

body.page-id-165 div.wpforms-container [data-field-id="70"] ul li label:hover,
body.page-id-165 div.wpforms-container [data-field-id="71"] ul li label:hover {
    border-color: #B9D4EE;
}

body.page-id-165 div.wpforms-container [data-field-id="70"] ul li input:checked + label,
body.page-id-165 div.wpforms-container [data-field-id="71"] ul li input:checked + label {
    border: 2px solid #24CF69;
    background: #F1FBF5;
    padding: 10px 17px;
    color: #111E36;
}

/* WPForms' own "modern" radio style draws a small default indicator on the
   label via a pseudo-element, which collides with the pill's own text at
   this padding - not needed since the border+background already show the
   selected state. */
body.page-id-165 div.wpforms-container [data-field-id="70"] ul li label::before,
body.page-id-165 div.wpforms-container [data-field-id="70"] ul li label::after,
body.page-id-165 div.wpforms-container [data-field-id="71"] ul li label::before,
body.page-id-165 div.wpforms-container [data-field-id="71"] ul li label::after {
    display: none !important;
    content: none !important;
}

/* --- Additional requirements textarea --------------------------------------- */

body.page-id-165 div.wpforms-container [data-field-id="72"] {
    margin-top: 6px;
}

body.page-id-165 div.wpforms-container [data-field-id="72"] textarea {
    border: 1px solid #E3EAF2 !important;
    border-radius: 10px !important;
    font-family: 'Inter';
    font-size: 14.5px;
    color: #111E36;
    padding: 14px;
    min-height: 90px;
    resize: vertical;
}

body.page-id-165 div.wpforms-container [data-field-id="72"] textarea::placeholder {
    color: #A7B2C1;
}

/* character counter, added next to the textarea by functions.php's JS */
body.page-id-165 .fyc-char-count {
    display: block;
    text-align: right;
    font-family: 'Inter';
    font-size: 12.5px;
    color: #A7B2C1;
    margin-top: 6px;
}

/* --- Selection summary panel (built by functions.php JS) ------------------- */

body.page-id-165 .fyc-summary {
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    background: #EDFBF2;
    border: 1px solid #CDEFD9;
    border-radius: 14px;
    padding: 18px 22px;
    margin: -2px 0 24px;
}

body.page-id-165 .fyc-summary.is-ready {
    display: flex;
}

body.page-id-165 .fyc-summary-left {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

body.page-id-165 .fyc-summary-photo {
    flex: none;
    width: 92px;
    height: 68px;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
}

body.page-id-165 .fyc-summary-photo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

body.page-id-165 .fyc-summary-title {
    font-family: 'Inter';
    font-size: 13px;
    font-weight: 700;
    color: #1770D4;
    text-transform: uppercase;
    letter-spacing: .8px;
    margin: 0 0 8px;
}

body.page-id-165 .fyc-summary-rows {
    display: grid;
    grid-template-columns: repeat(2, auto);
    column-gap: 28px;
    row-gap: 6px;
}

body.page-id-165 .fyc-summary-row {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: 'Inter';
    font-size: 14px;
    color: #2E3B4E;
    white-space: nowrap;
}

body.page-id-165 .fyc-summary-row .fyc-summary-ico {
    flex: none;
    width: 16px;
    height: 16px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: .75;
}

body.page-id-165 .fyc-summary-edit {
    flex: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid #B9E4C7;
    border-radius: 10px;
    padding: 11px 18px;
    font-family: 'Inter';
    font-size: 14px;
    font-weight: 600;
    color: #1770D4;
    cursor: pointer;
    white-space: nowrap;
}

body.page-id-165 .fyc-summary-edit:hover {
    border-color: #24CF69;
}

body.page-id-165 .fyc-summary-edit .fyc-summary-ico {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231770D4'%3E%3Cpath d='M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04a1 1 0 0 0 0-1.41l-2.34-2.34a1 1 0 0 0-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z'/%3E%3C/svg%3E");
    opacity: 1;
}

/* icons for each summary row, keyed by data-kind */
body.page-id-165 .fyc-summary-row[data-kind="body"] .fyc-summary-ico {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23111E36'%3E%3Cpath d='M5 11l1.5-4.5A2 2 0 0 1 8.4 5h7.2a2 2 0 0 1 1.9 1.5L19 11m-14 0h14m-14 0a2 2 0 0 0-2 2v4h2m14-6a2 2 0 0 1 2 2v4h-2M7 17a2 2 0 1 1-4 0 2 2 0 0 1 4 0zm14 0a2 2 0 1 1-4 0 2 2 0 0 1 4 0z'/%3E%3C/svg%3E");
}

body.page-id-165 .fyc-summary-row[data-kind="make"] .fyc-summary-ico {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23111E36'%3E%3Cpath d='M20.59 13.41 11 3.83A2 2 0 0 0 9.59 3.24L3 3v6.59a2 2 0 0 0 .59 1.41l9.58 9.58a2 2 0 0 0 2.83 0l4.59-4.59a2 2 0 0 0 0-2.83zM6.5 8A1.5 1.5 0 1 1 8 6.5 1.5 1.5 0 0 1 6.5 8z'/%3E%3C/svg%3E");
}

body.page-id-165 .fyc-summary-row[data-kind="budget"] .fyc-summary-ico {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23111E36'%3E%3Cpath d='M11.8 10.9c-2.27-.59-3-1.2-3-2.15 0-1.09 1.01-1.85 2.7-1.85 1.78 0 2.44.85 2.5 2.1h2.21c-.07-1.72-1.12-3.3-3.21-3.81V3h-3v2.16c-1.94.42-3.5 1.68-3.5 3.61 0 2.31 1.91 3.46 4.7 4.13 2.5.6 3 1.48 3 2.41 0 .69-.49 1.79-2.7 1.79-2.06 0-2.87-.92-2.98-2.1h-2.2c.12 2.19 1.76 3.42 3.68 3.83V21h3v-2.15c1.95-.37 3.5-1.5 3.5-3.55 0-2.84-2.43-3.81-4.7-4.4z'/%3E%3C/svg%3E");
}

body.page-id-165 .fyc-summary-row[data-kind="year"] .fyc-summary-ico {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23111E36'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 16H5V10h14z'/%3E%3C/svg%3E");
}

body.page-id-165 .fyc-summary-row[data-kind="transmission"] .fyc-summary-ico {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23111E36'%3E%3Cpath d='M19.4 13a7.65 7.65 0 0 0 .06-1 7.65 7.65 0 0 0-.06-1l2.11-1.65a.5.5 0 0 0 .12-.64l-2-3.46a.5.5 0 0 0-.6-.22l-2.49 1a7.3 7.3 0 0 0-1.7-1L14.4 3.5a.49.49 0 0 0-.49-.42h-4a.49.49 0 0 0-.49.42L9.06 6a7.3 7.3 0 0 0-1.7 1l-2.49-1a.5.5 0 0 0-.6.22l-2 3.46a.5.5 0 0 0 .12.64L4.5 12a7.65 7.65 0 0 0 0 2l-2.11 1.65a.5.5 0 0 0-.12.64l2 3.46a.5.5 0 0 0 .6.22l2.49-1a7.3 7.3 0 0 0 1.7 1l.36 2.5a.49.49 0 0 0 .49.42h4a.49.49 0 0 0 .49-.42l.36-2.5a7.3 7.3 0 0 0 1.7-1l2.49 1a.5.5 0 0 0 .6-.22l2-3.46a.5.5 0 0 0-.12-.64zM12 15.5A3.5 3.5 0 1 1 15.5 12 3.5 3.5 0 0 1 12 15.5z'/%3E%3C/svg%3E");
}

body.page-id-165 .fyc-summary-row[data-kind="fuel"] .fyc-summary-ico {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23111E36'%3E%3Cpath d='M18.92 5.01c-.11-.32-.42-.51-.92-.51h-2V3H4v18h12v-9.5h1.5v6c0 1.1.9 2 2 2s2-.9 2-2V8c0-1.34-2-3.11-2.58-3.99zM10 10H6V5h4zM19.5 9.5c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5z'/%3E%3C/svg%3E");
}

/* --- Submit / WhatsApp button ----------------------------------------------- */

body.page-id-165 div.wpforms-container .wpforms-form button.wpforms-submit {
    background: #2FC46C;
    border: none;
    border-radius: 30px;
    color: #fff;
    font-family: 'Inter';
    font-size: 16px;
    font-weight: 600;
    padding: 16px 34px;
    line-height: 1;
    cursor: pointer;
    transition: background-color .2s;
}

body.page-id-165 div.wpforms-container .wpforms-form button.wpforms-submit:hover {
    background: #27B461;
}

body.page-id-165 div.wpforms-container .wpforms-form button.wpforms-submit::after {
    content: '\2192';
    margin-left: 10px;
    font-weight: 400;
}

/* No !important here: WPForms toggles this container with jQuery .show()/
   .hide() (inline display:none while hidden, cleared back to '' when the
   last page is reached) - forcing display:flex with !important would have
   overridden the inline display:none too and shown the submit button on
   every page. */
body.page-id-165 div.wpforms-container .wpforms-form .wpforms-submit-container {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
}

/* Field 5 (the closing, "position: bottom" pagebreak) renders its own Back
   button in a separate DOM branch from .wpforms-submit-container, so the
   two can't be made real flex siblings. Left-aligning Back and pulling the
   submit row up to match its height puts them visually on one line, same
   as the reference. */
body.page-id-165 div.wpforms-container [data-field-id="5"] .wpforms-pagebreak-right {
    display: flex;
    justify-content: flex-start;
    padding: 0;
    margin: -2px 0 0;
}

body.page-id-165 div.wpforms-container .wpforms-form .wpforms-submit-container {
    margin-top: 0;
}

@media (max-width: 767px) {
    body.page-id-165 div.wpforms-container [data-field-id="5"] .wpforms-pagebreak-right {
        margin-top: 16px;
    }

    body.page-id-165 div.wpforms-container .wpforms-form .wpforms-submit-container {
        margin-top: 12px;
        position: static;
    }
}

@media (max-width: 767px) {
    body.page-id-165 div.wpforms-container [data-field-id="55"] .wpforms-field-layout-row,
    body.page-id-165 div.wpforms-container [data-field-id="69"] .wpforms-field-layout-row {
        flex-direction: column;
        gap: 16px;
    }

    body.page-id-165 .fyc-summary {
        flex-direction: column;
        align-items: stretch;
    }

    body.page-id-165 .fyc-summary-rows {
        grid-template-columns: 1fr;
    }

    body.page-id-165 .fyc-summary-edit {
        justify-content: center;
    }

    body.page-id-165 div.wpforms-container .wpforms-form .wpforms-submit-container {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    body.page-id-165 .fyc-final-back {
        margin-right: 0;
    }
}


body.page-id-165 div.wpforms-container-full .wpforms-form ul.wpforms-image-choices-modern li label.wpforms-field-label-inline {
    width: 130px;
}


body.page-id-165 div.wpforms-container ul#wpforms-159-field_2 label.wpforms-field-label-inline {
    width: 100%;
}

div.wpforms-container-full .wpforms-form .wpforms-page-button {
    min-width: 190px !important;
}

div.wpforms-container-full .wpforms-page-button:focus:after {
    position: unset;
    border: none !important;
}

#wpforms-159-field_55-container label.wpforms-field-label {
    color: #111E36 !important;
    font-weight: 600 !important;
    font-family: 'Inter' !important;
    font-size: 17px !important;
}

div#wpforms-159-field_68-container {
    padding-bottom: 0px !important;
}

div#wpforms-159-field_68-description {
    margin-bottom: 20px;
}

#wpforms-159-field_68-container label.wpforms-field-label {
    margin-bottom: 0px !important;
}

.wpforms-page-3.last button.wpforms-page-button.wpforms-page-prev {
    display: none !important;
}



#wpforms-159-field_72-container label.wpforms-field-label {
        color: #111E36 !important;
    font-weight: 600 !important;
    font-family: 'Inter' !important;
    font-size: 17px !important;
}

button#wpforms-submit-159::after {
    position: unset !important;
    border: none !important;
}

/* ==========================================================================
   Contact page (page-id-18): hero, contact details + blue form card, FAQ,
   areas covered. Everything is scoped to body.page-id-18.
   ========================================================================== */

/* --- Shared eyebrow ("GET IN TOUCH â€”â€”") ------------------------------------ */

body.page-id-18 .ct-eyebrow,
body.page-id-18 .contact-us .info-box-subtitle,
body.page-id-18 .area .info-box-subtitle {
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: 'Poppins';
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    color: #1770D4;
    margin: 0 0 16px;
}

body.page-id-18 .ct-eyebrow::after,
body.page-id-18 .contact-us .info-box-subtitle::after,
body.page-id-18 .area .info-box-subtitle::after {
    content: '';
    width: 40px;
    height: 2px;
    background: currentColor;
}

/* --- Hero ------------------------------------------------------------------ */

/* NOTE: the reference uses a close-up photo of a dark car headlight on the
   right. That image isn't in the media library, so the closest dark image
   that is (the showroom shot) stands in - swap the url() below for the real
   photo once it is uploaded. */
body.page-id-18 .ct-hero {
    background:
        linear-gradient(90deg, #04070d 0%, #060b14 36%, rgba(6, 11, 20, .78) 60%, rgba(6, 11, 20, .28) 100%),
        url(../../uploads/2026/09/about-company.png) right center / cover no-repeat;
    padding: 76px 0 70px;
}

body.page-id-18 .ct-hero > .vc_row {
    width: 100%;
    max-width: 1324px;
    margin: 0 auto;
    padding-inline: 24px;
}

body.page-id-18 .ct-hero .wpb_text_column .wpb_wrapper {
    max-width: 620px;
}

body.page-id-18 .ct-hero .ct-eyebrow {
    color: #2E97FF;
    margin-bottom: 20px;
}

body.page-id-18 .ct-hero .ct-eyebrow::after {
    width: 64px;
}

body.page-id-18 h1.ct-hero-title {
    font-family: 'Poppins';
    font-size: 60px;
    font-weight: 700;
    line-height: 1.05;
    color: #fff;
    margin: 0 0 18px;
}

body.page-id-18 p.ct-hero-lead {
    font-family: 'Inter';
    font-size: 22px;
    font-weight: 500;
    line-height: 1.35;
    color: #fff;
    margin: 0 0 14px;
}

body.page-id-18 p.ct-hero-text {
    font-family: 'Inter';
    font-size: 16px;
    line-height: 1.65;
    color: rgba(255, 255, 255, .78);
    max-width: 480px;
    margin: 0 0 26px;
}

body.page-id-18 p.ct-crumbs {
    font-family: 'Inter';
    font-size: 14px;
    color: rgba(255, 255, 255, .85);
    margin: 0;
}

body.page-id-18 p.ct-crumbs a {
    color: #fff;
    text-decoration: none;
}

body.page-id-18 p.ct-crumbs strong {
    color: #fff;
    font-weight: 700;
}

/* --- Contact details + form card ------------------------------------------- */

body.page-id-18 .contact-us {
    padding-block: 64px 90px;
}

body.page-id-18 .contact-us > .vc_row {
    width: 100%;
    max-width: 1324px;
    margin-inline: auto;
    padding-inline: 24px;
}

body.page-id-18 .contact-us > .vc_row > .wpb_column:first-child {
    width: 45% !important;
    flex: 0 0 45% !important;
}

body.page-id-18 .contact-us > .vc_row > .wpb_column:last-child {
    width: 50% !important;
    flex: 0 0 50% !important;
    margin-left: auto;
    background:
        radial-gradient(circle at 88% 0%, rgba(255, 255, 255, .16), transparent 42%),
        linear-gradient(135deg, #1c93e6 0%, #0d78cf 100%);
    border: 0;
    border-radius: 16px;
    padding: 34px 36px 30px;
    box-shadow: 0 22px 44px rgba(13, 120, 207, .22);
}

body.page-id-18 .contact-us h2.info-box-title {
    font-family: 'Poppins';
    font-size: 40px;
    font-weight: 700;
    line-height: 1.1;
    color: #0B1220;
    padding-bottom: 6px;
}

body.page-id-18 .contact-us .info-box-inner p {
    font-family: 'Inter';
    font-size: 16px;
    line-height: 1.65;
    color: #4B5868;
    margin: 0;
}

/* detail rows: Phone / WhatsApp / Email / Address */
body.page-id-18 .contact-us .wd-info-box {
    align-items: center;
    margin-bottom: 22px;
}

body.page-id-18 .contact-us h4.info-box-title {
    font-family: 'Inter';
    font-size: 15px;
    font-weight: 700;
    color: #0B1220;
    margin: 0 0 2px;
}

body.page-id-18 .contact-us .info-box-inner p.ct-val {
    font-size: 15px;
    line-height: 1.4;
    color: #0B1220;
}

body.page-id-18 .contact-us .info-box-inner p.ct-val a,
body.page-id-18 .contact-us .info-box-inner p.ct-sub a {
    color: inherit;
    text-decoration: none;
}

body.page-id-18 .contact-us .info-box-inner p.ct-sub {
    font-size: 13px;
    line-height: 1.4;
    color: #7A879A;
    margin-top: 2px;
}

/* card heading + intro */
body.page-id-18 .contact-us .wpb_text_column.wpb_content_element h2 {
    font-family: 'Poppins';
    font-size: 26px;
    font-weight: 600;
    padding-bottom: 4px;
    margin: 0;
}

body.page-id-18 .contact-us p.ct-form-sub {
    font-family: 'Inter';
    font-size: 14px;
    color: rgba(255, 255, 255, .92);
    margin: 0 0 20px;
}

/* form controls: white, borderless, slightly tighter than before */
body.page-id-18 .contact-us label.wpforms-field-label {
    font-size: 13px;
    margin-bottom: 7px !important;
}

body.page-id-18 .contact-us .wpforms-field-container input:not([type="checkbox"]):not([type="radio"]),
body.page-id-18 .contact-us .wpforms-field-container textarea {
    height: 46px !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: #fff;
    font-family: 'Inter';
    font-size: 14px;
}

body.page-id-18 .contact-us textarea#wpforms-127-field_6 {
    height: 92px !important;
}

body.page-id-18 .contact-us .wpforms-submit-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding-top: 6px;
}

body.page-id-18 .contact-us button#wpforms-submit-127 {
    flex: 0 0 100%;
    width: 100%;
    padding-block: 17px;
    font-size: 15px;
    font-weight: 600;
    border-radius: 40px;
    background: #05070B !important;
    color: #fff;
}

body.page-id-18 .contact-us button#wpforms-submit-127::after {
    content: '\2192';
    margin-left: 10px;
    font-weight: 400;
}

body.page-id-18 .contact-us .wpforms-submit-container::after {
    content: 'Your details are safe with us. We never share your information.';
    display: block;
    width: fit-content;
    margin: 16px auto 0;
    padding-left: 20px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M18 8h-1V6A5 5 0 0 0 7 6v2H6a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V10a2 2 0 0 0-2-2zM9 6a3 3 0 0 1 6 0v2H9z'/%3E%3C/svg%3E") no-repeat left center / 12px 12px;
    font-family: 'Inter';
    font-size: 12px;
    color: rgba(255, 255, 255, .88);
}

/* --- FAQ -------------------------------------------------------------------- */

body.page-id-18 .ct-faq {
    background: #EDF5FD;
    padding: 58px 0;
}

body.page-id-18 .ct-faq > .vc_row {
    width: 100%;
    max-width: 1340px;
    margin: 0 auto;
    padding-inline: 24px;
    align-items: center;
}

body.page-id-18 .ct-faq > .vc_row > .wpb_column:first-child {
    width: 40% !important;
    flex: 0 0 40% !important;
}

body.page-id-18 .ct-faq > .vc_row > .wpb_column:last-child {
    width: 57% !important;
    flex: 0 0 57% !important;
    margin-left: auto;
}

body.page-id-18 h2.ct-faq-title {
    font-family: 'Poppins';
    font-size: 44px;
    font-weight: 700;
    line-height: 1.1;
    color: #0B1220;
    margin: 0 0 16px;
}

body.page-id-18 p.ct-faq-text {
    font-family: 'Inter';
    font-size: 15.5px;
    line-height: 1.65;
    color: #5B6B7C;
    max-width: 370px;
    margin: 0 0 26px;
}

body.page-id-18 a.ct-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #2FC46C;
    color: #fff;
    font-family: 'Inter';
    font-size: 15px;
    font-weight: 600;
    line-height: 1;
    padding: 16px 30px;
    border-radius: 40px;
    text-decoration: none;
    transition: background-color .2s;
}

body.page-id-18 a.ct-btn::after {
    content: '\2192';
    font-weight: 400;
}

body.page-id-18 a.ct-btn:hover {
    background: #27B461;
    color: #fff;
}

body.page-id-18 .ct-faq-card {
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 10px 34px rgba(17, 30, 54, .07);
    padding: 6px 30px;
}

body.page-id-18 .ct-faq-item {
    border-bottom: 1px solid #EDF2F8;
}

body.page-id-18 .ct-faq-item:last-child {
    border-bottom: 0;
}

body.page-id-18 .ct-faq-item summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 19px 0;
    font-family: 'Inter';
    font-size: 16px;
    font-weight: 500;
    color: #0B1220;
    cursor: pointer;
    list-style: none;
}

body.page-id-18 .ct-faq-item summary::-webkit-details-marker {
    display: none;
}

body.page-id-18 .ct-faq-item summary::after {
    content: '+';
    flex: none;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #E4EFFB;
    color: #1770D4;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 400;
    line-height: 1;
    padding-bottom: 2px;
    transition: background-color .2s, color .2s;
}

body.page-id-18 .ct-faq-item[open] summary::after {
    content: '\2212';
    background: #1770D4;
    color: #fff;
}

body.page-id-18 .ct-faq-answer {
    padding: 0 52px 22px 0;
}

body.page-id-18 .ct-faq-answer p {
    font-family: 'Inter';
    font-size: 14.5px;
    line-height: 1.7;
    color: #5B6B7C;
    margin: 0;
}

/* --- Areas covered ---------------------------------------------------------- */

body.page-id-18 .area {
    background: #fff;
    padding-block: 60px 30px !important;
    margin-bottom: 30px !important;
    /* This row is section-stretched (full viewport width, -15px margins from
       the row gutter, ~8px of content inset), so its content is inset by
       hand to line up with the 1276px content edge the other sections use. */
    padding-inline: max(16px, calc((100vw - 1276px) / 2 - 8px));
}

/* WPForms' default 15px top+bottom on every field made the card taller than
   the design; 8px each keeps the same rhythm as the reference. */
body.page-id-18 .contact-us .wpforms-field {
    padding: 8px 0;
}

body.page-id-18 .area h2.info-box-title {
    font-family: 'Poppins';
    font-size: 40px;
    font-weight: 700;
    line-height: 1.1;
    color: #0B1220;
}

body.page-id-18 .area p.ct-area-text {
    font-family: 'Inter';
    font-size: 16px;
    line-height: 1.65;
    color: #5B6B7C;
    max-width: 450px;
    margin: 10px 0 0;
}

body.page-id-18 .area ul {
    margin-top: 26px;
}

body.page-id-18 .area ul li {
    width: auto;
    height: 46px;
    padding: 0 22px 0 16px;
    gap: 8px;
    justify-content: flex-start;
    box-shadow: 0 3px 10px rgba(17, 30, 54, .05);
    border: 1px solid #EDF2F8;
}

body.page-id-18 .area ul li::before {
    content: '';
    flex: none;
    width: 16px;
    height: 16px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231770D4'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5.25 7 13 7 13s7-7.75 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 14.5 9 2.5 2.5 0 0 1 12 11.5z'/%3E%3C/svg%3E") center / contain no-repeat;
}

body.page-id-18 #custom-leaflet-map {
    height: 380px !important;
    border-radius: 14px !important;
    box-shadow: 0 12px 34px rgba(17, 30, 54, .12);
}

/* --- Responsive ------------------------------------------------------------- */

@media (max-width: 1024px) {
    body.page-id-18 h1.ct-hero-title {
        font-size: 46px;
    }

    body.page-id-18 .contact-us > .vc_row > .wpb_column:first-child,
    body.page-id-18 .contact-us > .vc_row > .wpb_column:last-child,
    body.page-id-18 .ct-faq > .vc_row > .wpb_column:first-child,
    body.page-id-18 .ct-faq > .vc_row > .wpb_column:last-child {
        width: 100% !important;
        flex: 0 0 100% !important;
    }

    body.page-id-18 .contact-us > .vc_row > .wpb_column:first-child {
        margin-bottom: 36px;
    }

    /* The site-wide `.area { display: flex }` rule keeps the text and map
       columns side by side even on phones, squeezing the map into a sliver.
       Let the row wrap so the two columns stack. */
    body.page-id-18 .area {
        flex-wrap: wrap;
    }

    body.page-id-18 .area > .wpb_column {
        width: 100%;
        flex: 0 0 100%;
    }

    body.page-id-18 .area > .wpb_column:first-child {
        margin-bottom: 28px;
    }

    body.page-id-18 .ct-faq > .vc_row > .wpb_column:first-child {
        margin-bottom: 28px;
    }
}

@media (max-width: 767px) {
    body.page-id-18 .ct-hero {
        padding: 52px 0 48px;
        background:
            linear-gradient(180deg, rgba(4, 7, 13, .92) 0%, rgba(4, 7, 13, .78) 100%),
            url(../../uploads/2026/09/about-company.png) center / cover no-repeat;
    }

    body.page-id-18 h1.ct-hero-title {
        font-size: 22px;
    }

    body.page-id-18 p.ct-hero-lead {
        font-size: 19px;
    }

    /* the extra classes are needed to out-rank the older site-wide
       `h2.info-box-title.title.box-title-style-default.wd-fontsize-m` rule */
    body.page-id-18 .contact-us h2.info-box-title.title.box-title-style-default,
    body.page-id-18 .area h2.info-box-title.title.box-title-style-default,
    body.page-id-18 h2.ct-faq-title {
        font-size: 30px;
    }

    body.page-id-18 .contact-us > .vc_row > .wpb_column:last-child {
        padding: 26px 0px 24px;
    }

    body.page-id-18 .ct-faq-card {
        padding: 2px 20px;
    }

    body.page-id-18 .ct-faq-answer {
        padding-right: 0;
    }
}


/* ==========================================================================
   Blog page (page-id-17): featured hero, recent-posts grid, "Get the latest
   car advice" strip. Markup comes from [adams_blog] / [adams_blog_cta] in
   functions.php. Scoped to body.page-id-17.
   ========================================================================== */

/* the design has no pre-footer "Ready to find your next car" banner here */
body.page-id-17 .wd-prefooter {
    display: none;
}

body.page-id-17 .ab-main {
    padding: 40px 0 0;
}

body.page-id-17 .ab-main > .vc_row {
    width: 100%;
    margin: 0;
}

body.page-id-17 .ab-main .vc_column-inner {
    padding: 0;
}

body.page-id-17 .ab-blog {
    width: min(1340px, calc(100% - 32px));
    margin-inline: auto;
}

/* --- Shared button --------------------------------------------------------- */

body.page-id-17 a.ab-btn,
body.page-id-17 button.ab-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #2FC46C;
    color: #fff;
    border: 0;
    border-radius: 40px;
    padding: 15px 30px;
    font-family: 'Inter';
    font-size: 15px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .2s, opacity .2s;
}

body.page-id-17 .ab-btn::after {
    content: '\2192';
    font-weight: 400;
}

body.page-id-17 .ab-btn:hover {
    background: #27B461;
    color: #fff;
}

body.page-id-17 .ab-btn.is-loading {
    opacity: .6;
    pointer-events: none;
}

/* --- Featured hero ----------------------------------------------------------- */

body.page-id-17 .ab-hero-wrap {
    position: relative;
    margin-bottom: 40px;
}

body.page-id-17 .ab-hero {
    display: none;
    position: relative;
    min-height: 400px;
    padding: 56px 64px;
    border-radius: 20px;
    overflow: hidden;
    color: #fff;
    background-color: #061018;
    background-image:
        linear-gradient(90deg, #061018 0%, rgba(6, 16, 24, .94) 34%, rgba(6, 16, 24, .55) 60%, rgba(6, 16, 24, .12) 100%),
        var(--ab-hero-img, linear-gradient(#061018, #061018));
    background-position: center, right center;
    background-size: 100% 100%, cover;
    background-repeat: no-repeat;
}

body.page-id-17 .ab-hero.is-active {
    display: flex;
    align-items: center;
}

body.page-id-17 .ab-hero-copy {
    max-width: 610px;
}

body.page-id-17 p.ab-hero-eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: 'Inter';
    font-size: 15px;
    font-weight: 500;
    color: #fff;
    margin: 0 0 16px;
}

body.page-id-17 p.ab-hero-eyebrow::after {
    content: '';
    width: 48px;
    height: 2px;
    background: #2FC46C;
}

body.page-id-17 h2.ab-hero-title {
    font-family: 'Poppins';
    font-size: 46px;
    font-weight: 600;
    line-height: 1.14;
    color: #fff;
    margin: 0 0 18px;
}

body.page-id-17 h2.ab-hero-title a {
    color: inherit;
    text-decoration: none;
}

body.page-id-17 p.ab-hero-text {
    font-family: 'Inter';
    font-size: 16px;
    line-height: 1.62;
    color: rgba(255, 255, 255, .92);
    max-width: 560px;
    margin: 0 0 26px;
}

body.page-id-17 .ab-hero-next {
    position: absolute;
    top: 50%;
    right: 30px;
    transform: translateY(-50%);
    width: 46px;
    height: 46px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .25);
    background: rgba(12, 22, 32, .78);
    cursor: pointer;
    z-index: 2;
}

body.page-id-17 .ab-hero-next::after {
    content: '\203A';
    color: #fff;
    font-size: 30px;
    line-height: 1;
    display: block;
    margin-top: -3px;
}

/* --- Grid -------------------------------------------------------------------- */

body.page-id-17 h2.ab-heading {
    font-family: 'Inter';
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
    color: #0B1220;
    margin: 0 0 22px;
}

body.page-id-17 .ab-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

body.page-id-17 .ab-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid #E5EBF2;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(17, 30, 54, .04);
    transition: box-shadow .25s, transform .25s;
}

body.page-id-17 .ab-card:hover {
    box-shadow: 0 12px 30px rgba(17, 30, 54, .10);
    transform: translateY(-3px);
}

body.page-id-17 .ab-card-img {
    display: block;
    aspect-ratio: 310 / 145;
    overflow: hidden;
    background: #EAF1F9;
}

body.page-id-17 .ab-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .5s;
}

body.page-id-17 .ab-card:hover .ab-card-img img {
    transform: scale(1.04);
}

/* posts with no featured image yet */
body.page-id-17 .ab-noimg {
    display: block;
    width: 100%;
    height: 100%;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23a9c3e0'%3E%3Cpath d='M18.92 6.01C18.72 5.42 18.16 5 17.5 5h-11c-.66 0-1.21.42-1.42 1.01L3 12v8a1 1 0 0 0 1 1h1a1 1 0 0 0 1-1v-1h12v1a1 1 0 0 0 1 1h1a1 1 0 0 0 1-1v-8zM6.85 7h10.29l1.08 3.11H5.77zM19 17H5v-5h14zM7.5 16a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm9 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3z'/%3E%3C/svg%3E") center / 54px no-repeat,
        linear-gradient(135deg, #EAF2FB, #D6E5F6);
}

body.page-id-17 .ab-card-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 20px 22px 22px;
}

body.page-id-17 .ab-cat {
    display: block;
    font-family: 'Inter';
    font-size: 13.5px;
    font-weight: 500;
    color: #1770D4;
    margin: 0 0 6px;
}

body.page-id-17 h3.ab-card-title {
    font-family: 'Inter';
    font-size: 19px;
    font-weight: 700;
    line-height: 1.3;
    color: #0B1220;
    margin: 0 0 8px;
}

body.page-id-17 h3.ab-card-title a {
    color: inherit;
    text-decoration: none;
}

body.page-id-17 p.ab-card-excerpt {
    font-family: 'Inter';
    font-size: 14.5px;
    line-height: 1.55;
    color: #6B7788;
    margin: 0 0 18px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

body.page-id-17 .ab-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: auto;
    font-family: 'Inter';
    font-size: 14px;
}

body.page-id-17 .ab-avatar {
    position: relative;
    overflow: hidden;
    flex: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #DCE8F5;
    color: #1770D4;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* the profile picture sits over the initials and covers them when it loads */
body.page-id-17 .ab-avatar img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

body.page-id-17 .ab-author {
    font-weight: 500;
    color: #0B1220;
}

body.page-id-17 .ab-dot {
    color: #9AA7B6;
    font-size: 11px;
}

body.page-id-17 .ab-meta time {
    color: #6B7788;
}

body.page-id-17 .ab-more {
    text-align: center;
    margin: 36px 0 0;
}

/* --- "Get the latest car advice" strip ---------------------------------------- */

body.page-id-17 .ab-cta-section {
    background: #04070B;
    margin-top: 64px;
    padding: 46px 0 42px;
}

body.page-id-17 .ab-cta-section > .vc_row {
    width: 100%;
    margin: 0;
}

body.page-id-17 .ab-cta-section .vc_column-inner {
    padding: 0;
}

body.page-id-17 .ab-cta-inner {
    width: min(1340px, calc(100% - 32px));
    margin-inline: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 56px;
}

body.page-id-17 .ab-cta-left {
    flex: 1 1 50%;
}

body.page-id-17 h2.ab-cta-title {
    font-family: 'Inter';
    font-size: 34px;
    font-weight: 700;
    line-height: 1.15;
    color: #fff;
    margin: 0 0 12px;
}

body.page-id-17 p.ab-cta-text {
    font-family: 'Inter';
    font-size: 16px;
    line-height: 1.6;
    color: rgba(255, 255, 255, .85);
    max-width: 480px;
    margin: 0 0 22px;
}

body.page-id-17 .ab-cta-right {
    flex: 1 1 42%;
    padding: 6px 0 6px 64px;
    border-left: 1px solid rgba(255, 255, 255, .14);
}

body.page-id-17 img.ab-cta-logo {
    display: block;
    height: 66px;
    width: auto;
    margin: 0 0 14px;
}

body.page-id-17 p.ab-cta-tag {
    font-family: 'Inter';
    font-size: 16px;
    color: #fff;
    margin: 0 0 22px;
}

body.page-id-17 ul.ab-social {
    display: flex;
    gap: 22px;
    list-style: none;
    margin: 0;
    padding: 0;
}

body.page-id-17 ul.ab-social li {
    margin: 0;
}

body.page-id-17 ul.ab-social a {
    display: block;
    width: 22px;
    height: 22px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    opacity: .95;
}

body.page-id-17 ul.ab-social a:hover {
    opacity: 1;
    transform: translateY(-2px);
}

body.page-id-17 ul.ab-social a[data-icon="facebook"] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M13.5 21v-8h2.7l.4-3.2h-3.1V7.8c0-.9.3-1.5 1.6-1.5h1.7V3.4c-.3 0-1.3-.1-2.4-.1-2.4 0-4 1.5-4 4.1v2.4H7.5V13h2.9v8z'/%3E%3C/svg%3E");
}

body.page-id-17 ul.ab-social a[data-icon="instagram"] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='3' width='18' height='18' rx='5' fill='none' stroke='%23fff' stroke-width='2'/%3E%3Ccircle cx='12' cy='12' r='4' fill='none' stroke='%23fff' stroke-width='2'/%3E%3Ccircle cx='17.5' cy='6.5' r='1.2' fill='%23fff'/%3E%3C/svg%3E");
}

body.page-id-17 ul.ab-social a[data-icon="youtube"] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M21.6 7.2a2.5 2.5 0 0 0-1.8-1.8C18.2 5 12 5 12 5s-6.2 0-7.8.4A2.5 2.5 0 0 0 2.4 7.2C2 8.8 2 12 2 12s0 3.2.4 4.8a2.5 2.5 0 0 0 1.8 1.8C5.8 19 12 19 12 19s6.2 0 7.8-.4a2.5 2.5 0 0 0 1.8-1.8c.4-1.6.4-4.8.4-4.8s0-3.2-.4-4.8zM10 15V9l5.2 3z'/%3E%3C/svg%3E");
}

body.page-id-17 ul.ab-social a[data-icon="linkedin"] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M6.9 8.9H3.6V20h3.3zM5.3 3.5a1.9 1.9 0 1 0 0 3.8 1.9 1.9 0 0 0 0-3.8zM20.4 13.6c0-3-1.6-4.9-4.2-4.9-1.4 0-2.4.8-2.8 1.5V8.9h-3.2V20h3.3v-6c0-1.6.6-2.6 1.9-2.6s1.7 1.1 1.7 2.6V20h3.3z'/%3E%3C/svg%3E");
}

/* --- Responsive ----------------------------------------------------------------- */

@media (max-width: 1024px) {
    body.page-id-17 .ab-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    body.page-id-17 .ab-hero {
        padding: 44px 40px;
        min-height: 340px;
    }

    body.page-id-17 h2.ab-hero-title {
        font-size: 36px;
    }

    body.page-id-17 .ab-cta-inner {
        gap: 32px;
    }

    body.page-id-17 .ab-cta-right {
        padding-left: 36px;
    }
}

@media (max-width: 767px) {
    body.page-id-17 .ab-grid {
        grid-template-columns: 1fr;
    }

    body.page-id-17 .ab-hero {
        padding: 34px 24px;
        min-height: 0;
        background-image:
            linear-gradient(180deg, rgba(6, 16, 24, .9) 0%, rgba(6, 16, 24, .82) 100%),
            var(--ab-hero-img, linear-gradient(#061018, #061018));
    }

    body.page-id-17 h2.ab-hero-title {
        font-size: 28px;
        line-height: 1;
    }

    body.page-id-17 .ab-hero-next {
        top: auto;
        bottom: 16px;
        right: 16px;
        transform: none;
    }

    body.page-id-17 h2.ab-heading {
        font-size: 24px;
    }

    body.page-id-17 .ab-cta-inner {
        flex-direction: column;
        align-items: flex-start;
    }

    body.page-id-17 .ab-cta-right {
        padding: 28px 0 0;
        border-left: 0;
        border-top: 1px solid rgba(255, 255, 255, .14);
        width: 100%;
    }

    body.page-id-17 h2.ab-cta-title {
        font-size: 28px;
    }
}


/* ==========================================================================
   Single blog post (single.php): hero, article, pull-quote, tags, author box
   + share, read next, related articles, CTA. Scoped to body.single-post.
   ========================================================================== */

/* the design replaces Woodmart's title bar, boxed container and pre-footer CTA */
body.single-post .wd-page-title,
body.single-post .wd-prefooter {
    display: none;
}

body.single-post main#main-content {
    max-width: none;
    width: 100%;
    padding-inline: 0;
}

body.single-post .wd-content-area {
    padding: 0;
    margin: 0;
}

/* --- Hero ------------------------------------------------------------------ */

body.single-post .sp-hero {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 470px;
    color: #fff;
    background-color: #0B1420;
    background-image:
        linear-gradient(90deg, rgba(4, 9, 16, .82) 0%, rgba(4, 9, 16, .55) 32%, rgba(4, 9, 16, .08) 62%, rgba(4, 9, 16, 0) 100%),
        var(--sp-img, linear-gradient(#0B1420, #0B1420));
    background-size: 100% 100%, cover;
    background-position: center, right center;
    background-repeat: no-repeat;
}

body.single-post .sp-hero-inner {
    width: min(1226px, calc(100% - 48px));
    margin-inline: auto;
    padding: 200px 0;
}

body.single-post a.sp-hero-cat {
    display: block;
    font-family: 'Inter';
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: #3AA6FF;
    text-decoration: none;
    margin: 0 0 14px;
}

body.single-post h1.sp-hero-title {
    font-family: 'Poppins';
    font-size: 58px;
    font-weight: 700;
    line-height: 1.04;
    color: #fff;
    max-width: 810px;
    margin: 0 0 18px;
}

body.single-post p.sp-hero-excerpt {
    font-family: 'Inter';
    font-size: 18px;
    line-height: 1.5;
    color: rgba(255, 255, 255, .95);
    max-width: 440px;
    margin: 0 0 26px;
}

body.single-post .sp-byline,
body.single-post .sp-authorbox-who {
    display: flex;
    align-items: center;
    gap: 14px;
}

body.single-post .sp-avatar {
    position: relative;
    overflow: hidden;
    flex: none;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: #DCE8F5;
    color: #1770D4;
    font-family: 'Inter';
    font-size: 14px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

body.single-post .sp-avatar img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.single-post .sp-hero .sp-avatar {
    background: rgba(255, 255, 255, .2);
    color: #fff;
    border: 2px solid rgba(255, 255, 255, .75);
    box-sizing: border-box;
}

body.single-post .sp-byline-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-family: 'Inter';
}

body.single-post .sp-byline-text strong {
    font-size: 15px;
    font-weight: 600;
    color: #fff;
}

body.single-post .sp-byline-text > span {
    font-size: 14px;
    color: rgba(255, 255, 255, .85);
}

/* --- Article body ---------------------------------------------------------- */

body.single-post .sp-article {
    width: min(1230px, calc(100% - 0px));
    margin: 34px auto 0;
}

body.single-post .sp-banner {
    margin: 0 0 40px;
}

body.single-post .sp-banner img {
    display: block;
    width: 100%;
    aspect-ratio: 3.2 / 1;
    object-fit: cover;
    border-radius: 6px;
}

body.single-post .sp-lead-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 0 44px;
    align-items: start;
}

body.single-post .sp-content {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 18px;
    line-height: 1.72;
    color: #33404F;
}

body.single-post .sp-content p {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
    margin: 0 0 18px;
}

body.single-post .sp-content h2 {
    font-family: 'Inter';
    font-size: 26px;
    font-weight: 700;
    line-height: 1.25;
    color: #0B1220;
    margin: 30px 0 12px;
}

body.single-post .sp-content h3 {
    font-family: 'Inter';
    font-size: 21px;
    font-weight: 700;
    color: #0B1220;
    margin: 24px 0 10px;
}

body.single-post .sp-content a {
    color: #1770D4;
}

body.single-post .sp-content ul,
body.single-post .sp-content ol {
    margin: 0 0 18px 22px;
}

body.single-post .sp-first > p:first-of-type::first-letter {
    float: left;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 84px;
    font-weight: 700;
    line-height: .78;
    color: #1E9E55;
    padding: 8px 12px 0 0;
}

body.single-post .sp-content img {
    max-width: 100%;
    height: auto;
}

body.single-post .sp-content figure {
    margin: 0 0 22px;
}

body.single-post .sp-content .alignleft {
    float: left;
    width: 46%;
    margin: 8px 34px 18px 0;
}

body.single-post .sp-content .alignright {
    float: right;
    width: 46%;
    margin: 8px 0 18px 34px;
}

body.single-post .sp-content .alignleft img,
body.single-post .sp-content .alignright img {
    display: block;
    width: 100%;
    border-radius: 6px;
}

/* a heading further down clears the picture that sat beside an earlier section */
body.single-post .sp-content .alignleft ~ h2 ~ h2,
body.single-post .sp-content .alignright ~ h2 ~ h2 {
    clear: both;
}

body.single-post .sp-content::after {
    content: '';
    display: block;
    clear: both;
}

/* --- Pull-quote -------------------------------------------------------------- */

body.single-post .sp-quote {
    border-left: 1px solid #DCE5EE;
    padding: 2px 0 0 38px;
}

body.single-post .sp-quote-mark {
    display: block;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 96px;
    font-weight: 700;
    line-height: .68;
    height: 42px;
    color: #2FC46C;
}

body.single-post .sp-quote blockquote {
    margin: 12px 0 22px;
    padding: 0;
    border: 0;
    background: none;
    font-family: Georgia, 'Times New Roman', serif;
    font-style: italic;
    font-size: 28px;
    line-height: 1.32;
    color: #1A2433;
}

body.single-post .sp-quote blockquote::before,
body.single-post .sp-quote blockquote::after {
    content: none;
}

body.single-post .sp-quote-line {
    display: block;
    width: 52px;
    height: 3px;
    background: #2FC46C;
    margin: 0 0 16px;
}

body.single-post p.sp-quote-name {
    font-family: 'Inter';
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #0B1220;
    margin: 0;
}

body.single-post p.sp-quote-role {
    font-family: 'Inter';
    font-size: 13px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #9AA7B6;
    margin: 2px 0 0;
}

/* --- Tags, author box, share --------------------------------------------------- */

body.single-post ul.sp-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    list-style: none;
    margin: 26px 0 22px;
    padding: 0;
}

body.single-post ul.sp-tags li {
    margin: 0;
}

body.single-post ul.sp-tags a {
    display: block;
    padding: 9px 18px;
    border: 1px solid #E3EAF2;
    border-radius: 30px;
    font-family: 'Inter';
    font-size: 13.5px;
    font-weight: 500;
    color: #33404F;
    text-decoration: none;
    transition: border-color .2s, color .2s;
}

body.single-post ul.sp-tags a:hover {
    border-color: #1770D4;
    color: #1770D4;
}

body.single-post .sp-authorbox {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
    padding: 20px 0;
    border-top: 1px solid #E8EEF5;
}

body.single-post .sp-authorbox .sp-byline-text strong {
    color: #0B1220;
}

body.single-post .sp-authorbox .sp-byline-text > span {
    color: #7A879A;
    font-size: 13.5px;
}

body.single-post .sp-share {
    display: flex;
    align-items: center;
    gap: 10px;
}

body.single-post .sp-share-label {
    font-family: 'Inter';
    font-size: 14px;
    color: #6B7788;
    margin-right: 4px;
}

body.single-post .sp-share a,
body.single-post .sp-share button {
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background-color: #F1F5F9;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 17px 17px;
    cursor: pointer;
    transition: background-color .2s, transform .2s;
}

body.single-post .sp-share a:hover,
body.single-post .sp-share button:hover {
    background-color: #E1EAF3;
    transform: translateY(-2px);
}

body.single-post .sp-share button.is-copied {
    background-color: #CFF0DC;
}

body.single-post .sp-share [data-icon="facebook"] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230B1220'%3E%3Cpath d='M13.5 21v-8h2.7l.4-3.2h-3.1V7.8c0-.9.3-1.5 1.6-1.5h1.7V3.4c-.3 0-1.3-.1-2.4-.1-2.4 0-4 1.5-4 4.1v2.4H7.5V13h2.9v8z'/%3E%3C/svg%3E");
}

body.single-post .sp-share [data-icon="x"] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230B1220'%3E%3Cpath d='M18.9 3H22l-7.2 8.2L23 21h-6.5l-5.1-6.7L5.5 21H2.4l7.7-8.8L2 3h6.6l4.6 6.1zM17.8 19h1.8L7.3 4.9H5.4z'/%3E%3C/svg%3E");
}

body.single-post .sp-share [data-icon="linkedin"] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230B1220'%3E%3Cpath d='M6.9 8.9H3.6V20h3.3zM5.3 3.5a1.9 1.9 0 1 0 0 3.8 1.9 1.9 0 0 0 0-3.8zM20.4 13.6c0-3-1.6-4.9-4.2-4.9-1.4 0-2.4.8-2.8 1.5V8.9h-3.2V20h3.3v-6c0-1.6.6-2.6 1.9-2.6s1.7 1.1 1.7 2.6V20h3.3z'/%3E%3C/svg%3E");
}

body.single-post .sp-share [data-icon="link"] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230B1220'%3E%3Cpath d='M10.6 13.4a1 1 0 0 1 0-1.4l3.8-3.8a3.2 3.2 0 0 1 4.5 4.5l-2 2-1.4-1.4 2-2a1.2 1.2 0 0 0-1.7-1.7L12 13.4a1 1 0 0 1-1.4 0zM13.4 10.6a1 1 0 0 1 0 1.4l-3.8 3.8a3.2 3.2 0 1 1-4.5-4.5l2-2 1.4 1.4-2 2a1.2 1.2 0 0 0 1.7 1.7l3.8-3.8a1 1 0 0 1 1.4 0z'/%3E%3C/svg%3E");
}

/* --- Read next ------------------------------------------------------------------ */

body.single-post a.sp-next {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 4px;
    padding: 14px 24px 14px 14px;
    border: 1px solid #E5EBF2;
    border-radius: 8px;
    color: inherit;
    text-decoration: none;
    transition: box-shadow .25s, transform .25s;
}

body.single-post a.sp-next:hover {
    box-shadow: 0 10px 26px rgba(17, 30, 54, .08);
    transform: translateY(-2px);
}

body.single-post .sp-next-img {
    flex: none;
    width: 124px;
    height: 78px;
    border-radius: 5px;
    overflow: hidden;
    background: #EAF1F9;
}

body.single-post .sp-next-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

body.single-post .sp-next-text {
    display: flex;
    flex-direction: column;
    gap: 3px;
    flex: 1;
    min-width: 0;
    font-family: 'Inter';
}

body.single-post .sp-next-label {
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 1.1px;
    text-transform: uppercase;
    color: #22B35E;
}

body.single-post .sp-next-text strong {
    font-size: 17px;
    font-weight: 700;
    color: #0B1220;
}

body.single-post .sp-next-ex {
    font-size: 14px;
    color: #6B7788;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

body.single-post .sp-next-arrow {
    flex: none;
    width: 10px;
    height: 10px;
    border-top: 2px solid #33404F;
    border-right: 2px solid #33404F;
    transform: rotate(45deg);
    margin-right: 6px;
}

/* --- Related articles -------------------------------------------------------------- */

body.single-post .sp-related {
    width: min(1226px, calc(100% - 48px));
    margin: 54px auto 0;
}

body.single-post h2.sp-related-title {
    font-family: 'Inter';
    font-size: 24px;
    font-weight: 700;
    color: #0B1220;
    margin: 0 0 20px;
}

body.single-post .sp-related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

body.single-post a.sp-rel-card {
    display: flex;
    flex-direction: column;
    border: 1px solid #E5EBF2;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    color: inherit;
    text-decoration: none;
    box-shadow: 0 1px 4px rgba(17, 30, 54, .04);
    transition: box-shadow .25s, transform .25s;
}

body.single-post a.sp-rel-card:hover {
    box-shadow: 0 12px 28px rgba(17, 30, 54, .10);
    transform: translateY(-3px);
}

body.single-post .sp-rel-img {
    display: block;
    aspect-ratio: 2.3 / 1;
    overflow: hidden;
    background: #EAF1F9;
}

body.single-post .sp-rel-img img,
body.single-post .sp-rel-img .ab-noimg {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.single-post .sp-rel-body {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 16px 18px 20px;
    font-family: 'Inter';
}

body.single-post .sp-rel-cat {
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 1.1px;
    text-transform: uppercase;
    color: #1770D4;
}

body.single-post .sp-rel-title {
    font-size: 17px;
    font-weight: 700;
    line-height: 1.3;
    color: #0B1220;
}

body.single-post .sp-rel-ex {
    font-size: 14px;
    line-height: 1.5;
    color: #6B7788;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* --- CTA ---------------------------------------------------------------------------- */

body.single-post .sp-cta {
    position: relative;
    display: flex;
    align-items: center;
    width: min(1323px, calc(100% - 32px));
    min-height: 250px;
    margin: 50px auto 64px;
    padding: 100px 60px;
    border-radius: 16px;
    overflow: hidden;
    background-color: #EAF5EE;
    background-image:
        linear-gradient(90deg, #EAF5EE 38%, rgba(234, 245, 238, 0) 78%),
        var(--sp-cta-img, linear-gradient(#EAF5EE, #EAF5EE));
    background-size: cover;
    background-position: 0 0, right center;
    background-repeat: no-repeat;
}

body.single-post .sp-cta-copy {
    max-width: 620px;
}

body.single-post p.sp-cta-eyebrow {
    font-family: 'Inter';
    font-size: 14px;
    font-weight: 500;
    color: #2FC46C;
    margin: 0 0 6px;
}

body.single-post h2.sp-cta-title {
    font-family: 'Poppins';
    font-size: 40px;
    font-weight: 700;
    line-height: 1.1;
    color: #2FC46C;
    margin: 0 0 12px;
}

body.single-post p.sp-cta-text {
    font-family: 'Inter';
    font-size: 16px;
    line-height: 1.55;
    color: #3DB56E;
    max-width: 380px;
    margin: 0 0 22px;
}

body.single-post .sp-cta-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

body.single-post a.sp-btn {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 14px 26px;
    border-radius: 40px;
    background: #2FC46C;
    color: #fff;
    font-family: 'Inter';
    font-size: 15px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    transition: background-color .2s;
}

body.single-post a.sp-btn:hover {
    background: #27B461;
    color: #fff;
}

body.single-post a.sp-btn::before {
    content: '';
    width: 17px;
    height: 17px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

body.single-post a.sp-btn-cars::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M18.92 6.01C18.72 5.42 18.16 5 17.5 5h-11c-.66 0-1.21.42-1.42 1.01L3 12v8a1 1 0 0 0 1 1h1a1 1 0 0 0 1-1v-1h12v1a1 1 0 0 0 1 1h1a1 1 0 0 0 1-1v-8zM6.85 7h10.29l1.08 3.11H5.77zM19 17H5v-5h14zM7.5 16a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm9 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3z'/%3E%3C/svg%3E");
}

body.single-post a.sp-btn-cars::after {
    content: '\2192';
    font-weight: 400;
}

body.single-post a.sp-btn-wa::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.149-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51a12.8 12.8 0 0 0-.57-.01c-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 0 1-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 0 1-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 0 1 2.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0 0 12.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 0 0 5.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 0 0-3.48-8.413'/%3E%3C/svg%3E");
}

/* --- Responsive --------------------------------------------------------------------- */

@media (max-width: 1024px) {
    body.single-post h1.sp-hero-title {
        font-size: 44px;
    }

    body.single-post .sp-lead-grid {
        grid-template-columns: 1fr;
    }

    body.single-post .sp-quote {
        border-left: 0;
        border-top: 1px solid #DCE5EE;
        padding: 26px 0 0;
        margin-bottom: 8px;
    }

    body.single-post .sp-related-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    body.single-post .sp-cta {
        padding: 40px 36px;
    }
}

@media (max-width: 767px) {
    body.single-post .sp-hero {
        min-height: 0;
        background-image:
            linear-gradient(180deg, rgba(4, 9, 16, .88) 0%, rgba(4, 9, 16, .72) 100%),
            var(--sp-img, linear-gradient(#0B1420, #0B1420));
    }

    body.single-post .sp-hero-inner {
        padding: 44px 0;
    }

    body.single-post h1.sp-hero-title {
        font-size: 34px;
    }

    body.single-post p.sp-hero-excerpt {
        font-size: 16px;
    }

    body.single-post .sp-banner img {
        aspect-ratio: 16 / 9;
    }

    body.single-post .sp-content {
        font-size: 17px;
    }

    body.single-post .sp-content .alignleft,
    body.single-post .sp-content .alignright {
        float: none;
        width: 100%;
        margin: 0 0 18px;
    }

    body.single-post .sp-first > p:first-of-type::first-letter {
        font-size: 64px;
    }

    body.single-post .sp-quote blockquote {
        font-size: 23px;
    }

    body.single-post .sp-related-grid {
        grid-template-columns: 1fr;
    }

    body.single-post a.sp-next {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    body.single-post .sp-next-arrow {
        display: none;
    }

    body.single-post .sp-cta {
        padding: 32px 24px;
        background-image:
            linear-gradient(180deg, rgba(234, 245, 238, .96) 0%, rgba(234, 245, 238, .86) 100%),
            var(--sp-cta-img, linear-gradient(#EAF5EE, #EAF5EE));
        background-size: 100% 100%, cover;
    }

    body.single-post h2.sp-cta-title {
        font-size: 25px;
    }
}


/* ==========================================================================
   Single blog post v2: sidebar layout (search, "Find Your Next Car" widget,
   compact related list) + rich-content components (checklist box, tables,
   tip callout, definition list, H2 accent). Adds to (doesn't replace) the
   hero/tags/author-box/share/read-next/CTA rules already in place.
   ========================================================================== */

/* --- Two-column layout ------------------------------------------------------ */

body.single-post .sp-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 56px;
    align-items: start;
    width: min(1226px, calc(100% - 48px));
    margin: 34px auto 0;
}

/* the article column no longer needs its own width/centering - .sp-layout owns that now */
body.single-post .sp-main {
    min-width: 0;
}

body.single-post .sp-sidebar {
    position: sticky;
    top: 24px;
    display: flex;
    flex-direction: column;
    gap: 22px;
}

/* --- Sidebar: search ------------------------------------------------------ */

body.single-post .sp-search {
    position: relative;
}

body.single-post .sp-search input[type="search"] {
    width: 100%;
    height: 50px;
    padding: 0 50px 0 18px;
    border: 1px solid #E3EAF2;
    border-radius: 10px;
    background: #fff;
    font-family: 'Inter';
    font-size: 14.5px;
    color: #0B1220;
    box-sizing: border-box;
}

body.single-post .sp-search input[type="search"]::placeholder {
    color: #9AA7B6;
}

body.single-post .sp-search button {
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
    height: 50px;
    border: 0;
    background: transparent;
    cursor: pointer;
}

body.single-post .sp-search button::before {
    content: '';
    display: block;
    width: 18px;
    height: 18px;
    margin: 0 auto;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7788' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* --- Sidebar: "Find Your Next Car" widget ---------------------------------- */

body.single-post .sp-widget-cta {
    border: 1px solid #E5EBF2;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 1px 4px rgba(17, 30, 54, .04);
}

body.single-post .sp-widget-cta img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
}

body.single-post .sp-widget-cta-body {
    padding: 18px 20px 20px;
}

body.single-post .sp-widget-cta-body h3 {
    font-family: 'Inter';
    font-size: 19px;
    font-weight: 700;
    line-height: 1.25;
    color: #0B1220;
    margin: 0 0 8px;
}

body.single-post .sp-widget-cta-body p {
    font-family: 'Inter';
    font-size: 14px;
    line-height: 1.55;
    color: #6B7788;
    margin: 0 0 16px;
}

body.single-post .sp-widget-cta-body a.sp-btn {
    display: flex;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
}

/* --- Sidebar: compact related-articles list --------------------------------- */

body.single-post .sp-widget-related {
    border: 1px solid #E5EBF2;
    border-radius: 12px;
    padding: 18px 20px 8px;
    background: #fff;
}

body.single-post .sp-widget-related h3 {
    font-family: 'Inter';
    font-size: 17px;
    font-weight: 700;
    color: #0B1220;
    margin: 0 0 14px;
}

body.single-post .sp-widget-related ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

body.single-post .sp-widget-related li {
    border-top: 1px solid #EEF2F7;
}

body.single-post .sp-widget-related li:first-child {
    border-top: 0;
}

body.single-post .sp-widget-related a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 0;
    text-decoration: none;
    color: inherit;
}

body.single-post .sp-wr-img {
    flex: none;
    width: 70px;
    height: 52px;
    border-radius: 6px;
    overflow: hidden;
    background: #EAF1F9;
}

body.single-post .sp-wr-img img,
body.single-post .sp-wr-img .ab-noimg {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.single-post .sp-wr-body {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    font-family: 'Inter';
}

body.single-post .sp-wr-cat {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .8px;
    text-transform: uppercase;
    color: #1770D4;
}

body.single-post .sp-wr-body strong {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
    color: #0B1220;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

body.single-post .sp-wr-meta {
    font-size: 12px;
    color: #9AA7B6;
}

/* --- Article content: headings, lists, images ------------------------------- */

body.single-post .sp-content h2 {
    position: relative;
    padding-top: 14px;
}

body.single-post .sp-content h2::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    height: 3px;
    background: #2FC46C;
    border-radius: 2px;
}

body.single-post .sp-content > img,
body.single-post .sp-content figure > img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 10px;
    margin: 26px 0;
}

body.single-post .sp-content ul,
body.single-post .sp-content ol {
    margin: 0 0 18px;
    padding-left: 22px;
}

body.single-post .sp-content li {
    margin-bottom: 6px;
}

body.single-post .sp-content strong {
    color: #1A2433;
}

/* --- Checklist box ------------------------------------------------------------ */

body.single-post .uc-checklist {
    background: #EDFBF2;
    border: 1px solid #CDEFD9;
    border-radius: 12px;
    padding: 22px 26px 8px;
    margin: 22px 0 26px;
}

body.single-post .uc-checklist ul {
    list-style: none;
    margin: 0;
    padding: 0;
    columns: 2;
    column-gap: 32px;
}

body.single-post .uc-checklist li {
    position: relative;
    padding: 0 0 14px 30px;
    font-family: 'Inter';
    font-size: 15px;
    color: #1A2433;
    break-inside: avoid;
}

body.single-post .uc-checklist li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 1px;
    width: 20px;
    height: 20px;
    border-radius: 5px;
    background: #24CF69 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
}

/* --- Definition list ("Doors and panels - Do they line up...") ---------------- */

body.single-post dl.uc-deflist {
    margin: 4px 0 24px;
    padding: 0;
}

body.single-post dl.uc-deflist > div {
    display: flex;
    gap: 6px;
    padding: 13px 0;
    border-top: 1px solid #EEF2F7;
}

body.single-post dl.uc-deflist > div:first-child {
    border-top: 0;
}

body.single-post dl.uc-deflist dt {
    flex: 0 0 190px;
    font-family: 'Inter';
    font-size: 15px;
    font-weight: 700;
    color: #0B1220;
}

body.single-post dl.uc-deflist dd {
    margin: 0;
    font-family: 'Inter';
    font-size: 15px;
    line-height: 1.55;
    color: #5B6B7C;
}

/* --- Tables --------------------------------------------------------------------- */

body.single-post .sp-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 6px 0 28px;
    font-family: 'Inter';
    font-size: 14.5px;
}

body.single-post .sp-content table th,
body.single-post .sp-content table td {
    text-align: left;
    padding: 13px 16px;
    border-bottom: 1px solid #EEF2F7;
}

body.single-post .sp-content table th {
    background: #F7FAFD;
    font-weight: 700;
    color: #0B1220;
    font-size: 13px;
    letter-spacing: .3px;
    text-transform: uppercase;
}

body.single-post .sp-content table td {
    color: #33404F;
}

body.single-post .sp-content table tr:last-child td {
    border-bottom: 0;
}

/* horizontal scroll on phones rather than squeezing/breaking the table */
body.single-post .sp-table-wrap {
    overflow-x: auto;
}

/* --- "Car A / Car B" style price comparison ------------------------------------- */

body.single-post .uc-compare {
    display: flex;
    gap: 18px;
    margin: 6px 0 24px;
    flex-wrap: wrap;
}

body.single-post .uc-compare > div {
    flex: 1 1 220px;
    border: 1px solid #E5EBF2;
    border-radius: 10px;
    padding: 16px 18px;
}

body.single-post .uc-compare h4 {
    display: flex;
    align-items: baseline;
    gap: 8px;
    font-family: 'Inter';
    font-size: 16px;
    font-weight: 700;
    color: #0B1220;
    margin: 0 0 6px;
}

body.single-post .uc-compare h4 span {
    font-size: 15px;
    font-weight: 600;
    color: #2FC46C;
}

body.single-post .uc-compare p {
    font-family: 'Inter';
    font-size: 14px;
    line-height: 1.5;
    color: #6B7788;
    margin: 0;
}

/* variant used for text-list comparisons ("The BMW cabin tends to feel...")
   rather than the price-card variant above */
body.single-post .uc-compare.uc-compare-list > div {
    background: #FAFBFD;
}

body.single-post .uc-compare ul {
    margin: 0 !important;
    padding-left: 18px !important;
}

body.single-post .uc-compare li {
    font-family: 'Inter';
    font-size: 14px;
    line-height: 1.5;
    color: #6B7788;
    margin-bottom: 4px !important;
}

/* --- Tip callout ------------------------------------------------------------------ */

body.single-post .uc-tip {
    position: relative;
    background: #FFF8E6;
    border: 1px solid #F3E2AC;
    border-radius: 12px;
    padding: 20px 24px 20px 56px;
    margin: 24px 0 28px;
}

/* label goes on ::before (real flow order: pseudo, then children) so it
   sits above the tip text; the icon is absolutely positioned so it doesn't
   matter which pseudo it uses - ::after keeps it out of the label's way */
body.single-post .uc-tip::before {
    content: 'QUICK BUYER TIP';
    display: block;
    font-family: 'Inter';
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    color: #A9791A;
    margin-bottom: 6px;
}

body.single-post .uc-tip::after {
    content: '';
    position: absolute;
    left: 20px;
    top: 22px;
    width: 24px;
    height: 24px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23C99A1B'%3E%3Cpath d='M9 21c0 .55.45 1 1 1h4c.55 0 1-.45 1-1v-1H9v1zm3-19C8.14 2 5 5.14 5 9c0 2.38 1.19 4.47 3 5.74V17c0 .55.45 1 1 1h6c.55 0 1-.45 1-1v-2.26c1.81-1.27 3-3.36 3-5.74 0-3.86-3.14-7-7-7z'/%3E%3C/svg%3E") center / contain no-repeat;
}

body.single-post .uc-tip p {
    font-family: 'Inter';
    font-size: 15px;
    line-height: 1.6;
    color: #5B4A1E;
    margin: 0;
}

/* --- Responsive --------------------------------------------------------------------- */

@media (max-width: 1024px) {
    body.single-post .sp-layout {
        grid-template-columns: 1fr;
    }

    body.single-post .sp-sidebar {
        position: static;
        flex-direction: row;
        flex-wrap: wrap;
    }

    body.single-post .sp-search {
        flex: 1 1 100%;
    }

    body.single-post .sp-widget-cta,
    body.single-post .sp-widget-related {
        flex: 1 1 300px;
    }
}

@media (max-width: 767px) {
    body.single-post .sp-sidebar {
        flex-direction: column;
    }

    body.single-post .uc-checklist ul {
        columns: 1;
    }

    body.single-post dl.uc-deflist dt {
        flex-basis: 130px;
    }

    body.single-post .uc-compare {
        flex-direction: column;
    }

    body.single-post .sp-content table {
        font-size: 13.5px;
    }

    body.single-post .sp-content table th,
    body.single-post .sp-content table td {
        padding: 10px 12px;
    }
}


body.single-post.postid-83 .sp-hero {
    background-position: center !important;
}

/* ==========================================================================
   Category archive (category.php): hero, breadcrumb, post list. The green
   CTA strip below is Woodmart's own site-wide pre-footer widget, unchanged.
   Scoped to body.archive (WordPress adds this class on every taxonomy/date
   archive, which is what category.php renders for).
   ========================================================================== */

body.archive .wd-page-title,
body.archive .wd-prefooter .wd-breadcrumbs {
    display: none;
}

body.archive main#main-content {
    max-width: none;
    width: 100%;
    padding-inline: 0;
}

/* --- Hero -------------------------------------------------------------------- */

body.archive .cp-hero {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 320px;
    color: #fff;
    background-color: #0B1420;
    background-image:
        linear-gradient(90deg, rgba(4, 9, 16, .72) 0%, rgba(4, 9, 16, .5) 100%),
        var(--cp-img, linear-gradient(#0B1420, #0B1420));
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

body.archive .cp-hero-inner {
    width: min(1226px, calc(100% - 48px));
    margin-inline: auto;
    padding: 56px 0;
}

body.archive p.cp-hero-eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: 'Inter';
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    color: #fff;
    margin: 0 0 14px;
}

body.archive p.cp-hero-eyebrow::after {
    content: '';
    width: 48px;
    height: 2px;
    background: #2FC46C;
}

body.archive h1.cp-hero-title {
    font-family: 'Poppins';
    font-size: 48px;
    font-weight: 700;
    color: #fff;
    margin: 0;
}

/* --- Breadcrumb ---------------------------------------------------------------- */

body.archive .cp-crumbs {
    border-bottom: 1px solid #EEF2F7;
}

body.archive .cp-crumbs-inner {
    width: min(1226px, calc(100% - 48px));
    margin-inline: auto;
    padding: 16px 0;
    font-family: 'Inter';
    font-size: 13.5px;
    color: #6B7788;
    display: flex;
    align-items: center;
    gap: 8px;
}

body.archive .cp-crumbs-inner a {
    color: #6B7788;
    text-decoration: none;
}

body.archive .cp-crumbs-inner a:hover {
    color: #1770D4;
}

body.archive .cp-crumbs-inner .is-current {
    color: #0B1220;
    font-weight: 600;
}

/* --- Post list ------------------------------------------------------------------ */

body.archive .cp-list {
    width: min(860px, calc(100% - 48px));
    margin: 40px auto 70px;
}

body.archive .cp-cards {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

body.archive .cp-card {
    border: 1px solid #E5EBF2;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 1px 4px rgba(17, 30, 54, .04);
}

body.archive .cp-card-img {
    position: relative;
    display: block;
    aspect-ratio: 16 / 8;
    overflow: hidden;
    background: #EAF1F9;
}

body.archive .cp-card-img img,
body.archive .cp-card-img .ab-noimg {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.archive .cp-date {
    position: absolute;
    left: 20px;
    top: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 14px rgba(17, 30, 54, .18);
    font-family: 'Inter';
    line-height: 1.1;
}

body.archive .cp-date strong {
    font-size: 19px;
    font-weight: 700;
    color: #0B1220;
}

body.archive .cp-date span {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .5px;
    text-transform: uppercase;
    color: #6B7788;
}

body.archive .cp-card-body {
    padding: 26px 30px 30px;
}

body.archive a.cp-cat {
    display: block;
    font-family: 'Inter';
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .8px;
    color: #1770D4;
    text-decoration: none;
    margin-bottom: 8px;
}

body.archive h2.cp-card-title {
    font-family: 'Inter';
    font-size: 24px;
    font-weight: 700;
    line-height: 1.3;
    margin: 0 0 12px;
}

body.archive h2.cp-card-title a {
    color: #0B1220;
    text-decoration: none;
}

body.archive h2.cp-card-title a:hover {
    color: #1770D4;
}

body.archive .cp-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: 'Inter';
    font-size: 13.5px;
    color: #6B7788;
    margin-bottom: 14px;
}

body.archive .cp-avatar {
    position: relative;
    overflow: hidden;
    flex: none;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #DCE8F5;
    color: #1770D4;
    font-size: 10px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

body.archive .cp-avatar img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.archive .cp-dot {
    font-size: 10px;
    color: #C3CBD6;
}

body.archive p.cp-excerpt {
    font-family: 'Inter';
    font-size: 15.5px;
    line-height: 1.65;
    color: #5B6B7C;
    margin: 0 0 16px;
}

body.archive a.cp-more {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Inter';
    font-size: 14.5px;
    font-weight: 600;
    color: #2FC46C;
    text-decoration: none;
}

body.archive a.cp-more:hover {
    color: #22A459;
}

body.archive p.cp-empty {
    font-family: 'Inter';
    font-size: 16px;
    color: #6B7788;
    text-align: center;
    padding: 40px 0;
}

/* --- Pagination ------------------------------------------------------------------- */

body.archive .cp-pagination {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 40px;
}

body.archive .cp-pagination span,
body.archive .cp-pagination a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 8px;
    border: 1px solid #E5EBF2;
    border-radius: 8px;
    font-family: 'Inter';
    font-size: 14px;
    font-weight: 600;
    color: #0B1220;
    text-decoration: none;
}

body.archive .cp-pagination a:hover {
    border-color: #2FC46C;
    color: #2FC46C;
}

body.archive .cp-pagination span.current {
    background: #2FC46C;
    border-color: #2FC46C;
    color: #fff;
}

/* --- Responsive --------------------------------------------------------------------- */

@media (max-width: 767px) {
    body.archive h1.cp-hero-title {
        font-size: 34px;
    }

    body.archive .cp-hero-inner {
        padding: 40px 0;
    }

    body.archive .cp-card-body {
        padding: 20px 20px 24px;
    }

    body.archive h2.cp-card-title {
        font-size: 20px;
    }
	
	main#main-content {
}

.wd-content-area.site-content {
    padding-inline: 15px !important;
}

.sec-1 {
    padding-block: 60px !important;
}

.sec-1 span.sub-head {
    font-size: 12px;
}

.sec-1 h1 {
    font-size: 26px;
}

p {
    font-size: 14px !important;
}

body a.btn.btn-style-default.btn-shape-rectangle.btn-size-default.btn.theme-btn {
    font-size: 11px;
    padding-inline: 0px !important;
    min-height: 33px;
}

.sec-1 a.btn.btn-style-default.btn-shape-rectangle.btn-size-default.btn.theme-btn {
    width: 100% !important;
    padding-block: 0px !important;
}

.sec-1 .vc_row.wpb_row.vc_row-fluid .vc_row.wpb_row.vc_inner.vc_row-fluid .wpb_wrapper .wd-button-wrapper {
    width: 44%;
}

.about-sec {
    padding-top: 40px !important;
    row-gap: 0px !important;
    padding-bottom: 0px !important;
}

.about-sec img.vc_single_image-img.attachment-full {
    width: 100% !important;
}

.about-sec figure.wpb_wrapper.vc_figure {
    width: 100%;
}

.about-sec .vc_single_image-wrapper {
    width: 100%;
}

.info-box-subtitle.subtitle-color-default.wd-fontsize-xs.subtitle-style-default, .sub-head {
    font-size: 13px !important;
}

.about-sec h2.info-box-title.title.box-title-style-default.wd-fontsize-m {}

p {
    font-size: 13px !important;
}

.sec-topup .wd-info-box h4.info-box-title.title.box-title-style-default.wd-fontsize-m {
    font-size: 15px;
}

.sec-topup {
    padding-bottom: 20px !important;
}

.sec-3 {
    padding-block: 40px !important;
    row-gap: 15px;
    padding-bottom: 0px !important;
    margin-bottom: 30px !important;
}

.sec-3 h2 {
    font-size: 21px !important;
}

#browse-body .sub-head, #our-brands .sub-head, #used-cars .sub-head {
    font-size: 11px !important;
}

.sec-3 p {
    margin-bottom: 10px !important;
}

.sec-3 .wpb_column.vc_column_container.vc_col-sm-6 {padding-bottom: 7px !important;}

#browse-body .vc_col-sm-6 a.btn, #our-brands .vc_col-sm-6 a.btn, #used-cars .vc_col-sm-6 a.btn, #browse-body .info-btn-wrapper a.btn, #used-cars .info-btn-wrapper a.btn {
    font-size: 12px;
}

#browse-body .info-box-title {
    font-size: 16px !important;
}

.sec-4 p {margin-bottom: 5px;}

h2.info-box-title.title.box-title-style-default.wd-fontsize-m, h2 {
    font-size: 21px;
}

.sec-4 .wpb_column.vc_column_container.vc_col-sm-6 {
    padding-bottom: 5px !important;
}

#our-brands .wd-info-box {}

#our-brands .adams-slider > .wpb_column {
    max-width: 100% !important;
    flex: 0 0 55% !important;
}

#our-brands .info-box-title {
    font-size: 15px;
}

#our-brands img.attachment-800x600.size-800x600 {
    width: 90px;
}

#our-brands {
    padding-bottom: 20px !important;
}

#used-cars {margin-bottom: 40px !important;}

#used-cars .adams-slider {
    padding-inline: 15px;
}

.sec-5 > .vc_row.wpb_row.vc_row-fluid {
    margin-inline: 0;
}

.sec-5 .sub-head {
    font-size: 11px !important;
}

.sec-5 h2 {
    font-size: 21px;
}

.sec-5 .vc_row.wpb_row.vc_row-fluid {
    padding-top: 0px !important;
    margin-bottom: 45px !important;
}

.sec-5 .vc_row.wpb_row.vc_row-fluid .wpb_column.vc_column_container.vc_col-sm-12 .wpb_wrapper a.btn.btn-style-default.btn-shape-rectangle.btn-size-default.btn.theme-btn {
    padding-inline: 15px !important;
    width: 100%;
}

.sec-5 .vc_row.wpb_row.vc_row-fluid .wpb_column.vc_column_container.vc_col-sm-12 .wpb_wrapper .wd-button-wrapper {
    width: 100% !important;
}

.why-sec {
    padding-top: 20px !important;
    row-gap: 0px;
    padding-bottom: 0;
}

.why-sec ul li {
    font-size: 13px;
}

.testi-section .wd-carousel.wd-grid.wd-initialized.wd-horizontal.wd-watch-progress.wd-backface-hidden {}

.wd-testimon-name.title {
    font-size: 14px;
}

.wd-testimon-pos {
    font-size: 12px;
}

.area ul li {
    font-size: 12px;
    height: 30px;
}

.area .wd-info-box {
    margin-bottom: 0px !important;
}

.area ul {
    margin-bottom: 0px !important;
}

.blog-row {
    padding-top: 40px !important;
}

.blog-row .wd-info-box {
    margin-bottom: 0px !important;
}

.blog-row .wd-button-wrapper {
    text-align: left;
}

.blog-row .wd-button-wrapper a.btn.btn-style-default.btn-shape-round.btn-size-default {
    font-size: 13px;
}

body .blog-row h3.wd-post-title.wd-entities-title.title.post-title {min-height: auto !important;line-height: 1;padding-bottom: 5px;}

h3.wd-post-title.wd-entities-title.title.post-title a {
    font-size: 14px !important;
}

    .about-sec {
    padding-top: 40px !important;
    row-gap: 0px !important;
    padding-bottom: 0px !important;
}

.about-sec img.vc_single_image-img.attachment-full {
    width: 100% !important;
}

.about-sec figure.wpb_wrapper.vc_figure {
    width: 100%;
}

.about-sec .vc_single_image-wrapper {
    width: 100%;
}

.info-box-subtitle.subtitle-color-default.wd-fontsize-xs.subtitle-style-default, .sub-head {
    font-size: 13px !important;
}

.about-sec h2.info-box-title.title.box-title-style-default.wd-fontsize-m {}

p {
    font-size: 13px !important;
}

.sec-topup .wd-info-box h4.info-box-title.title.box-title-style-default.wd-fontsize-m {
    font-size: 15px;
}

.sec-topup {
    padding-bottom: 20px !important;
}

.sec-3 {
    padding-block: 40px !important;
    row-gap: 15px;
    padding-bottom: 0px !important;
    margin-bottom: 30px !important;
}

.sec-3 h2 {
    font-size: 21px !important;
}

#browse-body .sub-head, #our-brands .sub-head, #used-cars .sub-head {
    font-size: 11px !important;
}

.sec-3 p {
    margin-bottom: 10px !important;
}

.sec-3 .wpb_column.vc_column_container.vc_col-sm-6 {padding-bottom: 7px !important;}

#browse-body .vc_col-sm-6 a.btn, #our-brands .vc_col-sm-6 a.btn, #used-cars .vc_col-sm-6 a.btn, #browse-body .info-btn-wrapper a.btn, #used-cars .info-btn-wrapper a.btn {
    font-size: 12px;
}

#browse-body .info-box-title {
    font-size: 16px !important;
}

.sec-4 p {margin-bottom: 5px;}

h2.info-box-title.title.box-title-style-default.wd-fontsize-m, h2 {
    font-size: 21px;
}

.sec-4 .wpb_column.vc_column_container.vc_col-sm-6 {
    padding-bottom: 5px !important;
}

#our-brands .wd-info-box {}

#our-brands .adams-slider > .wpb_column {
    max-width: 100% !important;
    flex: 0 0 55% !important;
}

#our-brands .info-box-title {
    font-size: 15px;
}

#our-brands img.attachment-800x600.size-800x600 {
    width: 90px;
}

#our-brands {
    padding-bottom: 20px !important;
}

#used-cars {margin-bottom: 40px !important;}

#used-cars .adams-slider {
    padding-inline: 15px;
}

.sec-5 > .vc_row.wpb_row.vc_row-fluid {
    margin-inline: 0;
}

.sec-5 .sub-head {
    font-size: 11px !important;
}

.sec-5 h2 {
    font-size: 21px;
}

.sec-5 .vc_row.wpb_row.vc_row-fluid {
    padding-top: 0px !important;
    margin-bottom: 45px !important;
}

.sec-5 .vc_row.wpb_row.vc_row-fluid .wpb_column.vc_column_container.vc_col-sm-12 .wpb_wrapper a.btn.btn-style-default.btn-shape-rectangle.btn-size-default.btn.theme-btn {
    padding-inline: 15px !important;
    width: 100%;
    padding-block: 11px !important;
}

.sec-5 .vc_row.wpb_row.vc_row-fluid .wpb_column.vc_column_container.vc_col-sm-12 .wpb_wrapper .wd-button-wrapper {
    width: 100% !important;
}

.why-sec {
    padding-top: 20px !important;
    row-gap: 0px;
    padding-bottom: 0;
}

.why-sec ul li {
    font-size: 13px;
}

.testi-section .wd-carousel.wd-grid.wd-initialized.wd-horizontal.wd-watch-progress.wd-backface-hidden {}

.wd-testimon-name.title {
    font-size: 14px;
}

.wd-testimon-pos {
    font-size: 12px;
}

.area ul li {
    font-size: 12px;
    height: 30px;
}

.area .wd-info-box {
    margin-bottom: 0px !important;
}

.area ul {
    margin-bottom: 0px !important;
}

.blog-row {
    padding-top: 40px !important;
    padding-bottom: 0px !important;
}

.blog-row .wd-info-box {
    margin-bottom: 0px !important;
}

.blog-row .wd-button-wrapper {
    text-align: left;
}

.blog-row .wd-button-wrapper a.btn.btn-style-default.btn-shape-round.btn-size-default {
    font-size: 11px;
    padding-block: 13px !important;
    min-height: auto !important;
}

h3.wd-post-title.wd-entities-title.title.post-title {min-height: auto !important;}

h3.wd-post-title.wd-entities-title.title.post-title a {
    font-size: 14px !important;
}

.blog-row .wd-post-excerpt.entry-content {
    font-size: 12px;
}

.blog-row .wd-post-cat.wd-style-with-bg.meta-post-categories a {
    font-size: 11px;
}

.wd-post-read-more.wd-style-link.read-more-section a {
    font-size: 12px;
}

.final-cta .wpb_column.vc_column_container.vc_col-sm-6:last-child {
    padding-left: 0px !important;
}

.final-cta .wd-info-box {
    margin-bottom: 10px;
}

.final-cta a.btn.btn-style-default.btn-shape-rectangle.btn-size-default.btn.theme-btn.btn-icon-pos-left {
    width: 100%;
    padding-block: 12px !important;
}

.final-cta .wd-button-wrapper {
    width: 100%;
}

.adams-reveal.is-visible {
    margin-bottom: 10px !important;
}

.whb-mobile-right a.btn.btn-style-default.btn-shape-rectangle.btn-size-default.btn.theme-btn {
    padding-inline: 13px !important;padding-block: 0px !important;
}

.wd-logo img {
    width: 110px !important;
}

.footer-column.footer-column-1.wd-grid-col {
    --wd-col: 12;
}

    img.image.wp-image-192.attachment-full.size-full {
    width: 150px !important;
    max-width: 150px !important;
}

footer.wd-footer.footer-container::before {
    width: 150px;
    height: 70px;
}

.footer-column .am-footer__contact-links a {
    font-size: 12px;
}

.footer-column.footer-column-2.wd-grid-col, .footer-column.footer-column-3.wd-grid-col , .footer-column.footer-column-4.wd-grid-col, .footer-column.footer-column-5.wd-grid-col {
    --wd-col: 6;
}

h5.widget-title {
    font-size: 15px;
}

.footer-column li a {
    font-size: 12px;
}

.footer-column p {
    font-size: 12px !important;
}

.footer-column .am-footer__contact-links a[href*="whatsapp.com"]::before, .footer-column .am-footer__contact-links a[href^="https://wa.me"]::before {
    width: 23px;
    height: 23px;
}

body.page-id-17 h2.ab-hero-title a {
    font-size: 18px;
    line-height: 1.1 !important;
}

body.page-id-17 p.ab-hero-text {
    font-size: 12px !important;
}

body.page-id-17 a.ab-btn, body.page-id-17 button.ab-btn {
    font-size: 12px;
    padding-block: 11px !important;
}

body.page-id-17 h2.ab-heading {
    font-size: 19px;
}

body.page-id-17 h3.ab-card-title a {
    font-size: 16px;
    line-height: 1;
}

body.page-id-17 p.ab-card-excerpt {
    font-size: 12px !important;
}

body.page-id-17 .ab-main {
    padding-bottom: 40px !important;
}

body.single-post h1.sp-hero-title {
    font-size: 19px !important;
    line-height: 1.3;
}

body.single-post a.sp-hero-cat {
    font-size: 9px;
}

body.single-post p.sp-hero-excerpt {
    font-size: 11px !important;
}

body.single-post .sp-byline-text strong {
    font-size: 13px;
}

body.single-post .sp-byline-text > span {
    font-size: 11px !important;
}

body.single-post .sp-content h2 {
    font-size: 17px !important;
}

body.single-post .sp-content li {
    font-size: 13px;
}

body.single-post .sp-content h3 {
    font-size: 18px !important;
}

body.single-post .sp-content table th {
    font-size: 12px;
}

body.single-post .sp-content table th, body.single-post .sp-content table td {
    font-size: 12px;
}

.sp-main div {
    font-size: 14px;
}

body.single-post ul.sp-tags a {
    font-size: 12px;
}

body.single-post .sp-next-text strong {
    font-size: 12px;
}

body.single-post .sp-widget-cta-body h3 {
    font-size: 15px;
}

body.single-post a.sp-btn {
    font-size: 12px;
    padding-block: 9px;
}

    body.single-post .sp-next-label {
    font-size: 9px !important;
}
	
	body.single-post .sp-next-ex {
    font-size: 12px;
}

	body.page-id-18 .ct-hero > .vc_row {
    padding-inline: 0px !important;
}

body.page-id-18 p.ct-crumbs strong , body.page-id-18 p.ct-crumbs {
    font-size: 11px;
}

body.page-id-18 p.ct-crumbs a {
    font-size: 12px;
}

body.page-id-18 .ct-hero .ct-eyebrow {
    font-size: 9px !important;
}

body.page-id-18 .contact-us > .vc_row {
    padding-inline: 0px !important;
}

body.page-id-18 .contact-us {
    padding-block: 40px 50px !important;
    padding-inline: 0px !important;
}

body.page-id-18 .ct-eyebrow, body.page-id-18 .contact-us .info-box-subtitle, body.page-id-18 .area .info-box-subtitle {
}

.contact-us h2.info-box-title.title.box-title-style-default.wd-fontsize-m {
    font-size: 21px !important;
}

body.page-id-18 .ct-faq > .vc_row {
    padding-inline: 0px !important;
}

body.page-id-18 h2.ct-faq-title {
    font-size: 21px;
}

body.page-id-18 a.ct-btn {
    font-size: 12px;
    padding-block: 11px;
}

body.page-id-18 .ct-faq-item summary {
    font-size: 13px;
}

body.page-id-18 .area {
    padding-inline: 0px !important;
    padding-top: 40px !important;
    row-gap: 0px;
    padding-bottom: 10px !important;
}

body.page-id-18 .area h2.info-box-title {
    font-size: 20px !important;
}

.page-id-18 .final-cta {
    margin-bottom: 0px !important;
}

	body.page-id-18 .contact-us .wpb_text_column.wpb_content_element h2 {
    font-size: 20px !important;
}

body.page-id-18 .contact-us button#wpforms-submit-127 {
    font-size: 13px;
}

    .page-id-165 .fyc-banner .vc_col-sm-6:last-child {
    width: 100%;
}

.page-id-165 .fyc-banner .vc_col-sm-6:first-child {
    width: 100%;
}

.page-id-165 h1.fyc-title {
    font-size: 22px;
}

.page-id-165 .fyc-eyebrow {
    font-size: 10px;
}

.page-id-165 ul.fyc-usps {
    flex-wrap: wrap;
}

.page-id-165 .fyc-help-txt strong {
    font-size: 18px;
    line-height: 1;
    padding-bottom: 10px;
}

.page-id-165 .fyc-help-row {
    margin-bottom: 40px !important;
}

.page-id-165 .final-cta {
    margin-bottom: 0px !important;
}

    div#wpforms-159 {
    padding-inline: 15px !important;
    padding-block: 20px;
}

label.wpforms-field-label-inline {
    font-size: 11px !important;
}

div#wpforms-159-field_7-description {
    font-size: 12px !important;
}

body.page-id-165 div.wpforms-container .wpforms-form button.wpforms-page-prev {
    margin-bottom: 10px;
    width: 100%;
}

span.wpforms-page-button-group {
    width: 100%;
}

body.page-id-165 div.wpforms-container .wpforms-form button {
    font-size: 13px !important;
    width: 100%;
    margin-inline: 0px !important;
}

.choices__item.choices__item--selectable {
    font-size: 12px !important;
}

#wpforms-159-field_72-container label.wpforms-field-label {
    font-size: 13px !important;
}

#wpforms-159-field_71-container legend.wpforms-field-label {
    font-size: 13px !important;
}

textarea#wpforms-159-field_72 {
    font-size: 12px !important;
}
}

.area ul li:hover {
    background: #44cf6c;
    color: #fff;
    transition: 0.5s;
}


.contact-us p a:hover {
    color: #44cf6c !important;
}


span.nav-link-text {
    position: relative;
}

span.nav-link-text::after {
    content: '';
    background: #44cf6c;
    width: 10%;
    height: 2px;
    bottom: -3px;
    position: absolute;
    left: 0;
    opacity: 0 !important;
    transition: 0.4s;
}

span.nav-link-text:hover::after {
     opacity: 1 !important;
     width: 100% !important;
}