/*
 * Dacar Web / HOME / 02b Marketing visual
 * Sección puente entre Bonitas y Billing.
 */

.dacar-marketing-visual {
    background: #0B0F19 !important;
    border-bottom: 0 !important;
    overflow: hidden;
    padding: clamp(34px, 4.4vw, 64px) 24px clamp(52px, 5.6vw, 78px) !important;
    position: relative;
}

.dacar-marketing-visual::before {
    background:
        linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px),
        radial-gradient(circle at 10% 18%, rgba(0, 91, 255, .34), transparent 34%),
        linear-gradient(90deg, #0d3475 0%, #0B1632 42%, #0B0F19 100%) !important;
    background-size: 44px 44px, 44px 44px, 100% 100%, 100% 100% !important;
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
}

.dacar-marketing-visual > * {
    position: relative;
    z-index: 1;
}

.dacar-marketing-visual-copy h2 {
    color: #FFFFFF !important;
    font-size: clamp(32px, 4.2vw, 54px) !important;
    font-weight: 430 !important;
    letter-spacing: -0.01em !important;
    line-height: 1.08 !important;
    margin: 0 !important;
    max-width: none !important;
    text-align: center !important;
    width: 100% !important;
}

.dacar-marketing-visual-copy p {
    color: #D8E4F5 !important;
    font-size: clamp(17px, 1.35vw, 20px) !important;
    font-weight: 400 !important;
    line-height: 1.76 !important;
    margin: 24px 0 0 !important;
    max-width: none !important;
}

.dacar-home-v2 > .dacar-marketing-visual + .dacar-fb-billing {
    border-top: 0 !important;
    margin-top: 0 !important;
    padding-top: 72px !important;
    position: relative !important;
}

.dacar-marketing-visual-grid {
    display: block !important;
}

.dacar-marketing-visual-copy,
.dacar-marketing-visual-copy h2,
.dacar-marketing-visual-copy p {
    max-width: none !important;
}

.dacar-marketing-visual-copy h2 {
    width: 100% !important;
}

.dacar-marketing-visual-title-hidden {
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    height: 1px !important;
    overflow: hidden !important;
    position: absolute !important;
    white-space: nowrap !important;
    width: 1px !important;
}

.dacar-marketing-visual-copy p strong {
    color: #FFFFFF !important;
    font-weight: 760 !important;
}

.dacar-marketing-slider {
    display: none !important;
}

.dacar-marketing-carousel {
    --dacar-carousel-gap: clamp(10px, 1.1vw, 14px);
    --dacar-visible-slides: 4;
    border: 2px solid #005BFF;
    border-radius: 6px;
    box-shadow: 0 26px 72px rgba(0, 91, 255, .18);
    margin-top: clamp(34px, 4.2vw, 58px);
    padding: clamp(8px, 1vw, 12px);
    position: relative;
    width: 100%;
}

.dacar-marketing-carousel__viewport {
    overflow: hidden;
    width: 100%;
}

.dacar-marketing-carousel__track {
    display: flex;
    gap: var(--dacar-carousel-gap);
    transform: translate3d(0, 0, 0);
    transition: transform 1.05s cubic-bezier(.22, .8, .24, 1);
    will-change: transform;
}

.dacar-marketing-carousel__slide {
    aspect-ratio: 210 / 297;
    background: rgba(255, 255, 255, .06);
    border-radius: 4px;
    box-shadow: 0 26px 60px rgba(0, 0, 0, .28);
    flex: 0 0 calc((100% - (var(--dacar-carousel-gap) * (var(--dacar-visible-slides) - 1))) / var(--dacar-visible-slides));
    min-width: 0;
    overflow: hidden;
    position: relative;
}

.dacar-marketing-carousel__slide::after {
    border: 5px solid rgba(255, 255, 255, .68);
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
}

.dacar-marketing-carousel__slide img {
    display: block;
    height: 100%;
    object-fit: cover;
    object-position: center;
    width: 100%;
}

.dacar-marketing-carousel__controls {
    display: flex;
    gap: 10px;
    justify-content: center;
    margin-top: clamp(12px, 1.4vw, 18px);
}

.dacar-marketing-carousel__button {
    align-items: center;
    appearance: none;
    background: #0B0F19;
    border: 1px solid #005BFF;
    border-radius: 999px;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-flex;
    font-size: 26px;
    font-weight: 420;
    height: 42px;
    justify-content: center;
    line-height: 1;
    padding: 0;
    transition: background-color .22s ease, color .22s ease, transform .22s ease;
    width: 42px;
}

.dacar-marketing-carousel__button:hover,
.dacar-marketing-carousel__button:focus-visible {
    background: #005BFF;
    color: #020817;
    outline: none;
    transform: translateY(-1px);
}

.dacar-marketing-visual-claim {
    color: #FFFFFF !important;
    font-size: clamp(22px, 2.2vw, 34px) !important;
    font-weight: 430 !important;
    letter-spacing: .005em !important;
    line-height: 1.28 !important;
    margin: clamp(22px, 2.6vw, 36px) auto 0 !important;
    max-width: 1050px !important;
    text-align: center !important;
    text-wrap: balance;
}

.dacar-marketing-visual-note {
    color: #D8E4F5 !important;
    font-size: clamp(16px, 1.18vw, 19px) !important;
    font-weight: 430 !important;
    letter-spacing: .002em !important;
    line-height: 1.7 !important;
    margin: clamp(14px, 1.8vw, 24px) auto 0 !important;
    max-width: 1080px !important;
    text-align: center !important;
    text-wrap: balance;
}

@media (prefers-reduced-motion: reduce) {
    .dacar-marketing-carousel__track {
        transition: none;
    }
}
