/* =========================
   PROMO BANNER
========================= */

.fh-promo-wrapper{

    box-sizing:border-box;
    width:100%;

    margin:20px 0 5px;
}

/* STESSA LARGHEZZA DELLE LEGHE */
.fh-promo-container{

    width:100%;

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:20px;

    padding:0 40px;

    box-sizing:border-box;

}

/* BANNER */
.fh-promo-banner {

    position:relative;

    aspect-ratio:1024 / 409;

    width:100%;

    border-radius:18px;

    overflow:hidden;

    box-sizing:border-box;

    border:2px solid #d6a72b;

    background:#050505;

    box-shadow:
        0 0 10px rgba(214,167,43,0.35),
        inset 0 0 8px rgba(214,167,43,0.25);

}

/* IMMAGINI — riempiono il banner senza stirarsi */
.fh-promo-banner img {

    width:100%;

    height:100%;

    object-fit:cover;

    object-position:center;

    display:block;

    border-radius:16px;

}

/* BOTTONE */
.btn-promo {

    position:absolute;

    bottom:16px;

    right:20px;

left:auto;

transform:none;


    display:flex;

    align-items:center;

    justify-content:center;


    width:180px;

    height:32px;


    background:#f7b500;

    color:#ff2d2d;

    font-size:12px;

    font-weight:900;

    text-transform:uppercase;

    text-decoration:none;

    border-radius:20px;

    transition:opacity .20s ease;

}
.btn-promo:hover{

    opacity:.95;

}

/* RESPONSIVE */
@media(max-width:1200px){

    .fh-promo-container{
        grid-template-columns:1fr;
    }

}

@media(max-width:768px){

    .fh-promo-container{
        padding:0 16px;
        gap:14px;
    }

    .fh-promo-banner{
        display:flex;
        flex-direction:column;
        text-align:center;
        height:auto;
        aspect-ratio:auto;
        padding:16px;
    }

    .fh-promo-banner img{
        margin:0 0 14px;
        height:auto;
        max-height:220px;
        width:100%;
        object-fit:contain;
    }

    .btn-promo{
        position:static;
        width:100%;
        max-width:100%;
        height:44px;
        margin:0;
        left:auto;
        right:auto;
        bottom:auto;
    }

}

@media(max-width:480px){

    .fh-promo-container{
        padding:0 12px;
    }

}