/* === Fahrzeuge Kacheln (Figma-spec) === */

/* Grid: 2 columns desktop, 1 column mobile, gap 24 */
.fzg-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:24px;
}
@media(min-width:768px){
  .fzg-grid{ grid-template-columns:repeat(2,1fr); }
}

/* Card: white, rounded, soft shadow */
.fzg-card{
  position:relative;
  overflow:hidden;
  /*border-radius:20px;*/
  background:#fff;
  /*box-shadow:0 8px 24px rgba(0,0,0,.08);*/
  transition:transform .18s ease;
}
.fzg-card:hover{ transform:translateY(-2px); }
.fzg-link{ position:absolute; inset:0; z-index:5; }

/* Media area with background image + zoom on hover */
.fzg-media{
  position:relative;
  height:320px;
  overflow:hidden;
  isolation:isolate;
  background:#dfe5ec;
}
@media(max-width:767.98px){
  .fzg-media{ height:260px; }
}
.fzg-bg{
  position:absolute; inset:0;
  background:center/cover no-repeat;
  transform:scale(1);
  transition:transform .5s ease;
}
.fzg-card:hover .fzg-bg{ transform:scale(1.06); } /* keep zoom inside card */

/* Blue D shape (Figma numbers) */
.fzg-d{
  position:absolute;
  left:-92px;
  bottom:-134px;
  width:377.192px;
  height:223px;
  z-index:2;
  color:var(--Epple-Mittelblau,#0779CA);
  mix-blend-mode:hard-light;
  pointer-events:none;
}
.fzg-d svg{ width:100%; height:100%; display:block; }

/* Title on image */
.fzg-title-wrap{ position:absolute; left:24px; bottom:22px; z-index:3; }
.fzg-title{ margin:0; color:#fff; font-weight:700; font-size:32px; line-height:1; }
.fzg-sub{ margin-top:6px; color:#e7f3ff; font-size:18px; }

/* Optional pill badge (if used) */
.fzg-badge{
  position:absolute; right:20px; top:18px;
  background:#0A84E6; color:#fff; border-radius:999px;
  padding:10px 16px; font-weight:700;
}

/* Body: filled background like in the mockup */
.fzg-body{
  background:#ECF0F2;                 /* panel fill */
  padding:16px 28px 26px 28px;
}

/* Meta list */
.fzg-meta{ margin:0 0 18px 0; padding:0; list-style:none; }
.fzg-meta li{ display:flex; gap:10px; margin:7px 0; font-size:18px; font-family: Geomanist; color: #1E1E1E; }
.fzg-meta b{ min-width:170px; }

/* Divider before prices */
.fzg-hr{
  height:2px;
  background:#22313f;                  /* dark line */
  opacity:.2;
  margin:18px 0 22px;
}

/* Prices row: 2 columns desktop, 1 column mobile */
.fzg-bottom{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  align-items:end;
}
@media(max-width:767.98px){
  .fzg-bottom{ grid-template-columns:1fr; }
}

/* Price tiles */
.fzg-price b{
  display:block;
  color:#12223B;
  font-size:14px;
  margin-bottom:6px;
}
.fzg-price span{
  font-weight:900;
  font-size:28px;
  color:#0779CA;
}