:root{
  --blau:#004A82;
  --blau-dunkel:#00365F;
  --braun:#8D7256;
  --braun-dunkel:#6E5A42;
  --creme:#FAF7F2;
  --text:#232323;
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:'Ubuntu', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  color:var(--text);
  background:#fff;
  line-height:1.5;
}
img{ max-width:100%; display:block; }
a{ color:var(--blau); }
.skip-link{
  position:absolute;
  left:-999px;
  top:auto;
  background:#fff;
  color:var(--blau);
  padding:12px 20px;
  z-index:100;
}
.skip-link:focus{ left:16px; top:16px; }

header.site-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:20px 6%;
  background:#fff;
  flex-wrap:wrap;
  gap:12px;
}
header.site-header img{ height:40px; }
.reihe-tag{
  font-size:0.85rem;
  color:var(--braun);
  letter-spacing:0.04em;
  text-transform:uppercase;
}

.hero{
  position:relative;
  min-height:88vh;
  display:flex;
  align-items:flex-end;
  background:url('assets/bilder/berg-blick-gespiegelt.jpg') center/cover no-repeat;
}
.hero::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(0,25,45,0.82) 10%, rgba(0,25,45,0.2) 65%, rgba(0,25,45,0.05) 100%);
}
.hero-content{
  position:relative;
  z-index:1;
  padding:0 6% 6% 6%;
  max-width:780px;
  color:#fff;
}
.hero-content .reihe-tag{ color:#CBB89A; }
h1{
  font-size:clamp(2.1rem, 5vw, 3.4rem);
  line-height:1.14;
  font-weight:700;
  margin:0.4em 0 0.3em;
}
h1 em{ font-style:normal; color:var(--braun); }
.hero-badge{
  display:inline-block;
  background:var(--braun);
  color:#fff;
  font-weight:700;
  font-size:1rem;
  letter-spacing:0.05em;
  text-transform:uppercase;
  padding:9px 20px;
  border-radius:30px;
  margin-bottom:0.9em;
}
.sub{
  font-size:1.1rem;
  line-height:1.5;
  max-width:560px;
  margin:0 0 1.4em;
  font-weight:300;
}
.eckdaten-bar{
  display:flex;
  flex-wrap:wrap;
  row-gap:8px;
  column-gap:14px;
  margin-top:1.3em;
  font-size:1.2rem;
  font-weight:700;
}
.eckdaten-bar span.sep{
  opacity:0.55;
  font-weight:400;
}
.hero .eckdaten-bar{ color:#fff; }
.anmeldung .eckdaten-bar{
  color:#fff;
  justify-content:center;
  margin-bottom:1.4em;
}
.btn{
  display:inline-block;
  background:var(--braun);
  color:#fff;
  text-decoration:none;
  padding:16px 32px;
  border-radius:4px;
  font-weight:700;
  font-size:1.05rem;
  transition:background .2s;
  border:none;
  cursor:pointer;
}
.btn:hover, .btn:focus{ background:var(--braun-dunkel); }

section{ padding:70px 6%; }
section.creme{ background:var(--creme); }
.inner{ max-width:920px; margin:0 auto; }
h2{ color:var(--blau); font-size:1.7rem; font-weight:700; margin-top:0; }
p{ margin:0 0 1em; }

.ablauf-liste{
  margin-top:1.5em;
  display:flex;
  flex-direction:column;
  gap:34px;
}
.ablauf-punkt{
  border-left:3px solid var(--braun);
  padding-left:20px;
}
.ablauf-zeit{
  color:var(--braun);
  font-weight:700;
  font-size:0.85rem;
  text-transform:uppercase;
  letter-spacing:0.04em;
  margin-bottom:0.35em;
}
.ablauf-punkt h3{
  color:var(--blau);
  font-size:1.15rem;
  margin:0 0 0.5em;
  font-weight:700;
}
.ablauf-punkt p{ margin:0 0 0.6em; }
.ablauf-punkt ul{ margin:0.6em 0 0; padding-left:1.2em; }
.ablauf-punkt ul li{ margin-bottom:0.4em; }
.ablauf-ausklang{
  margin-top:2em;
  font-style:italic;
  color:var(--braun-dunkel);
}

.mitnehmen-liste{
  list-style:none;
  padding:0;
  margin:1.5em 0 0;
  display:grid;
  gap:16px;
}
.mitnehmen-liste li{
  padding-left:34px;
  position:relative;
}
.mitnehmen-liste li::before{
  content:"✓";
  position:absolute;
  left:0; top:0;
  color:var(--blau);
  font-weight:700;
}

section.feuer{
  position:relative;
  background:url('assets/bilder/feuer.jpg') center/cover no-repeat;
  color:#fff;
}
section.feuer::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(20,12,6,0.6), rgba(10,6,4,0.8));
}
section.feuer .inner{ position:relative; z-index:1; }
section.feuer h2{ color:#fff; }
section.feuer .mitnehmen-liste li::before{ color:#F3DCC2; }
section.feuer .mitnehmen-closing{
  margin-top:1.8em;
  font-size:1.05rem;
  line-height:1.6;
  color:#F3EEE6;
}

.person{
  display:flex;
  gap:40px;
  align-items:center;
  flex-wrap:wrap;
}
.person-foto{
  flex:0 0 240px;
  width:240px;
  height:300px;
  border-radius:6px;
  overflow:hidden;
  background:var(--creme);
}
.person-foto img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:top center;
}
.person-foto.platzhalter{
  border:2px dashed var(--braun);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:var(--braun);
  font-size:0.9rem;
  padding:12px;
}
.person-text{ flex:1 1 380px; }
.signature{ font-style:italic; color:var(--blau); font-weight:700; margin-top:1em; }

.quote-row{ display:flex; gap:32px; flex-wrap:wrap; margin-top:1.5em; }
.quote-card{
  flex:1 1 260px;
  background:#fff;
  padding:26px 24px;
  border-left:4px solid var(--blau);
  border-radius:2px;
}
.quote-card p{ font-size:0.96rem; line-height:1.55; color:#333; margin:0 0 1em; }
.quote-card .wer{ font-weight:700; color:var(--braun); font-size:0.88rem; }

.faq details{
  border-bottom:1px solid #ddd;
  padding:16px 0;
}
.faq summary{
  cursor:pointer;
  font-weight:700;
  color:var(--blau);
  font-size:1.02rem;
}
.faq p{ margin:12px 0 0; }

.anmeldung{
  background:var(--blau);
  color:#fff;
  text-align:center;
}
.anmeldung h2{ color:#fff; }

.kontakt p{ margin:0.2em 0; }

footer{
  background:#fff;
  border-top:1px solid #eee;
  padding:30px 6%;
  font-size:0.85rem;
  color:#666;
  display:flex;
  gap:20px;
  flex-wrap:wrap;
  justify-content:space-between;
}
footer a{ color:#666; }

@media (max-width:640px){
  header.site-header{ padding:16px 5%; }
  section{ padding:50px 5%; }
  .hero{ min-height:94vh; }
  .hero-content{ padding:0 5% 8% 5%; }
  .person{ flex-direction:column; text-align:center; }
  .person-foto{ margin:0 auto; }
}

@media (max-width:640px){
  h1{ font-size:clamp(1.65rem, 7.2vw, 2.2rem); overflow-wrap:break-word; hyphens:auto; }
}