:root{
  --tannengruen:#2D6950;
  --tannengruen-dark:#204a38;
  --indigo:#462F97;
  --indigo-dark:#31206b;
  --gelb:#F7C844;
  --gelb-dark:#8a6a10;
  --hellgrau:#DEDCD4;
  --text-dark:#2b2b28;
  --text-muted:#6b6b66;
  --bg:#ffffff;
  --bg-soft:#F8F7F3;
  --radius:10px;
  --maxw:1080px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:Georgia, 'Times New Roman', Times, serif;
  color:var(--text-dark);
  background:var(--bg);
  line-height:1.7;
  font-size:16px;
}
h1,h2,h3,.logo,nav a,button,.btn{
  font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}
h1,h2,h3{
  font-weight:600;
  color:var(--tannengruen);
  line-height:1.3;
  margin:0 0 1rem 0;
}
h1{font-size:32px;}
h2{font-size:24px;}
h3{font-size:18px;}
p{margin:0 0 1rem 0;}
a{color:inherit;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 1.5rem;}

/* Header / Nav */
header{
  border-bottom:1px solid var(--hellgrau);
  background:var(--bg);
  position:sticky; top:0; z-index:10;
}
.header-inner{
  max-width:var(--maxw); margin:0 auto; padding:1rem 1.5rem;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem;
  position:relative;
}
.logo{
  font-weight:600; font-size:17px; letter-spacing:0.2px; text-decoration:none;
  color:var(--tannengruen);
}
.logo .m{color:var(--tannengruen);}
.logo .h{color:var(--indigo);}
.logo .s{color:var(--gelb);}
nav ul{list-style:none; display:flex; gap:1.75rem; margin:0; padding:0; flex-wrap:wrap;}
.nav-toggle{display:none; background:none; border:none; cursor:pointer; padding:4px; width:32px; height:26px; position:relative;}
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
  content:""; display:block; position:absolute; left:4px; right:4px; height:2px;
  background:var(--text-dark); border-radius:2px;
}
.nav-toggle span{top:12px;}
.nav-toggle span::before{content:""; top:-8px;}
.nav-toggle span::after{content:""; top:8px;}
nav a{
  text-decoration:none; font-size:14px; font-weight:500; color:var(--text-dark);
  padding-bottom:4px; border-bottom:2px solid transparent;
}
nav a.active, nav a:hover{border-bottom-color:var(--tannengruen);}

/* Hero */
.hero{
  position:relative; overflow:hidden;
  padding:4rem 0 3rem 0;
  background:var(--bg-soft);
}
.hero-wave{position:absolute; inset:0; width:100%; height:100%; z-index:0;}
.hero-content{position:relative; z-index:1;}
.hero h1{font-size:38px; max-width:640px;}
.subheadline{
  font-family:Georgia, 'Times New Roman', Times, serif; font-style:italic; font-size:14px; color:var(--text-muted);
  margin-bottom:0.75rem; display:block;
}
.hero p.lead{font-size:17px; color:var(--text-muted); max-width:560px;}

/* Buttons */
.btn{
  display:inline-block; text-decoration:none; font-weight:500; font-size:14px;
  padding:12px 26px; border-radius:6px; border:none; cursor:pointer;
}
.btn-indigo{background:var(--indigo); color:#fff;}
.btn-indigo:hover{background:var(--indigo-dark);}
.btn-gruen{background:var(--tannengruen); color:#fff;}
.btn-gruen:hover{background:var(--tannengruen-dark);}
.btn-outline{background:transparent; border:1.5px solid var(--tannengruen); color:var(--tannengruen);}

/* Sections */
section{padding:3.5rem 0;}
section.alt{background:var(--bg-soft);}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:2.5rem; align-items:center;}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem;}
.grid-auto{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:1.5rem;}
.icon-card{display:flex; flex-direction:column; gap:0.5rem;}
.icon-card svg{width:36px; height:36px;}
.icon-card h3{margin-bottom:0.25rem;}
.icon-card p{font-size:14px; color:var(--text-muted); margin:0;}

/* Markengerechte Aufzählungspunkte in Content-Bereichen (nicht Navigation) */
section ul{list-style:none; padding-left:0; margin:0 0 1rem 0;}
section ul li{position:relative; padding-left:1.4em;}
section ul li::before{
  content:"✓";
  position:absolute; left:0; top:0;
  color:var(--tannengruen);
  font-weight:700;
  font-size:0.95em;
}

