/* Basis-Variablen und Grundlayout */
:root {
  --green: #2e7d32;
  --beige-light: #f9f6f2;
  --beige-dark: #e6e1d8;
  --beige-border: #d0bfa5;
  --text: #333;
}
body {
  font-family: Arial, sans-serif;
  background-color: #f8f8f8;
  margin: 0;
  padding: 0;
  color: var(--text);
}

/* HEADER */
.header-wrapper {
  background: linear-gradient(90deg, var(--beige-light) 0%, var(--beige-dark) 100%);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.07);
  border-bottom: 4px solid var(--beige-border);
  position: relative;
  z-index: 2000;
}
.header-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1200px;
  margin: 0 auto;
  padding: 1rem 2rem;
  border-radius: 0 0 16px 16px;
  background: rgba(255, 255, 255, 0.7);
  box-shadow: 0 4px 16px rgba(208, 191, 165, 0.08);
  flex-wrap: wrap;
  gap: 1rem;
  position: relative;
}
.header-left { display: flex; align-items: center; gap: 1rem; min-width: 260px; }
.logo-circle { background: #fffbe9; border-radius: 50%; box-shadow: 0 2px 8px rgba(208,191,165,.15); padding: 8px; display: flex; align-items: center; justify-content: center; margin-right: 1rem; }
.header-logo { height: 48px; width: 48px; border-radius: 50%; object-fit: contain; }
.header-title { font-size: 2rem; font-weight: 700; color: var(--green); letter-spacing: .5px; text-shadow: 1px 1px 0 var(--beige-dark); margin: 0; line-height: 1.2; }
.header-subtitle { font-size: 1rem; color: #555; margin-top: .25rem; font-style: italic; }

nav ul { display: flex; gap: 1.5rem; list-style: none; margin: 0; padding: 0; }
nav a { text-decoration: none; color: var(--green); font-weight: 500; padding: .4em .8em; border-radius: 6px; transition: background .2s ease, color .2s ease; }
nav a.active,
nav a[aria-current="page"] { color: #fff; background: var(--green); font-weight: 700; }
nav a:hover { background: var(--beige-dark); }

#hamburger-btn { display: none; background: none; border: none; cursor: pointer; padding: .25rem; border-radius: 6px; }
#hamburger-btn:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.hamburger-bars { display: block; width: 38px; height: 38px; position: relative; margin-right: 2px; }
.hamburger-bars span { position: absolute; left: 6px; right: 6px; height: 5px; background: linear-gradient(90deg, #2e7d32 60%, #0078d4 100%); border-radius: 3px; box-shadow: 0 1px 4px rgba(46,125,50,.18); transition: transform .2s ease, opacity .2s ease; }
.hamburger-bars span:nth-child(1){ top:8px } .hamburger-bars span:nth-child(2){ top:16px } .hamburger-bars span:nth-child(3){ top:24px }
.nav-open .hamburger-bars span:nth-child(1){ transform: translateY(8px) rotate(45deg); background:#0078d4 }
.nav-open .hamburger-bars span:nth-child(2){ opacity:0 }
.nav-open .hamburger-bars span:nth-child(3){ transform: translateY(-8px) rotate(-45deg); background:#2e7d32 }
.header-wave { margin-top: -8px; line-height: 0; }

@media (max-width: 900px) {
  nav { position: static; }
  nav ul {
    display: none;
    flex-direction: column;
    background: #fff;
    position: fixed;
    top: 68px;
    right: 16px;
    left: auto;
    box-shadow: 0 2px 8px rgba(0,0,0,.1);
    padding: .75rem;
    border-radius: 10px;
    z-index: 4000;
    min-width: 220px;
    max-width: 92vw;
  }
  nav.open ul { display: flex; }
  #hamburger-btn { display: block !important; position: absolute; top: 20px; right: 20px; z-index: 3000; background: #ffffffcc; pointer-events: auto; }
}

/* FOOTER */
footer { background: var(--beige-dark); color: #333; text-align: center; padding: 1rem 0; margin-top: 2rem; border-radius: 0 0 16px 16px; font-size: .95em; }
footer a { color: var(--green); text-decoration: none; margin: 0 1rem; }
footer a:hover { text-decoration: underline; }

/* Index: Content-Layout und Bildfluss */
.content-wrapper { display:flex; flex-wrap:wrap; justify-content:center; align-items:flex-start; gap:2rem; margin:3rem auto 2rem; max-width:1200px; padding:0 1rem; background:linear-gradient(90deg,var(--beige-light) 60%, var(--beige-dark) 100%); border:2px solid var(--beige-dark); border-radius:16px; box-shadow:0 4px 16px rgba(208,191,165,.12); }
.content-col { display:flex; flex-direction:column; justify-content:center; align-items:center; flex:1 1 420px; min-width:320px; }
.content-text { background:#fffbe9; border:1px solid var(--beige-border); border-radius:8px; box-shadow:0 2px 6px rgba(208,191,165,.15); padding:1.5rem; line-height:1.6; font-size:1.05em; text-align:left; max-width:840px; }
.content-text h2 { font-size:1.6em; margin-bottom:1rem; color:#333; text-align:center; }
.goethe-quote-block { background:#e6f4ea; border-left:6px solid #2e7d32; border-radius:10px; padding:1.2rem 2rem; margin-bottom:1.5rem; font-size:1.25em; font-family:'Georgia', serif; color:#2e7d32; box-shadow:0 2px 8px rgba(46,125,50,.07); text-align:center; font-style:italic; position:relative; max-width:420px; margin-left:auto; margin-right:auto; }
.goethe-quote-block::before { content:"❝"; font-size:2em; color:#2e7d32; position:absolute; left:12px; top:8px; }
.goethe-quote-block::after { content:"❞"; font-size:2em; color:#2e7d32; position:absolute; right:12px; bottom:8px; }
.goethe-quote { font-size:1.15rem; font-family:'Georgia', serif; color:#2e7d32; font-style:italic; font-weight:500; background:none; border-radius:0; padding:0; box-shadow:none; display:block; }
.goethe-author { display:block; font-size:1rem; color:#0078d4; margin-top:.2em; font-style:italic; }
.content-text p { margin:.5rem 0; }
.content-text .flow-figure { float:right; width:clamp(240px, 40%, 380px); margin:.2rem 0 .8rem 1.25rem; position:relative; box-shadow:0 6px 18px rgba(208,191,165,.22); }
.content-text .flow-figure img.flow-img { display:block; width:100%; height:auto; }
.content-text .flow-figure::after { content:""; position:absolute; inset:0; pointer-events:none; background: linear-gradient(to right,#fffbe9,rgba(255,255,255,0)) 0 0/24px 100% no-repeat, linear-gradient(to left,#fffbe9,rgba(255,255,255,0)) 100% 0/24px 100% no-repeat, linear-gradient(to bottom,#fffbe9,rgba(255,255,255,0)) 0 0/100% 24px no-repeat, linear-gradient(to top,#fffbe9,rgba(255,255,255,0)) 0 100%/100% 24px no-repeat; }
.content-text .flow-figure.flow-large { width: clamp(360px, 62%, 620px); }
.content-col img.content-photo { display:block; max-width:100%; height:auto; border-radius:12px; box-shadow:0 4px 16px rgba(208,191,165,.15); border:1px solid var(--beige-dark); background:#fffbe9; padding:.5rem; }
@media (max-width: 900px) {
  .content-wrapper { flex-direction:column; gap:1.5rem; }
  .content-col { align-items:center; }
  .content-text { text-align:left; margin:0 auto; max-width:min(95vw, 700px); }
  .content-text .flow-figure { float:none; margin:0 auto 1rem; width:min(100%, 420px); }
  .goethe-quote-block { padding:1rem 1rem; max-width:95vw; }
}

/* Impressum */
.impressum-wrapper { max-width: 700px; margin: 3rem auto 2rem auto; background: #fffbe9; border: 2px solid #e6e1d8; border-radius: 16px; box-shadow: 0 4px 16px rgba(208,191,165,.12); padding: 2.5rem 2rem; font-size: 1.08em; line-height: 1.7; }
.impressum-wrapper h1 { font-size: 1.7em; color: var(--green); margin-bottom: 1.2rem; text-align: center; font-family: 'Georgia', serif; letter-spacing: 1px; }
.impressum-wrapper strong { color: #0078d4; }

/* Beratung */
.beratung-wrapper { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:2rem; margin:3rem auto 2rem; max-width:1200px; padding:0 1rem; background:linear-gradient(90deg,var(--beige-light) 60%, var(--beige-dark) 100%); border:2px solid var(--beige-dark); border-radius:16px; box-shadow:0 4px 16px rgba(208,191,165,.12); }
.beratung-col { flex:1 1 420px; min-width:320px; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }
.b.beratung-text { background: linear-gradient(120deg, #fffbe9 80%, #e6f4ea 100%); border: 1px solid var(--beige-border); border-radius: 16px; box-shadow: 0 6px 24px rgba(208,191,165,.18); padding: 2rem 1.5rem; max-width: 420px; margin-bottom: 1rem; position: relative; }
.beratung-text h2 { font-size: 1.7em; color: var(--green); text-align: center; margin-bottom: .7em; position: relative; }
.beratung-text h2::after { content:""; display:block; width:60px; height:4px; background: linear-gradient(90deg, #2e7d32 60%, #0078d4 100%); margin:.5em auto 0; border-radius:2px; }
.beratung-text ul { margin-top:1.2em; padding-left:0; list-style:none; }
.beratung-text li { margin-bottom:.7em; padding-left:2em; position:relative; }
.beratung-text li::before { content:"💡"; position:absolute; left:0; top:0; font-size:1.1em; color:#2e7d32; }
.beratung-col img { display:block; max-width:100%; height:auto; border-radius:12px; box-shadow:0 4px 16px rgba(208,191,165,.15); border:1px solid var(--beige-dark); background:#fffbe9; padding:.5rem; margin-top:1rem; }
@media (max-width: 900px) { .beratung-wrapper { flex-direction:column; gap:1.5rem; } .beratung-col { align-items:center; } .beratung-text { text-align:center; margin:0 auto 1rem; } }

/* Coaching */
.coaching-wrapper { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:2rem; margin:3rem auto 2rem; max-width:1200px; padding:0 1rem; background:linear-gradient(90deg,var(--beige-light) 60%, var(--beige-dark) 100%); border:2px solid var(--beige-dark); border-radius:16px; box-shadow:0 4px 16px rgba(208,191,165,.12); }
.coaching-col { flex:1 1 420px; min-width:320px; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }
.coaching-text { background:#fffbe9; border:1px solid var(--beige-border); border-radius:8px; box-shadow:0 2px 6px rgba(208,191,165,.15); padding:1.5rem; line-height:1.6; font-size:1.05em; max-width:400px; margin-bottom:1rem; }
.coaching-text h2 { font-size:1.6em; margin-bottom:1rem; color:#333; text-align:center; }
.coaching-col img { display:block; max-width:100%; height:auto; border-radius:12px; box-shadow:0 4px 16px rgba(208,191,165,.15); border:1px solid var(--beige-dark); background:#fffbe9; padding:.5rem; margin-top:1rem; }
@media (max-width: 900px) { .coaching-wrapper { flex-direction:column; gap:1.5rem; } .coaching-col { align-items:center; } .coaching-text { text-align:center; margin:0 auto 1rem; } }

/* Psychotherapie */
.psychotherapie-flow-wrapper { max-width:1100px; margin:3rem auto 2rem; background: linear-gradient(120deg, #fffbe9 80%, #e6f4ea 100%); border:2px solid var(--beige-dark); border-radius:18px; box-shadow:0 4px 16px rgba(208,191,165,.12); padding:2.5rem 2rem; display:flex; flex-wrap:wrap; gap:2.5rem; align-items:flex-start; }
.psychotherapie-flow-text { flex:2 1 350px; min-width:320px; font-size:1.12em; color:#333; line-height:1.7; margin-bottom:1rem; display:flex; flex-direction:column; gap:1.2rem; justify-content:flex-start; }
.psychotherapie-flow-img { flex:3 1 420px; min-width:320px; display:flex; align-items:center; justify-content:center; }
.psychotherapie-flow-img img { max-width:100%; height:auto; border-radius:18px; box-shadow:0 6px 24px rgba(208,191,165,.18); border:2px solid #e6e1d8; background:#fffbe9; padding:.7rem; }
.psychotherapie-flow-bottom { margin:2rem auto 0; max-width:1100px; font-size:1.08em; color:#333; line-height:1.7; text-align:left; }
.spruch-box { background:#e6f4ea; border-left:6px solid #2e7d32; border-radius:10px; padding:1.2rem 2rem; margin-bottom:1.5rem; font-size:1.25em; font-family:'Georgia', serif; color:#2e7d32; box-shadow:0 2px 8px rgba(46,125,50,.07); text-align:center; font-style:italic; position:relative; }
.spruch-box::before { content:"❝"; font-size:2em; color:#2e7d32; position:absolute; left:12px; top:8px; }
.spruch-box::after { content:"❞"; font-size:2em; color:#2e7d32; position:absolute; right:12px; bottom:8px; }
@media (max-width: 900px) { .psychotherapie-flow-wrapper { flex-direction:column; gap:1.5rem; padding:1.2rem .5rem; } .psychotherapie-flow-img { margin-bottom:1.5rem; } .spruch-box { padding:1rem 1rem; } .psychotherapie-flow-bottom { padding:0 .5rem; } }

/* Kontakt */
.kontakt-wrapper { display:flex !important; flex-wrap:wrap; justify-content:center; align-items:center; gap:2rem; margin:3rem auto 2rem; max-width:1200px; padding:0 1rem; background:linear-gradient(90deg,var(--beige-light) 60%, var(--beige-dark) 100%); border:2px solid var(--beige-dark); border-radius:16px; box-shadow:0 4px 16px rgba(208,191,165,.12); }
.kontakt-col { display:flex; flex-direction:column; justify-content:center; align-items:center; flex:1 1 420px; min-width:320px; }
#kontakt-info { background:#fffbe9; border:1px solid var(--beige-border); border-radius:8px; box-shadow:0 2px 6px rgba(208,191,165,.15); padding:1.5rem; line-height:1.6; font-size:1.05em; text-align:center; max-width:400px; }
#kontakt-info h2 { font-size:1.6em; margin-bottom:1rem; color:#333; }
#kontakt-info address { font-style:normal; margin-bottom:1rem; text-align:center; }
#kontakt-info p { margin:.5rem 0; text-align:center; }
#kontakt-info a { color:#006699; text-decoration:none; }
#kontakt-info a:hover { text-decoration:underline; }
#kontakt-info .barrierefrei { margin-top:1rem; padding:.8rem; background:#e6f4ea; border-left:4px solid var(--green); color:var(--green); font-weight:bold; text-align:center; }
.bild-col img { display:block; max-width:100%; height:auto; border-radius:12px; box-shadow:0 4px 16px rgba(208,191,165,.15); border:1px solid var(--beige-dark); background:#fffbe9; padding:.5rem; }
.kontakt-form-wrapper { background:#fff; border:1px solid var(--beige-border); border-radius:8px; box-shadow:0 2px 6px rgba(0,0,0,.1); padding:2rem; margin:2rem auto; max-width:600px; }
.kontakt-form-wrapper h2 { text-align:center; color:#333; margin-bottom:1.5rem; }
.kontakt-form-wrapper label { display:block; margin-bottom:.3rem; font-weight:bold; color:var(--green); }
.kontakt-form-wrapper input, .kontakt-form-wrapper textarea { width:100%; padding:.7rem; margin-bottom:1rem; border:1px solid #ccc; border-radius:4px; font-size:1em; box-sizing:border-box; }
.kontakt-form-wrapper button { background:var(--green); color:#fff; border:none; padding:.8rem 2rem; border-radius:4px; font-size:1em; cursor:pointer; font-weight:bold; transition:background .2s; display:block; margin:0 auto; }
.kontakt-form-wrapper button:hover { background:#0078d4; }
.map-wrapper { max-width:600px; margin:2rem auto; border-radius:8px; overflow:hidden; box-shadow:0 2px 6px rgba(0,0,0,.08); }
.map-wrapper iframe { width:100%; height:350px; border:none; display:block; }
@media (max-width: 900px) { .kontakt-wrapper { flex-direction:column; gap:1.5rem; } .kontakt-col { align-items:center; } #kontakt-info { text-align:center; margin:0 auto; } }

/* Ablauf/Kosten */
.ablauf-wrapper { max-width:800px; margin:3rem auto 2rem; background: linear-gradient(120deg, #fffbe9 70%, #e6f4ea 100%); border:2px solid var(--beige-dark); border-radius:18px; box-shadow:0 4px 16px rgba(208,191,165,.12); padding:2.5rem 2rem; }
.ablauf-wrapper h1 { font-size:2em; color:var(--green); margin-bottom:1.2rem; text-align:center; font-family:'Georgia', serif; letter-spacing:1px; }
.ablauf-wrapper h2 { font-size:1.3em; color:#0078d4; margin-top:2rem; margin-bottom:.8rem; text-align:left; }
.ablauf-wrapper p, .ablauf-wrapper ul, .ablauf-wrapper li { font-size:1.08em; color:#333; line-height:1.7; margin-bottom:1rem; font-family:'Arial', sans-serif; }
.ablauf-wrapper ul { padding-left:1.2em; margin-bottom:1.5rem; }
.ablauf-wrapper li { margin-bottom:.5em; }
.ablauf-wrapper .kosten-box { background:#e6f4ea; border-left:6px solid var(--green); border-radius:8px; padding:1rem 1.5rem; margin:2rem 0; font-weight:bold; color:var(--green); box-shadow:0 2px 8px rgba(46,125,50,.07); }
.ablauf-wrapper .absage-box { background:#fffbe9; border-left:6px solid var(--beige-border); border-radius:8px; padding:1rem 1.5rem; margin:2rem 0; color:#a67c52; font-weight:bold; box-shadow:0 2px 8px rgba(208,191,165,.07); }
.ablauf-wrapper .highlight { color:#0078d4; font-weight:bold; }
@media (max-width: 900px) { .ablauf-wrapper { padding:1.2rem .5rem; } }

/* Datenschutz (Legacy-Seite mit anderem Markup) */
#imHeader, #imStickyBar { display: none !important; }
#imContent { max-width:1200px; margin:3rem auto 2rem; padding:0 1rem; background:linear-gradient(90deg,var(--beige-light) 60%, var(--beige-dark) 100%); border:2px solid var(--beige-dark); border-radius:16px; box-shadow:0 4px 16px rgba(208,191,165,.12); }
#imContent .text-inner { background:#fffbe9; border:1px solid var(--beige-border); border-radius:12px; box-shadow:0 2px 6px rgba(208,191,165,.15); padding:2rem; }
#imFooter { background:var(--beige-dark); color:#333; text-align:center; padding:1rem 0; margin-top:2rem; border-radius:0 0 16px 16px; font-size:.95em; }
#imFooter a { color:var(--green); text-decoration:none; margin:0 1rem; }
#imFooter a:hover { text-decoration:underline; }

/* Deko-Pflanzen (subtil, responsiv) */
.with-plants { position: relative; overflow: hidden; }
.with-plants .content-col { position: relative; z-index: 2; }
.plant { position: absolute; opacity: .28; pointer-events: none; z-index: 1; }
.plant-top-left { top: 6px; left: 6px; width: clamp(90px, 12vw, 160px); height: auto; }
.plant-bottom-right { bottom: 6px; right: 6px; width: clamp(110px, 15vw, 220px); height: auto; }
@media (max-width: 1100px) { .plant { opacity:.22; } }
@media (max-width: 900px) { .plant { display: none; } }

/* Foto-Pflanzen (optional) */
.with-plant-photos .plant-photo { position: absolute; z-index: 1; pointer-events: none; opacity: .45; filter: saturate(1.1) contrast(1.02); border-radius: 10px; box-shadow: 0 6px 18px rgba(0,0,0,.12); border: 1px solid var(--beige-dark); }
.with-plant-photos .plant-photo-1 { top: 24px; right: 12px; width: clamp(120px, 12vw, 220px); transform: rotate(2deg); }
.with-plant-photos .plant-photo-2 { bottom: 18px; left: 10px; width: clamp(120px, 13vw, 240px); transform: rotate(-3deg); }
.with-plant-photos .plant-photo-3 { top: 40%; left: -12px; width: clamp(110px, 11vw, 200px); transform: rotate(-6deg); }
.with-plant-photos .plant-photo-4 { bottom: 8%; right: -8px; width: clamp(110px, 11vw, 200px); transform: rotate(5deg); }
.with-plant-photos .content-col { z-index: 2; }
@media (max-width: 1100px) { .with-plant-photos .plant-photo { opacity: .35; } }
@media (max-width: 900px) { .with-plant-photos .plant-photo { display: none; } }
