/* Schriften lokal auf dem eigenen Server (SIL Open Font License 1.1, siehe fonts/*-OFL.txt) – keine Verbindung zu Google */
@font-face{font-family:"Poppins";src:url("fonts/Poppins-Regular.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Poppins";src:url("fonts/Poppins-Medium.woff") format("woff");font-weight:500 600;font-style:normal;font-display:swap}
@font-face{font-family:"Poppins";src:url("fonts/Poppins-Bold.woff") format("woff");font-weight:700 800;font-style:normal;font-display:swap}
@font-face{font-family:"Lora";src:url("fonts/Lora-Regular.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Lora";src:url("fonts/Lora-Italic.woff") format("woff");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Lora";src:url("fonts/Lora-Bold.woff") format("woff");font-weight:600 700;font-style:normal;font-display:swap}
@font-face{font-family:"Lora";src:url("fonts/Lora-BoldItalic.woff") format("woff");font-weight:600 700;font-style:italic;font-display:swap}
:root{
  --rot:#B83C72; --rot-dunkel:#7E2550;
  --tief:#4B2E6B; --gelb:#F2A33A; --gruen:#4E8B5C;
  --bg:#F7F3F8; --surface:#FFFFFF; --text:#2A1B3D; --muted:#6B5E78; --line:#E6DDEB;
  --hero:#2A1B3D; --hero-text:#FFF4E8;
  --display:"Poppins", "Segoe UI", system-ui, sans-serif;
  --body:"Lora", Georgia, "Times New Roman", serif;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#17101F; --surface:#241A30; --text:#F3EDF6; --muted:#BFB2CB; --line:#3A2D48;
    --hero:#140C1E; --hero-text:#FFF4E8; --rot:#E77FAA;
  }
}
:root[data-theme="dark"]{
  --bg:#17101F; --surface:#241A30; --text:#F3EDF6; --muted:#BFB2CB; --line:#3A2D48;
  --hero:#140C1E; --hero-text:#FFF4E8; --rot:#E77FAA;
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body);font-size:1.0625rem;line-height:1.65;min-height:100vh;display:flex;flex-direction:column}
img,svg{max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--gelb);outline-offset:3px;border-radius:6px}

