/* V2 Dark Edition — Artikel-Stylesheet
   Behält V1-Klassennamen, dreht aber das Farbschema:
   warm-beige  →  schwarz / wein / gold */

:root{
  --bg:       #0a0606;
  --bg-2:     #120a0a;
  --bg-3:     #1a0f0f;
  --fg:       #f5f1ea;
  --fg-2:     rgba(245,241,234,.65);
  --fg-3:     rgba(245,241,234,.45);
  --accent:   #8b0d28;
  --accent-2: #b51737;
  --gold:     #c9a14a;
  --gold-light:#e6c879;
  --line:     rgba(245,241,234,.10);
  --ink:      #0a0606;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg);
  color:var(--fg);
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  font-weight:300;
  line-height:1.85;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
::selection{background:var(--accent);color:#fbf8f3}
h1,h2,h3,h4,.serif{font-family:'Cormorant Garamond',Georgia,serif;font-weight:500;line-height:1.25;letter-spacing:.01em}
a{color:inherit}

/* Top Navigation (fixed) */
.topnav{
  position:fixed;
  top:0;left:0;right:0;
  z-index:100;
  background:rgba(10,6,6,.80);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
  padding:14px 26px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.topnav .brand-mini{
  font-family:'Cormorant Garamond',serif;
  font-size:1.05rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--fg);
  text-decoration:none;
  transition:color .25s;
  font-weight:500;
}
.topnav .brand-mini:hover{color:var(--gold)}
.topnav .back{
  font-size:.7rem;
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--fg-2);
  text-decoration:none;
  transition:color .25s;
}
.topnav .back:hover{color:var(--gold)}
.topnav .back::before{content:'← ';color:var(--accent-2);margin-right:4px}
@media (max-width:520px){
  .topnav{padding:12px 18px}
  .topnav .brand-mini{font-size:.9rem;letter-spacing:.14em}
  .topnav .back{font-size:.6rem;letter-spacing:.22em}
  .topnav .back::before{margin-right:2px}
}

/* Aurora-Background hinter dem Header */
header.page{
  text-align:center;
  padding:180px 24px 90px;
  max-width:900px;
  margin:0 auto;
  position:relative;
}
header.page::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse 60% 70% at 50% 30%, rgba(139,13,40,.18), transparent 70%),
    radial-gradient(ellipse 50% 60% at 50% 80%, rgba(201,161,74,.06), transparent 70%);
  pointer-events:none;
  z-index:-1;
}
.eyebrow{
  font-family:'JetBrains Mono', 'IBM Plex Mono', monospace;
  font-size:.7rem;
  letter-spacing:.5em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:30px;
}
h1.title{
  font-size:clamp(2.4rem,6.5vw,4.6rem);
  letter-spacing:.02em;
  line-height:1.1;
  margin-bottom:32px;
  color:var(--fg);
}
.subtitle-page{
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  font-size:clamp(1.15rem,2.3vw,1.5rem);
  color:var(--fg-2);
  max-width:660px;
  margin:0 auto;
  line-height:1.5;
}
.header-rule{
  width:60px;
  height:1px;
  background:var(--gold);
  margin:50px auto 0;
}

/* Essay */
article.essay{
  max-width:680px;
  margin:0 auto;
  padding:40px 24px 100px;
}
article.essay h2{
  font-size:clamp(1.8rem,4vw,2.6rem);
  margin:80px 0 16px;
  letter-spacing:.01em;
  color:var(--fg);
}
article.essay h2 .roman{
  display:block;
  font-family:'JetBrains Mono', 'IBM Plex Mono', monospace;
  font-size:.7rem;
  font-weight:400;
  letter-spacing:.5em;
  color:var(--gold);
  text-transform:uppercase;
  margin-bottom:14px;
}
article.essay h2:first-of-type{margin-top:20px}
article.essay p{
  margin-bottom:24px;
  font-size:1.08rem;
  color:var(--fg-2);
}
article.essay p.lead{
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  font-size:clamp(1.25rem,2.4vw,1.55rem);
  color:var(--fg);
  line-height:1.55;
  margin:34px 0;
  padding-left:24px;
  border-left:2px solid var(--accent-2);
}
article.essay p.signature{
  text-align:right;
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  color:var(--gold);
  font-size:1.3rem;
  margin-top:60px;
}
article.essay hr{
  border:none;
  text-align:center;
  margin:60px 0;
  color:var(--gold);
  letter-spacing:1em;
}
article.essay hr::before{content:'· · ·'}
article.essay ul{
  list-style:none;
  margin:24px 0;
  padding:0;
}
article.essay ul li{
  font-family:'Cormorant Garamond',serif;
  font-size:1.15rem;
  padding:14px 0 14px 32px;
  border-bottom:1px solid var(--line);
  position:relative;
  color:var(--fg);
}
article.essay ul li:last-child{border-bottom:none}
article.essay ul li::before{
  content:'—';
  position:absolute;
  left:0;
  color:var(--gold);
}
article.essay a{
  color:var(--gold);
  text-decoration:underline;
  text-decoration-color:rgba(201,161,74,.4);
  text-underline-offset:3px;
  transition:color .2s;
}
article.essay a:hover{color:var(--gold-light)}

