/* ═══════════════════════════════════════════════════════════
   HOME ENHANCE — animatii, hover, colturi rotunde, micro-interactiuni
   Fisier aditiv: nu modifica style.css. Reversibil prin scoaterea include-ului.
   ═══════════════════════════════════════════════════════════ */

/* ── Tranzitii fine globale pe elementele interactive home ── */
.car, .button, .styled_buttons__button a, .blog_post,
.content_page--darken, .map_element, .more_button .button {
    transition: transform .4s cubic-bezier(.2,.8,.2,1),
                box-shadow .4s cubic-bezier(.2,.8,.2,1),
                background .35s ease, color .35s ease;
    will-change: transform;
}

/* ── CARDURI MASINI ── */
.car {
    border-radius: 18px;
    overflow: hidden;
    position: relative;
}
.car__image__holder {
    border-radius: 18px 18px 0 0;
    overflow: hidden;
}
.car__image {
    transition: transform .6s cubic-bezier(.2,.8,.2,1);
}
.car:hover {
    transform: translateY(-10px);
    box-shadow: 0 22px 45px -18px rgba(0,0,0,.45);
}
.car:hover .car__image {
    transform: scale(1.08);
}
.car__content {
    border-radius: 0 0 18px 18px;
}

/* ── BUTOANE PRINCIPALE (oferta completa) ── */
.button, .more_button .button {
    border-radius: 50px;
    position: relative;
    overflow: hidden;
    z-index: 1;
}
.button::after, .more_button .button::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,.18);
    transform: translateX(-100%) skewX(-18deg);
    transition: transform .6s ease;
    z-index: -1;
}
.button:hover::after, .more_button .button:hover::after {
    transform: translateX(100%) skewX(-18deg);
}
.button:hover, .more_button .button:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px -10px rgba(0,0,0,.4);
}

/* ── CTA BUTOANE (bannere la comanda / showroom) ── */
.styled_buttons__button a {
    border-radius: 50px;
    position: relative;
    overflow: hidden;
    display: inline-block;
}
.styled_buttons__button a::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,.2);
    transform: translateX(-100%) skewX(-18deg);
    transition: transform .6s ease;
}
.styled_buttons__button a:hover::after {
    transform: translateX(100%) skewX(-18deg);
}
.styled_buttons__button a:hover {
    transform: translateY(-3px) scale(1.02);
    box-shadow: 0 14px 30px -10px rgba(0,0,0,.45);
}

/* ── BANNERE (la comanda, showroom) ── */
.content_page--darken {
    border-radius: 24px;
    overflow: hidden;
    background-size: cover;
    transition: transform .7s cubic-bezier(.2,.8,.2,1), box-shadow .5s ease;
}
.content_page--darken:hover {
    transform: scale(1.012);
    box-shadow: 0 30px 60px -25px rgba(0,0,0,.5);
}

/* ── BLOG / NOUTATI ── */
.blog_post {
    border-radius: 18px;
    overflow: hidden;
}
.blog_post:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px -18px rgba(0,0,0,.4);
}

/* ── HARTA ── */
.map_element {
    border-radius: 24px;
    overflow: hidden;
    display: block;
}
.map_element:hover {
    transform: scale(1.01);
    box-shadow: 0 24px 50px -22px rgba(0,0,0,.45);
}

/* ── Imbunatatire animatii WOW: pornesc usor mai jos pentru efect mai placut ── */
.wow {
    animation-duration: .9s;
}

/* ── Respecta preferinta utilizatorilor care vor mai putina miscare ── */
@media (prefers-reduced-motion: reduce) {
    .car, .button, .styled_buttons__button a, .blog_post,
    .content_page--darken, .map_element, .car__image {
        transition: none !important;
        animation: none !important;
        transform: none !important;
    }
}