/* Kopfzeile: Social + Flaggen */
.topbar{position:absolute;top:calc(env(safe-area-inset-top,0px) + 14px);right:18px;z-index:10;display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.social,.flags{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.social a{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12);color:var(--hero-text);transition:transform .2s, background .2s}
.social a:hover{transform:scale(1.15);background:var(--rot)}
.social a[aria-disabled="true"]{opacity:.45;cursor:default}
.social a[aria-disabled="true"]:hover{transform:none;background:rgba(255,255,255,.12)}
.social svg{width:17px;height:17px}
.flags button{border:0;padding:0;background:none;cursor:pointer;width:26px;height:18px;border-radius:3px;overflow:hidden;opacity:.6;transition:opacity .2s, transform .2s}
.flags button:hover,.flags button[aria-pressed="true"]{opacity:1;transform:scale(1.12)}
.flags svg{display:block;width:100%;height:100%}
body.sub .social a{background:var(--tief);color:#fff}
body.sub .social a[aria-disabled="true"]:hover{background:var(--tief)}

/* Startseite */
.home{flex:1;background:radial-gradient(ellipse at 30% 55%, #4F3474 0%, var(--hero) 62%);color:var(--hero-text);display:grid;grid-template-columns:minmax(0,340px) auto;justify-content:center;align-items:center;gap:clamp(.5rem,1.5vw,1.25rem);padding:5.5rem clamp(1.25rem,5vw,4.5rem) 3rem}
.hero-art{position:relative;display:flex;flex-direction:column;align-items:center}
.title-block{position:absolute;top:calc(36% - .6rem);left:50%;transform:translateX(-50%) rotate(-8deg);text-align:center;z-index:2;width:max-content;max-width:100%}
.hero-art .owner{display:block;margin:0 0 .01em;font-family:var(--display);font-weight:800;font-size:clamp(2rem,5.2vw,4rem);line-height:1;letter-spacing:-.02em;color:#2A1B3D;text-shadow:0 0 1px #FFF4E8,0 2px 0 rgba(255,243,214,.55),0 0 18px rgba(255,197,107,.45)}
.hero-art .main{display:block}
.hero-art h1{margin:0;font-family:var(--display);font-weight:800;font-size:clamp(3.2rem,9.5vw,7.4rem);line-height:.9;letter-spacing:-.04em;color:var(--gelb);text-shadow:0 5px 0 var(--rot-dunkel),0 0 30px rgba(42,27,61,.75)}
.hero-art .tagline{margin:calc(.25rem - 3px) 0 0;white-space:pre-line;font-family:var(--display);font-weight:600;font-size:clamp(1rem,2vw,1.35rem);color:#FFF4E8;line-height:1.3;text-shadow:0 2px 10px rgba(42,27,61,.9),0 0 3px rgba(42,27,61,.9)}
.hero-art{cursor:default}
.menu{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.55rem}
.menu a{display:flex;align-items:center;gap:1.1rem;text-decoration:none;color:var(--hero-text);padding:.35rem .8rem .35rem .35rem;border-radius:999px;transition:background .25s}
.menu .ico{flex:none;width:66px;height:66px;border-radius:50%;display:grid;place-items:center;background:var(--c);color:#fff;box-shadow:0 0 0 0 var(--c);transition:transform .25s cubic-bezier(.3,1.6,.5,1), box-shadow .25s}
.menu .ico svg{width:31px;height:31px}
.menu strong{display:block;font-family:var(--display);font-size:1.5rem;font-weight:600;line-height:1.1}
.menu small{display:block;font-size:.95rem;color:#DCCDE8}
.menu a:hover,.menu a:focus-visible{background:rgba(255,255,255,.07)}
.menu a:hover .ico,.menu a:focus-visible .ico{transform:scale(1.14) rotate(-6deg);box-shadow:0 0 0 6px rgba(255,255,255,.12),0 0 28px 4px var(--c)}

/* Unterseiten */
.page{flex:1;width:100%;max-width:1060px;margin:0 auto;padding:5.5rem clamp(1.1rem,4vw,2.5rem) 3rem}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;font-family:var(--display);font-size:.95rem;margin-bottom:1.6rem}
.crumb{display:inline-flex;align-items:center;gap:.45rem;padding:.42rem .95rem .42rem .5rem;border-radius:999px;font-weight:600;text-decoration:none;line-height:1}
.crumb .ci{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;flex:none}
.crumb .ci svg{width:14px;height:14px}
.crumb-home{background:var(--surface);color:var(--tief);border:2px solid var(--line);transition:transform .2s cubic-bezier(.3,1.6,.5,1),background .2s,color .2s,border-color .2s,box-shadow .2s}
.crumb-home .ci{background:var(--rot);color:#fff;transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.crumb-home:hover,.crumb-home:focus-visible{background:var(--tief);border-color:var(--tief);color:#fff;transform:translateY(-2px);box-shadow:0 8px 18px -8px rgba(75,46,107,.7)}
.crumb-home:hover .ci,.crumb-home:focus-visible .ci{transform:rotate(-14deg) scale(1.12)}
.crumb-home:active{transform:translateY(1px)}
.crumb-sep{width:18px;height:18px;color:var(--muted);flex:none}
.crumb-here{background:var(--c);color:#fff;border:2px solid var(--c)}
.crumb-here .ci{background:rgba(255,255,255,.22)}
:root[data-theme="dark"] .crumb-home{color:#E2CCF2}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .crumb-home{color:#E2CCF2}}
.page-head{display:flex;align-items:center;gap:1.2rem;margin-bottom:1.5rem}
.page-head .ico{flex:none;width:84px;height:84px;border-radius:50%;background:var(--c);color:#fff;display:grid;place-items:center}
.page-head .ico svg{width:40px;height:40px}
.page h1{font-family:var(--display);font-weight:800;font-size:clamp(2.2rem,5vw,3.4rem);line-height:1;letter-spacing:-.02em;margin:0}
.page h2{font-family:var(--display);font-weight:600;font-size:1.6rem;margin:2.4rem 0 .6rem;line-height:1.2}
.prose{max-width:68ch}
.prose p{margin:0 0 1rem}
.lang-note{background:var(--gelb);color:#2A1B3D;padding:.6rem 1rem;border-radius:10px;font-family:var(--display);font-size:.95rem;margin-bottom:1.5rem;max-width:68ch}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:1.2rem 1.4rem}

/* Gesundheit */
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1rem;margin-top:1rem}
.facts .panel h3{font-family:var(--display);margin:0 0 .3rem;font-size:1.15rem}
.facts .panel{border-top:6px solid var(--c)}
.facts .panel p{margin:0;font-size:1rem}
.warn{border-left:6px solid var(--rot);background:var(--surface);padding:1rem 1.2rem;border-radius:0 14px 14px 0;margin-top:1.5rem;max-width:68ch}

/* Geschichte: Zeitleiste */
.timeline{list-style:none;padding:0;margin:1.5rem 0 0;position:relative;max-width:72ch}
.timeline::before{content:"";position:absolute;left:5.6rem;top:.5rem;bottom:.5rem;width:4px;border-radius:2px;background:linear-gradient(var(--gruen),var(--gelb),var(--rot),var(--tief))}
.timeline li{display:grid;grid-template-columns:5rem 1fr;gap:1.6rem;padding:.6rem 0;position:relative}
.timeline li::before{content:"";position:absolute;left:5.1rem;top:1.05rem;width:14px;height:14px;border-radius:50%;background:var(--bg);border:4px solid var(--rot)}
.timeline time{font-family:var(--display);font-weight:800;text-align:right;line-height:1.3;padding-top:.45rem}
.timeline h3{font-family:var(--display);margin:0;font-size:1.15rem}
.timeline p{margin:.2rem 0 0}

/* Allgemeines */
.svg-defs{position:absolute;width:0;height:0;overflow:hidden}
.page-hero{margin:0 0 1.8rem;border-radius:26px;overflow:hidden;line-height:0;box-shadow:0 18px 40px -20px rgba(42,27,61,.55)}
.page-hero svg,.page-hero img{width:100%;height:auto;display:block}
.lead{font-size:1.2rem;line-height:1.6}
.prose a{color:var(--rot);font-weight:600}
.species{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin:1.2rem 0 .5rem}
.sp{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:1rem 1.1rem 1.2rem}
.sp-img{width:96px;height:96px;border-radius:50%;background:linear-gradient(135deg,#7A5AA0,#2A1B3D);display:grid;place-items:center;margin-bottom:.7rem}
.sp-img svg{width:74px;height:74px}
.sp h3{font-family:var(--display);font-size:1.05rem;margin:0}
.sp-ex{font-family:var(--display);font-size:.88rem;color:var(--muted);margin:.15rem 0 .5rem;line-height:1.35}
.sp p:last-child{margin:0;font-size:.97rem;line-height:1.5}
.swatches{display:flex;flex-wrap:wrap;gap:1.1rem 1.4rem;margin:1rem 0 .5rem}
.sw{display:flex;flex-direction:column;align-items:center;text-align:center;width:6.5rem}
.sw span{width:56px;height:56px;border-radius:50%;border:3px solid var(--surface);box-shadow:0 0 0 1px var(--line);margin-bottom:.4rem}
.sw strong{font-family:var(--display);font-size:.98rem}
.sw small{font-size:.82rem;color:var(--muted);line-height:1.3}
.timeline time{font-size:.95rem}
.world{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:.2rem 1.6rem;margin:1rem 0 .5rem;max-width:900px}
.w{padding:.7rem 0;border-bottom:1px solid var(--line)}
.w strong{display:block;font-family:var(--display);font-size:1.05rem}
.w span{font-size:.97rem;color:var(--muted)}
.facts.five{grid-template-columns:repeat(auto-fit,minmax(165px,1fr))}
.myths{display:flex;flex-direction:column;gap:.8rem;margin:1rem 0 .5rem;max-width:820px}
.myth{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:1.2rem;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:1rem 1.2rem}
.myth p{margin:0}
.myth .m{font-family:var(--display);font-weight:600;font-size:1.05rem;line-height:1.35}
.tag{display:inline-block;font-size:.78rem;font-weight:600;padding:.12rem .6rem;border-radius:999px;color:#fff;margin:0 .5rem .3rem 0;vertical-align:.1em}
.tag.no{background:var(--rot)}.tag.yes{background:var(--gruen)}
.myth .f{font-size:.98rem}
.disclaimer{margin-top:2rem;font-size:.9rem;color:var(--muted);max-width:68ch}
@media (max-width:700px){.myth{grid-template-columns:1fr;gap:.4rem}}
/* Besucherzähler */
.counter{margin:2.6rem 0 0;max-width:560px;padding:1.4rem 1.6rem 1.6rem;border-radius:24px;background:linear-gradient(135deg,#4B2E6B,#2A1B3D);color:#FFF4E8;position:relative;overflow:hidden}
.counter-label{font-family:var(--display);font-weight:600;font-size:1.15rem;margin:0 0 .9rem}
.counter-digits{display:flex;gap:.4rem}
.dg{width:2.6rem;height:3.4rem;display:grid;place-items:center;border-radius:10px;font-family:var(--display);font-weight:800;font-size:2rem;font-variant-numeric:tabular-nums;color:#2A1B3D;
  background:linear-gradient(#FFD99A 0 50%,#F2A33A 50% 100%);box-shadow:inset 0 -3px 0 rgba(0,0,0,.18),0 4px 0 #7E2550;animation:flip .5s cubic-bezier(.3,1.5,.5,1) both}
.dg.off{background:rgba(255,255,255,.12);color:rgba(255,243,214,.5);box-shadow:none;animation:none}
@keyframes flip{from{transform:rotateX(90deg);opacity:0}to{transform:none;opacity:1}}
.counter-art{position:absolute;right:-6px;top:50%;width:120px;height:120px;opacity:.9;transform:translateY(-50%) rotate(-20deg);pointer-events:none}
@media (max-width:480px){.dg{width:2.1rem;height:2.9rem;font-size:1.6rem}.counter-art{width:84px;height:84px}}
/* Kontakt */
.contact{max-width:720px;display:flex;flex-direction:column;gap:1rem;margin-top:1.4rem}
.cf-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.cf-field{display:flex;flex-direction:column;gap:.35rem}
.cf-field span{font-family:var(--display);font-weight:600;font-size:.98rem}
.cf-field small{font-weight:400;color:var(--muted)}
.cf-field input,.cf-field textarea{font:inherit;font-size:1rem;color:var(--text);background:var(--surface);border:2px solid var(--line);border-radius:14px;padding:.7rem .9rem;transition:border-color .2s,box-shadow .2s}
.cf-field textarea{resize:vertical;min-height:9rem;line-height:1.5}
.cf-field input:focus,.cf-field textarea:focus{outline:none;border-color:var(--tief);box-shadow:0 0 0 4px rgba(75,46,107,.15)}
.cf-field .invalid,.cf-field input.invalid,.cf-field textarea.invalid{border-color:var(--rot)}
.cf-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cf-consent{display:flex;gap:.7rem;align-items:flex-start;font-size:.95rem;line-height:1.45;padding:.3rem;border-radius:10px}
.cf-consent input{width:1.25rem;height:1.25rem;margin-top:.15rem;accent-color:var(--tief);flex:none}
.cf-consent.invalid{outline:2px solid var(--rot);outline-offset:2px}
.cf-consent a{color:var(--rot);font-weight:600}
.cf-captcha{min-height:78px}
.cf-gate{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1.2rem;padding:1rem 1.1rem;border:2px solid var(--line);border-radius:14px;background:var(--surface)}
.cf-gate p{margin:0;flex:1 1 300px;font-size:.92rem;line-height:1.5;color:var(--muted)}
.cf-gate a{color:var(--rot);font-weight:600}
.cf-gate-btn{font-family:var(--display);font-weight:600;font-size:.95rem;border:2px solid var(--tief);background:transparent;color:var(--tief);padding:.55rem 1.1rem;border-radius:999px;cursor:pointer;transition:background .2s,color .2s,transform .2s}
.cf-gate-btn:hover{background:var(--tief);color:#fff;transform:translateY(-2px)}
.cf-note{margin:0;padding:.8rem 1rem;border:2px dashed var(--line);border-radius:12px;color:var(--muted);font-size:.92rem}
.cf-actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem}
.cf-send{font-family:var(--display);font-weight:600;font-size:1.05rem;border:0;cursor:pointer;background:var(--rot);color:#fff;padding:.85rem 1.6rem;border-radius:999px;box-shadow:0 6px 0 var(--rot-dunkel);transition:transform .15s,box-shadow .15s,background .15s}
.cf-send:hover{background:#D2588B;transform:translateY(-2px);box-shadow:0 8px 0 var(--rot-dunkel)}
.cf-send:active{transform:translateY(4px);box-shadow:0 2px 0 var(--rot-dunkel)}
.cf-send:disabled{opacity:.6;cursor:wait;transform:none}
.cf-status{margin:0;font-size:.95rem}
.cf-status.err{color:var(--rot);font-weight:600}
.cf-done{max-width:720px;margin-top:1.4rem;padding:2rem 1.6rem;border-radius:24px;background:var(--surface);border:2px solid var(--gruen);text-align:center}
.cf-done svg{width:72px;height:72px;animation:flip .6s cubic-bezier(.3,1.5,.5,1) both}
.cf-done h2{font-family:var(--display);margin:.4rem 0}
.cf-done p{margin:0}
@media (max-width:700px){.cf-row{grid-template-columns:1fr}.cf-send{width:100%}}
/* Datenschutz */
.privacy h2{font-size:1.35rem}
.privacy a{color:var(--rot);font-weight:600;word-break:break-word}
.todo{background:#FFD99A;color:#2A1B3D;padding:.05rem .35rem;border-radius:6px;font-weight:600}
.imp-h{font-family:var(--display);font-size:1.1rem;margin:1.6rem 0 .4rem}
.cf-ok{margin:0;padding:.8rem 1rem;border:2px solid var(--gruen);border-radius:12px;font-size:.88rem;line-height:1.5;color:var(--muted)}
.cf-ok span{color:var(--gruen);font-weight:800;margin-right:.2rem}
.cf-ok a{color:var(--rot);font-weight:600}
.grecaptcha-badge{visibility:hidden}
/* Unterstützen */
.support{max-width:720px;margin:1.6rem 0 1rem;padding:1.6rem 1.7rem;border-radius:26px;background:linear-gradient(135deg,#4B2E6B,#2A1B3D);color:#FFF4E8;position:relative;overflow:hidden}
.support::after{content:"";position:absolute;right:-50px;top:-50px;width:200px;height:200px;border-radius:50%;background:rgba(194,71,122,.32)}
.support-head{display:flex;gap:1rem;align-items:center;position:relative;z-index:1}
.support-heart{flex:none;width:58px;height:58px;border-radius:50%;background:var(--rot);color:#fff;display:grid;place-items:center}
.support:hover .support-heart{animation:beat 1.6s ease-in-out infinite}
.support-heart svg{width:28px;height:28px}
@keyframes beat{0%,100%{transform:scale(1)}12%{transform:scale(1.12)}24%{transform:scale(1)}36%{transform:scale(1.08)}48%{transform:scale(1)}}
.support h2{font-family:var(--display);font-weight:800;font-size:1.5rem;margin:0;color:#FFF4E8}
.support-head p{margin:.2rem 0 0;font-size:.95rem;color:#E6D9EE}
.support-amounts{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;margin:1.3rem 0 1rem;position:relative;z-index:1}
.amount{display:flex;flex-direction:column;align-items:center;gap:.15rem;padding:.9rem .6rem;border-radius:18px;background:rgba(255,255,255,.1);border:2px solid rgba(255,255,255,.18);color:#FFF4E8;text-decoration:none;text-align:center;transition:transform .2s cubic-bezier(.3,1.6,.5,1),background .2s,border-color .2s}
.amount strong{font-family:var(--display);font-weight:800;font-size:1.6rem;color:#FFC56B}
.amount span{font-size:.82rem;color:#E6D9EE;line-height:1.3}
.amount:hover,.amount:focus-visible{transform:translateY(-3px);background:rgba(255,197,107,.16);border-color:#FFC56B}
.paypal-btn{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:.6rem;width:100%;padding:.95rem 1.2rem;border-radius:999px;background:#FFC439;color:#003087;font-family:var(--display);font-weight:700;font-size:1.05rem;text-decoration:none;box-shadow:0 6px 0 #C99A1A;transition:transform .15s,box-shadow .15s,background .15s}
.paypal-btn svg{width:22px;height:22px}
.paypal-btn:hover{background:#FFD46A;transform:translateY(-2px);box-shadow:0 8px 0 #C99A1A}
.paypal-btn:active{transform:translateY(4px);box-shadow:0 2px 0 #C99A1A}
.support-note{position:relative;z-index:1;margin:1.1rem 0 0;font-size:.82rem;color:#C9BAD6;line-height:1.5}
.facts .panel a{color:var(--rot);font-weight:600}
.support-thanks{margin-top:2rem;font-family:var(--display);font-weight:600;font-size:1.2rem;color:var(--tief)}
@media (max-width:560px){.support{padding:1.3rem 1.1rem}.support-amounts{gap:.45rem}.amount{padding:.75rem .3rem}.amount strong{font-size:1.35rem}.amount span{font-size:.74rem}}
@media (max-width:560px){footer{justify-content:center;text-align:center}}
.sb-facts dd small.sb-note{font-style:italic;margin-top:.3rem}
.pt-stand{display:flex;align-items:center;gap:.35rem;margin-top:.7rem;padding-top:.6rem;border-top:1px solid var(--line);font-size:.85rem;color:var(--muted)}
.pt-stand svg{width:15px;height:15px;flex:none}
.pt-stand + .pt-more{margin-top:.35rem}
[hidden]{display:none!important}
.cf-done{outline:none}
.cf-done-back{margin-top:1.4rem!important}
.cf-done-back a.back-btn{color:#3B6E48}
.cf-done-back a.back-btn:hover,.cf-done-back a.back-btn:focus-visible{background:#4E8B5C;color:#fff;transform:translateY(-2px)}
/* Fußzeile */
footer{padding:1rem clamp(1.1rem,4vw,2.5rem);display:flex;justify-content:flex-end;flex-wrap:wrap;gap:.5rem 1.4rem;font-family:var(--display);font-size:.95rem;border-top:1px solid var(--line);background:var(--bg)}
body.start footer{background:var(--hero);border-top-color:rgba(255,255,255,.08);color:var(--hero-text)}
footer a{text-decoration:none;opacity:.85}
footer a:hover{opacity:1;text-decoration:underline}

/* ---------- Tablet ---------- */
@media (max-width:1000px){
  .home{grid-template-columns:minmax(0,280px) auto;gap:.5rem}
  .lotus{width:min(100%,280px)}
  .menu{gap:.35rem}
  .menu .ico{width:56px;height:56px}
  .menu .ico svg{width:27px;height:27px}
  .menu strong{font-size:1.25rem}
  .menu small{font-size:.88rem}
}
/* ---------- Handy ---------- */
@media (max-width:700px){
  .home{grid-template-columns:1fr;justify-content:stretch;justify-items:center;gap:1.2rem;padding:6.2rem 1rem 2rem}
  .hero-art{width:100%}
  .lotus{width:auto;height:min(52vh,420px);max-width:78vw}
  .menu{width:100%;max-width:440px;gap:.25rem}
  .menu a{padding:.3rem .6rem .3rem .25rem;gap:.85rem}
  .menu .ico{width:52px;height:52px}
  .menu .ico svg{width:25px;height:25px}
  .menu strong{font-size:1.15rem}
  .menu small{font-size:.85rem;line-height:1.3}
  .page{padding:5.6rem 1rem 2.5rem}
  .page-head{gap:.9rem}
  .page-head .ico{width:60px;height:60px}
  .page-head .ico svg{width:30px;height:30px}
  .page h1{font-size:clamp(1.9rem,8.5vw,2.6rem)}
  .page h2{font-size:1.4rem;margin-top:2rem}
  .lead{font-size:1.08rem}
  .page-hero{border-radius:18px;margin-left:-.25rem;margin-right:-.25rem}
  .crumb{padding:.38rem .8rem .38rem .45rem;font-size:.9rem}
  .species{grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}
  .sp{padding:.8rem .85rem 1rem}
  .sp-img{width:72px;height:72px}
  .sp-img svg{width:56px;height:56px}
  .facts,.facts.five{grid-template-columns:1fr}
  .swatches{gap:.9rem .6rem}
  .sw{width:4.9rem}
  .sw span{width:46px;height:46px}
  /* Zeitleiste: Datum über dem Titel */
  .timeline::before{left:.45rem}
  .timeline li{grid-template-columns:1fr;gap:.1rem;padding:.6rem 0 .6rem 2rem}
  .timeline li::before{left:0;top:.95rem}
  .timeline time{text-align:left;padding-top:.2rem;font-size:.9rem;color:var(--muted)}
  .myth{padding:.9rem 1rem}
  .counter{padding:1.2rem 1.1rem 1.4rem}
  footer{justify-content:center}
}
/* Größere Tippflächen auf Touch-Geräten */
@media (pointer:coarse){
  .social{gap:6px}
  .social a{width:36px;height:36px}
  .flags{gap:10px}
  .flags button{width:30px;height:21px}
}
.home{overflow:hidden}
#app{flex:1;display:flex;flex-direction:column}
@media (min-width:701px) and (max-width:1000px){.facts.five{grid-template-columns:repeat(auto-fit,minmax(135px,1fr))}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- Link zu kohli.de ---------- */
.topbar-row{display:flex;align-items:center;justify-content:flex-end;gap:12px}
.home-link{display:inline-flex;align-items:center;gap:.35rem;padding:.3rem .8rem .3rem .62rem;border-radius:999px;background:#C2477A;color:#fff;font-family:var(--display);font-weight:700;font-size:.85rem;line-height:1.2;text-decoration:none;white-space:nowrap;box-shadow:0 3px 0 #7E2550;transition:transform .15s ease, box-shadow .15s ease}
.home-link svg{width:15px;height:15px;flex:none;display:block}
.home-link:hover{transform:translateY(-2px);box-shadow:0 5px 0 #7E2550;color:#fff;text-decoration:none}
.home-link:active{transform:translateY(2px);box-shadow:0 1px 0 #7E2550}
.home-link:focus-visible{outline:3px solid #F2A33A;outline-offset:3px}
.page{padding-top:calc(env(safe-area-inset-top,0px) + 96px)}
.home{padding-top:calc(env(safe-area-inset-top,0px) + 5.5rem)}
@media (max-width:700px){
  .page{padding-top:calc(env(safe-area-inset-top,0px) + 98px)}
  .home{padding-top:calc(env(safe-area-inset-top,0px) + 7.6rem)}
}
@media (max-width:400px){
  .topbar{right:10px}
  .flags{gap:6px}
  .flags button{width:24px;height:17px}
  .home-link{font-size:.8rem;padding:.28rem .66rem .28rem .52rem;gap:.3rem}
  .home-link svg{width:14px;height:14px}
}
@media (max-width:360px){
  .topbar-row{gap:8px}
}
@media (max-width:340px){
  .flags{gap:5px}
  .flags button{width:21px;height:15px}
  .home-link{font-size:.76rem;padding:.26rem .58rem .26rem .46rem}
}

/* Startbild: engerer Bildausschnitt, Abstände halbiert */
.title-block{top:calc(49% - .6rem)}
@media (max-width:700px){
  .lotus{height:auto;width:min(78vw, calc(min(52vh,420px) * .92));max-width:none}
  .home{padding-top:calc(env(safe-area-inset-top,0px) + 98px);row-gap:20px}
}

/* Statusleiste (safe-area) genau einmal einrechnen: über :root, Kopfleiste und Inhalt darunter ohne zweites env() */
:root{padding-top:env(safe-area-inset-top,0px);box-sizing:border-box}
html{background:var(--bg)}
html:has(body.start){background:var(--hero)}
body{position:relative;min-height:calc(100vh - env(safe-area-inset-top,0px))}
.topbar{top:14px}
.page{padding-top:106px}
.home{padding-top:5.5rem}
@media (max-width:700px){
  .page{padding-top:108px}
  .home{padding-top:108px}
}

/* Abstand Social Media zu Flaggen +5 px; Inhalt rückt mit, damit die Abstände darunter gleich bleiben */
.topbar{gap:13px}
.page{padding-top:111px}
.home{padding-top:calc(5.5rem + 5px)}
@media (max-width:700px){
  .page{padding-top:113px}
  .home{padding-top:113px}
}


/* ---------- Kohlis Yoga ---------- */
/* Startseite: Lotus vor der aufgehenden Sonne, Titel darunter */
.home{background:radial-gradient(ellipse at 30% 45%, #4F3474 0%, var(--hero) 64%)}
.lotus{display:block;width:min(100%,380px);height:auto;overflow:visible;animation:rise 1.6s ease-out both}
.lotus .sun,.lotus .mandala,.lotus .bloom{transform-box:fill-box}
.lotus .sun{transform-origin:50% 50%;animation:sunrise 1.6s cubic-bezier(.2,.7,.2,1) both}
.lotus .mandala{transform-origin:50% 50%;animation:halo 2.2s cubic-bezier(.2,.7,.2,1) .2s both}
.lotus .bloom{transform-origin:50% 100%;animation:bloom 1.5s cubic-bezier(.3,1.35,.5,1) .35s both}
@keyframes rise{from{opacity:0}to{opacity:1}}
@keyframes sunrise{from{transform:translateY(70px);opacity:0}to{transform:none;opacity:1}}
@keyframes halo{from{transform:rotate(-40deg) scale(.85);opacity:0}to{transform:none;opacity:1}}
@keyframes bloom{from{transform:scale(.35,.15);opacity:0}to{transform:none;opacity:1}}
.lotus.ready .sun,.lotus.ready .mandala,.lotus.ready .bloom{animation:none}
.lotus.breathe .bloom{animation:breathe 3.2s ease-in-out both}
.lotus.breathe .mandala{animation:turn 3.2s ease-in-out both}
@keyframes breathe{0%{transform:none}45%{transform:scale(1.07)}100%{transform:none}}
@keyframes turn{0%{transform:none}100%{transform:rotate(15deg)}}
.title-block{position:relative;top:auto;left:auto;transform:none;margin-top:-1.4rem;width:auto}
.hero-art .owner{font-weight:500;font-size:clamp(1.25rem,2.6vw,1.9rem);letter-spacing:.04em;color:var(--gelb);text-shadow:none;margin-bottom:.1rem}
.hero-art h1{font-weight:700;font-size:clamp(3.3rem,7.4vw,5.6rem);line-height:.95;letter-spacing:-.01em;color:#FFF4E8;text-shadow:0 4px 0 #C2477A,0 0 34px rgba(242,163,58,.35)}
.hero-art .tagline{margin-top:.55rem;font-weight:500;color:#F6D9E6;text-shadow:none;letter-spacing:.01em}
.menu small{color:#DCCDE8}
.menu .ico{box-shadow:0 0 0 0 var(--c)}

/* Unterseiten: Allgemeines */
.sp-img{background:linear-gradient(135deg,#FFE7CF,#F6C9DA)}
.sp-img svg{width:70px;height:70px}
.prose a,.facts .panel a,.sp a{color:var(--rot);font-weight:600}
.limbs{list-style:none;margin:1.2rem 0 .5rem;padding:0;max-width:760px;position:relative}
.limbs::before{content:"";position:absolute;left:1.15rem;top:1rem;bottom:1rem;width:3px;border-radius:2px;background:linear-gradient(#C8414B,#E07B24,#E3A91F,#5E9A6B,#2E86AB,#4B4FA3,#8A4FA0)}
.limbs li{display:grid;grid-template-columns:2.3rem minmax(0,1fr);gap:1rem;padding:.55rem 0;position:relative}
.ln{width:2.3rem;height:2.3rem;border-radius:50%;background:var(--c);color:#fff;display:grid;place-items:center;font-family:var(--display);font-weight:700;font-size:1rem;box-shadow:0 0 0 4px var(--bg)}
.limbs h3{font-family:var(--display);font-size:1.15rem;margin:.2rem 0 .1rem}
.limbs h3 small{font-weight:500;font-size:.92rem;color:var(--muted);margin-left:.35rem}
.limbs p{margin:0;font-size:1rem}

/* Übungen: Sonnengruß */
.flow-tools{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem;margin:1.2rem 0 .9rem}
.flow-play{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--display);font-weight:600;font-size:1rem;border:0;cursor:pointer;background:var(--tief);color:#fff;padding:.65rem 1.25rem .65rem .8rem;border-radius:999px;box-shadow:0 5px 0 #2A1B3D;transition:transform .15s,box-shadow .15s}
.flow-play:hover{transform:translateY(-2px);box-shadow:0 7px 0 #2A1B3D}
.flow-play:active{transform:translateY(3px);box-shadow:0 2px 0 #2A1B3D}
.fp-ico{width:22px;height:22px;border-radius:50%;background:#FFF4E8;position:relative;flex:none}
.fp-ico::after{content:"";position:absolute;left:8px;top:6px;border-left:8px solid var(--tief);border-top:5px solid transparent;border-bottom:5px solid transparent}
.flow-play[aria-pressed="true"] .fp-ico::after{left:7px;top:7px;width:8px;height:8px;border:0;background:var(--tief);border-radius:1px}
.flow-hint{font-size:.92rem;color:var(--muted)}
.flow{list-style:none;padding:0;margin:0 0 1rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(122px,1fr));gap:.7rem;max-width:980px}
.flow li{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:.9rem .5rem 1rem;background:var(--surface);border:2px solid var(--line);border-radius:20px;transition:transform .35s cubic-bezier(.3,1.5,.5,1),border-color .3s,box-shadow .3s}
.fl-img{width:84px;height:84px;border-radius:50%;background:linear-gradient(135deg,#FFE7CF,#F6C9DA);display:grid;place-items:center;margin-bottom:.5rem;transition:background .3s}
.fl-img svg{width:64px;height:64px}
.fl-n{position:absolute;top:.5rem;left:.55rem;width:1.6rem;height:1.6rem;border-radius:50%;background:var(--c);color:#fff;font-family:var(--display);font-weight:700;font-size:.82rem;display:grid;place-items:center}
.flow strong{font-family:var(--display);font-weight:600;font-size:1rem;line-height:1.2}
.flow small{font-size:.85rem;line-height:1.35;color:var(--muted);margin-top:.2rem}
.flow li.on{border-color:var(--c);transform:translateY(-6px) scale(1.04);box-shadow:0 16px 30px -16px var(--c)}
.flow li.on .fl-img{background:radial-gradient(circle at 50% 45%,#FFF1DA,var(--c))}

/* Übungen: YouTube */
.yt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:1rem;margin:1.2rem 0 .5rem;max-width:980px}
.yt{display:flex;flex-direction:column;gap:.7rem;padding:1.1rem 1.2rem 1.15rem;background:var(--surface);border:1px solid var(--line);border-radius:22px;color:var(--text);text-decoration:none;transition:transform .25s cubic-bezier(.3,1.6,.5,1),box-shadow .25s,border-color .25s}
.yt:hover,.yt:focus-visible{transform:translateY(-4px);border-color:#C2477A;box-shadow:0 18px 32px -18px rgba(194,71,122,.75)}
.yt-top{display:flex;align-items:center;gap:.8rem}
.yt-ava{flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#F2A33A,#C2477A 60%,#4B2E6B);color:#fff;font-family:var(--display);font-weight:700;font-size:1.05rem;letter-spacing:.02em}
.yt-top strong{display:block;font-family:var(--display);font-weight:600;font-size:1.12rem;line-height:1.2}
.yt-lang{display:inline-block;margin-top:.2rem;font-family:var(--display);font-size:.78rem;font-weight:600;padding:.08rem .55rem;border-radius:999px;background:var(--line);color:var(--muted)}
.yt-text{font-size:.97rem;line-height:1.5;flex:1}
.yt-btn{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--display);font-weight:600;font-size:.95rem;color:var(--rot)}
.yt-btn svg{width:22px;height:22px;color:#E62117}

/* Meditation: Atemkreis */
.breath{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:2rem;align-items:center;max-width:860px;margin:1.4rem 0 1rem;padding:1.6rem;border-radius:28px;background:radial-gradient(circle at 25% 50%,#4B3478,#1A1030 75%);color:#FFF4E8}
.br-stage{position:relative;width:100%;aspect-ratio:1;display:grid;place-items:center}
.br-circle{position:absolute;inset:4%;border-radius:50%;background:radial-gradient(circle at 50% 40%,#FFD9A6 0%,#F08DB0 45%,#8A4FA0 100%);box-shadow:0 0 50px 6px rgba(240,141,176,.35);transform:scale(.42);transition-property:transform;transition-timing-function:ease-in-out;transition-duration:1.2s}
.br-circle.big{transform:scale(1)}
.br-core{position:absolute;width:16%;aspect-ratio:1;border-radius:50%;border:2px solid rgba(255,244,232,.6)}
.br-say{position:relative;margin:0;font-family:var(--display);font-weight:600;font-size:1.35rem;text-shadow:0 2px 12px rgba(26,16,48,.8)}
.br-modes{display:flex;flex-direction:column;gap:.55rem}
.br-modes button{display:flex;flex-direction:column;align-items:flex-start;text-align:left;font:inherit;cursor:pointer;padding:.7rem 1rem;border-radius:16px;border:2px solid rgba(255,244,232,.18);background:rgba(255,255,255,.06);color:#FFF4E8;transition:border-color .2s,background .2s}
.br-modes button strong{font-family:var(--display);font-weight:600;font-size:1.02rem}
.br-modes button small{font-size:.86rem;color:#DCCDE8}
.br-modes button:hover{border-color:rgba(255,244,232,.45)}
.br-modes button[aria-pressed="true"]{border-color:#F2A33A;background:rgba(242,163,58,.16)}
.br-start{margin-top:1rem;font-family:var(--display);font-weight:600;font-size:1.05rem;border:0;cursor:pointer;background:#F2A33A;color:#2A1B3D;padding:.8rem 1.6rem;border-radius:999px;box-shadow:0 5px 0 #B9611A;transition:transform .15s,box-shadow .15s}
.br-start:hover{transform:translateY(-2px);box-shadow:0 7px 0 #B9611A}
.br-start:active{transform:translateY(3px);box-shadow:0 2px 0 #B9611A}
.br-start.on{background:#FFF4E8}
.br-count{margin:.8rem 0 0;font-family:var(--display);font-size:.95rem;color:#DCCDE8}
.breath :focus-visible{outline-color:#F2A33A}

/* Matten: Vergleich */
.cmp-wrap{max-width:980px;margin:1rem 0 .5rem;border:1px solid var(--line);border-radius:20px;background:var(--surface);overflow:hidden}
.cmp{border-collapse:collapse;width:100%;font-size:.98rem}
.cmp th,.cmp td{text-align:left;padding:.75rem .95rem;border-bottom:1px solid var(--line);vertical-align:middle}
.cmp thead th{font-family:var(--display);font-weight:600;background:var(--tief);color:#fff;font-size:.95rem}
.cmp tbody th{font-family:var(--display);font-weight:600;white-space:nowrap}
.cmp tbody tr:last-child th,.cmp tbody tr:last-child td{border-bottom:0}
.cmp .cmp-x{font-size:.95rem;color:var(--muted);line-height:1.45}
.rate{display:inline-flex;gap:4px}
.rate i{width:12px;height:12px;border-radius:50%;background:var(--line)}
.rate i.on{background:#4E8B5C}
.thick{display:flex;flex-direction:column;gap:.9rem;max-width:760px;margin:1rem 0 .5rem}
.th-row{display:grid;grid-template-columns:150px minmax(0,1fr);gap:1.2rem;align-items:center}
.th-bar{display:block;height:calc(var(--mm) * 3.4px + 2px);border-radius:calc(var(--mm) * 1.7px + 1px);background:var(--c);box-shadow:0 3px 0 rgba(42,27,61,.14)}
.th-row strong{font-family:var(--display);font-weight:600;font-size:1.05rem}
.th-row strong small{font-weight:500;color:var(--muted);margin-left:.3rem}
.th-row p{margin:.1rem 0 0;font-size:.97rem}

/* Kissen: Sitzhöhe */
.heights{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;max-width:680px;margin:1rem 0 1.2rem;align-items:end}
.heights div{display:flex;flex-direction:column;align-items:center;text-align:center}
.hb{display:block;width:72%;height:calc(var(--h) * 5px);border-radius:14px 14px 8px 8px;background:var(--c);margin-bottom:.6rem}
.heights strong{font-family:var(--display);font-weight:600;font-size:1rem}
.heights small{font-size:.86rem;color:var(--muted);line-height:1.35}

/* Reisen */
.tip{display:grid;grid-template-columns:150px minmax(0,1fr);gap:1.8rem;align-items:center;max-width:880px;margin:1.6rem 0 1rem;padding:1.7rem 1.9rem;border-radius:28px;background:linear-gradient(135deg,#4B2E6B,#2A1B3D);color:#FFF4E8;position:relative;overflow:hidden}
.tip::after{content:"";position:absolute;right:-70px;top:-70px;width:240px;height:240px;border-radius:50%;background:rgba(242,163,58,.16)}
.tip-art{aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 50% 40%,#F2A33A,#C2477A);display:grid;place-items:center;position:relative;z-index:1}
.tip-art svg{width:62%;height:62%}
.tip>div:last-child{position:relative;z-index:1}
.tip-label{display:inline-block;font-family:var(--display);font-weight:600;font-size:.8rem;background:#F2A33A;color:#2A1B3D;padding:.15rem .7rem;border-radius:999px}
.tip h2{font-family:var(--display);font-weight:700;font-size:clamp(1.4rem,3vw,1.9rem);line-height:1.15;margin:.5rem 0 .6rem;color:#FFF4E8}
.tip p{margin:0 0 .8rem;font-size:1.02rem}
.tip p a{color:#FFC56B;font-weight:600}
.tip-btn{display:inline-flex;align-items:center;gap:.5rem;margin-top:.3rem;font-family:var(--display);font-weight:600;font-size:1.05rem;text-decoration:none;background:#C2477A;color:#fff;padding:.8rem 1.4rem;border-radius:999px;box-shadow:0 6px 0 #7E2550;transition:transform .15s,box-shadow .15s,background .15s}
.tip-btn svg{width:18px;height:18px}
.tip-btn:hover{background:#D2588B;transform:translateY(-2px);box-shadow:0 8px 0 #7E2550}
.tip-btn:active{transform:translateY(4px);box-shadow:0 2px 0 #7E2550}
.tip-btn:focus-visible{outline:3px solid #F2A33A;outline-offset:3px}
.pack{list-style:none;padding:0;margin:.8rem 0 1rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:.5rem;max-width:880px}
.pack label{display:flex;align-items:center;gap:.75rem;padding:.65rem .9rem;border-radius:14px;background:var(--surface);border:1px solid var(--line);cursor:pointer;font-size:.98rem;line-height:1.35;transition:border-color .2s,background .2s}
.pack input{position:absolute;opacity:0;width:1px;height:1px}
.pk-box{flex:none;width:1.4rem;height:1.4rem;border-radius:50%;border:2px solid #C2477A;display:grid;place-items:center;transition:background .2s}
.pk-box::after{content:"";width:.45rem;height:.75rem;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg) translate(-1px,-1px);opacity:0}
.pack input:checked + .pk-box{background:#C2477A}
.pack input:checked + .pk-box::after{opacity:1}
.pack input:checked ~ span:last-child{text-decoration:line-through;color:var(--muted)}
.pack input:focus-visible + .pk-box{outline:3px solid var(--gelb);outline-offset:2px}

/* Kontakt, Impressum */
.cf-done-ico{display:block;width:72px;height:72px;margin:0 auto}
.cf-done-ico svg{width:100%;height:100%}
.counter{background:linear-gradient(135deg,#4B2E6B,#2A1B3D)}
.counter-art{position:absolute;right:6px;top:50%;width:110px;height:110px;opacity:.9;transform:translateY(-50%);pointer-events:none}
.counter-art svg{width:100%;height:100%;display:block}
.dg{box-shadow:inset 0 -3px 0 rgba(0,0,0,.18),0 4px 0 #7E2550}

/* Dunkler Modus: Figuren-Hintergründe bleiben hell, Texte passen sich an */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .rate i.on{background:#7CC08C}
  :root:not([data-theme="light"]) .yt-btn,:root:not([data-theme="light"]) .prose a{color:#F2A3C4}
}
:root[data-theme="dark"] .rate i.on{background:#7CC08C}

/* ---------- Tablet / Handy ---------- */
@media (max-width:1000px){
  .lotus{width:min(100%,300px)}
}
@media (max-width:700px){
  .lotus{width:min(76vw,320px);height:auto;max-width:none}
  .title-block{margin-top:-1rem}
  .home{row-gap:14px}
  .flow{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:.6rem;padding:.6rem .2rem 1rem;margin:0 -1rem 1rem;padding-left:1rem;padding-right:1rem}
  .flow li{flex:0 0 132px;scroll-snap-align:center}
  .breath{grid-template-columns:1fr;padding:1.2rem;gap:1.2rem}
  .br-stage{max-width:260px;margin:0 auto}
  .br-modes{flex-direction:row;flex-wrap:wrap}
  .br-modes button{flex:1 1 130px}
  .br-start{width:100%}
  .cmp-wrap{border:0;background:none;overflow:visible;border-radius:0}
  .cmp thead{display:none}
  .cmp,.cmp tbody{display:block}
  .cmp tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.3rem .6rem;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:.8rem .95rem;margin-bottom:.6rem}
  .cmp th,.cmp td{display:block;border:0;padding:0}
  .cmp tbody th{grid-column:1/-1;font-size:1.08rem}
  .cmp td[data-l]::before{content:attr(data-l);display:block;font-family:var(--display);font-size:.76rem;font-weight:600;color:var(--muted);margin-bottom:.15rem}
  .cmp .cmp-x{grid-column:1/-1;margin-top:.3rem}
  .th-row{grid-template-columns:90px minmax(0,1fr);gap:.9rem}
  .heights{gap:.6rem}
  .tip{grid-template-columns:1fr;padding:1.3rem 1.2rem;gap:1rem}
  .tip-art{width:96px}
  .tip-btn{display:flex;justify-content:center}
  .limbs h3 small{display:block;margin:0}
  .yt-grid{grid-template-columns:1fr}
}

/* Abstände Logo: Desktop 25 px mehr zum Menü (15 + 10), Handy/Tablet 15 px mehr nach oben und unten */
@media (min-width:1001px){
  .home{column-gap:calc(clamp(.5rem,1.5vw,1.25rem) + 25px)}
}
@media (max-width:1000px){
  .hero-art{margin-top:15px;margin-bottom:15px}
}
/* Schriftzug: "Kohlis" größer mit Schatten, Slogan 15 px tiefer */
.hero-art .owner{font-weight:600;font-size:clamp(1.7rem,3.6vw,2.6rem);letter-spacing:.03em;margin-bottom:.05rem;text-shadow:0 3px 0 #C2477A,0 0 24px rgba(242,163,58,.55)}
.hero-art .tagline{margin-top:calc(.55rem + 15px)}

/* Schriftzug: "Kohlis" noch größer in Rosa mit violettem Schatten, Slogan kleiner in einer Zeile */
.hero-art .owner{font-size:clamp(2.1rem,4.6vw,3.3rem);color:#F49AB8;text-shadow:0 4px 0 #8A4FA0,0 0 26px rgba(138,79,160,.65)}
.hero-art .tagline{white-space:nowrap;font-size:clamp(.92rem,1.5vw,1.1rem)}

/* Anzeige / Affiliate (Aufbau wie bei Kohlis Tomaten) */
.promo{display:grid;grid-template-columns:170px minmax(0,1fr);gap:1.6rem;align-items:center;margin:3rem 0 0;max-width:820px;padding:1.5rem 1.8rem;border-radius:26px;
  background:linear-gradient(120deg,#FFD39A 0%,#F7B0C8 55%,#E07FAE 100%);color:#2A1B3D;box-shadow:0 18px 40px -18px rgba(194,71,122,.7);position:relative;overflow:hidden}
.promo::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.2)}
.promo-art svg{width:100%;height:auto;display:block;transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.promo:hover .promo-art svg{transform:rotate(6deg) scale(1.06)}
.promo-text{position:relative;z-index:1}
.promo-label{display:inline-block;font-family:var(--display);font-size:.78rem;font-weight:600;background:rgba(42,27,61,.85);color:#FFF4E8;padding:.15rem .65rem;border-radius:999px}
.promo h2{font-family:var(--display);font-weight:700;font-size:clamp(1.5rem,3vw,2rem);line-height:1.1;margin:.5rem 0 .5rem;color:#2A1B3D}
.promo p{margin:0 0 1rem;font-size:1.02rem}
.promo-btn{display:inline-block;font-family:var(--display);font-weight:600;font-size:1.05rem;text-decoration:none;background:#4B2E6B;color:#fff;padding:.8rem 1.4rem;border-radius:999px;box-shadow:0 6px 0 #2A1B3D;transition:transform .15s, box-shadow .15s, background .15s}
.promo-btn:hover{background:#5E3A86;transform:translateY(-2px);box-shadow:0 8px 0 #2A1B3D}
.promo-btn:active{transform:translateY(4px);box-shadow:0 2px 0 #2A1B3D}
.promo-btn:focus-visible{outline:3px solid #2A1B3D;outline-offset:3px}
.promo .promo-note{font-size:.82rem;margin:.9rem 0 0;opacity:.8}
.promo + .prose h2{margin-top:3rem}
@media (max-width:640px){.promo{grid-template-columns:1fr;text-align:left;padding:1.3rem 1.2rem}.promo-art{width:120px}.promo-btn{display:block;text-align:center}}

/* Schriftzug leicht schräg, "Kohlis" mit weichem, violett auslaufendem Schatten dahinter */
.title-block{transform:rotate(-6deg);transform-origin:50% 50%}
.hero-art .owner{text-shadow:3px 5px 4px rgba(176,108,226,.95),6px 10px 14px rgba(160,92,210,.8),10px 16px 30px rgba(150,86,200,.55)}

/* Schriftzug mit Slogan 20 px tiefer */
.title-block{margin-top:calc(-1.4rem + 20px)}
@media (max-width:700px){.title-block{margin-top:calc(-1rem + 20px)}}

/* "Yoga" mit weichem, rosa auslaufendem Schatten dahinter */
.hero-art h1{text-shadow:4px 6px 5px rgba(226,96,150,.95),8px 12px 16px rgba(206,78,136,.8),12px 20px 36px rgba(194,71,122,.55)}

/* Slogan weitere 10 px tiefer */
.hero-art .tagline{margin-top:calc(.55rem + 25px)}

/* Touch-Geräte: größere unsichtbare Tippflächen für Flaggen und den Link zu kohli.de, Aussehen bleibt gleich */
@media (pointer:coarse){
  .flags button,.home-link{position:relative;overflow:visible}
  .flags button::before{content:"";position:absolute;inset:-12px -4px}
  .home-link::before{content:"";position:absolute;inset:-10px -4px}
}
.flags button svg{border-radius:3px}
/* Kleine Texte bei den Beträgen nicht unter 12 px */
@media (max-width:560px){.amount span{font-size:.78rem}}

/* Lange deutsche Wörter: auf schmalen Handys Karten untereinander, Bild links, Text rechts */
.sp h3,.sp p,.sp-ex,.facts .panel h3,.facts .panel p,.flow strong,.flow small,.w,.heights small,.limbs p,.timeline p{hyphens:auto;-webkit-hyphens:auto}
@media (max-width:480px){
  .species{grid-template-columns:1fr;gap:.6rem}
  .sp{display:grid;grid-template-columns:64px minmax(0,1fr);column-gap:.9rem;align-items:start;padding:.85rem .95rem .95rem}
  .sp-img{width:64px;height:64px;margin:0;grid-row:1 / span 3}
  .sp-img svg{width:48px;height:48px}
  .sp h3{font-size:1.02rem;align-self:end}
  .sp-ex{margin:.05rem 0 .35rem}
}

/* Schriftzug in den Lotusfarben: "Kohlis" helles Blütenrosa, "Yoga" kräftiges Spitzenrosa, Schatten jeweils im passenden dunkleren Ton */
.hero-art .owner{color:#FBBFD2;text-shadow:3px 5px 4px rgba(217,94,147,.95),6px 10px 14px rgba(200,80,138,.75),10px 16px 30px rgba(184,60,114,.5)}
.hero-art h1{color:#D95E93;text-shadow:4px 6px 5px rgba(150,46,104,.95),8px 12px 16px rgba(130,40,98,.8),12px 20px 36px rgba(110,36,92,.6)}

/* Slogan 5 px höher */
.hero-art .tagline{margin-top:calc(.55rem + 20px)}

/* TEST: Schriftzug ohne Schatten (zum Zurückholen diesen Block löschen) */
.hero-art .owner,.hero-art h1{text-shadow:none}

/* "Yoga Retreat" in einer Zeile, etwas größer als "Kohlis" */
.hero-art h1{font-size:clamp(2.5rem,5.3vw,3.75rem);line-height:1.05;letter-spacing:0}
.hero-art .main{white-space:nowrap}
.home{grid-template-columns:minmax(0,400px) auto}
@media (max-width:1000px){.home{grid-template-columns:minmax(0,320px) auto}.hero-art h1{font-size:clamp(2.1rem,4.6vw,2.6rem)}}
@media (max-width:700px){.home{grid-template-columns:1fr}.hero-art h1{font-size:clamp(2.3rem,10.5vw,2.9rem)}}
@media (min-width:701px) and (max-width:1000px){.hero-art h1{font-size:clamp(2.6rem,5.2vw,2.95rem)}}

/* "Yoga Retreat" etwa 10 % kleiner */
.hero-art h1{font-size:clamp(2.25rem,4.8vw,3.375rem)}
@media (min-width:701px) and (max-width:1000px){.hero-art h1{font-size:clamp(2.35rem,4.7vw,2.65rem)}}
@media (max-width:700px){.hero-art h1{font-size:clamp(2.1rem,9.5vw,2.6rem)}}

/* "Yoga Retreat" noch etwas kleiner */
.hero-art h1{font-size:clamp(2rem,4.2vw,2.95rem)}
@media (min-width:701px) and (max-width:1000px){.hero-art h1{font-size:clamp(2.05rem,4.1vw,2.3rem)}}
@media (max-width:700px){.hero-art h1{font-size:clamp(1.85rem,8.4vw,2.3rem)}}

/* "Yoga Retreat" nochmals kleiner, "Namaste" 20 px höher */
.hero-art h1{font-size:clamp(1.8rem,3.7vw,2.6rem)}
@media (min-width:701px) and (max-width:1000px){.hero-art h1{font-size:clamp(1.8rem,3.6vw,2.05rem)}}
@media (max-width:700px){.hero-art h1{font-size:clamp(1.65rem,7.4vw,2.05rem)}}
.hero-art .tagline{margin-top:.55rem}

/* "Namaste" weitere 5 px höher */
.hero-art .tagline{margin-top:calc(.55rem - 5px)}