/* Praxis Luana Cuzzucoli – Entwurf
   Layout-Idee: wie die Wände der Praxis – ruhige helle Flächen, unten Lavendel mit einem schmalen Aubergine-Streifen.
   Viel Weissraum, eine Spalte zum Lesen, Bilder aus der eigenen Welt (Wege, Meer, Praxis). */
:root{
  --papier:#F5F0EE;      /* Off-White, Haupthintergrund */
  --weiss:#FFFDFC;
  --lavendel:#C8B8DB;
  --lavendel-hell:#E7DFEF;
  --mauve:#71597D;
  --aubergine:#4F2F4B;
  --tinte:#3A2737;       /* Fliesstext */
  --petrol:#49676F;
  --graublau:#C1CAD6;
  --greige:#D4CBCF;
  --ocker:#ECB371;
  --linie:rgba(79,47,75,.18);
  --f-text:"Montserrat",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --f-schrift:"Italianno","Brush Script MT",cursive;
  --gutter-l:max(16px, env(safe-area-inset-left, 0px));
  --gutter-r:max(16px, env(safe-area-inset-right, 0px));
  --breite:1120px;
  --lese:40rem;
  --radius:14px;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
body{margin:0;background:var(--papier);color:var(--tinte);font-family:var(--f-text);font-size:1.0625rem;line-height:1.7;font-weight:400}
img{max-width:100%;height:auto;display:block}
a{color:var(--aubergine);text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{color:var(--mauve)}
:focus-visible{outline:3px solid var(--ocker);outline-offset:3px;border-radius:4px}
h1,h2,h3{color:var(--aubergine);font-weight:500;line-height:1.25;text-wrap:balance;margin:0}
h1{font-size:clamp(1.8rem,1.2rem + 2.4vw,2.9rem);font-weight:500;letter-spacing:-.01em}
h2{font-size:clamp(1.45rem,1.1rem + 1.3vw,2rem)}
h3{font-size:1.15rem;font-weight:600}
p{margin:0}
.wrap{max-width:var(--breite);margin-inline:auto;padding-left:var(--gutter-l);padding-right:var(--gutter-r)}
.lese{max-width:var(--lese)}
.stack{display:flex;flex-direction:column;gap:1.1rem}
.skip{position:absolute;left:-999px;top:0;background:var(--aubergine);color:var(--weiss);padding:.6rem 1rem;z-index:50}
.skip:focus{left:var(--gutter-l)}

/* Kopfzeile */
.kopf{background:var(--lavendel-hell);border-bottom:1px solid var(--linie);position:sticky;top:env(safe-area-inset-top,0px);z-index:20}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:21;background:var(--lavendel-hell)}
.kopf .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:.6rem}
.logo img{width:150px}
.nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.2rem 1.3rem}
.nav a{text-decoration:none;font-size:.9rem;font-weight:500;color:var(--aubergine);padding:.3rem 0;display:inline-block;border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current="page"]{border-bottom-color:var(--ocker)}
.menu{display:none}
@media (max-width:1180px){
  .nav{flex:1;min-width:0}
  .nav ul{gap:.1rem 1.2rem;justify-content:flex-end}
  .nav a{font-size:.88rem}
  .logo img{width:120px}
}
@media (max-width:760px){
  .kopf{position:static}
  .nav ul{justify-content:flex-end;gap:0 .9rem;text-align:right}
  .kopf .wrap{align-items:center}
  .nav a{font-size:.85rem;padding:.2rem 0}
  .logo img{width:110px}
}

/* Wandstreifen – das Motiv aus den Praxisräumen */
.wand{background:linear-gradient(to bottom,var(--aubergine) 0 10px,var(--lavendel-hell) 10px)}
.wand-oben{border-top:10px solid var(--aubergine)}

/* Einstieg */
.held{position:relative;overflow:hidden}
.held-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:center;padding-block:clamp(2rem,6vw,4.5rem)}
.held-text{display:flex;flex-direction:column;gap:1.2rem;min-width:0}
.schrift{font-family:var(--f-schrift);font-size:clamp(2rem,1.5rem + 2vw,2.9rem);color:var(--mauve);line-height:1;font-weight:400}
.unterzeile{font-size:clamp(1.25rem,1rem + 1vw,1.5rem);line-height:1.4;font-weight:500;color:var(--petrol)}
.held-bild{position:relative;min-width:0}
.held-bild img{border-radius:999px 999px var(--radius) var(--radius);aspect-ratio:4/5;object-fit:cover;width:100%;max-width:100%}
.kreis{position:absolute;border-radius:50%;pointer-events:none}
.kreis.k1{width:46%;aspect-ratio:1;background:var(--lavendel);opacity:.55;left:-14%;bottom:-8%;mix-blend-mode:multiply}
.kreis.k2{width:22%;aspect-ratio:1;background:var(--ocker);opacity:.55;right:-4%;top:6%;mix-blend-mode:multiply}
@media (max-width:760px){.held-grid{grid-template-columns:1fr}.held-bild{order:-1;max-width:420px}.held-bild img{aspect-ratio:1/1}}

.knoepfe{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:.3rem}
.knopf{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.3rem;border-radius:999px;font-weight:600;font-size:.95rem;text-decoration:none;border:2px solid var(--aubergine);background:var(--aubergine);color:var(--weiss)}
.knopf:hover{background:var(--mauve);border-color:var(--mauve);color:var(--weiss)}
.knopf.leise{background:transparent;color:var(--aubergine)}
.knopf.leise:hover{background:var(--weiss);color:var(--aubergine)}

/* Abschnitte */
.abschnitt{padding-block:clamp(3rem,7vw,5.5rem)}
.titel{display:flex;align-items:center;gap:.9rem;margin-bottom:clamp(1.4rem,3vw,2.2rem)}
.titel img{width:60px;height:60px;flex:none}
.titel h2{min-width:0}
.einleitung{max-width:var(--lese);margin-top:-1rem;margin-bottom:2rem}