/* Booking CTA */
.booking{
  background:linear-gradient(180deg, var(--bg-2), var(--bg) 60%);
  color:var(--fg);
  padding:110px 24px;
  text-align:center;
  border-top:1px solid var(--line);
  position:relative;
  overflow:hidden;
}
.booking::before{
  content:'';
  position:absolute;
  top:-200px;left:50%;
  transform:translateX(-50%);
  width:600px;height:400px;
  background:radial-gradient(circle, rgba(139,13,40,.18), transparent 70%);
  pointer-events:none;
}
.booking-inner{max-width:720px;margin:0 auto;position:relative;z-index:1}
.booking .eyebrow{color:var(--gold);margin-bottom:24px}
.booking h2{
  font-size:clamp(2rem,5vw,3rem);
  color:var(--fg);
  margin-bottom:18px;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.booking .rule{
  width:60px;
  height:1px;
  background:var(--gold);
  margin:0 auto 36px;
}
.booking p.intro{
  color:var(--fg-2);
  font-size:1.08rem;
  margin-bottom:44px;
  max-width:580px;
  margin-left:auto;
  margin-right:auto;
}
.contact-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden;
  margin-bottom:44px;
}
.contact{
  background:var(--bg-2);
  padding:30px 24px;
  text-decoration:none;
  color:var(--fg);
  transition:background .3s, transform .3s;
  text-align:center;
}
.contact:hover{background:var(--accent);transform:translateY(-2px)}
.contact .ico{
  display:block;
  font-family:'Cormorant Garamond',serif;
  font-size:1.6rem;
  color:var(--gold);
  margin-bottom:8px;
  letter-spacing:.04em;
}
.contact:hover .ico{color:var(--fg)}
.contact .label{
  display:block;
  font-family:'JetBrains Mono', 'IBM Plex Mono', monospace;
  font-size:.65rem;
  letter-spacing:.35em;
  text-transform:uppercase;
  color:var(--fg-3);
  margin-bottom:8px;
}
.contact .num{
  font-size:.95rem;
  font-weight:400;
  letter-spacing:.04em;
  color:var(--fg);
}
.booking-note{
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  color:var(--fg-3);
  font-size:1rem;
  margin-top:14px;
}

/* Footer */
footer{
  padding:60px 24px 44px;
  text-align:center;
  border-top:1px solid var(--line);
  background:var(--bg);
}
.disclaimer{
  font-size:.78rem;
  color:var(--fg-3);
  max-width:720px;
  margin:0 auto 20px;
  line-height:1.7;
}
.copy{
  font-family:'JetBrains Mono', 'IBM Plex Mono', monospace;
  font-size:.72rem;
  color:var(--fg-3);
  letter-spacing:.22em;
  text-transform:uppercase;
}

@media (max-width:640px){
  header.page{padding:120px 22px 50px}
  article.essay{padding:30px 22px 60px}
  article.essay h2{margin-top:60px}
  .booking{padding:80px 22px}
}

/* Disziplinen-Navigator unten */
.discipline-nav{
  border-top:1px solid var(--line);
  background:var(--bg-2);
  padding:36px 24px;
}
.discipline-nav-inner{
  max-width:1180px;
  margin:0 auto;
}
.dn-label{
  font-family:'JetBrains Mono', 'IBM Plex Mono', monospace;
  text-align:center;
  font-size:.66rem;
  letter-spacing:.4em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:22px;
}
.dn-grid{
  display:grid;
  grid-template-columns:repeat(9,1fr);
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
}
.dn-cell{
  background:var(--bg);
  padding:18px 8px;
  text-align:center;
  text-decoration:none;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  transition:background .3s ease, color .3s ease;
  min-height:96px;
}
.dn-cell:hover{background:var(--bg-3)}
.dn-cell .roman{
  font-family:'Cormorant Garamond',serif;
  font-size:1rem;
  color:var(--gold);
  letter-spacing:.04em;
  font-weight:500;
}
.dn-cell .name{
  font-family:'Inter',sans-serif;
  font-size:.7rem;
  letter-spacing:.04em;
  color:var(--fg);
  line-height:1.35;
  font-weight:400;
}
.dn-cell.active{background:var(--accent)}
.dn-cell.active .roman{color:var(--gold-light)}
.dn-cell.active .name{color:#fff}
.dn-cell.active:hover{background:var(--accent-2)}

@media (max-width:980px){
  .dn-grid{
    display:flex;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
    -ms-overflow-style:none;
    border:none;
    background:transparent;
    gap:8px;
    padding-bottom:2px;
    border-radius:0;
  }
  .dn-grid::-webkit-scrollbar{display:none}
  .dn-cell{
    flex:0 0 138px;
    scroll-snap-align:start;
    border:1px solid var(--line);
    border-radius:10px;
  }
}
