/* ============ Wohngebietsfest – gemeinsames Stylesheet (Festabend-Look) ============ */
:root{
  --neon-gold:#f8c054;
  --neon-glow:rgba(248,192,84,.6);
  --wood-bg:#2d1e14;
  --wood-bg2:#3a281a;
  --bg:#1c1712;
  --text-main:#f5f0e6;
  --text-muted:#d4c8b8;
  --danger:#ff6b6b;
  --maxw:960px;
}
*{box-sizing:border-box}
body{
  margin:0;min-height:100vh;font-family:'Roboto',system-ui,sans-serif;
  color:var(--text-main);
  background:
    radial-gradient(circle at 12% 0%,#f8c05420,transparent 42%),
    radial-gradient(circle at 88% 6%,#f8c05412,transparent 38%),
    linear-gradient(180deg,var(--bg),#100d0a);
  display:flex;flex-direction:column;min-height:100vh;
}
a{color:inherit}
img{max-width:100%}

/* ---------- Navigation ---------- */
.site-nav{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 28px;background:#00000055;border-bottom:1px solid #f8c05433;
  position:sticky;top:0;z-index:20;backdrop-filter:blur(6px);
}
.site-nav .brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.site-nav .brand img{height:38px}
.site-nav ul{list-style:none;display:flex;gap:26px;margin:0;padding:0}
.site-nav a.navlink{
  color:var(--text-muted);text-decoration:none;font-family:'Oswald',sans-serif;font-size:14px;
  letter-spacing:.03em;text-transform:uppercase;border-bottom:2px solid transparent;
  padding-bottom:4px;transition:.2s;
}
.site-nav a.navlink:hover,.site-nav a.navlink.active{color:var(--neon-gold);border-color:var(--neon-gold)}
.nav-toggle{display:none;background:none;border:1px solid var(--neon-gold);color:var(--neon-gold);
  border-radius:8px;padding:8px 10px;font-size:18px;cursor:pointer}
@media(max-width:720px){
  .nav-toggle{display:block}
  .site-nav ul{
    position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;
    background:#100d0aee;border-bottom:1px solid #f8c05433;max-height:0;overflow:hidden;transition:max-height .25s ease;
  }
  .site-nav ul.open{max-height:260px}
  .site-nav ul li{border-top:1px solid #ffffff0f}
  .site-nav a.navlink{display:block;padding:16px 28px;border-bottom:none}
}

/* ---------- Hero ---------- */
.hero{text-align:center;padding:64px 20px 46px}
.hero .logo{width:min(480px,88vw);filter:drop-shadow(0 4px 18px #000c)}
.hero h1{font-family:'Oswald',sans-serif;font-size:clamp(20px,3.6vw,28px);margin:22px 0 0;color:var(--text-main);font-weight:500}
.hero p{color:var(--text-muted);font-size:16px;max-width:520px;margin:14px auto 0;line-height:1.65}
.cta{
  display:inline-flex;align-items:center;gap:8px;margin-top:26px;background:#111a24;color:var(--neon-gold);
  border:2px solid var(--neon-gold);padding:14px 28px;border-radius:12px;font-family:'Oswald',sans-serif;
  font-size:15px;text-decoration:none;box-shadow:0 0 16px var(--neon-glow),inset 0 0 8px var(--neon-glow);
  transition:.2s;
}
.cta:hover{background:#1a2736;box-shadow:0 0 22px rgba(248,192,84,.8),inset 0 0 12px rgba(248,192,84,.5);transform:translateY(-1px)}

/* ---------- Layout / Cards ---------- */
main{flex:1}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.grid.cols-2{grid-template-columns:repeat(2,1fr)}
@media(max-width:720px){.grid,.grid.cols-2{grid-template-columns:1fr}}

.glowing-box{
  border:2px solid var(--neon-gold);border-radius:12px;padding:22px 26px;margin-bottom:22px;
  box-shadow:0 0 12px var(--neon-glow),inset 0 0 12px var(--neon-glow);
  background:rgba(15,10,5,.55);
}
.glowing-box h2,.glowing-box h3{color:#fff;margin:0 0 14px;display:flex;align-items:center;gap:10px;font-family:'Oswald',sans-serif;font-weight:500}
.glowing-box h2{font-size:22px}
.glowing-box h3{font-size:18px}
.glowing-box p{margin:0 0 12px;color:var(--text-muted);line-height:1.6;font-size:15px}
.glowing-box ul{padding-left:20px;margin:12px 0;color:var(--text-muted)}
.glowing-box li{margin-bottom:8px;line-height:1.55;font-size:15px}

.card{
  background:var(--wood-bg);
  background-image:linear-gradient(90deg,rgba(0,0,0,.25) 0%,transparent 10%,transparent 90%,rgba(0,0,0,.25) 100%),
    repeating-linear-gradient(180deg,transparent,transparent 15px,rgba(0,0,0,.08) 15px,rgba(0,0,0,.08) 30px);
  border:1px solid #4a3424;border-radius:10px;padding:24px;box-shadow:0 12px 30px #00000070;
}
.card .thumb{
  width:100%;aspect-ratio:16/10;border-radius:8px;margin-bottom:14px;
  background:linear-gradient(150deg,#3a281a,#241a10);
  display:flex;align-items:center;justify-content:center;font-size:30px;color:var(--neon-gold);
  border:1px solid #4a342440;
}
.card h3{margin:0 0 8px;font-family:'Oswald',sans-serif;color:var(--neon-gold);font-size:17px;font-weight:500}
.card p{margin:0 0 12px;color:var(--text-muted);font-size:14px;line-height:1.55}
.card a.link{color:var(--neon-gold);font-size:14px;font-weight:600;text-decoration:none;border-bottom:1px dotted var(--neon-gold)}
.card a.link:hover{color:#fff}

.notice-box{
  background:rgba(248,192,84,.1);border-left:4px solid var(--neon-gold);padding:15px;margin:15px 0;
  font-size:14px;line-height:1.55;color:var(--text-main);border-radius:0 8px 8px 0;
}
.mail-button{
  display:inline-block;background:#111a24;color:var(--neon-gold);border:1px solid var(--neon-gold);
  padding:12px 22px;font-family:'Oswald',sans-serif;font-size:16px;border-radius:8px;text-decoration:none;
  margin-top:6px;transition:.2s;box-shadow:0 0 8px rgba(248,192,84,.3);
}
.mail-button:hover{background:#1a2736;box-shadow:0 0 12px rgba(248,192,84,.6)}

.page-head{text-align:center;padding:50px 20px 10px}
.page-head h1{font-family:'Oswald',sans-serif;font-weight:500;font-size:clamp(24px,4vw,32px);margin:0;color:var(--text-main)}
.page-head p{color:var(--text-muted);max-width:520px;margin:12px auto 0;line-height:1.6}

/* ---------- Footer ---------- */
footer{text-align:center;color:rgba(255,255,255,.5);font-size:14px;padding:44px 20px 32px;line-height:1.7}
footer a{color:var(--neon-gold);text-decoration:none;border-bottom:1px dotted var(--neon-gold);margin:0 5px}
footer a:hover{color:#fff}

/* ---------- Isso (Gästebuch) ---------- */
#isso-thread{margin-top:6px}
#isso-thread .isso-postbox{background:rgba(0,0,0,.25);border-radius:8px;padding:12px;border:1px solid rgba(248,192,84,.2)}
#isso-thread input[type="text"],#isso-thread input[type="email"],#isso-thread textarea{
  background:rgba(20,15,10,.8)!important;color:var(--text-main)!important;
  border:1px solid rgba(248,192,84,.3)!important;border-radius:6px!important;
}
#isso-thread .isso-btn{
  background:#111a24!important;color:var(--neon-gold)!important;border:1px solid var(--neon-gold)!important;
  font-family:'Oswald',sans-serif!important;border-radius:6px!important;
}
