:root{
  --bg: #0b0a09;
  --bg-alt: #100e0c;
  --cream: #f4ecd8;
  --cream-dim: #cdc0a3;
  --gold: #cda15e;
  --gold-bright: #e8c584;
  --west-1: #2a1509;
  --west-2: #6b350f;
  --west-accent: #e2a24a;
  --winter-1: #060d1c;
  --winter-2: #16233f;
  --winter-accent: #bcd3ef;
  --gothic-1: #070a08;
  --gothic-2: #16241a;
  --gothic-accent: #9fd6a8;
  --thriller-1: #1a0303;
  --thriller-2: #3a1414;
  --thriller-accent: #e2726a;
  --fantasy-1: #080b1e;
  --fantasy-2: #1b2350;
  --fantasy-accent: #f0c869;
  --serif: 'Playfair Display', serif;
  --body: 'Cormorant Garamond', serif;
  --script: 'Cormorant Garamond', serif;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--cream);
  font-family:var(--body);
  font-size:19px;
  line-height:1.7;
  overflow-x:hidden;
}
h1,h2,h3,h4{font-family:var(--serif);font-weight:700;letter-spacing:.02em;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.container{max-width:1180px;margin:0 auto;padding:0 32px;}
::selection{background:var(--gold);color:#1a1208;}

/* Scrollbar */
::-webkit-scrollbar{width:10px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:linear-gradient(var(--gold),var(--west-2));border-radius:6px;}

/* NAV */
nav{
  position:fixed;top:0;left:0;width:100%;z-index:1000;
  display:flex;align-items:center;justify-content:space-between;
  padding:22px 40px;
  transition:background .5s ease, padding .4s ease, box-shadow .4s ease;
}
nav.scrolled{
  background:rgba(11,10,9,.88);
  backdrop-filter:blur(10px);
  padding:14px 40px;
  box-shadow:0 6px 30px rgba(0,0,0,.35);
  border-bottom:1px solid rgba(205,161,94,.15);
}
.logo{
  font-family:var(--script);
  font-style:italic;
  font-weight:600;
  font-size:28px;
  color:var(--gold-bright);
  letter-spacing:.02em;
}
.nav-links{display:flex;gap:38px;list-style:none;}
.nav-links a{
  font-family:var(--serif);
  font-size:13px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--cream-dim);
  position:relative;
  padding-bottom:4px;
  transition:color .3s;
}
.nav-links a::after{
  content:'';position:absolute;left:0;bottom:0;width:0;height:1px;
  background:var(--gold-bright);transition:width .35s ease;
}
.nav-links a:hover{color:var(--cream);}
.nav-links a:hover::after{width:100%;}
.nav-links a.active{color:var(--gold-bright);}
.nav-links a.active::after{width:100%;}
.nav-toggle{display:none;background:none;border:none;color:var(--cream);font-size:24px;cursor:pointer;}

/* HERO */
#hero{
  position:relative;
  height:100vh;
  min-height:640px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  overflow:hidden;
  background:radial-gradient(ellipse at 50% 30%, #1a140d 0%, #0b0a09 65%);
}
#hero canvas{position:absolute;inset:0;width:100%;height:100%;}
.hero-inner{position:relative;z-index:3;padding:0 24px;}
.hero-eyebrow{
  font-family:var(--script);
  font-style:italic;
  font-weight:600;
  font-size:clamp(24px,3.2vw,34px);
  letter-spacing:.02em;
  color:var(--gold-bright);
  opacity:0;
  animation:fadeUp 1.2s ease .2s forwards;
  display:inline-block;
}
.hero-title{
  font-size:clamp(56px,11vw,132px);
  line-height:.95;
  letter-spacing:.04em;
  background:linear-gradient(180deg,#fff3da 0%, var(--gold-bright) 45%, var(--gold) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 6px 30px rgba(205,161,94,.25));
  opacity:0;
  animation:fadeUp 1.2s ease .5s forwards;
}
.hero-sub{
  margin:26px auto 0;
  max-width:620px;
  font-size:20px;
  color:var(--cream-dim);
  opacity:0;
  animation:fadeUp 1.2s ease .9s forwards;
}
.hero-cta{
  display:inline-block;margin-top:42px;
  padding:16px 42px;
  border:1px solid var(--gold);
  border-radius:2px;
  font-family:var(--serif);
  font-size:13px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--gold-bright);
  position:relative;
  overflow:hidden;
  opacity:0;
  animation:fadeUp 1.2s ease 1.3s forwards;
  transition:color .4s ease;
}
.hero-cta::before{
  content:'';position:absolute;inset:0;background:var(--gold);
  transform:translateX(-101%);transition:transform .45s ease;z-index:-1;
}
.hero-cta:hover{color:#1a1208;}
.hero-cta:hover::before{transform:translateX(0);}

@keyframes fadeUp{
  from{opacity:0;transform:translateY(26px);}
  to{opacity:1;transform:translateY(0);}
}

.scroll-cue{
  position:absolute;bottom:36px;left:50%;transform:translateX(-50%);
  z-index:3;color:var(--gold-bright);font-size:22px;
  animation:bob 2.2s ease-in-out infinite;
  opacity:.8;
}
@keyframes bob{
  0%,100%{transform:translate(-50%,0);}
  50%{transform:translate(-50%,10px);}
}

/* Small page header (for sub-pages like Musik) */
.page-header{
  position:relative;
  padding:200px 0 100px;
  text-align:center;
  overflow:hidden;
  background:radial-gradient(ellipse at 50% 0%, #1a140d 0%, #0b0a09 70%);
}
.page-header canvas{position:absolute;inset:0;width:100%;height:100%;}
.page-header .hero-inner{position:relative;z-index:3;}

/* SECTION GENERIC */
section{position:relative;padding:130px 0;}
.section-head{text-align:center;max-width:680px;margin:0 auto 90px;}
.kicker{
  font-family:var(--serif);font-size:12px;letter-spacing:.32em;
  text-transform:uppercase;color:var(--gold);margin-bottom:18px;
}
.section-head h2{font-size:clamp(34px,5vw,54px);color:var(--cream);}
.section-head p{margin-top:20px;color:var(--cream-dim);font-size:20px;}

.reveal{opacity:0;transform:translateY(46px);transition:opacity .9s cubic-bezier(.2,.6,.2,1), transform .9s cubic-bezier(.2,.6,.2,1);}
.reveal.visible{opacity:1;transform:translateY(0);}
.reveal-left{transform:translateX(-60px);}
.reveal-left.visible{transform:translateX(0);}
.reveal-right{transform:translateX(60px);}
.reveal-right.visible{transform:translateX(0);}

/* BOOKS */
#buecher{background:var(--bg);}
.book-block{
  position:relative;
  padding:110px 0;
  overflow:hidden;
}
.book-block .particles{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:1;}
.book-block .container{
  position:relative;z-index:2;
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:70px;
  align-items:center;
}
.book-block.flip .container{grid-template-columns:1.15fr .85fr;}
.book-block.flip .book-text{order:2;}
.book-block.flip .book-visual{order:1;}

.theme-west{background:radial-gradient(ellipse at 20% 20%, var(--west-2) 0%, var(--west-1) 45%, #0b0a09 85%);}
.theme-winter{background:radial-gradient(ellipse at 80% 10%, var(--winter-2) 0%, var(--winter-1) 55%, #0b0a09 88%);}
.theme-gothic{background:radial-gradient(ellipse at 30% 80%, var(--gothic-2) 0%, var(--gothic-1) 55%, #0b0a09 88%);}
.theme-thriller{background:radial-gradient(ellipse at 75% 85%, var(--thriller-2) 0%, var(--thriller-1) 55%, #0b0a09 88%);}
.theme-fantasy{background:radial-gradient(ellipse at 25% 15%, var(--fantasy-2) 0%, var(--fantasy-1) 55%, #0b0a09 88%);}

.book-visual{display:flex;justify-content:center;perspective:1400px;}
.cover-frame{
  width:min(100%,340px);
  border-radius:4px;
  box-shadow:0 30px 60px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.05);
  transition:transform .25s ease, box-shadow .4s ease;
  will-change:transform;
  cursor:pointer;
}
.cover-frame img{border-radius:4px;}
.cover-frame.trilogy{width:min(100%,560px);}

/* 3D BOOK */
.book3d-float{
  --bw:250px; --bh:378px; --bd:32px;
  animation:bookFloat 6s ease-in-out infinite;
}
@keyframes bookFloat{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-14px);}
}
.book3d-stage{
  perspective:1800px;
  width:var(--bw);
  margin:0 auto;
  padding:20px 70px 40px 20px;
}
.book3d{
  position:relative;
  width:var(--bw);
  height:var(--bh);
  transform-style:preserve-3d;
  transform:rotateY(-32deg);
  transition:transform .6s cubic-bezier(.2,.7,.3,1);
  cursor:pointer;
}
.book3d-stage:hover .book3d{transform:rotateY(-14deg) scale(1.02);}
.book3d .cover{
  position:absolute;inset:0;width:100%;height:100%;
  background-size:cover;background-position:center;
  border-radius:2px 6px 6px 2px;
  box-shadow:0 25px 55px rgba(0,0,0,.6);
}
.book3d .pages{
  position:absolute;top:2px;bottom:2px;left:0;
  width:var(--bd);
  background:repeating-linear-gradient(to bottom, #efe4c9 0, #efe4c9 2px, #d9cba9 2px, #d9cba9 3px);
  transform:translateX(calc(var(--bw) - var(--bd))) rotateY(90deg);
  transform-origin:left center;
  box-shadow:inset -6px 0 10px -4px rgba(0,0,0,.35);
  border-radius:0 3px 3px 0;
}
.book3d.pages-cool .pages{
  background:repeating-linear-gradient(to bottom, #f4f7fb 0, #f4f7fb 2px, #dbe4f0 2px, #dbe4f0 3px);
}
.book3d .spineback{
  position:absolute;top:0;left:0;width:100%;height:100%;
  transform:translateZ(calc(var(--bd) * -1));
  border-radius:2px 6px 6px 2px;
}

.badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 16px;border-radius:100px;
  font-family:var(--serif);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  margin-bottom:22px;
}
.badge.live{background:rgba(226,162,74,.12);color:var(--west-accent);border:1px solid rgba(226,162,74,.4);}
.badge.soon{background:rgba(188,211,239,.1);color:var(--winter-accent);border:1px solid rgba(188,211,239,.35);}
.badge.progress{background:rgba(159,214,168,.1);color:var(--gothic-accent);border:1px solid rgba(159,214,168,.35);}
.badge.chill{background:rgba(226,114,106,.1);color:var(--thriller-accent);border:1px solid rgba(226,114,106,.35);}
.badge.magic{background:rgba(240,200,105,.1);color:var(--fantasy-accent);border:1px solid rgba(240,200,105,.35);}
.badge i{font-size:9px;}

.genre-tag{
  font-family:var(--serif);font-size:12px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--cream-dim);margin-bottom:8px;display:block;
}
.book-text h3{font-size:clamp(30px,4vw,46px);line-height:1.15;margin-bottom:22px;color:var(--cream);}
.book-text .script-line{font-family:var(--script);font-style:italic;font-weight:600;font-size:23px;line-height:1.5;color:var(--gold-bright);display:block;margin-bottom:14px;}
.book-text p{color:var(--cream-dim);font-size:19px;margin-bottom:16px;}
.book-list{list-style:none;margin:22px 0;padding:0;}
.book-list li{
  padding:10px 0 10px 30px;position:relative;color:var(--cream-dim);font-size:18px;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.book-list li::before{content:'✦';position:absolute;left:0;top:10px;color:var(--gold);font-size:13px;}
.book-list li b{color:var(--cream);font-weight:600;}

.btn{
  display:inline-flex;align-items:center;gap:10px;
  margin-top:24px;padding:15px 36px;
  border:1px solid var(--gold);border-radius:2px;
  font-family:var(--serif);font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--gold-bright);transition:all .35s ease;position:relative;overflow:hidden;
}
.btn:hover{background:var(--gold);color:#1a1208;transform:translateY(-2px);box-shadow:0 12px 26px rgba(205,161,94,.25);}
.btn.ghost{border-color:rgba(255,255,255,.25);color:var(--cream-dim);}
.btn.ghost:hover{background:rgba(255,255,255,.08);color:var(--cream);box-shadow:none;transform:none;}
.btn + .btn{margin-left:14px;}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:24px;}
.btn-row .btn{margin-top:0;}

/* Countdown */
.countdown{display:flex;gap:18px;margin:28px 0 8px;flex-wrap:wrap;}
.countdown div{
  text-align:center;min-width:70px;padding:14px 10px;
  background:rgba(255,255,255,.05);border:1px solid rgba(188,211,239,.2);border-radius:6px;
}
.countdown .num{font-family:var(--serif);font-size:30px;color:var(--winter-accent);display:block;}
.countdown .lbl{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-dim);}
.countdown.chill .num{color:var(--thriller-accent);}
.countdown.chill div{border-color:rgba(226,114,106,.25);}
.countdown.magic .num{color:var(--fantasy-accent);}
.countdown.magic div{border-color:rgba(240,200,105,.25);}

/* particles */
.snowflake{position:absolute;top:-10%;color:#dfeeff;opacity:.85;animation:fall linear infinite;}
@keyframes fall{
  to{transform:translateY(120vh) translateX(20px);}
}
.ember{position:absolute;bottom:-5%;border-radius:50%;background:radial-gradient(circle,#ffcf8a,#e2762c 70%);opacity:.8;animation:rise linear infinite;filter:blur(.3px);}
@keyframes rise{
  0%{transform:translateY(0) translateX(0);opacity:.9;}
  100%{transform:translateY(-115vh) translateX(30px);opacity:0;}
}
.firefly{position:absolute;border-radius:50%;background:#bff2c2;box-shadow:0 0 8px 3px rgba(159,214,168,.7);animation:drift ease-in-out infinite;}
@keyframes drift{
  0%,100%{transform:translate(0,0);opacity:.3;}
  50%{transform:translate(24px,-34px);opacity:1;}
}
.ash{position:absolute;bottom:-5%;border-radius:50%;background:radial-gradient(circle,#e2726a,#3a1414 70%);opacity:.7;animation:rise linear infinite;}
.spark{position:absolute;border-radius:50%;background:#fff3d0;box-shadow:0 0 10px 3px rgba(240,200,105,.8);animation:drift ease-in-out infinite;}

/* ABOUT */
#ueber-mich{background:linear-gradient(180deg,#0b0a09, #120f0c 50%, #0b0a09);}
.about-grid{
  display:grid;grid-template-columns:.6fr 1fr;gap:80px;align-items:center;
  max-width:1000px;margin:0 auto;padding:0 32px;
}
.monogram{
  width:230px;height:230px;border-radius:50%;
  border:1px solid rgba(205,161,94,.4);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto;position:relative;
}
.monogram::before{
  content:'';position:absolute;inset:14px;border:1px solid rgba(205,161,94,.25);border-radius:50%;
}
.monogram span{font-family:var(--script);font-style:italic;font-weight:600;font-size:70px;color:var(--gold-bright);}
.portrait{
  width:280px;height:280px;border-radius:50%;
  margin:0 auto;overflow:hidden;
  border:1px solid rgba(205,161,94,.4);
  box-shadow:0 25px 60px rgba(0,0,0,.5);
  position:relative;
}
.portrait::after{
  content:'';position:absolute;inset:12px;border:1px solid rgba(205,161,94,.3);border-radius:50%;
  pointer-events:none;
}
.portrait img{width:100%;height:100%;object-fit:cover;}
.about-text h2{font-size:clamp(32px,4vw,46px);margin-bottom:22px;color:var(--cream);}
.about-text p{color:var(--cream-dim);margin-bottom:16px;font-size:19px;}
.about-text .sign{font-family:var(--script);font-style:italic;font-weight:600;font-size:30px;color:var(--gold-bright);margin-top:18px;display:block;}

/* LEGAL PAGES (Impressum, Datenschutz, Haftungsausschluss) */
.legal-content{
  max-width:780px;margin:0 auto;
  padding:170px 32px 110px;
}
.legal-content .kicker{display:block;}
.legal-content h1{font-size:clamp(36px,5vw,54px);color:var(--cream);margin-bottom:40px;}
.legal-content h2{font-size:22px;color:var(--gold-bright);margin:44px 0 14px;}
.legal-content h2:first-of-type{margin-top:0;}
.legal-content p{color:var(--cream-dim);font-size:18px;line-height:1.75;margin-bottom:14px;}
.legal-content ul{padding-left:22px;margin-bottom:14px;}
.legal-content li{color:var(--cream-dim);font-size:18px;line-height:1.7;margin-bottom:8px;}
.legal-content a{color:var(--gold-bright);border-bottom:1px solid rgba(205,161,94,.4);}
.legal-content .note{
  margin-top:10px;padding:16px 20px;border-radius:6px;
  background:rgba(205,161,94,.07);border:1px solid rgba(205,161,94,.25);
  font-size:16px;color:var(--cream-dim);
}
.legal-content .updated{font-size:14px;color:var(--cream-dim);opacity:.65;margin-top:56px;}

/* ALBUMS (Musik-Seite) */
#alben{background:var(--bg);}
.album-block{
  position:relative;
  padding:90px 0;
  overflow:hidden;
}
.album-block .container{
  position:relative;z-index:2;
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:70px;
  align-items:center;
}
.album-block.flip .container{grid-template-columns:1.15fr .85fr;}
.album-block.flip .album-text{order:2;}
.album-block.flip .album-visual{order:1;}
.album-visual{display:flex;justify-content:center;perspective:1400px;}
.album-cover{
  width:min(100%,340px);
  border-radius:6px;
  box-shadow:0 30px 70px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.05);
  transition:transform .3s ease;
  cursor:pointer;
  animation:bookFloat 7s ease-in-out infinite;
}
.album-cover img{border-radius:6px;}
.album-cover:hover{transform:scale(1.03) rotate(-1deg);}
.stream-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px;}
.stream-row a{
  display:inline-flex;align-items:center;gap:10px;
  padding:13px 24px;border:1px solid rgba(205,161,94,.35);border-radius:100px;
  font-family:var(--serif);font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--cream-dim);transition:all .3s ease;
}
.stream-row a:hover{border-color:var(--gold);color:var(--gold-bright);background:rgba(205,161,94,.08);}

/* CONTACT */
#kontakt{
  background:radial-gradient(ellipse at 50% 0%, #14110d 0%, #0b0a09 60%);
  text-align:center;
}
.newsletter-form{
  display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin:36px 0 30px;
}
.newsletter-form input{
  padding:16px 20px;width:320px;max-width:80vw;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.18);border-radius:2px;
  color:var(--cream);font-family:var(--body);font-size:17px;
}
.newsletter-form input::placeholder{color:var(--cream-dim);}
.newsletter-form input:focus{outline:none;border-color:var(--gold);}
.social-row{display:flex;justify-content:center;gap:24px;margin-top:34px;}
.social-row a{
  width:52px;height:52px;border-radius:50%;border:1px solid rgba(205,161,94,.35);
  display:flex;align-items:center;justify-content:center;font-size:19px;color:var(--gold-bright);
  transition:all .3s ease;
}
.social-row a:hover{background:var(--gold);color:#1a1208;transform:translateY(-4px);}
.contact-email{margin-top:26px;font-family:var(--serif);letter-spacing:.05em;color:var(--cream-dim);}
.contact-email a{color:var(--gold-bright);border-bottom:1px solid rgba(205,161,94,.4);}

footer{
  padding:50px 0 34px;text-align:center;border-top:1px solid rgba(255,255,255,.07);
  color:var(--cream-dim);font-size:14px;
}
footer .logo{display:block;margin-bottom:14px;}
footer .foot-links{display:flex;justify-content:center;gap:26px;margin-bottom:18px;list-style:none;flex-wrap:wrap;}
footer .foot-links a{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--cream-dim);}
footer .foot-links a:hover{color:var(--gold-bright);}

@media (max-width: 880px){
  .book-block .container, .book-block.flip .container{grid-template-columns:1fr;text-align:center;}
  .book-block .book-visual{order:-1 !important;}
  .book-block .book-text{order:2 !important;}
  .album-block .container, .album-block.flip .container{grid-template-columns:1fr;text-align:center;}
  .album-block .album-visual{order:-1 !important;}
  .album-block .album-text{order:2 !important;}
  .stream-row{justify-content:center;}
  .about-grid{grid-template-columns:1fr;text-align:center;}
  .nav-links{
    position:fixed;top:0;right:0;height:100vh;width:70%;max-width:320px;
    background:rgba(10,9,8,.98);flex-direction:column;justify-content:center;align-items:center;
    transform:translateX(100%);transition:transform .4s ease;gap:34px;
  }
  .nav-links.open{transform:translateX(0);}
  .nav-toggle{display:block;}
  .book3d-float{--bw:190px; --bh:288px; --bd:24px;}
  .book3d-stage{padding:20px 40px 30px 10px;}
}