:root{
  --bg:#000;
  --muted:#9aa0a6;
  --maxw:1100px;
}

*{
  box-sizing:border-box;
}

html,body{
  margin:0;
  background:#000;
  color:#eee;
  font-family:'Oswald',sans-serif;
}

/* LOGO */
.top-bar{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  padding:18px 24px;
  z-index:30;
  pointer-events:none;
}

.logo-wrap{
  pointer-events:auto;
}

.logo{
  height:60px;
  width:auto;
  filter:drop-shadow(0 0 8px rgba(0,0,0,0.85));
}

/* SOCIALS RECHTS */
.social-rail{
  position:fixed;
  top:140px;
  right:32px;
  display:flex;
  flex-direction:column;
  gap:12px;
  z-index:25;
}

.social-dot{
  width:32px;
  height:32px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,0.6);
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,0.45);
}

.social-dot svg{
  width:18px;
  height:18px;
}

.social-dot:hover{
  border-color:#fff;
  background:rgba(0,0,0,0.75);
}

/* HERO */
.fullscreen{
  min-height:100vh;
  position:relative;
  overflow:hidden;
}

.hero{
  position:relative;
}

.hero-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 17%; /* Hero bleibt exakt wie gewünscht */
  filter:grayscale(.08) contrast(1.05) saturate(.85);
}

.hero-gradient{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,0.05),rgba(0,0,0,0.7));
}

.hero-center{
  position:relative;
  z-index:5;
  width:100%;
  max-width:var(--maxw);
  margin:0 auto;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  align-items:center;
  padding:0 20px 80px;
}

/* TITEL + SUBLINE */
.hero-title{
  text-transform:uppercase;
  font-weight:400;         /* Regular */
  font-size:52px;
  letter-spacing:0.25em;
  text-indent:0.25em;
  margin:0;
  text-align:center;
}

.hero-subline{
  margin-top:10px;
  font-weight:300;         /* Light */
  font-size:18px;
  letter-spacing:0.15em;
  text-transform:uppercase;
  color:#ccc;
  text-align:center;
  border-bottom:1px solid rgba(255,255,255,0.35);
  display:inline-block;
  padding-bottom:6px;
}

/* SECTIONS */
.strip{
  padding:56px 20px;
  text-align:center;
}

.info-strip{
  background:#050505;
}

.contact-strip{
  background:#080808;
}

.strip-inner{
  max-width:var(--maxw);
  margin:0 auto;
}

/* Überschriften in den Strips */
.strip-inner h2{
  margin:0 0 10px 0;
  letter-spacing:0.12em;
  text-transform:uppercase;
  font-weight:400;
}

/* Mehr Abstand zwischen About-Block und Listen-Block */
.strip-inner h2 + p + h2{
  margin-top:32px;
}

/* Fließtext */
.strip-inner p{
  margin:8px 0;
}

.siteurl{
  color:var(--muted);
}

/* FOOTER */
.site-footer{
  text-align:center;
  padding:18px;
  font-size:13px;
  color:var(--muted);
  border-top:1px solid rgba(255,255,255,0.05);
}

/* RESPONSIVE */
@media (max-width:900px){

  .top-bar{
    padding:12px 16px;
  }

  .logo{
    height:46px;
  }

  .social-rail{
    top:120px;
    right:16px;
    bottom:auto;
    flex-direction:column;
    gap:10px;
  }

  .hero-center{
    padding-bottom:72px;
  }

  .hero-title{
    font-size:34px;
    letter-spacing:0.20em;
  }
}

/* SEITENLAYOUT FÜR IMPRESSUM UND WEITERE UNTERSEITEN */

.page{
  min-height:100vh;
  padding:120px 20px 40px;
  background:#000;
}

.page-inner{
  max-width:var(--maxw);
  margin:0 auto;
  text-align:left;
}

.page-inner h1{
  margin:0 0 24px 0;
  font-size:32px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  font-weight:400;
}

.page-inner h2{
  margin:26px 0 8px 0;
  font-size:18px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  font-weight:400;
}

.page-inner p{
  margin:4px 0;
  line-height:1.4;
}

.page-inner a{
  color:#fff;
  text-decoration:underline;
}

.backlink{
  margin-top:24px;
}