/* Cards */
.card{
  background:#fff; border:1px solid var(--hellgrau); border-radius:var(--radius);
  padding:1.5rem;
}
.card.accent-indigo{border-left:3px solid var(--indigo);}
.card.accent-gruen{border-left:3px solid var(--tannengruen);}
.card.accent-gelb{border-left:3px solid var(--gelb);}

/* Kooperationspartner-Logokacheln: einheitliche Höhe unabhängig vom
   Seitenverhältnis der einzelnen Partner-Logos (Hoch- oder Querformat) */
.coop-logo{
  height:56px; display:flex; align-items:center; justify-content:flex-start;
  margin-bottom:1rem;
}
.coop-logo img{max-height:100%; max-width:100%; object-fit:contain;}

/* Variante für eher quadratische/hochformatige Logos (z.B. Badges/Siegel):
   feste Box oben links in der Karte, statt in eine schmale Höhen-Leiste
   gequetscht zu werden – erhält die Bildproportion, sitzt bündig links. */
.coop-logo-square{
  margin-bottom:-3px; display:flex; justify-content:flex-end;
}
.coop-logo-square img{width:120px; height:auto; display:block;}

.coop-card h3{font-size:19px; margin-bottom:0.5rem;}
.coop-card p{font-size:16px; color:var(--text-muted); margin:0;}
.coop-card a.coop-link{
  font-size:15px; font-weight:500; text-decoration:none; color:var(--tannengruen);
  display:inline-block; margin-top:0.75rem;
}
.coop-card a.coop-link:hover{text-decoration:underline;}

/* Split tiles on homepage */
.split{display:grid; grid-template-columns:1fr 1fr; gap:0; border-radius:var(--radius); overflow:hidden; border:1px solid var(--hellgrau);}
.split-tile{padding:2.5rem 2rem; position:relative;}
.split-tile.beratung{background:#eef4f1;}
.split-tile.coaching{background:#fdf7e8;}
.split-tile h2{margin-bottom:0.5rem;}

/* Image placeholder */
.img-placeholder{
  background:repeating-linear-gradient(135deg, var(--hellgrau), var(--hellgrau) 10px, #eeece5 10px, #eeece5 20px);
  border:1px dashed #b9b7ae; border-radius:var(--radius);
  display:flex; align-items:center; justify-content:center; text-align:center;
  color:var(--text-muted); font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; font-size:13px;
  padding:1.5rem; min-height:220px;
}

/* Footer */
footer{
  border-top:1px solid var(--hellgrau); padding:2rem 0; margin-top:2rem;
  font-size:13px; color:var(--text-muted);
}
.footer-inner{display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; align-items:center;}

/* Form */
form{display:flex; flex-direction:column; gap:1rem; max-width:480px;}
label{font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; font-size:13px; font-weight:500; color:var(--text-dark); margin-bottom:4px; display:block;}
input, textarea{
  width:100%; padding:10px 12px; border:1px solid var(--hellgrau); border-radius:6px;
  font-family:Georgia, 'Times New Roman', Times, serif; font-size:14px;
}
textarea{min-height:120px; resize:vertical;}

@media (max-width:720px){
  .grid-2, .grid-3, .split{grid-template-columns:1fr;}
  .hero h1{font-size:28px;}

  /* Hamburger-Menü statt ausgeschriebener Navigation */
  .nav-toggle{display:block;}
  nav ul{
    display:none; flex-direction:column; gap:0;
    position:absolute; top:100%; left:0; right:0;
    background:var(--bg); border:1px solid var(--hellgrau); border-top:none;
    padding:0.5rem 1.5rem; z-index:20;
  }
  nav ul.open{display:flex;}
  nav ul li{padding:0.6rem 0; border-bottom:1px solid var(--hellgrau);}
  nav ul li:last-child{border-bottom:none;}

  /* NUR auf Mobile: Welle als schmales, ruhiges Band am unteren Rand statt über die volle Höhe.
     Das behebt den Zickzack-/Verzerrungseffekt, der entsteht, wenn preserveAspectRatio="none"
     eine breite, flache Welle auf einen hohen, schmalen Mobile-Hero streckt.
     Desktop bleibt komplett unverändert (diese Regel gilt nur unterhalb 720px Breite). */
  .hero-wave{
    inset:auto 0 0 0;
    top:auto;
    height:70px;
  }

  /* Logo/Subheadline bleibt in natürlicher Reihenfolge: Text oben, Logo darunter, rechtsbündig */
  .hero-content{flex-direction:column;}
  .hero-content > div:last-child{align-self:flex-end; margin-top:1rem;}
}
