
:root{--maxw:1000px;--radius:16px}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Helvetica,Arial,sans-serif;color:#0b1b2b;background:#fff}
/* NAVBAR */
.navbar{position:sticky;top:0;background:#ffffffcc;backdrop-filter:saturate(160%) blur(6px);
  border-bottom:1px solid #e8edf3; z-index:10}
.navbar .inner{max-width:var(--maxw);margin:auto;display:flex;align-items:center;gap:1rem;padding:.75rem 1.25rem;justify-content:space-between;flex-wrap:wrap}
.nav{margin-left:auto;gap:.6rem}
.nav a{color:#0b1b2b;text-decoration:none;padding:.25rem .5rem;border-radius:8px;white-space:nowrap}
.nav a:hover{background:#f2f6ff}
.menu-toggle{display:none;margin-left:auto;width:44px;height:44px;border:0;border-radius:10px;background:#fff;
  box-shadow:0 6px 16px rgba(0,0,0,.08);align-items:center;justify-content:center;cursor:pointer}
.menu-toggle svg{width:22px;height:22px}
@media (max-width:1024px){
  .menu-toggle{display:flex}
  .nav{display:none;position:relative;margin-left:0;width:100%}
  .nav.open{display:flex;flex-direction:column;background:#fff;border:1px solid #e8edf3;border-radius:12px;
            padding:.5rem;margin-top:.5rem;box-shadow:0 12px 28px rgba(0,0,0,.08)}
  .nav a{padding:.5rem}
}

/* HERO (start) */
.hero{position:relative;min-height:52vh;display:grid;place-items:center;color:#fff;text-align:center;overflow:hidden}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.8)}
.wrap{max-width:var(--maxw);padding:2.5rem 1rem;margin-inline:auto}

/* Slider */
.slider{position:relative}
.slides{position:relative;overflow:hidden;border-radius:var(--radius);box-shadow:0 16px 40px rgba(0,0,0,.12);aspect-ratio:3/2;background:#f3f5f7}
.slide{position:absolute;inset:0;opacity:0;transition:opacity .5s ease}
.slide.is-active{opacity:1}
.slide img{width:100%;height:100%;object-fit:cover}
.slide figcaption{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(180deg,transparent,rgba(0,0,0,.5));color:#fff;padding:1rem;font-size:15px}
.navbtn{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:0;border-radius:50%;background:#fff;
  box-shadow:0 10px 30px rgba(0,0,0,.15);cursor:pointer;font-size:22px;line-height:44px}
.navbtn.prev{left:10px}.navbtn.next{right:10px}
.dots{display:flex;gap:.5rem;justify-content:center;margin:.8rem 0}
.dot{width:8px;height:8px;border-radius:50%;background:#c8d2dc;cursor:pointer;border:0}
.dot.is-active{background:#2a6bff}

/* Cards */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:2rem}
.card{border:1px solid #e8edf3;border-radius:14px;padding:1rem}
.card h3{margin:.2rem 0 .4rem;font-size:1.05rem}
.card p{margin:0;color:#4b5b6b;font-size:.95rem}
@media (max-width:900px){.grid{grid-template-columns:1fr}}

/* Page headers */
.hero-leistungen,.hero-ueber,.hero-kontakt{position:relative;height:260px;border-radius:0 0 20px 20px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hero-leistungen::before{content:"";position:absolute;inset:0;background:url('../assets/leistungen-bg.png') center/cover no-repeat}
.hero-ueber::before{content:"";position:absolute;inset:0;background:url('../assets/ueber-bg.png') center/cover no-repeat}
.hero-kontakt::before{content:"";position:absolute;inset:0;background:url('../assets/kontakt-bg.png') center/cover no-repeat}
.hero-leistungen .overlay,.hero-ueber .overlay,.hero-kontakt .overlay{position:absolute;inset:0;background:rgba(0,0,0,.55)}
.hero h1,.hero-leistungen h1,.hero-ueber h1,.hero-kontakt h1{position:relative}

/* CTA buttons */
.cta{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1rem}
.btn{display:inline-flex;align-items:center;gap:.5rem;border:1px solid #dbe3ee;border-radius:12px;padding:.65rem .9rem;text-decoration:none;color:#0b1b2b;background:#fff;box-shadow:0 6px 16px rgba(0,0,0,.06)}
.btn:hover{border-color:#b9c7df;transform:translateY(-1px)}
.btn svg{width:18px;height:18px}

/* Footer */
footer{margin-top:3rem;border-top:1px solid #e8edf3}
footer .inner{max-width:var(--maxw);margin:auto;padding:1.25rem 1rem;display:flex;gap:1rem;justify-content:space-between;flex-wrap:wrap}
footer a{text-decoration:none;color:#0b1b2b}