/* Für wen */
.fuerwen{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
@media (max-width:980px){.fuerwen{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.fuerwen{grid-template-columns:1fr}}
.wen{background:var(--weiss);border-radius:var(--radius);padding:1.4rem 1.3rem 1.3rem;display:flex;flex-direction:column;gap:.7rem;border-top:4px solid var(--farbe,var(--lavendel));min-width:0}
.wen p{font-size:.98rem}
.wen .wege{margin-top:auto;display:flex;flex-direction:column;gap:.15rem;font-size:.9rem;font-weight:500}
.wen .wege a{text-decoration:none}
.wen .wege a::before{content:"→ ";color:var(--mauve)}
.wen .wege a:hover{text-decoration:underline}

/* Angebote */
.angebote{display:grid;grid-template-columns:repeat(2,1fr);grid-auto-rows:1fr;gap:clamp(1rem,2.5vw,1.6rem)}
@media (max-width:760px){.angebote{grid-template-columns:1fr}}
.angebot{display:grid;grid-template-columns:42% 1fr;align-items:center;background:var(--weiss);border-radius:var(--radius);overflow:hidden;text-decoration:none;color:inherit;min-width:0}
.angebot img{width:calc(100% - 1rem);max-width:100%;aspect-ratio:5/4;height:auto;object-fit:cover;margin-left:1rem;border-radius:10px}
@media (max-width:480px){.angebot{grid-template-columns:38% 1fr}.angebot img{width:calc(100% - .75rem);margin-left:.75rem}.angebot div{padding:1rem}}
.angebot div{padding:1.3rem 1.4rem;display:flex;flex-direction:column;gap:.55rem;min-width:0}
.angebot p{font-size:.96rem}
.angebot .mehr{margin-top:auto;font-weight:600;font-size:.9rem;color:var(--aubergine)}
.angebot:hover h3{color:var(--mauve)}
.angebot:hover .mehr{text-decoration:underline}


/* Ansatz / zwei Spalten */
.zwei{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,5vw,4rem);align-items:center}
.zwei>*{min-width:0}
@media (max-width:820px){.zwei{grid-template-columns:1fr}}
.bild-rund img{border-radius:var(--radius);width:100%;aspect-ratio:4/3;object-fit:cover}
.portrait img{border-radius:50%;aspect-ratio:1;object-fit:cover;object-position:50% 25%;width:min(340px,100%);margin-inline:auto}
.weiter{font-weight:600;text-decoration:none}
.weiter::after{content:" →"}
.werte{display:grid;grid-template-columns:repeat(auto-fill,minmax(12rem,1fr));gap:.55rem 1.2rem;margin:0;padding:0;list-style:none}
.werte li{display:flex;align-items:center;gap:.6rem;font-size:.95rem;font-weight:500;color:var(--aubergine)}
.werte li::before{content:"";width:.9rem;height:.9rem;border-radius:50%;flex:none;background:var(--punkt,var(--lavendel))}
.werte li:nth-child(1){--punkt:var(--greige)}
.werte li:nth-child(2){--punkt:var(--lavendel)}
.werte li:nth-child(3){--punkt:var(--mauve)}
.werte li:nth-child(4){--punkt:var(--aubergine)}
.werte li:nth-child(5){--punkt:var(--petrol)}
.werte li:nth-child(6){--punkt:var(--ocker)}

/* Wissen */
.wissen{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
@media (max-width:820px){.wissen{grid-template-columns:1fr}}
.eintrag{background:var(--weiss);border-radius:var(--radius);padding:1.3rem 1.4rem;text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:.6rem;min-width:0}
.eintrag .art{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--petrol)}
.eintrag h3{font-size:1.05rem}
.eintrag:hover h3{color:var(--mauve)}

/* Meinungen */
.meinungen{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1rem;align-items:start}
.meinung{background:var(--weiss);border-radius:var(--radius);padding:1.3rem 1.4rem 1.2rem;margin:0;display:flex;flex-direction:column;gap:.7rem;font-size:.96rem;position:relative}
.meinung::before{content:"«";font-size:3rem;line-height:.6;color:var(--lavendel);font-family:Georgia,serif}
.meinung cite{font-style:normal;font-size:.8rem;font-weight:600;color:var(--petrol);margin-top:auto}
.hinweis-wisch{font-size:.85rem;color:var(--petrol);margin-top:.4rem}

/* Kontakt */
.kontakt{background:linear-gradient(to bottom,var(--aubergine) 0 10px,var(--lavendel-hell) 10px);color:var(--tinte);position:relative;isolation:isolate;overflow:hidden}
.kontakt h2,.kontakt h3{color:var(--aubergine)}
.kontakt .wege-liste{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.8rem}
.kontakt .wege-liste li{display:flex;gap:.8rem;align-items:baseline}
.kontakt .wege-liste li::before{content:"";width:.6rem;height:.6rem;border-radius:50%;background:var(--ocker);flex:none;transform:translateY(-.1rem)}
.kontakt .klein{font-size:.92rem;color:var(--tinte)}
.tuer img{border-radius:var(--radius);aspect-ratio:3/4;object-fit:cover;width:min(320px,100%);margin-inline:auto}
.platzhalter{display:inline-block;font-size:.78rem;font-weight:600;background:var(--ocker);color:var(--aubergine);padding:.1rem .5rem;border-radius:6px;vertical-align:middle}

/* Fusszeile */
.fuss{background:var(--lavendel-hell);padding-block:2.5rem;font-size:1rem;border-top:10px solid var(--aubergine)}
.fuss .wrap{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:1.5rem}
.fuss .wrap>*{min-width:0}
.kalender-link{margin-top:.6rem}
.kalender-link a{display:inline-block;background:var(--ocker);color:var(--aubergine);font-weight:600;text-decoration:none;padding:.3rem .8rem;border-radius:8px}
.kalender-link a:hover{background:var(--aubergine);color:var(--weiss)}
@media (max-width:820px){.fuss .wrap{grid-template-columns:1fr 1fr 1.2fr;gap:1rem}.fuss{font-size:.95rem}.fuss img{width:105px}}
@media (max-width:520px){.fuss .wrap{grid-template-columns:1fr 1fr}.fuss .wrap>div:last-child{grid-column:1/-1}}
.fuss h3{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--petrol);margin-bottom:.5rem}
.fuss ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.25rem}
.fuss img{width:130px;margin-bottom:.6rem}

