:root{
  --bg:#fbf5ec; --surface:#ffffff; --fg:#211a13; --muted:#7a6a58;
  --line:#ecdfcb; --line-soft:#f5ead9;
  --brand:#b8531f; --brand-soft:#fbe6d4; --brand-ink:#8a3d15;
  --accent:#c98a1e; --accent-soft:#fbf0da;
  --teal:#4f9186; --teal-soft:#e7f1ee;
  --maxw:46rem;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#191410; --surface:#221b15; --fg:#f3e9dd; --muted:#bba98f;
    --line:#3a2e21; --line-soft:#2a221a;
    --brand:#e2895a; --brand-soft:#3a2416; --brand-ink:#f0b28c;
    --accent:#e0b34e; --accent-soft:#332711;
    --teal:#7fb8ac; --teal-soft:#1c2e29;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; overflow-x:hidden}
body{
  margin:0; background:var(--bg); color:var(--fg); overflow-x:hidden;
  font:400 1.0625rem/1.7 ui-serif,Georgia,"Iowan Old Style",Palatino,serif;
}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 1.35rem}
@media (min-width:64rem){ .wrap{max-width:54rem} }
.sans{font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}

h1,h2,h3{font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  line-height:1.15; letter-spacing:-.025em; margin:0 0 .55em; font-weight:650}
h1{font-size:clamp(2rem,6vw,2.9rem)}
h2{font-size:clamp(1.35rem,4vw,1.75rem); margin-top:3.2rem}
h3{font-size:1.1rem; margin-top:1.9rem; letter-spacing:-.01em}
p,li{margin:0 0 1.05rem}
a{color:var(--brand); text-decoration:underline; text-underline-offset:.17em;
  text-decoration-thickness:.06em;
  text-decoration-color:color-mix(in srgb,var(--brand) 40%,transparent)}
a:hover{text-decoration-color:var(--brand)}
hr{border:0; margin:3rem 0; text-align:center}
hr::before{content:"✈ ⸻⸻⸻⸻⸻⸻⸻⸻ ✈"; font-family:ui-sans-serif,system-ui,sans-serif;
  font-size:.7rem; letter-spacing:.15em; color:var(--line); opacity:.8}
small{color:var(--muted); font-size:.875rem}
strong{font-weight:640}

/* Kopf und Fuss */
header.site{padding:1.9rem 0 0}
header.site .wrap{display:flex; align-items:center; justify-content:space-between; gap:1rem}
header.site .brand{font-family:ui-sans-serif,system-ui,sans-serif; font-size:.78rem;
  letter-spacing:.16em; text-transform:uppercase; color:var(--muted);
  text-decoration:none; font-weight:600}
header.site .brand:hover{color:var(--brand)}
header.site .wrap > a:not(.brand){font-family:ui-sans-serif,system-ui,sans-serif;
  font-size:.8rem; color:var(--brand-ink); text-decoration:none; font-weight:680;
  background:var(--brand-soft); padding:.45rem .95rem; border-radius:999px}
