@font-face {
    font-family: DWACorpid;
    font-display: swap;
    font-style: normal;
    font-weight: 400;
    src:  local("DWA Corpid"), url("../fonts/DWACorpid-Regular-UM3XPVIE.woff") format("woff")
}

@font-face {
    font-family: DWACorpid;
    font-display: swap;
    font-style: normal;
    font-weight: 700;
    src: url("../fonts/DWACorpid-Bold-D4H4X5TZ.woff") format("woff")
}

@font-face {
    font-family: DWACorpid;
    font-display: swap;
    font-style: normal;
    font-weight: 300;
    src: url("../fonts/DWACorpid-Light-BDJWACQ7.woff") format("woff")
}
:root,
[data-bs-theme=light] {
    --bs-primary: #F75900;
    --bs-dwa-radius: 56px;
    --bs-dwa-radius-int: 26px;
    --bs-font-sans-serif: DWACorpid, Arial, sans-serif;
    --bs-dwa-dark: #212529;
    --bs-primary-rgb: 247, 89, 0;

}

[data-bs-theme=dark] {
}


.navbar{
    --bs-navbar-padding-y: 1.5rem;
}
.logo-dwa {
    height: 42px;
    object-fit: contain;
}
.logo-menu{
    width: 20%;
    object-fit: contain;
}

main {
    background: linear-gradient(to bottom, #e7e8e8, transparent 5%);
}
.container__content{
    width: 100%;
    max-width: 1200px;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    margin: 0 auto;
}
.hero_info{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.hero_info__title {
    color: #000;
    font-size: 40px;
    line-height: 48px;
    font-family: DWACorpid, 'Inter', Arial, sans-serif;
    margin: 0;
    padding: 0;
    text-align: left;
    max-width: 60%;
    font-weight: 700;
}
.hero_info__image {
    max-width: 40%;
    object-fit: contain;
}
.container__main-image{
    width: 100%;
    object-fit: contain;
}
.container__info--mobile {
    display: none;
}

.container__info--mobile h1 {
    font-size: 30px;
    margin: auto;
    text-align: center;
    font-family: DWACorpid, 'Inter', Arial, sans-serif;
    line-height: 1.1;
    font-weight: 700;
}

.offer-section {
    width: 100%;
    background-color: #f65900;
    padding: 30px 24px;
}

.offer-section__content{
    max-width: 1024px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.offer-section__title{
    color: #fff;
    font-size: 35px;
    font-weight: 700;
    text-align: center;
    margin: 0;
}

.offer-filters {
   padding-top: 2rem;
   padding-bottom: .5rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.offer-filters__title {
    font-size: 28px;
    font-weight: 700;
}

.listing_card{
    --bs-card-border-radius:1rem;
    --bs-border-radius:1rem;
    --bs-card-title-color: var(--bs-dwa-dark);
    --bs-card-border-color: rgba(0, 0, 0, 0.1);
    height: 100%;
    &:hover{
        box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .04);
    }
    .card-img-top{
        min-height: 186px;
        max-height: 186px;
        object-fit: cover;
    }
    .card-img-link{
        background:  url("../img/loading.gif") no-repeat center center;
    }

    .card-title{
        font-weight: 700;
        a{
            color: var(--bs-dwa-dark);
            text-decoration: none;
            &:hover{
                text-decoration: underline;
            }
        }
    }
}

.card-price{
    background: #ffffff;
    border-width: 2px 0;
    border-style: solid;
    border-color: #F75900;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.card-price__price{
    color: var(--bs-dwa-dark);
    font-size: 24px;
    font-weight: 400;
    padding-inline: 1rem;
    text-align: center;
    display: flex;
    place-items: center;
    position: relative;
    text-decoration-line: line-through;
    text-decoration-thickness: 0.25rem;
}

.card-price__sale{
    background: #F75900;
    border-radius: 36px 0 0 36px;
    color:white;
    font-size: 27px;
    font-weight: 700;
    padding-inline: 1rem;
    text-align: center;
    /*display: flex;*/
    place-items: center;
}
.card-price__save{
    color: var(--bs-dwa-dark);
    font-size: 26px;
    font-weight: 700;
    padding-inline: 1rem;
    text-align: center;
    display: flex;
    place-items: center;
}
.card-sub-title{
    color: #666;
    padding-bottom: .5rem;
    border-bottom: 1px solid var(--bs-card-border-color);
    display: flex;

    gap: .5rem;
    font-size: .875rem;
    flex-wrap: wrap;
}

.card_icon {
    display: inline-flex;
    align-items: center;
    padding-left: 22px;
    position: relative;
}

.card_icon::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 18px;
    height: 18px;
    transform: translateY(-50%);
    background: no-repeat center/contain;
}

.icon-year::before {
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_293_167)'%3E%3Cpath d='M13.3333 2.5C13.7607 2.5 14.1129 2.8217 14.1611 3.23615L14.1667 3.33333V4.16667H15.8333C16.712 4.16667 17.4318 4.84656 17.4954 5.70895L17.5 5.83333V15.8333C17.5 16.712 16.8201 17.4318 15.9577 17.4954L15.8333 17.5H4.16667C3.28803 17.5 2.5682 16.8201 2.50457 15.9577L2.5 15.8333V5.83333C2.5 4.9547 3.1799 4.23486 4.04228 4.17124L4.16667 4.16667H5.83333V3.33333C5.83333 2.8731 6.20643 2.5 6.66667 2.5C7.09403 2.5 7.44626 2.8217 7.49439 3.23615L7.5 3.33333V4.16667H12.5V3.33333C12.5 2.8731 12.8731 2.5 13.3333 2.5ZM15.8333 10H4.16667V15.8333H15.8333V10ZM15.8333 5.83333H4.16667V8.33333H15.8333V5.83333Z' fill='%23535862'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_293_167'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}

.icon-fuel::before {
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_293_183)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.16675 2.5C3.24627 2.5 2.50008 3.24619 2.50008 4.16667V15.8333C2.03985 15.8333 1.66675 16.2064 1.66675 16.6667C1.66675 17.1269 2.03985 17.5 2.50008 17.5H12.5001C12.9603 17.5 13.3334 17.1269 13.3334 16.6667C13.3334 16.2064 12.9603 15.8333 12.5001 15.8333V11.6667H13.3334V13.75C13.3334 14.9006 14.2662 15.8333 15.4167 15.8333C16.5673 15.8333 17.5001 14.9006 17.5001 13.75V8.6785C17.5001 8.23648 17.3245 7.81256 17.0119 7.5L14.756 5.24408C14.4306 4.91864 13.9029 4.91864 13.5775 5.24408C13.2521 5.56952 13.2521 6.09715 13.5775 6.42259L14.495 7.34012C14.4731 7.36966 14.4521 7.39997 14.4322 7.43102C14.2762 7.67317 14.1857 7.95162 14.1694 8.23918C14.1532 8.52675 14.2117 8.81367 14.3393 9.07183C14.4669 9.33 14.6592 9.55075 14.8976 9.7125C15.136 9.87417 15.4122 9.97142 15.6992 9.99458C15.744 9.99817 15.7887 10 15.8334 10V13.75C15.8334 13.9801 15.6468 14.1667 15.4167 14.1667C15.1867 14.1667 15.0001 13.9801 15.0001 13.75V11.6667C15.0001 10.7462 14.2539 10 13.3334 10H12.5001V4.16667C12.5001 3.24619 11.7539 2.5 10.8334 2.5H4.16675ZM10.8334 9.16667V4.16667H4.16675V9.16667H10.8334ZM4.16675 10.8333H10.8334V15.8333H4.16675V10.8333Z' fill='%23535862'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_293_183'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}

