/* ===================================================================
   Engelhardt Kälte Klima – modernes Design (2026)
   Ergänzt Tailwind CDN um Marken-Farben und Hero-Overlay
   =================================================================== */

:root {
  --eng-primary:        #1e40af;
  --eng-primary-dark:   #1e3a8a;
  --eng-primary-light:  #3b82f6;
  --eng-accent:         #60a5fa;
  --eng-bg:             #ffffff;
  --eng-bg-alt:         #f8fafc;
  --eng-text:           #0f172a;
  --eng-text-muted:     #64748b;
  --eng-border:         #e2e8f0;
  --eng-shadow:         0 10px 30px -10px rgba(15, 23, 42, .15);
}

html { scroll-behavior: smooth; }

body {
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  color: var(--eng-text);
  background: var(--eng-bg);
  -webkit-font-smoothing: antialiased;
}

/* --- Hero (alte Klasse, beibehalten) --- */
.hero {
  position: relative;
  min-height: 70vh;
  background-image:
    linear-gradient(135deg, rgba(15,23,42,.78) 0%, rgba(30,64,175,.55) 50%, rgba(59,130,246,.30) 100%),
    url('../images/hero-beratung.jpg');
  background-size: cover;
  background-position: center;
}
.hero--fallback { background-image: linear-gradient(135deg, #0f172a 0%, #1e40af 50%, #3b82f6 100%); }

/* ===================================================================
   Hero-Hintergrundbilder pro Bereich
   ----------------------------------------------------------------
   Aktuell: Picsum-Platzhalter. Sobald eigene Fotos vorliegen, einfach
   die URL gegen den lokalen Pfad ersetzen, z.B.
       url('../images/hero-klimatechnik.jpg')
   Empfohlene Größe: 1920×800 px, JPEG, ca. 200–400 KB
   =================================================================== */

.gradient-hero,
.bg-gradient-to-br {
  position: relative;
  background-size: cover;
  background-position: center;
}

/* Standard-Hero (wenn keine spezifische .hero-bg-* Klasse gesetzt) */
.gradient-hero {
  background-image:
    linear-gradient(135deg, rgba(15,23,42,.85) 0%, rgba(30,64,175,.70) 50%, rgba(59,130,246,.55) 100%),
    url('https://picsum.photos/seed/eng-default/1920/800');
}

/* Spezifische Hintergrundbilder */
.hero-bg-home {
  background-image:
    linear-gradient(135deg, rgba(15,23,42,.80) 0%, rgba(30,64,175,.65) 50%, rgba(59,130,246,.45) 100%),
    url('https://picsum.photos/seed/eng-home/1920/800') !important;
  /* Später: url('../images/hero-home.jpg') */
}
.hero-bg-klimatechnik {
  background-image:
    linear-gradient(135deg, rgba(15,23,42,.80) 0%, rgba(30,64,175,.65) 50%, rgba(59,130,246,.45) 100%),
    url('https://picsum.photos/seed/eng-klima/1920/800') !important;
  /* Später: url('../images/hero-klimatechnik.jpg') */
}
.hero-bg-waermepumpen {
  background-image:
    linear-gradient(135deg, rgba(15,23,42,.80) 0%, rgba(30,64,175,.65) 50%, rgba(59,130,246,.45) 100%),
    url('https://picsum.photos/seed/eng-wp/1920/800') !important;
  /* Später: url('../images/hero-waermepumpen.jpg') */
}
.hero-bg-kaeltetechnik {
  background-image:
    linear-gradient(135deg, rgba(15,23,42,.80) 0%, rgba(30,64,175,.65) 50%, rgba(59,130,246,.45) 100%),
    url('https://picsum.photos/seed/eng-kaelte/1920/800') !important;
  /* Später: url('../images/hero-kaeltetechnik.jpg') */
}
.hero-bg-service {
  background-image:
    linear-gradient(135deg, rgba(15,23,42,.80) 0%, rgba(30,64,175,.65) 50%, rgba(59,130,246,.45) 100%),
    url('https://picsum.photos/seed/eng-service/1920/800') !important;
  /* Später: url('../images/hero-service.jpg') */
}
.hero-bg-enthaertung {
  background-image:
    linear-gradient(135deg, rgba(15,23,42,.80) 0%, rgba(30,64,175,.65) 50%, rgba(59,130,246,.45) 100%),
    url('https://picsum.photos/seed/eng-water/1920/800') !important;
  /* Später: url('../images/hero-enthaertung.jpg') */
}
.hero-bg-entwicklung {
  background-image:
    linear-gradient(135deg, rgba(15,23,42,.80) 0%, rgba(30,64,175,.65) 50%, rgba(59,130,246,.45) 100%),
    url('https://picsum.photos/seed/eng-cnc/1920/800') !important;
  /* Später: url('../images/hero-entwicklung.jpg') */
}
.hero-bg-anfrage {
  background-image:
    linear-gradient(135deg, rgba(15,23,42,.80) 0%, rgba(30,64,175,.65) 50%, rgba(59,130,246,.45) 100%),
    url('https://picsum.photos/seed/eng-contact/1920/800') !important;
  /* Später: url('../images/hero-anfrage.jpg') */
}
.hero-bg-region {
  background-image:
    linear-gradient(135deg, rgba(15,23,42,.80) 0%, rgba(30,64,175,.65) 50%, rgba(59,130,246,.45) 100%),
    url('https://picsum.photos/seed/eng-region/1920/800') !important;
  /* Später: url('../images/hero-region.jpg') */
}
.hero-bg-downloads {
  background-image:
    linear-gradient(135deg, rgba(15,23,42,.80) 0%, rgba(30,64,175,.65) 50%, rgba(59,130,246,.45) 100%),
    url('https://picsum.photos/seed/eng-downloads/1920/800') !important;
  /* Später: url('../images/hero-downloads.jpg') */
}

/* --- Header (sticky) --- */
.eng-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255, 255, 255, .92);
  backdrop-filter: saturate(160%) blur(8px);
  -webkit-backdrop-filter: saturate(160%) blur(8px);
  border-bottom: 1px solid var(--eng-border);
}

