/* Home / index */
.hero{ padding:26px 0 8px; display:grid; place-items:center }
.hero .logo-tile{
  width: clamp(260px, 36vw, 520px); height: clamp(260px, 36vw, 520px);
  border-radius:22px; border:1px solid var(--border);
  background:#25344C;
  box-shadow:0 24px 60px -24px rgba(0,0,0,.35),
             0 0 0 6px rgba(255,255,255,.03) inset,
             0 40px 120px -40px rgba(255,209,102,.35),
             0 30px 80px -30px rgba(255,107,154,.30);
  display:flex; align-items:center; justify-content:center; padding:14px; overflow:hidden;
}
.hero .logo-tile img{ max-width:100%; max-height:100%; width:auto; height:auto; display:block; border-radius:14px }

.first-impressions{ padding:10px 20px 18px }
.fi-grid{
  display:grid; gap:14px; justify-content:center; align-items:center;
  grid-template-columns: repeat(1, minmax(200px, 360px));
}
/* Desktop: 5 Kacheln in einer Reihe */
@media(min-width:1080px){ .fi-grid{ grid-template-columns: repeat(5, 1fr) } }

.fi-tile{
  position: relative; /* Notwendig für das Overlay */
  width: 100%; aspect-ratio: 1/1;
  border-radius:18px; border:1px solid var(--border);
  background:#25344C;
  box-shadow:0 24px 60px -24px rgba(0,0,0,.35),
             0 0 0 6px rgba(255,255,255,.03) inset,
             0 40px 120px -40px rgba(255,209,102,.32),
             0 30px 80px -30px rgba(255,107,154,.26);
  overflow:hidden; display:flex; align-items:center; justify-content:center;
  transition: transform .18s ease;
}
.fi-tile:hover{ transform: translateY(-2px) }
.fi-tile img{ max-width:100%; max-height:100%; width:auto; height:auto; display:block; border-radius:12px; transition: transform .25s ease }
.fi-tile:hover img{ transform: scale(1.03) }

/* NEU: Overlay für die Bildüberschriften */
.fi-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(0deg, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0) 100%);
  padding: 24px 12px 10px;
  text-align: center;
  border-radius: 0 0 12px 12px;
}
.fi-title {
  color: #FFFFFF;
  font-weight: 700;
  font-size: 1rem;
  margin: 0;
}
.fi-subtitle {
  color: var(--text-dim);
  font-size: 0.85rem;
  margin: 2px 0 0;
}


.open-hours{ padding:6px 20px 0 }
.oh-card{ max-width:920px; margin:0 auto }
.oh-list{ display:grid; gap:6px; margin:10px 0 8px }
@media(min-width:680px){ .oh-list{ grid-template-columns: repeat(3, 1fr) } }
.oh-line{ text-align:center }
.oh-line strong{ display:block; font-weight:800 }
.oh-bullets{ margin:.2rem auto 0; padding-left:1.2rem; max-width:620px; color:#DDE7F1 }
.slogan{ text-align:center; font-weight:800; margin-top:8px }

.loc-contact{ padding:20px 20px 0 }
.lc-grid{
  display:grid; gap:14px; grid-template-columns:1fr; max-width:1180px; margin:0 auto;
}
@media(min-width:980px){ .lc-grid{ grid-template-columns:1fr 1fr } }
.map-embed{ border:1px solid var(--border); border-radius:14px; overflow:hidden; background:var(--surface) }
.map-embed iframe{ width:100%; height:360px; display:block; border:0 }
@media(min-width:980px){ .map-embed iframe{ height:100% } }

.contact-form-wrap{ padding:18px 20px 0; max-width:980px; margin:0 auto }
.center{ text-align:center }