/* Lucky Bar – mulestyle.css (Cream baseline) */
:root{
  --radius: 16px;
  --shadow: 0 10px 30px rgba(0,0,0,.25);
  --text: #f5f5f5;
  --muted: #c7c7c7;
}
body{
  color: var(--text);
  background: linear-gradient(180deg,#0e0e10 0%, #121314 60%, #0e0e10 100%);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
.container{max-width:1100px;margin:0 auto;padding: clamp(16px,3vw,32px);}
.header{display:flex; align-items:center; justify-content:space-between; padding: 14px 0;}
.brand{font-family: "Bebas Neue", Impact, sans-serif; letter-spacing:.5px; font-size: clamp(28px,4vw,40px)}
.nav a{ color: var(--text); text-decoration:none; margin-left:18px; opacity:.85; }
.nav a:hover{ opacity:1 }

.button{
  display:inline-flex; gap:10px; align-items:center;
  background: #A8892A; color:#111; padding:12px 18px; border-radius: 999px;
  box-shadow: var(--shadow); border:1px solid rgba(255,255,255,.06);
}
.section{padding: clamp(28px,6vw,64px) 0}
.hero{
  background: radial-gradient(1200px 400px at 70% -50%, rgba(168,137,42,.25), transparent 60%);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.hero-inner{ display:grid; gap:18px; grid-template-columns: 1.4fr 1fr; align-items:center; }
.card{
  background: #141517; border:1px solid rgba(255,255,255,.08);
  border-radius: var(--radius); box-shadow: var(--shadow);
}
.card .content{padding:22px}
.grid{display:grid; gap:18px; grid-template-columns: repeat(3, 1fr);}

.badge{
  display:inline-block; padding:6px 10px; border-radius:999px;
  background: rgba(168,137,42,.15); color:#E8D38E; border:1px solid rgba(232,211,142,.35);
  font-weight:600; letter-spacing:.2px;
}
.kicker{color:var(--muted); text-transform:uppercase; letter-spacing:.2em; font-size:12px}
.h1{font-family: "Bebas Neue", Impact, sans-serif; font-size: clamp(36px,6vw,64px); line-height:.95; margin:0}
.h2{font-family: "Bebas Neue", Impact, sans-serif; font-size: clamp(24px,3.5vw,36px); margin:0 0 6px}
.lead{font-size: clamp(16px,2vw,20px); color:#e9e9e9}

.footer{ border-top: 1px solid rgba(255,255,255,.08); margin-top:40px; padding-top:20px; color: var(--muted); }
.footer a{color:var(--text)}

.events{display:grid; gap:12px}
.event{
  display:flex; gap:14px; align-items:center;
  border:1px solid rgba(255,255,255,.08); border-radius: var(--radius); padding:14px 16px; background: #121315;
}
.event .date{
  min-width:78px; text-align:center; border-radius: 12px; padding:8px 10px;
  background: #EDEBE6; color:#1a1a1a; font-weight:700; line-height:1.1;
}
.event .title{font-weight:700}

/* Öffnungszeiten */
.hours{ display:grid; grid-template-columns: 1fr auto; gap:8px 16px; margin-top:8px; }
.hours .day{ color:#ddd; }
.hours .time{ color:#fff; font-weight:600; }
.hours-note{ margin-top:10px; color:#ddd; font-style: italic; font-size: 14px; }

/* Route */
.route-card .content p{ margin-bottom:8px; }