
:root{
  --bg:#050505;
  --panel:#0d0d0d;
  --soft:#151515;
  --text:#f5f5f5;
  --muted:#a9a9a9;
  --line:#2a2a2a;
  --white:#fff;
  --black:#000;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.6;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(calc(100% - 36px),var(--max));margin:0 auto}
header{
  position:sticky;top:0;z-index:50;
  background:rgba(5,5,5,.92);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(12px);
}
.nav{height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
.brand img{height:56px;width:auto;max-width:250px;object-fit:contain;background:#fff;padding:5px 8px}
.brand .fallback{font-weight:900;letter-spacing:.06em;font-size:1.1rem}
nav{display:flex;align-items:center;gap:24px}
nav a{font-size:.92rem;color:#d7d7d7}
nav a:hover{color:#fff}
.nav-cta,.button{
  display:inline-flex;align-items:center;justify-content:center;
  border:1px solid #fff;padding:12px 18px;
  font-weight:700;letter-spacing:.02em;transition:.2s;
}
.nav-cta:hover,.button:hover{background:#fff;color:#000}
.menu-btn{display:none;background:none;border:1px solid var(--line);color:white;padding:8px 10px;font-size:1.15rem}

.hero{
  min-height:78vh;display:grid;align-items:end;
  border-bottom:1px solid var(--line);
  background:
    linear-gradient(90deg,rgba(0,0,0,.95) 0%,rgba(0,0,0,.75) 42%,rgba(0,0,0,.28) 100%),
    radial-gradient(circle at 78% 35%,#393939 0,#1d1d1d 22%,#080808 56%);
}
.hero-inner{padding:110px 0 88px;max-width:880px}
.eyebrow{
  font-size:.8rem;text-transform:uppercase;letter-spacing:.2em;color:#b8b8b8;
  margin-bottom:18px
}
h1,h2,h3{margin:0 0 18px;line-height:1.05}
h1{font-size:clamp(3rem,7vw,6.8rem);letter-spacing:-.055em;max-width:1000px}
h2{font-size:clamp(2rem,4vw,4rem);letter-spacing:-.04em}
h3{font-size:1.45rem}
.hero p{max-width:720px;color:#c8c8c8;font-size:1.12rem}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.button.secondary{border-color:#4a4a4a;color:#ddd}
.button.secondary:hover{border-color:#fff}

.section{padding:92px 0;border-bottom:1px solid var(--line)}
.section-head{display:grid;grid-template-columns:1fr 1.2fr;gap:60px;align-items:start;margin-bottom:44px}
.section-head p{color:var(--muted);margin:0}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.card{background:var(--panel);padding:34px;min-height:280px}
.card-number{font-size:.75rem;letter-spacing:.18em;color:#858585;margin-bottom:48px}
.card ul{padding-left:18px;color:#d4d4d4}
.card p{color:var(--muted)}
.band{display:grid;grid-template-columns:1.2fr .8fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.band>div{background:var(--panel);padding:46px}
.fact{font-size:clamp(2rem,4vw,4.8rem);font-weight:900;letter-spacing:-.05em;line-height:1}
.muted{color:var(--muted)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px}
.contact-list{display:grid;gap:18px}
.contact-item{padding:20px 0;border-bottom:1px solid var(--line)}
.contact-item small{display:block;color:#888;text-transform:uppercase;letter-spacing:.14em;margin-bottom:4px}
.hours{display:grid;gap:8px;margin-top:20px}
.hours-row{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);padding:9px 0}
.job{border:1px solid var(--line);padding:40px;background:var(--panel)}
.job-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:30px}
.job ul{padding-left:18px;color:#cfcfcf}
.legal{max-width:880px}
.legal h2{font-size:2rem;margin-top:42px}
.legal p,.legal li{color:#c9c9c9}
.notice{
  margin:18px 0 0;padding:14px 16px;border:1px solid #3a3a3a;background:#0b0b0b;
  color:#bdbdbd;font-size:.9rem
}
footer{padding:42px 0;background:#000}
.footer-grid{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:end}
.footer-links{display:flex;gap:18px;flex-wrap:wrap;color:#9d9d9d;font-size:.9rem}
.logo-warning{
  display:none;
  font-size:.75rem;color:#ffb7b7;border:1px solid #623737;padding:7px 10px;margin-left:8px
}
@media (max-width:800px){
  nav{display:none;position:absolute;top:77px;left:0;right:0;background:#070707;border-bottom:1px solid var(--line);padding:22px;flex-direction:column;align-items:flex-start}
  nav.open{display:flex}
  .menu-btn{display:block}
  .nav-cta{display:none}
  .section-head,.contact-grid,.band,.job-columns{grid-template-columns:1fr}
  .grid{grid-template-columns:1fr}
  .hero-inner{padding:78px 0 58px}
  h1{font-size:clamp(3rem,14vw,5.2rem)}
  .section{padding:68px 0}
  .footer-grid{grid-template-columns:1fr}
}


/* Kontaktformular */
.contact-form{display:grid;gap:18px;margin-top:26px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-field{display:grid;gap:8px}
.form-field label{font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;color:#9a9a9a}
.form-field input,.form-field textarea{
  width:100%;border:1px solid var(--line);background:#0a0a0a;color:#fff;
  padding:14px 15px;font:inherit;border-radius:0;outline:none;transition:.2s
}
.form-field input:focus,.form-field textarea:focus{border-color:#fff;background:#0f0f0f}
.form-field textarea{resize:vertical;min-height:140px}
.privacy-check{display:flex;gap:10px;align-items:flex-start;color:#a9a9a9;font-size:.82rem;line-height:1.45}
.privacy-check input{margin-top:3px;accent-color:#fff}
.privacy-check a{text-decoration:underline;text-underline-offset:3px}
.form-submit{background:#fff;color:#000;cursor:pointer;width:max-content}
.form-submit:hover{background:#dcdcdc;color:#000}
.form-status{border:1px solid var(--line);padding:14px 16px;margin:18px 0 4px;font-size:.92rem}
.form-status.success{border-color:#6f8b73;background:#0b140c}
.form-status.error{border-color:#8f6666;background:#160d0d}
.opening-hours-compact{margin-top:42px;padding-top:34px;border-top:1px solid var(--line)}
@media (max-width:800px){.form-row{grid-template-columns:1fr}}

.form-note{margin:0;color:#8f8f8f;font-size:.78rem;line-height:1.45;max-width:580px}.form-note a{text-decoration:underline;text-underline-offset:3px}
