/* ==========================================================================
   home.css  ·  Startseiten-spezifische Layouts
   ========================================================================== */

/* Heller Link-Pfeil (auf dunklem Hintergrund) ------------------------------ */
.link-arrow--light { color: var(--color-white); }
.link-arrow--light:hover { color: var(--color-red); }

/* Solid Tag-Pill (grau, weisser Text) – Aktuelles -------------------------- */
.tag--solid {
  background: #4c4c4c;
  color: var(--color-white);
  padding: 4px 10px;
  border-radius: 4px;
  text-transform: none;
  letter-spacing: 0;
  margin-bottom: 0;
}

/* ===================== FAHRZEUGFLOTTE ===================== */
.fleet-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: var(--space-6);
}
.fleet-card {
  background: var(--color-white);
  padding: var(--space-6);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  border-bottom: 4px solid var(--color-red);
}
.fleet-card__media { aspect-ratio: 3 / 2; overflow: hidden; background: var(--color-gray-100); margin: calc(var(--space-6) * -1) calc(var(--space-6) * -1) var(--space-2); }
.fleet-card__media img { width: 100%; height: 100%; object-fit: cover; }
.fleet-card__name { font-family: var(--font-heading); font-weight: 400; font-size: var(--text-large); letter-spacing: var(--tracking-tight); }
.fleet-card__details { color: var(--text-muted); font-size: var(--text-small); }

/* ===================== AKTUELLES (News) ===================== */
.news-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-12);
}
.news-card { display: flex; flex-direction: column; gap: var(--space-6); }
.news-card__media { aspect-ratio: 616 / 346; overflow: hidden; background: var(--color-gray-800, #222); }
.news-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition-slow); }
.news-card:hover .news-card__media img { transform: scale(1.03); }
.news-card__body { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.news-card__title { font-family: var(--font-heading); font-weight: 400; font-size: var(--text-h5); line-height: 1.3; letter-spacing: var(--tracking-tight); }
.news-card__text { color: var(--text-on-dark); }
.news-card__file { display: flex; align-items: center; gap: var(--space-2); font-size: var(--text-body); color: var(--text-on-dark); }
.news-card__file svg { width: 20px; height: 20px; flex-shrink: 0; }

@media (max-width: 768px) { .news-grid { grid-template-columns: 1fr; gap: var(--space-10); } }

/* Services-Grid liegt jetzt global in components.css (partials/services.html) */

/* ===================== ÜBER UNS (Teaser-Split) ===================== */
.split__content { display: flex; flex-direction: column; align-items: flex-start; }
.split__content .lead { margin-top: var(--space-6); }
.split__content .split__actions { margin-top: var(--space-8); align-items: center; }
.split__media { height: 100%; width: 100%; aspect-ratio: auto; }
.split__media img { width: 100%; height: 100%; object-fit: cover; }