.section {
    max-width: 100%;
    padding: clamp(20px, calc(20px + ((100 - 20) * ((100vw - 400px) / (1920 - 400)))), 100px) 10vw;
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1fr 1fr;
    place-items: center;
    justify-content: space-between;
    gap:20px;
}

.section::after{
    content: "";
    background-image: url(/wp-content/uploads/2025/04/LE-DAYA.svg);
    background-size: contain;
    position: absolute;
    top: 50%;
    right: -330px;
    transform: translate(0, -50%);
    rotate: -90deg;
    width: 600px;
    height: 100px;
    background-repeat: no-repeat;
}

.content-section {
    max-width: 637px;
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-right: auto;
    gap: clamp(20px, calc(20px + ((25 - 20) * ((100vw - 400px) / (1920 - 400)))), 25px);
}

.title {
    display: flex;
    flex-direction: column;
    gap: clamp(2px, calc(2px + ((10 - 2) * ((100vw - 400px) / (1920 - 400)))), 10px);
}

.title p {
    color: #9F936A;
}

.custom-list {
    display: flex;
    flex-direction: column;
    gap: clamp(20px, calc(20px + ((25 - 20) * ((100vw - 400px) / (1920 - 400)))), 25px);
}

.custom-list-item {
    display: flex;
    gap: 10px
}

.image {
    max-width: 100%;
    height: auto;
    margin-left: auto;
}

.price {
    display: flex;
    gap: clamp(15px, calc(15px + ((25 - 15) * ((100vw - 400px) / (1920 - 400)))), 25px);
    align-items: center;
}

.promo-price {
color: #3A271A;
font-family: var(--font-gotham);
font-size: clamp(16px, calc(16px + ((20 - 16) * ((100vw - 400px) / (1920 - 400)))), 20px);
font-style: normal;
font-weight: 700;
}

.old-price {
color: #D2C6BE;
font-family: var(--font-gotham);
font-weight: 700;
text-decoration-line: line-through;
}

.extends-button {
    max-width: fit-content !important;
}

@media (max-width: 1500px) {
    .section {
        grid-template-columns: 1fr;
    }
    .content-section {
        order: 2;
        max-width: 100% 
    }
    .price, .extends-button, .offer-validity {
        margin: auto;
    }
    .title {
        text-align: center;
    }
    .image {
    margin: auto;
    }
}

@media (max-width: 800px) {
    .section::after {
        display: none;
    }
}

.italic {
    font-style: italic;
}