.icon-mileage::before {
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_293_175)'%3E%3Cpath d='M6.86873 2.52487C7.31523 2.63649 7.58669 3.08893 7.47507 3.53543L4.14173 16.8687C4.03012 17.3152 3.57767 17.5867 3.13118 17.4751C2.68468 17.3635 2.41321 16.9111 2.52483 16.4646L5.85817 3.13121C5.96979 2.68471 6.42223 2.41324 6.86873 2.52487ZM14.1417 3.13121L17.475 16.4646C17.5867 16.9111 17.3152 17.3635 16.8687 17.4751C16.4222 17.5867 15.9698 17.3152 15.8582 16.8687L12.5249 3.53543C12.4132 3.08893 12.6847 2.63649 13.1312 2.52487C13.5777 2.41324 14.0301 2.68471 14.1417 3.13121ZM9.99996 14.1667C10.4273 14.1667 10.7796 14.4883 10.8277 14.9028L10.8333 15V16.6667C10.8333 17.1269 10.4602 17.5 9.99996 17.5C9.57258 17.5 9.22037 17.1783 9.17223 16.7638L9.16663 16.6667V15C9.16663 14.5397 9.53971 14.1667 9.99996 14.1667ZM9.99996 8.33332C10.4602 8.33332 10.8333 8.70641 10.8333 9.16665V10.8333C10.8333 11.2936 10.4602 11.6666 9.99996 11.6666C9.53971 11.6666 9.16663 11.2936 9.16663 10.8333V9.16665C9.16663 8.70641 9.53971 8.33332 9.99996 8.33332ZM9.99996 2.49998C10.4273 2.49998 10.7796 2.82169 10.8277 3.23613L10.8333 3.33332V4.99998C10.8333 5.46022 10.4602 5.83332 9.99996 5.83332C9.57258 5.83332 9.22037 5.51162 9.17223 5.09717L9.16663 4.99998V3.33332C9.16663 2.87308 9.53971 2.49998 9.99996 2.49998Z' fill='%23535862'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_293_175'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}