/* --- Cards --- */
.eng-card {
  background: #fff;
  border: 1px solid var(--eng-border);
  border-radius: 1rem;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.eng-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--eng-shadow);
  border-color: var(--eng-primary-light);
}

/* --- Buttons (Tailwind-kompatibel, nur Marken-Tints) --- */
.eng-btn-primary {
  background: var(--eng-primary);
  color: #fff;
  transition: background .2s ease;
}
.eng-btn-primary:hover { background: var(--eng-primary-dark); }

.eng-btn-ghost {
  background: rgba(255,255,255,.08);
  color: #fff;
  border: 1px solid rgba(255,255,255,.5);
  backdrop-filter: blur(4px);
}
.eng-btn-ghost:hover { background: rgba(255,255,255,.18); }

/* --- Section divider --- */
.eng-divider {
  background: linear-gradient(90deg, transparent 0%, var(--eng-border) 50%, transparent 100%);
  height: 1px;
}

/* --- Mobile menu --- */
.mobile-menu { display: none; }
.mobile-menu.is-open { display: block; }
@media (min-width: 1024px) {
  .mobile-menu { display: none !important; }
}

/* --- Legacy PHP-Seiten Hilfsklassen --- */
.gradient-hero {
  background: linear-gradient(135deg, #1e40af 0%, #2563eb 50%, #3b82f6 100%);
}
.gradient-card {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}
.card-hover {
  transition: transform .3s ease, box-shadow .3s ease;
}
.card-hover:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 25px -5px rgba(0,0,0,.12), 0 10px 10px -5px rgba(0,0,0,.05);
}
.ort-link {
  transition: background-color .2s ease, color .2s ease;
}
.ort-link:hover {
  background-color: #2563eb;
  color: #fff;
}
.text-shadow { text-shadow: 0 2px 4px rgba(0,0,0,.12); }
.link-hover   { transition: color .2s ease; }
.link-hover:hover { color: #2563eb; }

/* --- Print --- */
@media print {
  .eng-header, .eng-footer, .no-print { display: none; }
}