/* Angebotsseite */
.seitenkopf{padding-block:clamp(2rem,5vw,3.5rem)}
.seitenkopf .zwei{align-items:center}
.seitenkopf{overflow:hidden}
.seitenkopf .bild-bogen{position:relative;width:min(380px,100%);margin-inline:auto}
.seitenkopf .bild-bogen img{position:relative;border-radius:999px 999px var(--radius) var(--radius);aspect-ratio:4/5;object-fit:cover;width:100%}
.seitenkopf .bild-bogen .kreis.k1{z-index:1}
.seitenkopf .bild-bogen .kreis.k2{z-index:1}
.brotkrumen{font-size:.95rem;margin-bottom:.8rem;color:var(--petrol)}
.brotkrumen a{color:var(--petrol)}
.kennst{columns:2;column-gap:2.5rem;padding:0;margin:0;list-style:none}
@media (max-width:760px){.kennst{columns:1}}
.kennst li{break-inside:avoid;padding:.55rem 0 .55rem 1.7rem;position:relative;border-bottom:1px solid var(--linie)}
.kennst li::before{content:"✦";position:absolute;left:.1rem;top:.55rem;color:var(--mauve);font-size:.85rem}
.fuer{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
@media (max-width:820px){.fuer{grid-template-columns:1fr}}
.grenze{background:var(--weiss);border-left:4px solid var(--petrol);border-radius:0 var(--radius) var(--radius) 0;padding:1.3rem 1.5rem;max-width:var(--lese)}
.fragen{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,3vw,2rem);align-items:start}
@media (max-width:900px){.fragen{grid-template-columns:1fr}}
.fragen h3{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--petrol);margin-bottom:.4rem}
.fragen>div{min-width:0}
details.frage{border-bottom:1px solid var(--linie)}
details.frage summary{cursor:pointer;list-style:none;padding:.85rem 2rem .85rem 0;font-weight:600;color:var(--aubergine);position:relative}
details.frage summary::-webkit-details-marker{display:none}
details.frage summary::after{content:"+";position:absolute;right:.2rem;top:.7rem;font-size:1.3rem;font-weight:400;color:var(--mauve)}
details.frage[open] summary::after{content:"–"}
details.frage p{padding-bottom:1rem;font-size:.97rem}


/* Kontakt: Türbild im Text, links umflossen */
.kontakt-fluss{max-width:60rem}
.kontakt-fluss .stack{display:block}
.kontakt-fluss .stack>*+*{margin-top:1.1rem}
.kontakt-fluss .tuer-bild{float:right;width:clamp(16rem,44%,24rem);height:auto;border-radius:var(--radius);margin:.3rem 0 1rem 1.8rem}
.kontakt-fluss .knoepfe{clear:both;padding-top:.4rem}
@media (max-width:600px){.kontakt-fluss .tuer-bild{float:none;width:100%;max-width:420px;margin:1rem 0 0}}
.kontakt strong{overflow-wrap:anywhere}

.mehr-meinungen{margin-top:1rem}
.mehr-meinungen summary{cursor:pointer;font-weight:600;color:var(--aubergine);padding:.4rem 0;list-style:none}
.mehr-meinungen summary::-webkit-details-marker{display:none}
.mehr-meinungen summary::after{content:" +";color:var(--mauve)}
.mehr-meinungen[open] summary::after{content:" –"}
.mehr-meinungen .meinungen{margin-top:.8rem}

.fuss .wrap.verbaende{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 2rem;margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--linie)}
.verbaende-titel{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--petrol);width:100%}
.verbaende a{display:block;background:var(--weiss);padding:.5rem .8rem;border-radius:8px}
.verbaende img{height:44px;width:auto;margin:0}
@media (max-width:520px){.verbaende img{height:34px}}

.fuss .wrap.copyright{display:flex;justify-content:flex-end;align-items:center;gap:.6rem;margin-top:1.5rem;font-size:.8rem;color:var(--petrol)}
.fuss .copyright img{width:40px;height:auto;margin:0}
.fuss .fuss-symbol{width:40px;height:auto;margin:0}

/* Handy: Angebotsbilder ausblenden */
@media (max-width:600px){.angebot{grid-template-columns:1fr}.angebot img{display:none}}

/* Wo meine Begleitung endet: ruhiges Band */
.grenze-band{background:rgba(212,203,207,.35);padding-block:clamp(2.5rem,6vw,4rem)}
.grenze-inhalt{display:flex;align-items:center;gap:clamp(1.2rem,4vw,2.5rem);max-width:52rem}
.grenze-inhalt img{width:clamp(70px,12vw,120px);height:auto;flex:none}
.grenze-inhalt .stack{min-width:0;gap:.7rem}
.grenze-inhalt h2{color:var(--aubergine)}
@media (max-width:520px){.grenze-inhalt{flex-direction:column;align-items:flex-start}}
.fuss .verbaende .copyright{margin-left:auto;align-self:flex-end;font-size:.8rem;color:var(--petrol)}
.fuss{padding-bottom:1.5rem}

/* Kreismuster wie auf der bisherigen Webseite: sich überlagernde, transparente Kreise.
   Ohne Foto, rechts neben dem Text; der Text bleibt auf hellem Grund (gut lesbar). */
