/* ===== VEHICLE CARD – LARGE & CLEAN ===== */

/* ===== VEHICLE CARD FULL IMAGE ===== */

.vehicle-card{
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    background: #000;
}

/* immagine che RIEMPIE tutta la card */
.vehicle-img{
    width: 100%;
    height: 100%;
    min-height: 360px;      /* rende la card più grande */
    object-fit: cover;     /* riempie SENZA spazi */
    display: block;
}

/* overlay titolo sopra l'immagine */
.vehicle-title-overlay{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;

    padding: 14px 16px;
    font-size: 1.15rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: center;

    color: #fff;

    /* gradiente elegante per leggibilità */
    background: linear-gradient(
        to top,
        rgba(0,0,0,0.75),
        rgba(0,0,0,0.0)
    );
}

.vehicle-card{
    transition: transform .35s ease, box-shadow .35s ease;
}

.vehicle-card:hover{
    transform: translateY(-6px);
    box-shadow: 0 20px 40px rgba(0,0,0,.35);
}
/* =========================================
   Rent page – micro subtitle
   ========================================= */
.df-rent__subtitle{
  font-size: 0.6rem;          /* MOLTO piccolo */
  letter-spacing: 0.22em;
  text-transform: uppercase;
  opacity: 0.75;
  margin-top: 0.35rem;
}
@media (max-width: 576px){
  .df-rent__subtitle{
    font-size: 0.5rem;
    letter-spacing: 0.28em;
  }
}
/* =========================================
   RENT – Vehicle cards shadow
   ========================================= */

.vehicle-card{
  background-color: #000026; /* navy coerente */
  border-radius: 18px;
  overflow: hidden;

  /* ombra vera (sovrascrive shadow-sm) */
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.6) !important;

  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}
.vehicle-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 28px 60px rgba(0, 0, 0, 0.75) !important;
}