/*
 * Sunny Hands – barrierearme Anzeigeoptionen V2.
 * Basisdesign / Normalmodus bleibt vollständig im Original-Stylesheet.
 * Keine Bilddateien, Icons oder Logo werden verändert.
 */

/* Bedienelement: identische dezente Position wie die freigegebene Vorschau. */
.sh-skip-link{position:fixed;left:16px;top:-110px;z-index:100000;padding:12px 20px;background:#fff9f2;color:#6b3214;border:3px solid #c9682f;border-radius:8px;font-size:17px;font-weight:700;text-decoration:none;box-shadow:0 4px 16px #0003}
.sh-skip-link:focus{top:12px;outline:3px solid #263f50;outline-offset:2px}
.sh-accessibility{position:absolute;right:12px;top:8px;z-index:9999;font-family:inherit;isolation:isolate}
.sh-accessibility-trigger{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid #d58b65;border-radius:50%;background:#fff8f0;color:#ad4b1e;cursor:pointer;box-shadow:0 2px 8px #5033201c}
.sh-accessibility-trigger:hover,.sh-accessibility-trigger:focus-visible{outline:2px solid #a6491d;outline-offset:2px}
.sh-accessibility-panel{position:absolute;right:0;top:45px;width:min(340px,calc(100vw - 24px));max-height:min(80vh,690px);overflow:auto;padding:20px;background:#fffaf4;color:#30251f;border:1px solid #e9c9ae;border-radius:16px;box-shadow:0 14px 45px #35261b3b;font-size:15px;line-height:1.45;text-align:left}
.sh-accessibility-panel[hidden]{display:none!important}
.sh-a11y-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;font-size:18px}
.sh-a11y-close{border:0;background:transparent;color:#30251f;font-size:28px;cursor:pointer;line-height:1}
.sh-accessibility-panel fieldset{border:0;padding:0;margin:0 0 16px;min-width:0}
.sh-accessibility-panel legend{font-weight:650;margin-bottom:7px}
.sh-a11y-options{display:flex;gap:5px;flex-wrap:wrap}
.sh-a11y-options button,.sh-a11y-reset{font:inherit;border:1px solid #e3c7ad;background:#fff0df;color:#442b20;border-radius:8px;padding:9px 11px;cursor:pointer;min-height:42px}
.sh-a11y-options button[aria-pressed=true]{background:#bf551f;color:white;border-color:#bf551f}
.sh-accessibility-panel button:focus-visible,.sh-a11y-motion input:focus-visible{outline:3px solid #a6491d;outline-offset:2px}
.sh-a11y-motion{display:flex;align-items:center;gap:9px;margin:8px 0 17px;font-size:15px!important}
.sh-a11y-motion input{width:19px;height:19px;accent-color:#bc541e}
.sh-a11y-reset{width:100%;background:transparent;color:#a7481c}
@media(max-width:900px){.sh-accessibility{right:65px;top:8px}}
@media(max-width:480px){.sh-accessibility{right:58px;top:8px}.sh-accessibility-trigger{width:34px;height:34px}.sh-accessibility-panel{right:-50px}}

.sh-accessibility-panel{color-scheme:light}
.sh-accessibility-panel button{font-size:14px}
.sh-accessibility-panel button[aria-pressed="true"]{font-weight:700}
.sh-accessibility-panel :focus-visible{outline:3px solid #944014!important;outline-offset:3px!important}

/* Schriftvergrößerung: echte Schriftgröße statt bloßer Zeilenhöhe.
   Normale Überschriften und Hero-Sprechblasen behalten ihre Proportionen. */
html[data-sh-font="large"] main :is(p,li,dt,dd,blockquote,figcaption,summary,small,label,a,button,input,textarea,select),
html[data-sh-font="large"] footer :is(p,li,a,small) {
  font-size:max(20px,1em)!important;
  line-height:1.55!important;
}
html[data-sh-font="xlarge"] main :is(p,li,dt,dd,blockquote,figcaption,summary,small,label,a,button,input,textarea,select),
html[data-sh-font="xlarge"] footer :is(p,li,a,small) {
  font-size:max(24px,1em)!important;
  line-height:1.55!important;
}
html[data-sh-font="large"] main :is(h3,h4){font-size:max(25px,1em)!important;line-height:1.25!important}
html[data-sh-font="xlarge"] main :is(h3,h4){font-size:max(30px,1em)!important;line-height:1.25!important}
html[data-sh-font="large"] main :is(p,li) :is(span,strong,em,small),
html[data-sh-font="xlarge"] main :is(p,li) :is(span,strong,em,small){font-size:inherit!important}
html[data-sh-font="large"] main, html[data-sh-font="xlarge"] main {
  overflow-wrap:break-word;
}
html[data-sh-font="large"] main :is(a,button), html[data-sh-font="xlarge"] main :is(a,button) {
  white-space:normal;
}
/* Die in den Header eingepasste Navigation bleibt unverändert. */

/* Dunkelmodus: warme Anthrazit-/Espresso-Flächen und heller Text.
   Fotobereiche, Logo und gestaltete Hero-Sprechblasen bleiben bildgetreu.
   Der ursprüngliche Fehler "weiße Schrift auf hellem Hintergrund" wird vermieden. */
html[data-sh-mode="dark"]{
  color-scheme:dark;
  --cream:#202123;
  --cream2:#282729;
  --ink:#f5e8d8;
  --text:#e0d0c0;
  --line:#695447;
  --white:#29292b;
  --orange:#ffa46c;
}
/* Header und fotografische Hero-Bereiche behalten ihre originalen Markenfarben.
   Sonst würden durch die dunklen globalen Farbvariablen dort Texte aufhellen. */
html[data-sh-mode="dark"] .sh-wow-header,
html[data-sh-mode="dark"] main [class*="hero"]{
  --cream:#fffaf5;
  --cream2:#fbf1e7;
  --ink:#0d2d40;
  --text:#4d6876;
  --orange:#f45117;
  --line:#efc7a7;
  --white:#fffdf9;
}
html[data-sh-mode="dark"] body {
  background:#202123!important;
  color:#f4e9dd!important;
}
html[data-sh-mode="dark"] main{
  background:#202123!important;
  color:#f4e9dd!important;
}
/* Helle Farbflächen neutralisieren, ohne fotografische Kind-Elemente
   oder Bild-/Textkompositionen innerhalb der Hero-Bereiche umzubauen. */
html[data-sh-mode="dark"] main :is(section,article,aside,details,[class*="-card"],[class*="-box"],[class*="-panel"],[class*="-item"],[class*="-wrap"],[class*="-band"],[class*="-grid"]):not([class*="hero"],[class*="hero"] *){
  background-color:#29292b!important;
  background-image:none!important;
  color:#f4e9dd!important;
  border-color:#685a4f!important;
}
/* Aufeinanderfolgende große Sektionen ruhiger absetzen */
html[data-sh-mode="dark"] main > :is(section,article,div):not([class*="hero"]){
  background-color:#202123!important;
  background-image:none!important;
}
/* Inhaltsfarbe nur außerhalb der unverändert gestalteten Hero-Bilder.
   Orange Akzente und aktive Links bleiben als Akzente erkennbar. */
html[data-sh-mode="dark"] main :is(p,li,dd,dt,small,strong,em,span,label,h1,h2,h3,h4,h5,h6,figcaption,blockquote,summary):not([class*="hero"] *){
  color:#f4e9dd!important;
  text-shadow:none!important;
}
html[data-sh-mode="dark"] main :is(a,button):not([class*="hero"] *){
  color:#ffd0a9!important;
  text-shadow:none!important;
}
html[data-sh-mode="dark"] main :is(a[class*="btn"],a[class*="button"],button):not([class*="hero"] *){
  background:#994922!important;
  border-color:#dd9a71!important;
  color:#fff9f1!important;
}
html[data-sh-mode="dark"] main :is(input,textarea,select):not([class*="hero"] *){
  background:#343233!important;
  color:#fff7ed!important;
  border:1px solid #ad8b77!important;
}
html[data-sh-mode="dark"] main :is(input,textarea):not([class*="hero"] *)::placeholder {
  color:#d8c5b5!important;
  opacity:1;
}
/* Die Foto-Overlays und dekorativen Sprechblasen bleiben im Originalzustand.
   Bei der Startseiten-Zwischensektion mit großem Foto wird die helle
   Textblende gezielt durch eine dunkle Variante ersetzt. */
html[data-sh-mode="dark"] .home-distance-overlay{
  background:linear-gradient(90deg,rgba(29,30,32,.96),rgba(29,30,32,.83) 32%,rgba(29,30,32,.34) 61%,transparent)!important;
}
html[data-sh-mode="dark"] .privat30-service-card::after{
  background:linear-gradient(90deg,rgba(30,31,32,.98) 0%,rgba(30,31,32,.91) 38%,rgba(30,31,32,.25) 100%)!important;
}
/* Auf mehreren Seiten werden Farben auch direkt in span- oder em-Elementen
   gesetzt. Diese Akzente bleiben zur Orientierung orange. */
html[data-sh-mode="dark"] main :is(.sh-text-accent,[class*="-accent"],[class*="-kicker"]) {
  color:#ffae76!important;
}
html[data-sh-mode="dark"] .site-footer {
  background:#242427!important;
  border-color:#655344!important;
  color:#f5e9dc!important;
}
html[data-sh-mode="dark"] .site-footer :is(section,div){
  background-color:transparent!important;
  background-image:none!important;
}
html[data-sh-mode="dark"] .site-footer :is(p,a,h2,h3,small,span,strong,li){
  color:#f0e3d4!important;
  text-shadow:none!important;
}
/* Das Einstellungsmenü ist im Dunkelmodus selbst lesbar. */
html[data-sh-mode="dark"] .sh-accessibility-panel{
  color-scheme:dark;
  background:#28282b!important;
  border-color:#8c735f!important;
  color:#f5e8db!important;
}
html[data-sh-mode="dark"] .sh-accessibility-panel :is(legend,strong,label){
  color:#f5e8db!important;
}
html[data-sh-mode="dark"] .sh-a11y-close,
html[data-sh-mode="dark"] .sh-a11y-options button,
html[data-sh-mode="dark"] .sh-a11y-reset{
  color:#fff0df!important;
  background:#3b3431!important;
  border-color:#9d7a62!important;
}
html[data-sh-mode="dark"] .sh-a11y-options button[aria-pressed=true] {
  background:#b65c2d!important;
  color:#fff!important;
}
html[data-sh-mode="dark"] .sh-accessibility-trigger{
  background:#3b302a!important;
  color:#ffe0c0!important;
  border-color:#b88968!important;
}
/* Hoher Kontrast ohne Filter: Fotos und Bilder ändern ihre Farben NICHT. */
html[data-sh-contrast="high"]:not([data-sh-mode="dark"]) main :is(p,li,dd,dt,small,label,blockquote,summary):not([class*="hero"] *){
  color:#142833!important;
}
html[data-sh-contrast="high"][data-sh-mode="dark"] main :is(p,li,dd,dt,small,label,blockquote,summary):not([class*="hero"] *){
  color:#fff!important;
}
html[data-sh-contrast="high"] :is(main,footer) a:not([class*="hero"] *){
  text-decoration:underline;
  text-underline-offset:3px;
}
/* Bewegungseinstellungen wirken auch auf selbst gestartetes Scrollen. */
html[data-sh-motion="reduce"] *,
html[data-sh-motion="reduce"] *::before,
html[data-sh-motion="reduce"] *::after{
  animation-duration:.01ms!important;
  animation-iteration-count:1!important;
  transition-duration:.01ms!important;
  scroll-behavior:auto!important;
}
@media(prefers-reduced-motion:reduce){
  html *,html *::before,html *::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}
@media(max-width:680px){
  html[data-sh-font="xlarge"] main :is(p,li,a,button,label,small){
    font-size:max(22px,1em)!important;
  }
  html[data-sh-font="large"] main :is(p,li,a,button,label,small){
    font-size:max(19px,1em)!important;
  }
}