.btn-outline-primary {
    --bs-btn-color: #F75900;
    --bs-btn-border-color: #F75900;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #F75900;
    --bs-btn-hover-border-color: #F75900;
    --bs-btn-focus-shadow-rgb: 13, 110, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #F75900;
    --bs-btn-active-border-color: #F75900;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #F75900;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #F75900;
    --bs-gradient: none;
    --bs-btn-border-width:2px
}

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #F75900;
    --bs-btn-border-color: #F75900;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #c94c03;
    --bs-btn-hover-border-color: #c94c03;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #c94c03;
    --bs-btn-active-border-color: #c94c03;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #F75900;
    --bs-btn-disabled-border-color: #F75900;
}
.btn-form-action {
    --bs-btn-padding-y: .675rem;
    --bs-btn-padding-x: 1rem;
    --bs-btn-font-size: 1.25rem;
    --bs-btn-border-radius: var(--bs-dwa-radius);
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: .5rem;
}

.btn-success {
    --bs-btn-color: #1c1e21;
    --bs-btn-bg: #25d366;
    --bs-btn-border-color: #25d366;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #1daa66;
    --bs-btn-hover-border-color: #146c43;
    --bs-btn-focus-shadow-rgb: 60, 153, 110;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #1daa66;
    --bs-btn-active-border-color: #1daa66;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #25d366;
    --bs-btn-disabled-border-color: #25d366;
    --bs-btn-border-radius: var(--bs-dwa-radius);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    svg{
        width: 1.36rem;
    }
}

/* Form */

.h-5 {
    height: 1.25rem;
}
.w-5 {
    width: 1.25rem;
}

.form-control, .form-check-input, .form-select{
    --bs-border-color: #cecece;
    --bs-focus-ring-opacity:1
}
.form-control:focus, .form-select:focus {
    color: #212529;
    background-color: #fff;
    border-color: #f06409;
    outline: 0;
    box-shadow: 0 0 0 .25rem rgb(240 100 9 / 25%);
    box-shadow: none;
}
.form-check-input:checked {
    background-color: #F75900;
    border-color: #f06409;
}
.form-check-input:focus {
    border-color: #f06409;
    outline: 0;
    box-shadow: 0 0 0 .25rem rgb(240 100 9 / 25%);
}

.form-check label, .legal_text_label {
    font-size: 12px;
    line-height: 16px;
    color: rgba(17, 17, 17, .8);
    font-weight: 300;
}
.offer-empty{
    padding-top: 2rem;
    min-height: 30dvh;
    p{
        font-size: .875rem;
        font-weight: 300;
    }
}

.offer-form{
    padding: 20px;
    border: 1px solid #dadada;
    border-radius: 12px;
    box-shadow: rgb(235, 236, 237) 0 2px 4px 0;
}
.offer-form{
    .card-price{
        background: #ffffff;
        border-width: 2px;
        border-radius: var(--bs-dwa-radius);
        overflow: hidden;
    }

    .card-price__price{
        color: var(--bs-dwa-dark);
        font-size: 28px;
        font-weight: 700;
    }

    .card-price__sale{
        border-radius: var(--bs-dwa-radius) 0 0 var(--bs-dwa-radius);
        padding-block: .5rem;

    }
}
.offer-form__title{
font-size: 1.45rem;
    font-weight: 700;
    text-align: center;
}
.offer-form__sub{
    font-size: .875rem;
}
.lead-form{
    display: grid;
    gap: 1rem;
}
.left-side{
    display: grid;
    gap: 1rem;
}
.right-side{
    display: grid;
    gap: 1.3rem;
    place-content: flex-start;
}

.offer-header{
    display: flex;
    justify-content: space-between;
    place-items: center;
    gap: 1rem;
}
.offer-header .card-price {
    display: flex;
}

.offer-header__title{
    flex:1;
    font-weight: 700;
    color: var(--bs-dwa-dark);
    margin-bottom: 0;
    @media (min-width: 1200px) {
            font-size: 2rem;
    }
}

.offer-overview{
    background: #f4f5f5;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    row-gap: 1rem;
    column-gap: 0.5rem;
    padding: 1.3rem;
}