header.site .wrap > a:not(.brand):hover{background:var(--brand); color:#fff}
footer.site{margin-top:5rem; padding:2.4rem 0 3.5rem;
  font-family:ui-sans-serif,system-ui,sans-serif; font-size:.855rem; color:var(--muted);
  background:var(--surface); position:relative}
footer.site::before{content:""; position:absolute; top:0; left:0; right:0; height:10px;
  background:repeat-x center/40px 10px
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="40" height="10" viewBox="0 0 40 10"><path d="M0 5 C5 0 15 0 20 5 C25 10 35 10 40 5" fill="none" stroke="%234f9186" stroke-width="1.4" stroke-linecap="round" opacity="0.5"/></svg>')}
footer.site nav a{display:inline-block; margin:0 1.15rem .55rem 0; color:var(--muted);
  text-decoration:none; border-bottom:1px solid transparent}
footer.site nav a:hover{color:var(--fg); border-bottom-color:var(--line)}
footer.site .co{margin-top:1.1rem; color:var(--muted); opacity:.85}

/* Aufmacher, mit warmem Verlaufshintergrund statt flacher Flaeche */
.hero{padding:3rem 0 1.5rem; margin:0 0 0; position:relative}
.hero::before{content:""; position:absolute; inset:-5.5rem -50vw 0 -50vw; z-index:-1;
  background:radial-gradient(circle 26rem at 88% -6%, rgba(184,83,31,.16), transparent 70%),
             radial-gradient(ellipse 60% 100% at 30% 0%, var(--brand-soft), transparent 70%),
             radial-gradient(ellipse 50% 80% at 90% 20%, var(--teal-soft), transparent 65%);
  opacity:.9;
  -webkit-mask-image:linear-gradient(to bottom, transparent, #000 5.5rem);
  mask-image:linear-gradient(to bottom, transparent, #000 5.5rem)}
.hero::after{content:""; position:absolute; top:-2.4rem; right:-3.2rem; width:19rem; height:19rem;
  z-index:-1; pointer-events:none; opacity:.65;
  background:no-repeat center/contain url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 300"><g fill="none" stroke="%234f9186" stroke-width="6" stroke-linecap="round" opacity="0.55"><path d="M255 300 L255 120"/><path d="M255 210 C205 180 172 130 158 60"/><path d="M255 235 C310 210 345 165 360 100"/><path d="M255 180 C215 158 197 112 197 45"/><path d="M255 260 C305 245 340 205 360 145"/></g><g fill="none" stroke="%23c98a1e" stroke-width="5" stroke-linecap="round" opacity="0.42"><path d="M195 300 L195 195"/><path d="M195 260 C165 245 145 215 135 175"/><path d="M195 275 C230 265 250 235 258 195"/></g><g fill="none" stroke="%23b8531f" stroke-width="4" stroke-linecap="round" opacity="0.3"><path d="M150 300 L150 240"/><path d="M150 280 C130 272 116 254 111 226"/></g></svg>')}
.eyebrow{display:inline-block; font-family:ui-sans-serif,system-ui,sans-serif;
  font-size:.72rem; font-weight:660; letter-spacing:.13em; text-transform:uppercase;
  color:var(--brand-ink); background:var(--brand-soft); padding:.4rem .75rem;
  border-radius:999px; margin-bottom:1.15rem}
.lede{font-size:1.2rem; line-height:1.6; color:var(--muted); margin:0 0 1.8rem}
.facts{display:flex; flex-wrap:wrap; gap:.55rem; margin:0 0 2rem; padding:0; list-style:none}
.facts li{font-family:ui-sans-serif,system-ui,sans-serif; font-size:.82rem; font-weight:560;
  color:var(--fg); background:var(--surface); border:1px solid var(--line);
  padding:.42rem .8rem; border-radius:999px; margin:0}

.mark{color:var(--brand); font-weight:680}

/* Sprachumschalter auf den Blogseiten */
.lang-switch{margin:0 0 1.6rem; font-family:ui-sans-serif,system-ui,sans-serif; font-size:.85rem}
.lang-switch a{color:var(--muted); text-decoration:none; border-bottom:1px solid var(--line)}
.lang-switch a:hover{color:var(--brand); border-bottom-color:var(--brand)}

/* Kaesten */
.callout{background:var(--accent-soft); border-left:3px solid var(--accent);
  padding:1.15rem 1.25rem; margin:1.9rem 0; border-radius:0 8px 8px 0}
.callout p:last-child{margin-bottom:0}
.card{background:var(--surface); border:1px solid var(--line); border-radius:12px;
  padding:1.5rem 1.6rem; margin:1.7rem 0; box-shadow:0 1px 2px rgba(90,50,10,.04)}
.card h3{margin-top:0; color:var(--brand)}
.card p:last-child{margin-bottom:0}
.card + .card{margin-top:1rem}

/* Getoente Abschnitte, um reinen Fliesstext aufzulockern */
.panel{background:var(--surface); border:1px solid var(--line); border-radius:16px;
  padding:1.9rem 1.7rem; margin:2.2rem 0; box-shadow:0 1px 2px rgba(90,50,10,.04)}
.panel h2, .panel h3{margin-top:0}
.panel > *:last-child{margin-bottom:0}

/* Bereiche */
.areas{list-style:none; padding:0; margin:1.6rem 0; counter-reset:a;
  border:1px solid var(--line); border-radius:12px; overflow:hidden;
  background:var(--surface)}
.areas li{counter-increment:a; padding:.82rem 1.1rem .82rem 3.3rem; position:relative;
  border-bottom:1px solid var(--line-soft); margin:0;
  font-family:ui-sans-serif,system-ui,sans-serif; font-size:.98rem}
.areas li:last-child{border-bottom:0}
.areas li::before{content:counter(a,decimal-leading-zero); position:absolute; left:1.1rem;
  top:.85rem; font-size:.74rem; font-weight:680; color:var(--brand);
  font-variant-numeric:tabular-nums}

/* Kauf */
.buy{background:linear-gradient(160deg, var(--surface), var(--brand-soft) 140%);
  border:1px solid var(--line); border-radius:16px;
  padding:2.2rem 1.6rem; margin:2.2rem 0; text-align:center}
.price{font-family:ui-sans-serif,system-ui,sans-serif; font-size:2.9rem; font-weight:680;
  letter-spacing:-.035em; display:block; color:var(--fg); line-height:1}
.price small{display:block; font-size:.8rem; font-weight:400; letter-spacing:0;
  margin-top:.5rem; color:var(--muted)}
.btn{display:inline-block; margin:1.4rem 0 .9rem; padding:1rem 2.4rem;
  background:var(--brand); color:#fff; border-radius:10px; text-decoration:none;
  font-family:ui-sans-serif,system-ui,sans-serif; font-weight:620; font-size:1.03rem;
  letter-spacing:-.01em; border:0; box-shadow:0 4px 14px rgba(184,83,31,.25)}
.btn:hover{background:var(--brand-ink); text-decoration:none}
.btn.todo{background:var(--muted); cursor:not-allowed; box-shadow:none}
.buy .terms{margin:0; font-size:.855rem; line-height:1.55; color:var(--muted)}

/* Einwaende */
dl.faq{margin:1.6rem 0}
dl.faq dt{font-weight:640; font-family:ui-sans-serif,system-ui,sans-serif;
  margin-top:1.7rem; color:var(--fg); font-size:1.02rem}
dl.faq dt::before{content:"„"; color:var(--brand); font-weight:700}
dl.faq dt::after{content:"\201C"; color:var(--brand); font-weight:700}
dl.faq dd{margin:.5rem 0 0; color:var(--muted); padding-left:.1rem}

/* Stimmen */
.voices{display:flex; gap:1rem; margin:1.7rem 0; padding:0 0 .4rem; overflow-x:auto;
  scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch}
.voice{background:var(--surface); border:1px solid var(--line); border-radius:12px;
  padding:1.3rem 1.4rem; flex:0 0 auto; width:min(85vw,340px); scroll-snap-align:start}
.stars{color:var(--accent); letter-spacing:.12em}
.voice .stars{display:block; font-size:.95rem; margin:0 0 .5rem}
.voices-summary{display:flex; align-items:center; gap:.5rem; margin:0 0 1.1rem;
  font-family:ui-sans-serif,system-ui,sans-serif}
.voices-summary strong{font-size:1.05rem; color:var(--fg)}
.voices-summary .muted{color:var(--muted); font-size:.9rem}
.voice p{margin:0 0 .7rem; font-style:italic}
.voice cite{font-family:ui-sans-serif,system-ui,sans-serif; font-size:.83rem;
  font-style:normal; color:var(--muted); font-weight:560}

/* Ueber mich, mit Foto */
.about{background:var(--brand-soft); border-radius:16px; padding:1.9rem 1.7rem;
  margin:1.9rem 0; display:flex; gap:1.4rem; flex-wrap:wrap; align-items:flex-start;
  position:relative}
.about::after{content:""; position:absolute; top:-.6rem; right:-1.3rem; width:6.5rem; height:6.5rem;
  z-index:0; pointer-events:none; opacity:.4;
  background:no-repeat center/contain url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200"><g fill="none" stroke="%234f9186" stroke-width="6" stroke-linecap="round"><path d="M110 195 C112 150 108 95 78 42"/><path d="M108 150 C65 132 32 100 16 58"/><path d="M108 128 C55 118 22 92 6 96"/></g></svg>')}
.about > *{position:relative}
.about .pic{flex:0 0 auto}
.about .pic img{width:132px; height:132px; border-radius:50%; object-fit:cover;
  border:3px solid var(--surface); box-shadow:0 2px 8px rgba(90,50,10,.15); display:block}
.about .txt{flex:1 1 14rem; min-width:0}
.about .txt p:last-child{margin-bottom:0}
.about a{color:var(--brand-ink)}
:root:not([data-theme="light"]) .about a{color:var(--brand)}

/* Rechtstexte */
.legal{font-size:.99rem}
.legal pre{white-space:pre-wrap; word-wrap:break-word; font:inherit; margin:0;
  line-height:1.75}

table{width:100%; border-collapse:collapse; margin:1.5rem 0; font-size:.95rem}
th,td{text-align:left; padding:.65rem .55rem; border-bottom:1px solid var(--line);
  vertical-align:top}
th{font-family:ui-sans-serif,system-ui,sans-serif; font-size:.76rem; letter-spacing:.07em;
  text-transform:uppercase; color:var(--muted); font-weight:640}
.scroll{overflow-x:auto}
code{background:var(--line-soft); padding:.12em .4em; border-radius:4px; font-size:.9em}

/* Ressourcenseite: engere Abstaende, Anbieter als Karten statt Fliesstext */
body.ressourcen h2{margin-top:2.4rem}
body.ressourcen .card h3{margin-top:0}
body.ressourcen .card ul{margin-bottom:0}
body.ressourcen .card ul li:last-child{margin-bottom:0}

/* Titelbereich wie auf der Startseite, mit demselben Wedel-Akzent (dort bewaehrt) */
body.ressourcen .hero{padding:2.2rem 0 1.5rem}

/* Trennlinien als durchgehende Welle ueber die volle Breite statt Gedankenstrich-Reihe */
body.ressourcen hr{margin:1.8rem 0}
body.ressourcen hr::before{content:""; display:block; width:100%; height:14px;
  background:repeat-x center/44px 14px url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="44" height="14" viewBox="0 0 44 14"><path d="M0 7 C6 1 15 1 22 7 C29 13 38 13 44 7" fill="none" stroke="%234f9186" stroke-width="1.8" stroke-linecap="round" opacity="0.55"/></svg>')}