/* ==========================================================================
   HAUSVERWALTUNG SCHOLZ – MODERNIZED STYLESHEET
   ========================================================================== */

:root {
  --hv-dark: #0f172a;       /* Edles Slate-Navy */
  --hv-brand: #2563eb;      /* Modernes Royal-Blau */
  --hv-brand-hover: #1d4ed8;
  --hv-black: #020617;
  --hv-gray-bg: #e2e8f0;    /* <-- KRAFTVOLLERES BLAU-GRAU (vorher #f8fafc) */
  --hv-border: #cbd5e1;
  --hv-danger-bg: #fef2f2;
  --hv-danger-text: #dc2626;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  padding: 0;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  color: var(--hv-black);
  background-color: var(--hv-gray-bg);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}

/* Header & Banner */
.top-info-bar {
  background-color: var(--hv-dark);
  color: #38bdf8;
  font-size: 0.75rem;
  letter-spacing: 0.1em;
}

.main-header {
  border-bottom: 1px solid var(--hv-border);
}

.brand-title {
  font-size: 1.4rem;
  font-weight: 900;
  letter-spacing: -0.02em;
  color: var(--hv-dark);
}

.brand-subtitle {
  font-size: 0.8rem;
}

/* Farben & Utilities */
.bg-hv-dark { background-color: var(--hv-dark) !important; }
.bg-hv-gray { background-color: var(--hv-gray-bg) !important; }
.text-hv-dark { color: var(--hv-dark) !important; }
.text-hv-brand { color: var(--hv-brand) !important; }
.fw-black { font-weight: 900 !important; }
.fs-8 { font-size: 0.75rem !important; }
.tracking-wider { letter-spacing: 0.08em !important; }

/* Typografie Main */
.hero-title {
  font-size: clamp(2.5rem, 5vw, 4.5rem);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--hv-dark);
}

.hero-text {
  font-size: 1.15rem;
  line-height: 1.6;
  max-width: 620px;
}

/* Badges / Tags */
.tag-label {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  padding: 0.4em 0.8em;
  border-radius: 6px;
}

.tag-blue {
  background-color: var(--hv-dark);
  color: #ffffff;
}

.tag-outline {
  border: 1.5px solid var(--hv-dark);
  color: var(--hv-dark);
}

/* Sprechzeiten-Box */
.hours-box {
  background: #ffffff;
  border-left: 4px solid var(--hv-brand) !important;
}

.hours-grid {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

/* Kontakt-Karte */
.contact-card {
  border: 1px solid rgba(226, 232, 240, 0.8);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.contact-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.05), 0 8px 10px -6px rgba(0, 0, 0, 0.01) !important;
}

.contact-row {
  transition: background-color 0.2s ease;
}

.contact-row:hover {
  background-color: #f1f5f9 !important;
}

.havarie-row {
  background-color: var(--hv-danger-bg) !important;
  border: 1px solid #fecaca;
}

a.contact-link {
  text-decoration: none;
  transition: color 0.2s ease;
}

a.contact-link:hover {
  color: var(--hv-brand-hover) !important;
  text-decoration: underline;
}

/* Service Cards */
.service-card {
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.service-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.08) !important;
}

.havarie-card {
  background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
  border: 1px solid #334155 !important;
}

.bg-white-10 {
  background-color: rgba(255, 255, 255, 0.1);
}

.border-white-20 {
  border: 1px solid rgba(255, 255, 255, 0.2);
}

/* Mobile Optimierung */
@media (max-width: 768px) {
  .hero-title {
    font-size: 2.5rem;
  }
  
  .contact-row {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 0.2rem;
  }
}