.cmp-pdp__specification {
    display: grid;
    gap: 0.25rem;
}
.cmp-pdp__specification h3 {
    font-size: .75rem;
    text-transform: uppercase;
    font-weight: 300;
    margin: 0;
}

.cmp-pdp__specification p {
    font-size: 1rem;
    color: var(--bs-dwa-dark);
    margin-bottom: 0;
    font-weight: 700;
}

.list-style-2 {
    column-count: 2;
    column-gap: 40px;
    list-style-type: none;
}
.list-style-2 li, .list-style-3 li {
    line-height: 1.9;
    font-size: .875rem;
}

.offer-details__title{
    font-weight: 700;
    font-size: 1.23rem;
    border-bottom: 1px solid var(--bs-border-color);
    padding-bottom: 1rem;
    margin-bottom: 1rem;
}

.offer-price{

    .card-price{
        background: #ffffff;
        border-width: 2px;
        border-radius: var(--bs-dwa-radius);
        overflow: hidden;
    }

    .card-price__save{
        color: var(--bs-dwa-dark);
        font-size: 24px;
        line-height: 1;
        font-weight: 700;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: .5rem;
        flex:1;
        span{
            text-decoration-line: line-through;
            text-decoration-thickness: 0.25rem;
        }
        small{
            text-transform: uppercase;
            font-size: .775rem;
            position: relative;
            top: 2px;
        }
    }

    .card-price__sale{
        border-radius:var(--bs-dwa-radius) 0 0 var(--bs-dwa-radius);
        padding-block: .25rem;
        flex:1

    }
}

.splide__slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.btn {
    --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgb(255 140 65 / 50%)
}
.btn-back{
    --bs-btn-padding-y: .25rem;
    --bs-btn-padding-x: 1rem;
    --bs-btn-font-size: .875rem;
    --bs-btn-border-radius: var(--bs-dwa-radius);
    display: inline-flex;
    width: max-content;
    align-items: center;
    gap: .375rem;
    
}

.mobile_content{
    display: none;
}

.h1, h1 {
    font-size: calc(1.275rem + 1.5vw);
}

span.is-invalid {
    font-size: .875rem;
    line-height: 18px;
    color: hsla(358, 66%, 48%, 1);
    font-weight: 300;
}
.meios{
    padding-block: .5rem;
}
.form-check label.legal_text {
    font-size: .75rem;
}
.form-check label.legal_accept {
    font-size: .875rem;
}

.legal-info{
    background-color: #e7e8e8;
    padding: 40px 24px;
}
.legal-info__container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 40px 0 0;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 1rem;

    p{
        font-weight: 300;
        color: #3f4549;
        font-size: 13px;
        line-height: 1.6;
    }
}

.alert{
    border-radius: 0.55rem;
    font-size: .9rem;
    --bs-alert-padding-x: 1rem;
    --bs-alert-padding-y: .5rem;
    margin: 0;
    margin-top: 1rem;
    font-weight: 300;
}
.alert-success {
    color: #0b3320;
    background-color: #e1f7ed;
    border-color: #badbcc;
}

.alert-danger {
    color: #a1181b;
    background-color: #fff0f0;
    border-color: #fdd8d8;
}

@keyframes pulse {
    50% {
        opacity: .5
    }
}

.loading {
    animation: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
}


@media (max-width: 767.98px) {

    .listing_card {
        .card-img-top {
            max-height: 20rem;
        }
    }

    .navbar {
        --bs-navbar-padding-y: 0rem;
    }
    .container:not(.container_nav){
        padding: 20px 24px;
    }
    .offer-price {
        .card-price__save, .card-price__sale {
            font-size: 21px;
            padding-block: .35rem;
        }
    }
}
@media (max-width: 991.98px) {

    .legal-info__container {
        padding: 0;
    }

    .mobile_content{
        display: block;
    }
    header{
        background-color: #e7e8e8;
    }
    .logo-dwa, .logo-menu{
        width: 40%;
    }

    .hero_info, .container__main-image {
        display: none;
    }
    .container__info--mobile {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 1rem;
        padding-top: 1.5rem;
    }

    .offer-header{
        flex-direction: column;
    }
    .offer-price{
        width: 100%;
    }

    .offer-overview{
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .cmp-pdp__specification h3 {
        font-size: .675rem;
    }
    .right-side{
        margin-top: 1rem;
    }
    .btn-back{
        --bs-btn-border-radius: 0 0 var(--bs-dwa-radius-int) var(--bs-dwa-radius-int) ;
        gap: .375rem;
    }
}


@media (max-width: 575.98px) {

    .listing_card {
        .card-img-top {
            max-height: 15rem;
        }
    }

}


@media (min-width: 1200px) and (max-width: 1399.98px) {

}