.held,.seitenkopf{position:relative;isolation:isolate;overflow:hidden}
.held-grid,.seitenkopf .zwei{grid-template-columns:minmax(0,34rem);min-height:clamp(26rem,52vw,36rem)}
.kreismuster{position:absolute;inset:0;z-index:-1;pointer-events:none}
.kreismuster span{position:absolute;border-radius:50%;aspect-ratio:1;mix-blend-mode:multiply}
.kreismuster .m1{width:58%;left:62%;top:-48%;background:#E2DAE9}
.kreismuster .m2{width:34%;left:46%;top:-30%;background:rgba(138,147,163,.5)}
.kreismuster .m3{width:30%;left:58%;top:38%;background:rgba(113,89,125,.4)}
.kreismuster .m4{width:38%;left:74%;top:22%;background:rgba(162,144,157,.48)}
.kreismuster .m5{width:22%;left:52%;top:70%;background:rgba(193,202,214,.75)}
@media (max-width:760px){
  .held-grid,.seitenkopf .zwei{min-height:0;padding-top:calc(min(64vw,300px) + 1.5rem)}
  .kreismuster{bottom:auto;height:min(64vw,300px)}
  .kreismuster .m1{width:110%;left:30%;top:-90%}
  .kreismuster .m2{width:62%;left:-14%;top:-60%}
  .kreismuster .m3{width:52%;left:18%;top:20%}
  .kreismuster .m4{width:64%;left:52%;top:5%}
  .kreismuster .m5{width:40%;left:-12%;top:45%}
}


/* Fusszeile dunkel (Aubergine) */
.fuss{background:var(--aubergine);color:var(--greige);border-top:0}
.fuss h3,.verbaende-titel{color:var(--lavendel)}
.fuss a{color:var(--weiss)}
.fuss a:hover{color:var(--lavendel)}
.fuss .wrap.verbaende{border-top-color:rgba(255,253,252,.2)}
.fuss .verbaende .copyright{color:var(--greige)}
.kalender-link a{color:var(--aubergine)}
.kalender-link a:hover{background:var(--weiss);color:var(--aubergine)}

/* Türbild mit zwei Kreisen, wie beim Einstiegsbild im ersten Entwurf */
.kontakt-fluss .tuer-bild{display:block;position:relative}
.kontakt-fluss .tuer-bild img{position:relative;z-index:1;width:100%;height:auto;border-radius:var(--radius)}
.tuer-bild .kreis.k1{width:58%;left:-16%;bottom:-10%;background:var(--lavendel);opacity:.9;mix-blend-mode:multiply;z-index:0}
.tuer-bild .kreis.k2{width:26%;right:-7%;top:5%;background:var(--ocker);opacity:.6;mix-blend-mode:multiply;z-index:2}
@media (max-width:600px){.tuer-bild .kreis.k1{left:-6%}.tuer-bild .kreis.k2{right:-3%}}
.kontakt-fluss .tuer-bild{margin:.3rem 0 2rem 3rem}
.tuer-bild .kreis.k1{left:-12%}
@media (max-width:600px){.kontakt-fluss .tuer-bild{margin:1rem 0 2.6rem}.tuer-bild .kreis.k1{left:-6%}}

/* Bild «Mein Ansatz» / «Was wir zusammen tun» mit zwei Kreisen */
.bild-rund{position:relative}
.bild-rund img{position:relative;z-index:1}
.bild-rund .kreis.k1{width:42%;aspect-ratio:1;left:-9%;bottom:-16%;background:var(--lavendel);opacity:.9;mix-blend-mode:multiply;z-index:0}
.bild-rund .kreis.k2{width:20%;aspect-ratio:1;right:-5%;top:-9%;background:var(--ocker);opacity:.6;mix-blend-mode:multiply;z-index:2}
@media (max-width:600px){.bild-rund .kreis.k1{left:-4%}.bild-rund .kreis.k2{right:-3%}.bild-rund{margin-bottom:1.5rem}}



/* Kopfzeile hell lavendel mit dunkelviolettem Streifen unten, damit sie sich abhebt */
.kopf{border-bottom:8px solid var(--aubergine)}

/* Menüpunkte grösser */
.nav a{font-size:1.05rem}
@media (max-width:1180px){.nav a{font-size:1rem}}
@media (max-width:760px){.nav a{font-size:.95rem}}
.logo{flex:none}

/* Angebote mit Piktogrammen statt Fotos */
.angebot{grid-template-columns:auto 1fr}
.pikto{display:grid;place-items:center;width:clamp(72px,9vw,104px);aspect-ratio:1;border-radius:50%;margin-left:1.4rem;background:color-mix(in srgb,var(--pf,var(--lavendel)) 55%,var(--weiss));color:var(--aubergine)}
.pikto svg{width:58%;height:58%}
@media (max-width:600px){.angebot{grid-template-columns:auto 1fr}.pikto{width:60px;margin-left:1rem}}
@media (max-width:760px){.angebote{grid-auto-rows:auto}}

/* Angebote – Layout 2: vier Karten nebeneinander, Piktogramm oben */
.angebote{grid-template-columns:repeat(4,1fr);grid-auto-rows:auto}
@media (max-width:1100px){.angebote{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.angebote{grid-template-columns:1fr}}
.angebot{grid-template-columns:1fr;align-items:start;align-content:start;padding-top:1.6rem;text-align:left}
.angebot .pikto{margin:0 0 0 1.4rem;width:84px}
.angebot div{padding-top:1rem;height:100%}
@media (max-width:600px){.angebot{grid-template-columns:auto 1fr;align-items:center;padding-top:0}.angebot .pikto{width:60px;margin-left:1rem}.angebot div{padding-top:1rem}}
.angebot{grid-template-rows:auto 1fr}@media (max-width:600px){.angebot{grid-template-rows:auto}}

/* Für wen – Alternative: ruhige Liste mit Farbkreis, Wege als kleine Knöpfe */
.fuerwen{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 3rem;max-width:62rem}
@media (max-width:820px){.fuerwen{grid-template-columns:1fr}}
.fuerwen .wen{background:none;border:0;border-bottom:1px solid var(--linie);border-radius:0;padding:1.2rem 0 1.2rem 3.4rem;position:relative;gap:.4rem}
.fuerwen .wen::before{content:"";position:absolute;left:0;top:1.25rem;width:2.3rem;height:2.3rem;border-radius:50%;background:var(--farbe,var(--lavendel));opacity:.75}
.fuerwen .wen h3{font-size:1.1rem}
.fuerwen .wen .wege{flex-direction:row;flex-wrap:wrap;gap:.4rem;margin-top:.35rem}
.fuerwen .wen .wege a{background:var(--weiss);border:1px solid var(--linie);border-radius:999px;padding:.2rem .75rem;font-size:.85rem}
.fuerwen .wen .wege a::before{content:none}
.fuerwen .wen .wege a:hover{border-color:var(--mauve);text-decoration:none}
.fuerwen .wen::before{opacity:1;box-shadow:inset 0 0 0 1px rgba(79,47,75,.15)}
.nav{flex:1;min-width:0}.nav ul{justify-content:flex-end}
.fuerwen .wen:nth-child(-n+2){border-top:1px solid var(--linie)}@media (max-width:820px){.fuerwen .wen:nth-child(2){border-top:0}}
.fuerwen.drei{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none;gap:0 2.5rem}
.fuerwen.drei .wen:nth-child(-n+3){border-top:1px solid var(--linie)}
@media (max-width:820px){.fuerwen.drei{grid-template-columns:1fr}.fuerwen.drei .wen:nth-child(n+2){border-top:0}}
.grenze-band{background:var(--lavendel-hell)}
.grenze-band{padding-top:1rem}.abschnitt:has(+ .grenze-band){padding-bottom:1.5rem}

/* ---------- Weitere Seiten ---------- */
.zwei.oben{align-items:start}
.punkte{margin:0;padding-left:1.2rem;display:flex;flex-direction:column;gap:.55rem}
.punkte li::marker{color:var(--mauve)}
.hinweis-klein{margin-top:1.4rem;font-size:.95rem;color:var(--petrol);max-width:var(--lese)}
.nach-fuerwen{margin-top:1.6rem;max-width:var(--lese)}
.meinung p{margin:0}
.platzhalter{display:inline-block;font-size:.78rem;font-weight:600;background:var(--ocker);color:var(--aubergine);padding:.1rem .5rem;border-radius:6px;vertical-align:middle}
.eintrag p{font-size:.95rem}
.eintrag .mehr{margin-top:auto;font-weight:600;font-size:.9rem;color:var(--aubergine)}
.eintrag .platzhalter{margin-top:auto;align-self:flex-start}
/* Artikel */
.artikel{max-width:44rem}
.artikel h2{margin:2.2rem 0 .8rem}
.artikel h2:first-child{margin-top:0}
.artikel p+p,.artikel ul+p,.artikel p+ul{margin-top:1rem}
.quellen{margin-top:2.5rem;font-size:.85rem;color:var(--petrol)}
/* Links & Netzwerk */
.notfall-band{background:var(--weiss);border-top:10px solid var(--ocker);padding-block:clamp(2rem,5vw,3rem)}
.notfall-band h2{margin-bottom:.6rem}
.linkliste{list-style:none;margin:1rem 0 0;padding:0;display:flex;flex-direction:column;gap:.8rem;max-width:48rem}
.linkliste li{padding-left:1.4rem;position:relative}
.linkliste li::before{content:"";position:absolute;left:0;top:.55em;width:.55rem;height:.55rem;border-radius:50%;background:var(--mauve)}
.zwei-spalten{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem 3rem}
.zwei-spalten>*{min-width:0}
@media (max-width:760px){.zwei-spalten{grid-template-columns:1fr}}
.zwei-spalten h2{margin-bottom:.6rem}
/* Über mich */
.zitat{margin:.5rem 0 0;padding:0;font-size:1.15rem;line-height:1.6;color:var(--aubergine);font-style:italic;max-width:34rem}
.zitat cite{display:block;margin-top:.6rem;font-size:.9rem;font-style:normal;color:var(--petrol)}
.zwischentitel{margin-top:.8rem}
.portrait{position:sticky;top:7rem}
@media (max-width:820px){.portrait{position:static;order:-1}}
.lebenslauf{display:grid;grid-template-columns:1fr 1fr;gap:2rem 4rem;align-items:start}
.lebenslauf>*{min-width:0}
@media (max-width:900px){.lebenslauf{grid-template-columns:1fr}}
.zeitleiste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.zeitleiste li{display:grid;grid-template-columns:8.5rem 1fr;gap:1rem;padding:.75rem 0;border-bottom:1px solid var(--linie);font-size:.95rem}
.zeitleiste .jahr{font-weight:600;color:var(--aubergine)}
@media (max-width:520px){.zeitleiste li{grid-template-columns:1fr;gap:.2rem}}
.weiterbildungen{margin-top:1.5rem}
.mitglied-liste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1rem}
.mitglied-liste li{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap}
.mitglied-liste a{display:block;background:var(--weiss);padding:.5rem .8rem;border-radius:8px;flex:none}
.mitglied-liste img{height:48px;width:auto}
/* Rechtstexte */
.seitenkopf.schlicht{padding-block:clamp(2rem,5vw,3rem)}
.rechtstext{max-width:46rem}
.rechtstext p,.rechtstext ul{margin:0 0 1rem}
.klein-hinweis{font-size:.9rem;color:var(--petrol)}
/* Konditionen & Kontakt */
.kontaktwege{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem 2.5rem}
@media (max-width:900px){.kontaktwege{grid-template-columns:1fr}}
.kontaktwege .weg{display:flex;flex-direction:column;gap:.7rem;border-top:1px solid var(--linie);padding-top:1.2rem}
.kontaktwege h2{font-size:1.25rem}
.formular-wrap{max-width:46rem}
.kontaktformular{display:flex;flex-direction:column;gap:1rem;margin-top:1.2rem}
.feldreihe{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media (max-width:600px){.feldreihe{grid-template-columns:1fr}}
.kontaktformular label{display:flex;flex-direction:column;gap:.35rem;font-weight:500;font-size:.95rem;color:var(--aubergine)}
.kontaktformular input[type=text],.kontaktformular input[type=email],.kontaktformular input[type=tel],.kontaktformular textarea{font:inherit;font-weight:400;color:var(--tinte);background:var(--weiss);border:1px solid rgba(79,47,75,.35);border-radius:10px;padding:.7rem .85rem}
.kontaktformular [aria-invalid=true]{border-color:#9b2c2c}
.kontaktformular .haekchen{flex-direction:row;align-items:flex-start;gap:.7rem;font-weight:400;color:var(--tinte)}
.kontaktformular .haekchen input{width:1.2rem;height:1.2rem;margin-top:.2rem;accent-color:var(--aubergine);flex:none}
.honig{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.kontaktformular .knopf{align-self:flex-start;cursor:pointer}
.formular-hinweis{font-size:.9rem;color:var(--petrol);min-height:1.4em}
.logo img{filter:drop-shadow(0 3px 8px rgba(79,47,75,.28)) drop-shadow(0 1px 2px rgba(79,47,75,.18))}
.wrap.grenze-inhalt{max-width:var(--breite);display:block}.grenze-inhalt .stack{max-width:var(--lese)}.grenze-inhalt h2{font-size:clamp(1.15rem,1rem + .6vw,1.35rem)}
.bild-rund.freigestellt img{aspect-ratio:auto;object-fit:contain;border-radius:0}
.bild-rund.ganz img{aspect-ratio:auto}

/* Fragen paarweise nebeneinander (ADHS & Autismus) */
.fragenpaare{list-style:none;margin:2.2rem 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.1rem 1.4rem}
.fragenpaare li{background:var(--weiss);border-top:5px solid var(--lavendel);border-radius:var(--radius);padding:1.1rem 1.25rem 1.2rem}
.fragenpaare li:nth-child(4n+2),.fragenpaare li:nth-child(4n+3){border-top-color:var(--ocker)}
.fragenpaare li strong{display:block;margin-bottom:.35rem;color:var(--aubergine)}
.fragenpaare li:last-child:nth-child(odd){grid-column:1 / -1}
.nach-paaren{margin-top:1.8rem;max-width:var(--lese)}
@media (max-width:760px){.fragenpaare{grid-template-columns:1fr}}

/* Knopf «nach oben» */
.nach-oben{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:max(16px,env(safe-area-inset-bottom,0px));z-index:50;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--aubergine);color:var(--weiss);box-shadow:0 4px 14px rgba(58,39,55,.25);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .25s,transform .25s,visibility .25s,background .2s}
.nach-oben.sichtbar{opacity:.92;visibility:visible;transform:none}
.nach-oben:hover,.nach-oben:focus-visible{background:var(--mauve);opacity:1}
.nach-oben:focus-visible{outline:3px solid var(--ocker);outline-offset:3px}
@media print{.nach-oben{display:none}}

/* Handy: Hamburger-Menü (nur mit JavaScript; ohne bleibt die ganze Liste sichtbar) */
.menu-knopf{display:none}
@media (max-width:760px){
  .js .kopf{position:sticky;top:0}
  .js .kopf .wrap{flex-wrap:wrap;position:relative}
  .js .menu-knopf{display:inline-flex;align-items:center;gap:.55rem;margin-left:auto;background:var(--weiss);color:var(--aubergine);border:2px solid var(--aubergine);border-radius:999px;padding:.55rem 1rem;font:600 .95rem/1 var(--f-text);cursor:pointer;min-height:44px}
  .js .menu-knopf:focus-visible{outline:3px solid var(--ocker);outline-offset:2px}
  .menu-knopf .striche{display:inline-grid;gap:4px;width:20px}
  .menu-knopf .striche span{display:block;height:2.5px;border-radius:2px;background:currentColor;transition:transform .2s,opacity .2s}
  .menu-knopf[aria-expanded="true"] .striche span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
  .menu-knopf[aria-expanded="true"] .striche span:nth-child(2){opacity:0}
  .menu-knopf[aria-expanded="true"] .striche span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
  .js .kopf .nav{display:none;flex:0 0 100%;order:3}
  .js .kopf .nav.offen{display:block}
  .js .kopf .nav ul{flex-direction:column;align-items:stretch;gap:0;text-align:left;padding:.4rem 0 .6rem;border-top:1px solid var(--linie);margin-top:.5rem}
  .js .kopf .nav li{border-bottom:1px solid var(--linie)}
  .js .kopf .nav li:last-child{border-bottom:0}
  .js .kopf .nav a{display:block;font-size:1.05rem;padding:.8rem .2rem;border-bottom:0}
  .js .kopf .nav a[aria-current="page"]{color:var(--mauve);box-shadow:inset 4px 0 0 var(--ocker);padding-left:.8rem}
}

/* Weisses Logo (FörderNetzwerk Lernen) auf dunklem Plättchen */
.verbaende a.dunkel,.mitglied-liste a.dunkel{background:var(--aubergine);box-shadow:0 0 0 1px rgba(255,253,252,.35)}
.verbaende a.dunkel img{height:40px}
.mitglied-liste a.dunkel img{height:44px}
@media (max-width:520px){.verbaende a.dunkel img{height:30px}}

/* Bild mit kurzer Legende */
.bild-mit-legende{margin:0}
.bild-mit-legende .bild-rund{margin-bottom:0}
.bildlegende{margin:.9rem 0 0 36%;font-size:.92rem;line-height:1.55;color:var(--mauve);position:relative;z-index:1}
@media (max-width:600px){.bildlegende{margin-left:40%;font-size:.88rem}}

/* Zwei Karten nebeneinander unter Text und Bild (Lerncoaching & Lerntherapie) */
.karten-paar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.1rem 1.4rem;margin-top:clamp(3.5rem,9vw,7rem)}
.karte{background:var(--weiss);border-top:5px solid var(--lavendel);border-radius:var(--radius);padding:1.1rem 1.25rem 1.2rem}
.karte:first-child{border-top-color:var(--ocker)}
.karte h3{margin:0 0 .45rem;font-size:1.05rem;color:var(--aubergine)}
.karte p{margin:0 0 .7rem}.karte p:last-child{margin-bottom:0}
.karte.breit{grid-column:1 / -1}
.punkte.zweispaltig{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem 2.2rem}
@media (max-width:760px){.karten-paar,.punkte.zweispaltig{grid-template-columns:1fr}}

/* Lerncoaching & Lerntherapie: Bild am Laptop etwas kleiner, Text etwas breiter */
@media (min-width:821px){
  .zwei.oben:has(img[src$="praxis-tisch.jpg"]){align-items:center}
}
/* Tablet hochkant: alle Bilder neben dem Text gleich gross, zentriert */
@media (min-width:601px) and (max-width:820px){
  .zwei > .bild-rund{width:66%;margin:0 auto 2.5rem}
  .zwei > .bild-mit-legende{width:66%;margin:0 auto 1rem}
}
.karte.netz{border-top-color:var(--petrol)}

/* Meinungen kompakt (Autogenes Training) */
.js .meinungen.kompakt{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:1.1rem 1.4rem}
.js .meinungen.kompakt .meinung.verborgen{display:none}
.js .meinungen.kompakt .meinung-text{display:flex;flex-direction:column;gap:.7rem;max-height:calc(1.65em * 6);overflow:hidden;-webkit-mask-image:linear-gradient(#000 65%,transparent);mask-image:linear-gradient(#000 65%,transparent)}
.js .meinungen.kompakt .meinung.offen .meinung-text,.js .meinungen.kompakt .meinung.kurz .meinung-text{max-height:none;-webkit-mask-image:none;mask-image:none}
.js .meinungen.kompakt .meinung.kurz .weiterlesen{display:none}
.meinungen.kompakt .weiterlesen{align-self:flex-start;background:none;border:0;padding:.2rem 0;font:600 .9rem/1.3 var(--f-text);color:var(--aubergine);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.meinungen.kompakt .weiterlesen:focus-visible{outline:3px solid var(--ocker);outline-offset:2px}
.mehr-zeigen{margin-top:1.2rem;cursor:pointer}
@media (max-width:760px){.js .meinungen.kompakt{grid-template-columns:1fr}}

/* Hinweis und Knopf «Einfache Sprache» */
.sprache-hinweis{background:var(--weiss);border-bottom:1px solid var(--linie)}
.sprache-hinweis .wrap{display:flex;align-items:center;justify-content:space-between;gap:.6rem 1.2rem;flex-wrap:wrap;padding-block:.7rem}
.sprache-hinweis p{margin:0;font-size:.95rem;color:var(--tinte)}
.sprache-knopf{display:inline-flex;align-items:center;gap:.45rem;padding:.5rem 1.1rem;border-radius:999px;border:2px solid var(--aubergine);color:var(--aubergine);background:var(--lavendel-hell);font-weight:600;font-size:.92rem;text-decoration:none;white-space:nowrap}
.sprache-knopf::before{content:"";width:1.05em;height:1.05em;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6h16M4 12h10M4 18h7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6h16M4 12h10M4 18h7'/%3E%3C/svg%3E") center/contain no-repeat}
.sprache-knopf:hover{background:var(--aubergine);color:var(--weiss)}
.sprache-knopf:focus-visible{outline:3px solid var(--ocker);outline-offset:2px}
/* Seiten in einfacher Sprache: etwas grössere Schrift, kurze Zeilen */
.einfach p,.einfach li{font-size:1.08rem;line-height:1.7}
.einfach > p,.einfach > ul{max-width:var(--lese)}
.einfach > p{margin:0 0 .9rem}
.einfach > ul{margin:0 0 1.4rem}
.einfach .karte p{margin:0 0 .6rem}

/* Logo etwas grösser, Kopfzeile bleibt gleich hoch: dafür weniger Innenabstand oben und unten */
.kopf .wrap{padding-block:4px}
/* Logo mit grösserer Schrift: Schatten nur unter dem Kreis ist im Bild eingebacken, darum negative Ränder */
.logo img{width:186px;margin:-8px 0 -18px}
@media (max-width:1180px){.logo img{width:152px;margin:-7px 0 -15px}}
@media (max-width:760px){.logo img{width:141px;margin:-6px 0 -14px}}

/* Mitgliedschaft ohne Link (gleiches Plättchen wie die verlinkten Logos) */
.verbaende .verband-ohne-link,.mitglied-liste .verband-ohne-link{display:block;background:var(--weiss);padding:.5rem .8rem;border-radius:8px;flex:none}
.verbaende .verband-ohne-link img{height:44px;width:auto;margin:0}
.mitglied-liste .verband-ohne-link img{height:48px;width:auto}
@media (max-width:520px){.verbaende .verband-ohne-link img{height:34px}}

/* Konditionen: Überblick und aufklappbare Punkte */
.auf-einen-blick{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.9rem;margin:0 0 1.8rem}
.blick{background:var(--weiss);border-top:5px solid var(--ocker);border-radius:var(--radius);padding:.9rem 1rem;display:flex;flex-direction:column;gap:.25rem}
.blick:nth-child(2n){border-top-color:var(--lavendel)}
.blick-titel{font-weight:600;color:var(--aubergine)}
.konditionen-kopf{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:.6rem}
.konditionen-kopf p{margin:0}
.alle-oeffnen{background:none;border:0;padding:.3rem 0;font:600 .92rem var(--f-text);color:var(--aubergine);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.konditionen-liste{display:flex;flex-direction:column;gap:.5rem}
.kondition{background:var(--weiss);border-radius:var(--radius)}
.kondition summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:.8rem;padding:.85rem 1.1rem;font-weight:600;color:var(--aubergine)}
.kondition summary::-webkit-details-marker{display:none}
.kondition summary::after{content:"+";margin-left:auto;font-size:1.3rem;line-height:1;color:var(--mauve)}
.kondition[open] summary::after{content:"–"}
.kondition summary:focus-visible{outline:3px solid var(--ocker);outline-offset:2px;border-radius:var(--radius)}
.kondition .nr{flex:none;width:1.9rem;height:1.9rem;border-radius:50%;display:grid;place-items:center;background:var(--lavendel-hell);font-size:.85rem}
.kondition-text{padding:0 1.1rem 1rem 3.8rem}
.kondition-text p,.kondition-text ul{margin:0 0 .7rem}
.kondition-text > :last-child{margin-bottom:0}
@media (max-width:900px){.auf-einen-blick{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.auf-einen-blick{grid-template-columns:1fr}.kondition-text{padding-left:1.1rem}}
@media print{.kondition .kondition-text{display:block}.alle-oeffnen{display:none}}
.konditionen-liste + script + .klein-hinweis,.konditionen-liste ~ .klein-hinweis{margin-top:1rem}

/* Ruhigere Gestaltung: alle Abschnitte beige, Lavendel nur noch im Kontaktabschnitt (und Kopfzeile) */
.wand{background:var(--papier);border-top:10px solid var(--aubergine)}
.grenze-band{background:var(--papier);border-top:10px solid var(--aubergine);padding-top:clamp(2.5rem,6vw,4rem)}
.abschnitt:has(+ .grenze-band){padding-bottom:clamp(3rem,7vw,5.5rem)}

/* Dunkelviolette Linien nur noch nach dem Titelbereich und vor dem Kontakt */
.wand,.wand-oben,.grenze-band{border-top:0}
:is(.held,.seitenkopf) + section{border-top:10px solid var(--aubergine)}
/* zwischen beigen Abschnitten etwas weniger Abstand, damit keine grossen Lücken entstehen */
.abschnitt + .abschnitt:not(.kontakt){padding-top:clamp(1rem,3vw,2.5rem)}
.abschnitt:has(+ .grenze-band){padding-bottom:clamp(2rem,5vw,3.5rem)}

/* Konditionen, Formular und Rechtstexte linksbündig wie die übrigen Abschnitte (Zeilenlänge bleibt begrenzt) */
.wrap.rechtstext,.wrap.formular-wrap{max-width:var(--breite)}
.rechtstext > *,.formular-wrap > *{max-width:52rem}

/* Konditionen: alle Punkte offen sichtbar, mit Nummer im Kreis */
.kondition{padding:.9rem 1.1rem 1rem}
.kondition-titel{display:flex;align-items:center;gap:.8rem;margin:0 0 .5rem;font-size:1.02rem;font-weight:600;color:var(--aubergine)}
.kondition-titel .nr{background:var(--lavendel)}
.kondition-text{padding:0 0 0 2.7rem}
@media (max-width:520px){.kondition-text{padding-left:0}}
.konditionen-hinweis{margin:0 0 1.2rem;max-width:var(--lese)}
.logo img{filter:none}
/* AT-Zug im Wissenseintrag */
.artikel .at-zug{margin:1.4rem 0 2rem;padding:1rem;background:#fff;border-radius:14px}
.artikel .at-zug img{display:block;width:100%;height:auto}
.artikel .at-zug figcaption{margin-top:.6rem;font-size:.85rem;color:var(--mauve)}
/* Zum Weiterlesen auf Angebotsseiten */
.weiterlesen-alle{margin-top:1.4rem}
.weiterlesen-alle a{font-weight:600}
/* Bild oben im Wissenseintrag, wie auf den Angebotsseiten mit Kreisen und Legende */
.artikel .artikel-bild{width:min(30rem,100%);margin:1rem 0 3rem 1.5rem}
@media (max-width:600px){.artikel .artikel-bild{width:88%;margin:.5rem auto 2.5rem}}
.weiterlesen-band .wissen{grid-template-columns:repeat(2,1fr)}
@media (max-width:820px){.weiterlesen-band .wissen{grid-template-columns:1fr}}
.weiterlesen-band .eintrag.verborgen{display:none}
.weiterlesen-band .mehr-zeigen{margin-top:1.2rem}
/* Hinweise im Kontaktformular */
.kontaktformular .feld-hinweis{margin:-.4rem 0 .4rem;font-size:.9rem;color:var(--mauve)}
.spam-hinweis{font-size:.95rem;color:var(--mauve)}

main p,main li,main h1,main h2,main h3,main dd,main figcaption{overflow-wrap:break-word}
.nur-handy{display:none}@media (max-width:640px){.nur-handy{display:inline}}
.artikel .hinweis-allgemein{margin:0 0 2rem;padding:1rem 1.2rem;background:var(--lavendel-hell);border-left:4px solid var(--petrol);border-radius:10px;font-size:.95rem}
@media (max-width:820px){.zwei.oben>.portrait{margin-bottom:calc(clamp(3rem,7vw,5.5rem) - clamp(1.5rem,5vw,4rem))}}
.text-schmal{max-width:46rem}
/* Deko-Kreise dürfen nie seitlich scrollen lassen */
html,body{overflow-x:clip}

/* Cookie-Hinweis */
.cookie-hinweis{position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:60;max-width:40rem;margin-inline:auto;background:var(--weiss,#fff);color:var(--tinte,#2b2230);border:1px solid rgba(79,47,75,.25);border-radius:14px;box-shadow:0 8px 28px rgba(79,47,75,.22);padding:1rem 1.1rem}
.cookie-hinweis p{margin:0 0 .8rem;font-size:.92rem;line-height:1.5}
.cookie-hinweis a{color:var(--aubergine)}
.cookie-knoepfe{display:flex;flex-wrap:wrap;gap:.6rem}
.cookie-knoepfe button{font:inherit;font-weight:600;font-size:.92rem;cursor:pointer;border-radius:999px;padding:.55rem 1.2rem;border:2px solid var(--aubergine);background:var(--weiss,#fff);color:var(--aubergine)}
.cookie-knoepfe button:hover,.cookie-knoepfe button:focus-visible{background:var(--lavendel-hell)}
.cookie-link{font:inherit;font-size:.85rem;color:inherit;opacity:.85;background:none;border:0;padding:0;text-decoration:underline;cursor:pointer;margin-left:auto}
.cookie-link + .copyright{margin-left:1.2rem}
.hinweis-kalender{font-weight:500}