/* Designsystem für โรงพยาบาลส่งเสริมสุขภาพตำบลพืชอุดม — gerechnet, nicht ausgewählt.
   Ton 216°, Gegenton 37°, Typo-Verhältnis 1.25,
   Charakter: klar / weich / sachlich.
   Gemessener Kontrast (hell): Tinte 16.27:1 ·
   Matt 4.84:1 · auf Akzent 4.62:1 */

:root{
  --grund:#eff8fb;--flaeche:#ffffff;--erhoben:#ecf5f8;
  --linie:#cde2e8;--tinte:#001d25;--matt:#547179;
  --akzent:#008097;--akzent-text:#007a90;
  --auf-akzent:#ffffff;--gegen:#d3927f;
  color-scheme:light dark;

  /* Typo: EIN Verhältnis (1.25), sieben Stufen daraus. */
  --t-display:clamp(26px,3.0vw,45px);
  --t-h1:clamp(24px,2.1vw,36px);
  --t-h2:clamp(25px,1.3vw,28px);
  --t-h3:22px;--t-lead:19px;--t-body:17px;
  --t-klein:14px;--t-label:13px;

  /* Raum: EINE Skala. Ein Wert daneben ist ein Fehler. */
  --r1:4px;--r2:8px;--r3:14px;--r4:22px;
  --r5:34px;--r6:52px;--r7:78px;--r8:116px;
  --luft:clamp(78px,8vw,144px);

  --r:10px;--r-klein:6px;
  --r-gross:15px;
  --schatten-1:0 1px 2px oklch(0.171 0.02 216 / .06);--schatten-2:0 10px 24px -14px oklch(0.171 0.03 216 / .28);
  --schatten-3:0 34px 70px -40px oklch(0.171 0.04 216 / .42);

  --kopfschrift:'IBM Plex Sans Thai',system-ui,sans-serif;
  --textschrift:'IBM Plex Sans Thai',system-ui,sans-serif;
  --spur:-0.02em;--kopfgewicht:600;

  --raus:cubic-bezier(.2,.7,.3,1);--rein:cubic-bezier(.4,0,1,1);
  --kurz:160ms;--mittel:240ms;--lang:420ms;

  --muster:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20120%20120%22%3E%3Crect%20width%3D%22120%22%20height%3D%22120%22%20fill%3D%22%23ffffff%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%225%22%20r%3D%220.9958369439657382%22%20fill%3D%22%23008097%22%20opacity%3D%220.3757359312880715%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%225%22%20r%3D%221.187095925159781%22%20fill%3D%22%23008097%22%20opacity%3D%220.4094875162046673%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%225%22%20r%3D%221.3568542772370726%22%20fill%3D%22%23008097%22%20opacity%3D%220.4394448724536011%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%225%22%20r%3D%221.4993422191251786%22%20fill%3D%22%23008097%22%20opacity%3D%220.46458980337503153%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%225%22%20r%3D%221.6080426592379182%22%20fill%3D%22%23008097%22%20opacity%3D%220.48377223398316205%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%225%22%20r%3D%221.6765506164155046%22%20fill%3D%22%23008097%22%20opacity%3D%220.49586187348508903%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%225%22%20r%3D%221.7%22%20fill%3D%22%23008097%22%20opacity%3D%220.5%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%225%22%20r%3D%221.6765506164155046%22%20fill%3D%22%23008097%22%20opacity%3D%220.49586187348508903%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%225%22%20r%3D%221.6080426592379182%22%20fill%3D%22%23008097%22%20opacity%3D%220.48377223398316205%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%225%22%20r%3D%221.4993422191251786%22%20fill%3D%22%23008097%22%20opacity%3D%220.46458980337503153%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%225%22%20r%3D%221.3568542772370726%22%20fill%3D%22%23008097%22%20opacity%3D%220.4394448724536011%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%225%22%20r%3D%221.187095925159781%22%20fill%3D%22%23008097%22%20opacity%3D%220.4094875162046673%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2215%22%20r%3D%221.187095925159781%22%20fill%3D%22%23008097%22%20opacity%3D%220.4094875162046673%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2215%22%20r%3D%221.3965307866381151%22%20fill%3D%22%23008097%22%20opacity%3D%220.4464466094067262%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2215%22%20r%3D%221.5857814660606928%22%20fill%3D%22%23008097%22%20opacity%3D%220.47984378812835754%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2215%22%20r%3D%221.7478969631271652%22%20fill%3D%22%23008097%22%20opacity%3D%220.508452405257735%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2215%22%20r%3D%221.8742033046452236%22%20fill%3D%22%23008097%22%20opacity%3D%220.5307417596432747%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2215%22%20r%3D%221.9552778044820438%22%20fill%3D%22%23008097%22%20opacity%3D%220.5450490243203607%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2215%22%20r%3D%221.983333333333333%22%20fill%3D%22%23008097%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2215%22%20r%3D%221.9552778044820438%22%20fill%3D%22%23008097%22%20opacity%3D%220.5450490243203607%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2215%22%20r%3D%221.8742033046452236%22%20fill%3D%22%23008097%22%20opacity%3D%220.5307417596432747%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2215%22%20r%3D%221.7478969631271652%22%20fill%3D%22%23008097%22%20opacity%3D%220.508452405257735%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2215%22%20r%3D%221.5857814660606928%22%20fill%3D%22%23008097%22%20opacity%3D%220.47984378812835754%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2215%22%20r%3D%221.3965307866381151%22%20fill%3D%22%23008097%22%20opacity%3D%220.4464466094067262%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2225%22%20r%3D%221.3568542772370726%22%20fill%3D%22%23008097%22%20opacity%3D%220.4394448724536011%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2225%22%20r%3D%221.5857814660606928%22%20fill%3D%22%23008097%22%20opacity%3D%220.47984378812835754%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2225%22%20r%3D%221.7972246293104919%22%20fill%3D%22%23008097%22%20opacity%3D%220.5171572875253809%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2225%22%20r%3D%221.983333333333333%22%20fill%3D%22%23008097%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2225%22%20r%3D%222.1328948127501195%22%20fill%3D%22%23008097%22%20opacity%3D%220.5763932022500211%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2225%22%20r%3D%222.2317867394083293%22%20fill%3D%22%23008097%22%20opacity%3D%220.5938447187191169%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2225%22%20r%3D%222.266666666666667%22%20fill%3D%22%23008097%22%20opacity%3D%220.6000000000000001%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2225%22%20r%3D%222.2317867394083293%22%20fill%3D%22%23008097%22%20opacity%3D%220.5938447187191169%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2225%22%20r%3D%222.1328948127501195%22%20fill%3D%22%23008097%22%20opacity%3D%220.5763932022500211%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2225%22%20r%3D%221.983333333333333%22%20fill%3D%22%23008097%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2225%22%20r%3D%221.7972246293104919%22%20fill%3D%22%23008097%22%20opacity%3D%220.5171572875253809%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2225%22%20r%3D%221.5857814660606928%22%20fill%3D%22%23008097%22%20opacity%3D%220.47984378812835754%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2235%22%20r%3D%221.4993422191251786%22%20fill%3D%22%23008097%22%20opacity%3D%220.46458980337503153%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2235%22%20r%3D%221.7478969631271652%22%20fill%3D%22%23008097%22%20opacity%3D%220.508452405257735%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2235%22%20r%3D%221.983333333333333%22%20fill%3D%22%23008097%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2235%22%20r%3D%222.1979184719828693%22%20fill%3D%22%23008097%22%20opacity%3D%220.5878679656440358%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2235%22%20r%3D%222.3784271386185365%22%20fill%3D%22%23008097%22%20opacity%3D%220.6197224362268006%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2235%22%20r%3D%222.504021329618959%22%20fill%3D%22%23008097%22%20opacity%3D%220.641886116991581%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2235%22%20r%3D%222.55%22%20fill%3D%22%23008097%22%20opacity%3D%220.6499999999999999%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2235%22%20r%3D%222.504021329618959%22%20fill%3D%22%23008097%22%20opacity%3D%220.641886116991581%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2235%22%20r%3D%222.3784271386185365%22%20fill%3D%22%23008097%22%20opacity%3D%220.6197224362268006%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2235%22%20r%3D%222.1979184719828693%22%20fill%3D%22%23008097%22%20opacity%3D%220.5878679656440358%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2235%22%20r%3D%221.983333333333333%22%20fill%3D%22%23008097%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2235%22%20r%3D%221.7478969631271652%22%20fill%3D%22%23008097%22%20opacity%3D%220.508452405257735%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2245%22%20r%3D%221.6080426592379182%22%20fill%3D%22%23008097%22%20opacity%3D%220.48377223398316205%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2245%22%20r%3D%221.8742033046452236%22%20fill%3D%22%23008097%22%20opacity%3D%220.5307417596432747%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2245%22%20r%3D%222.1328948127501195%22%20fill%3D%22%23008097%22%20opacity%3D%220.5763932022500211%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2245%22%20r%3D%222.3784271386185365%22%20fill%3D%22%23008097%22%20opacity%3D%220.6197224362268006%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2245%22%20r%3D%222.598612314655246%22%20fill%3D%22%23008097%22%20opacity%3D%220.6585786437626904%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2245%22%20r%3D%222.7664474063750597%22%20fill%3D%22%23008097%22%20opacity%3D%220.6881966011250105%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2245%22%20r%3D%222.8333333333333335%22%20fill%3D%22%23008097%22%20opacity%3D%220.7%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2245%22%20r%3D%222.7664474063750597%22%20fill%3D%22%23008097%22%20opacity%3D%220.6881966011250105%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2245%22%20r%3D%222.598612314655246%22%20fill%3D%22%23008097%22%20opacity%3D%220.6585786437626904%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2245%22%20r%3D%222.3784271386185365%22%20fill%3D%22%23008097%22%20opacity%3D%220.6197224362268006%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2245%22%20r%3D%222.1328948127501195%22%20fill%3D%22%23008097%22%20opacity%3D%220.5763932022500211%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2245%22%20r%3D%221.8742033046452236%22%20fill%3D%22%23008097%22%20opacity%3D%220.5307417596432747%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2255%22%20r%3D%221.6765506164155046%22%20fill%3D%22%23008097%22%20opacity%3D%220.49586187348508903%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2255%22%20r%3D%221.9552778044820438%22%20fill%3D%22%23008097%22%20opacity%3D%220.5450490243203607%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2255%22%20r%3D%222.2317867394083293%22%20fill%3D%22%23008097%22%20opacity%3D%220.5938447187191169%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2255%22%20r%3D%222.504021329618959%22%20fill%3D%22%23008097%22%20opacity%3D%220.641886116991581%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2255%22%20r%3D%222.7664474063750597%22%20fill%3D%22%23008097%22%20opacity%3D%220.6881966011250105%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2255%22%20r%3D%222.9993061573276227%22%20fill%3D%22%23008097%22%20opacity%3D%220.7292893218813452%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2255%22%20r%3D%223.1166666666666663%22%20fill%3D%22%23008097%22%20opacity%3D%220.75%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2255%22%20r%3D%222.9993061573276227%22%20fill%3D%22%23008097%22%20opacity%3D%220.7292893218813452%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2255%22%20r%3D%222.7664474063750597%22%20fill%3D%22%23008097%22%20opacity%3D%220.6881966011250105%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2255%22%20r%3D%222.504021329618959%22%20fill%3D%22%23008097%22%20opacity%3D%220.641886116991581%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2255%22%20r%3D%222.2317867394083293%22%20fill%3D%22%23008097%22%20opacity%3D%220.5938447187191169%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2255%22%20r%3D%221.9552778044820438%22%20fill%3D%22%23008097%22%20opacity%3D%220.5450490243203607%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2265%22%20r%3D%221.7%22%20fill%3D%22%23008097%22%20opacity%3D%220.5%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2265%22%20r%3D%221.983333333333333%22%20fill%3D%22%23008097%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2265%22%20r%3D%222.266666666666667%22%20fill%3D%22%23008097%22%20opacity%3D%220.6000000000000001%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2265%22%20r%3D%222.55%22%20fill%3D%22%23008097%22%20opacity%3D%220.6499999999999999%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2265%22%20r%3D%222.8333333333333335%22%20fill%3D%22%23008097%22%20opacity%3D%220.7%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2265%22%20r%3D%223.1166666666666663%22%20fill%3D%22%23008097%22%20opacity%3D%220.75%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2265%22%20r%3D%223.4%22%20fill%3D%22%23008097%22%20opacity%3D%220.8%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2265%22%20r%3D%223.1166666666666663%22%20fill%3D%22%23008097%22%20opacity%3D%220.75%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2265%22%20r%3D%222.8333333333333335%22%20fill%3D%22%23008097%22%20opacity%3D%220.7%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2265%22%20r%3D%222.55%22%20fill%3D%22%23008097%22%20opacity%3D%220.6499999999999999%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2265%22%20r%3D%222.266666666666667%22%20fill%3D%22%23008097%22%20opacity%3D%220.6000000000000001%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2265%22%20r%3D%221.983333333333333%22%20fill%3D%22%23008097%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2275%22%20r%3D%221.6765506164155046%22%20fill%3D%22%23008097%22%20opacity%3D%220.49586187348508903%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2275%22%20r%3D%221.9552778044820438%22%20fill%3D%22%23008097%22%20opacity%3D%220.5450490243203607%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2275%22%20r%3D%222.2317867394083293%22%20fill%3D%22%23008097%22%20opacity%3D%220.5938447187191169%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2275%22%20r%3D%222.504021329618959%22%20fill%3D%22%23008097%22%20opacity%3D%220.641886116991581%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2275%22%20r%3D%222.7664474063750597%22%20fill%3D%22%23008097%22%20opacity%3D%220.6881966011250105%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2275%22%20r%3D%222.9993061573276227%22%20fill%3D%22%23008097%22%20opacity%3D%220.7292893218813452%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2275%22%20r%3D%223.1166666666666663%22%20fill%3D%22%23008097%22%20opacity%3D%220.75%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2275%22%20r%3D%222.9993061573276227%22%20fill%3D%22%23008097%22%20opacity%3D%220.7292893218813452%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2275%22%20r%3D%222.7664474063750597%22%20fill%3D%22%23008097%22%20opacity%3D%220.6881966011250105%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2275%22%20r%3D%222.504021329618959%22%20fill%3D%22%23008097%22%20opacity%3D%220.641886116991581%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2275%22%20r%3D%222.2317867394083293%22%20fill%3D%22%23008097%22%20opacity%3D%220.5938447187191169%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2275%22%20r%3D%221.9552778044820438%22%20fill%3D%22%23008097%22%20opacity%3D%220.5450490243203607%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2285%22%20r%3D%221.6080426592379182%22%20fill%3D%22%23008097%22%20opacity%3D%220.48377223398316205%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2285%22%20r%3D%221.8742033046452236%22%20fill%3D%22%23008097%22%20opacity%3D%220.5307417596432747%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2285%22%20r%3D%222.1328948127501195%22%20fill%3D%22%23008097%22%20opacity%3D%220.5763932022500211%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2285%22%20r%3D%222.3784271386185365%22%20fill%3D%22%23008097%22%20opacity%3D%220.6197224362268006%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2285%22%20r%3D%222.598612314655246%22%20fill%3D%22%23008097%22%20opacity%3D%220.6585786437626904%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2285%22%20r%3D%222.7664474063750597%22%20fill%3D%22%23008097%22%20opacity%3D%220.6881966011250105%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2285%22%20r%3D%222.8333333333333335%22%20fill%3D%22%23008097%22%20opacity%3D%220.7%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2285%22%20r%3D%222.7664474063750597%22%20fill%3D%22%23008097%22%20opacity%3D%220.6881966011250105%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2285%22%20r%3D%222.598612314655246%22%20fill%3D%22%23008097%22%20opacity%3D%220.6585786437626904%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2285%22%20r%3D%222.3784271386185365%22%20fill%3D%22%23008097%22%20opacity%3D%220.6197224362268006%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2285%22%20r%3D%222.1328948127501195%22%20fill%3D%22%23008097%22%20opacity%3D%220.5763932022500211%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2285%22%20r%3D%221.8742033046452236%22%20fill%3D%22%23008097%22%20opacity%3D%220.5307417596432747%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2295%22%20r%3D%221.4993422191251786%22%20fill%3D%22%23008097%22%20opacity%3D%220.46458980337503153%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2295%22%20r%3D%221.7478969631271652%22%20fill%3D%22%23008097%22%20opacity%3D%220.508452405257735%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2295%22%20r%3D%221.983333333333333%22%20fill%3D%22%23008097%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2295%22%20r%3D%222.1979184719828693%22%20fill%3D%22%23008097%22%20opacity%3D%220.5878679656440358%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2295%22%20r%3D%222.3784271386185365%22%20fill%3D%22%23008097%22%20opacity%3D%220.6197224362268006%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2295%22%20r%3D%222.504021329618959%22%20fill%3D%22%23008097%22%20opacity%3D%220.641886116991581%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2295%22%20r%3D%222.55%22%20fill%3D%22%23008097%22%20opacity%3D%220.6499999999999999%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2295%22%20r%3D%222.504021329618959%22%20fill%3D%22%23008097%22%20opacity%3D%220.641886116991581%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2295%22%20r%3D%222.3784271386185365%22%20fill%3D%22%23008097%22%20opacity%3D%220.6197224362268006%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2295%22%20r%3D%222.1979184719828693%22%20fill%3D%22%23008097%22%20opacity%3D%220.5878679656440358%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2295%22%20r%3D%221.983333333333333%22%20fill%3D%22%23008097%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2295%22%20r%3D%221.7478969631271652%22%20fill%3D%22%23008097%22%20opacity%3D%220.508452405257735%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%22105%22%20r%3D%221.3568542772370726%22%20fill%3D%22%23008097%22%20opacity%3D%220.4394448724536011%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%22105%22%20r%3D%221.5857814660606928%22%20fill%3D%22%23008097%22%20opacity%3D%220.47984378812835754%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%22105%22%20r%3D%221.7972246293104919%22%20fill%3D%22%23008097%22%20opacity%3D%220.5171572875253809%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%22105%22%20r%3D%221.983333333333333%22%20fill%3D%22%23008097%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%22105%22%20r%3D%222.1328948127501195%22%20fill%3D%22%23008097%22%20opacity%3D%220.5763932022500211%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%22105%22%20r%3D%222.2317867394083293%22%20fill%3D%22%23008097%22%20opacity%3D%220.5938447187191169%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%22105%22%20r%3D%222.266666666666667%22%20fill%3D%22%23008097%22%20opacity%3D%220.6000000000000001%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%22105%22%20r%3D%222.2317867394083293%22%20fill%3D%22%23008097%22%20opacity%3D%220.5938447187191169%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%22105%22%20r%3D%222.1328948127501195%22%20fill%3D%22%23008097%22%20opacity%3D%220.5763932022500211%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%22105%22%20r%3D%221.983333333333333%22%20fill%3D%22%23008097%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%22105%22%20r%3D%221.7972246293104919%22%20fill%3D%22%23008097%22%20opacity%3D%220.5171572875253809%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%22105%22%20r%3D%221.5857814660606928%22%20fill%3D%22%23008097%22%20opacity%3D%220.47984378812835754%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%22115%22%20r%3D%221.187095925159781%22%20fill%3D%22%23008097%22%20opacity%3D%220.4094875162046673%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%22115%22%20r%3D%221.3965307866381151%22%20fill%3D%22%23008097%22%20opacity%3D%220.4464466094067262%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%22115%22%20r%3D%221.5857814660606928%22%20fill%3D%22%23008097%22%20opacity%3D%220.47984378812835754%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%22115%22%20r%3D%221.7478969631271652%22%20fill%3D%22%23008097%22%20opacity%3D%220.508452405257735%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%22115%22%20r%3D%221.8742033046452236%22%20fill%3D%22%23008097%22%20opacity%3D%220.5307417596432747%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%22115%22%20r%3D%221.9552778044820438%22%20fill%3D%22%23008097%22%20opacity%3D%220.5450490243203607%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%22115%22%20r%3D%221.983333333333333%22%20fill%3D%22%23008097%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%22115%22%20r%3D%221.9552778044820438%22%20fill%3D%22%23008097%22%20opacity%3D%220.5450490243203607%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%22115%22%20r%3D%221.8742033046452236%22%20fill%3D%22%23008097%22%20opacity%3D%220.5307417596432747%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%22115%22%20r%3D%221.7478969631271652%22%20fill%3D%22%23008097%22%20opacity%3D%220.508452405257735%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%22115%22%20r%3D%221.5857814660606928%22%20fill%3D%22%23008097%22%20opacity%3D%220.47984378812835754%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%22115%22%20r%3D%221.3965307866381151%22%20fill%3D%22%23008097%22%20opacity%3D%220.4464466094067262%22%2F%3E%3C%2Fsvg%3E");
  --foto:url('../bilder/klinik-1.jpg');
  --foto2:url('../bilder/klinik-2.jpg');--foto3:url('../bilder/klinik-1.jpg');
  
  
  --txt-beispiel:"ภาพตัวอย่าง";
}
@media (prefers-color-scheme:dark){:root{
  --grund:#071214;--flaeche:#0b1a1d;--erhoben:#112428;
  --linie:#20373d;--tinte:#e2f8fe;--matt:#8cabb3;
  --akzent:#43c0dc;--akzent-text:#43c0dc;
  --auf-akzent:#080e10;--gegen:#9f5e4b;
  --muster:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20120%20120%22%3E%3Crect%20width%3D%22120%22%20height%3D%22120%22%20fill%3D%22%230b1a1d%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%225%22%20r%3D%220.9958369439657382%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.3757359312880715%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%225%22%20r%3D%221.187095925159781%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.4094875162046673%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%225%22%20r%3D%221.3568542772370726%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.4394448724536011%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%225%22%20r%3D%221.4993422191251786%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.46458980337503153%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%225%22%20r%3D%221.6080426592379182%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.48377223398316205%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%225%22%20r%3D%221.6765506164155046%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.49586187348508903%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%225%22%20r%3D%221.7%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%225%22%20r%3D%221.6765506164155046%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.49586187348508903%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%225%22%20r%3D%221.6080426592379182%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.48377223398316205%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%225%22%20r%3D%221.4993422191251786%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.46458980337503153%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%225%22%20r%3D%221.3568542772370726%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.4394448724536011%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%225%22%20r%3D%221.187095925159781%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.4094875162046673%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2215%22%20r%3D%221.187095925159781%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.4094875162046673%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2215%22%20r%3D%221.3965307866381151%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.4464466094067262%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2215%22%20r%3D%221.5857814660606928%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.47984378812835754%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2215%22%20r%3D%221.7478969631271652%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.508452405257735%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2215%22%20r%3D%221.8742033046452236%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5307417596432747%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2215%22%20r%3D%221.9552778044820438%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5450490243203607%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2215%22%20r%3D%221.983333333333333%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2215%22%20r%3D%221.9552778044820438%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5450490243203607%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2215%22%20r%3D%221.8742033046452236%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5307417596432747%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2215%22%20r%3D%221.7478969631271652%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.508452405257735%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2215%22%20r%3D%221.5857814660606928%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.47984378812835754%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2215%22%20r%3D%221.3965307866381151%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.4464466094067262%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2225%22%20r%3D%221.3568542772370726%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.4394448724536011%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2225%22%20r%3D%221.5857814660606928%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.47984378812835754%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2225%22%20r%3D%221.7972246293104919%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5171572875253809%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2225%22%20r%3D%221.983333333333333%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2225%22%20r%3D%222.1328948127501195%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5763932022500211%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2225%22%20r%3D%222.2317867394083293%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5938447187191169%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2225%22%20r%3D%222.266666666666667%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6000000000000001%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2225%22%20r%3D%222.2317867394083293%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5938447187191169%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2225%22%20r%3D%222.1328948127501195%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5763932022500211%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2225%22%20r%3D%221.983333333333333%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2225%22%20r%3D%221.7972246293104919%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5171572875253809%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2225%22%20r%3D%221.5857814660606928%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.47984378812835754%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2235%22%20r%3D%221.4993422191251786%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.46458980337503153%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2235%22%20r%3D%221.7478969631271652%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.508452405257735%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2235%22%20r%3D%221.983333333333333%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2235%22%20r%3D%222.1979184719828693%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5878679656440358%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2235%22%20r%3D%222.3784271386185365%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6197224362268006%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2235%22%20r%3D%222.504021329618959%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.641886116991581%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2235%22%20r%3D%222.55%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6499999999999999%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2235%22%20r%3D%222.504021329618959%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.641886116991581%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2235%22%20r%3D%222.3784271386185365%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6197224362268006%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2235%22%20r%3D%222.1979184719828693%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5878679656440358%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2235%22%20r%3D%221.983333333333333%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2235%22%20r%3D%221.7478969631271652%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.508452405257735%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2245%22%20r%3D%221.6080426592379182%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.48377223398316205%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2245%22%20r%3D%221.8742033046452236%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5307417596432747%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2245%22%20r%3D%222.1328948127501195%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5763932022500211%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2245%22%20r%3D%222.3784271386185365%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6197224362268006%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2245%22%20r%3D%222.598612314655246%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6585786437626904%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2245%22%20r%3D%222.7664474063750597%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6881966011250105%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2245%22%20r%3D%222.8333333333333335%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.7%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2245%22%20r%3D%222.7664474063750597%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6881966011250105%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2245%22%20r%3D%222.598612314655246%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6585786437626904%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2245%22%20r%3D%222.3784271386185365%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6197224362268006%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2245%22%20r%3D%222.1328948127501195%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5763932022500211%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2245%22%20r%3D%221.8742033046452236%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5307417596432747%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2255%22%20r%3D%221.6765506164155046%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.49586187348508903%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2255%22%20r%3D%221.9552778044820438%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5450490243203607%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2255%22%20r%3D%222.2317867394083293%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5938447187191169%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2255%22%20r%3D%222.504021329618959%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.641886116991581%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2255%22%20r%3D%222.7664474063750597%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6881966011250105%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2255%22%20r%3D%222.9993061573276227%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.7292893218813452%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2255%22%20r%3D%223.1166666666666663%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.75%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2255%22%20r%3D%222.9993061573276227%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.7292893218813452%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2255%22%20r%3D%222.7664474063750597%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6881966011250105%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2255%22%20r%3D%222.504021329618959%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.641886116991581%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2255%22%20r%3D%222.2317867394083293%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5938447187191169%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2255%22%20r%3D%221.9552778044820438%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5450490243203607%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2265%22%20r%3D%221.7%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2265%22%20r%3D%221.983333333333333%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2265%22%20r%3D%222.266666666666667%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6000000000000001%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2265%22%20r%3D%222.55%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6499999999999999%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2265%22%20r%3D%222.8333333333333335%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.7%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2265%22%20r%3D%223.1166666666666663%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.75%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2265%22%20r%3D%223.4%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.8%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2265%22%20r%3D%223.1166666666666663%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.75%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2265%22%20r%3D%222.8333333333333335%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.7%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2265%22%20r%3D%222.55%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6499999999999999%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2265%22%20r%3D%222.266666666666667%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6000000000000001%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2265%22%20r%3D%221.983333333333333%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2275%22%20r%3D%221.6765506164155046%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.49586187348508903%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2275%22%20r%3D%221.9552778044820438%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5450490243203607%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2275%22%20r%3D%222.2317867394083293%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5938447187191169%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2275%22%20r%3D%222.504021329618959%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.641886116991581%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2275%22%20r%3D%222.7664474063750597%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6881966011250105%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2275%22%20r%3D%222.9993061573276227%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.7292893218813452%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2275%22%20r%3D%223.1166666666666663%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.75%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2275%22%20r%3D%222.9993061573276227%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.7292893218813452%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2275%22%20r%3D%222.7664474063750597%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6881966011250105%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2275%22%20r%3D%222.504021329618959%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.641886116991581%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2275%22%20r%3D%222.2317867394083293%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5938447187191169%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2275%22%20r%3D%221.9552778044820438%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5450490243203607%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2285%22%20r%3D%221.6080426592379182%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.48377223398316205%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2285%22%20r%3D%221.8742033046452236%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5307417596432747%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2285%22%20r%3D%222.1328948127501195%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5763932022500211%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2285%22%20r%3D%222.3784271386185365%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6197224362268006%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2285%22%20r%3D%222.598612314655246%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6585786437626904%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2285%22%20r%3D%222.7664474063750597%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6881966011250105%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2285%22%20r%3D%222.8333333333333335%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.7%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2285%22%20r%3D%222.7664474063750597%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6881966011250105%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2285%22%20r%3D%222.598612314655246%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6585786437626904%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2285%22%20r%3D%222.3784271386185365%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6197224362268006%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2285%22%20r%3D%222.1328948127501195%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5763932022500211%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2285%22%20r%3D%221.8742033046452236%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5307417596432747%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2295%22%20r%3D%221.4993422191251786%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.46458980337503153%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2295%22%20r%3D%221.7478969631271652%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.508452405257735%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2295%22%20r%3D%221.983333333333333%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2295%22%20r%3D%222.1979184719828693%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5878679656440358%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%2295%22%20r%3D%222.3784271386185365%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6197224362268006%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%2295%22%20r%3D%222.504021329618959%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.641886116991581%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%2295%22%20r%3D%222.55%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6499999999999999%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%2295%22%20r%3D%222.504021329618959%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.641886116991581%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2295%22%20r%3D%222.3784271386185365%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6197224362268006%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%2295%22%20r%3D%222.1979184719828693%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5878679656440358%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%2295%22%20r%3D%221.983333333333333%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%2295%22%20r%3D%221.7478969631271652%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.508452405257735%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%22105%22%20r%3D%221.3568542772370726%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.4394448724536011%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%22105%22%20r%3D%221.5857814660606928%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.47984378812835754%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%22105%22%20r%3D%221.7972246293104919%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5171572875253809%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%22105%22%20r%3D%221.983333333333333%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%22105%22%20r%3D%222.1328948127501195%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5763932022500211%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%22105%22%20r%3D%222.2317867394083293%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5938447187191169%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%22105%22%20r%3D%222.266666666666667%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.6000000000000001%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%22105%22%20r%3D%222.2317867394083293%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5938447187191169%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%22105%22%20r%3D%222.1328948127501195%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5763932022500211%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%22105%22%20r%3D%221.983333333333333%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%22105%22%20r%3D%221.7972246293104919%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5171572875253809%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%22105%22%20r%3D%221.5857814660606928%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.47984378812835754%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%22115%22%20r%3D%221.187095925159781%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.4094875162046673%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%22115%22%20r%3D%221.3965307866381151%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.4464466094067262%22%2F%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%22115%22%20r%3D%221.5857814660606928%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.47984378812835754%22%2F%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%22115%22%20r%3D%221.7478969631271652%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.508452405257735%22%2F%3E%3Ccircle%20cx%3D%2245%22%20cy%3D%22115%22%20r%3D%221.8742033046452236%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5307417596432747%22%2F%3E%3Ccircle%20cx%3D%2255%22%20cy%3D%22115%22%20r%3D%221.9552778044820438%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5450490243203607%22%2F%3E%3Ccircle%20cx%3D%2265%22%20cy%3D%22115%22%20r%3D%221.983333333333333%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5499999999999999%22%2F%3E%3Ccircle%20cx%3D%2275%22%20cy%3D%22115%22%20r%3D%221.9552778044820438%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5450490243203607%22%2F%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%22115%22%20r%3D%221.8742033046452236%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.5307417596432747%22%2F%3E%3Ccircle%20cx%3D%2295%22%20cy%3D%22115%22%20r%3D%221.7478969631271652%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.508452405257735%22%2F%3E%3Ccircle%20cx%3D%22105%22%20cy%3D%22115%22%20r%3D%221.5857814660606928%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.47984378812835754%22%2F%3E%3Ccircle%20cx%3D%22115%22%20cy%3D%22115%22%20r%3D%221.3965307866381151%22%20fill%3D%22%2343c0dc%22%20opacity%3D%220.4464466094067262%22%2F%3E%3C%2Fsvg%3E");
}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--grund);color:var(--tinte);font-family:var(--textschrift);
  font-size:var(--t-body);line-height:1.62;-webkit-font-smoothing:antialiased;
  font-synthesis-weight:none;min-height:100vh}
/* Korn: nur bei Kreide- und Nachtfassung. Eine Papierfläche ohne Struktur
   wirkt auf großen Flächen tot, aber sichtbares Rauschen wirkt billig —
   deshalb 3 % Deckung, fest verankert, und nie über dem Text. */

img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
p,ul,ol,figure{margin:0}
ul{padding:0;list-style:none}

/* Typo — Betonung über Gewicht und Farbe, erst dann über Größe.
   Enge Laufweite nur bei großen Graden, offene bei Versalien. */
h1,h2,h3{font-family:var(--kopfschrift);font-weight:var(--kopfgewicht);
  letter-spacing:var(--spur);margin:0;text-wrap:balance}
h1{font-size:var(--t-h1);line-height:1.04}
h2{font-size:var(--t-h2);line-height:1.1}
h3{font-size:var(--t-h3);line-height:1.28}
.lead{color:var(--matt);font-size:var(--t-lead);max-width:62ch;text-wrap:pretty}
.eyebrow{font-size:var(--t-label);letter-spacing:.15em;text-transform:uppercase;
  color:var(--matt);font-weight:600}
time,.zahl,.zeit__w,.num__n,.b__zahl,.z span:last-child{font-variant-numeric:tabular-nums}

/* Fokus: sichtbar, immer, auf jedem Steuerelement — nicht der Browserring
   auf einem eigenen Knopf. */
:focus-visible{outline:2px solid var(--akzent);outline-offset:3px;border-radius:var(--r-klein)}
.sprung{position:absolute;left:-9999px;top:0;z-index:99;background:var(--akzent);
  color:var(--auf-akzent);padding:var(--r3) var(--r4);border-radius:var(--r-klein)}
.sprung:focus{left:var(--r3);top:var(--r3)}

/* Demo-Band — Charta 9.5, nicht wegklickbar */
.band{position:sticky;top:0;z-index:50;background:var(--tinte);color:var(--grund);
  font-size:var(--t-label);line-height:1.4;padding:var(--r2) var(--r4);
  display:flex;flex-wrap:wrap;gap:var(--r2) var(--r4);align-items:center;justify-content:center}
.band b{font-weight:700}
/* Die eine Handlung, die dem Ladenbesitzer offensteht, ohne die ganze Seite zu
   scrollen — und ohne die Demo als seine Seite zu zerstören. */
.band__weg{display:inline-flex;align-items:center;min-height:32px;padding:0 var(--r3);
  border:1px solid color-mix(in srgb,var(--grund) 45%,transparent);border-radius:999px;
  font-weight:600;white-space:nowrap;
  transition:background var(--kurz) var(--raus)}
.band__weg:hover{background:color-mix(in srgb,var(--grund) 16%,transparent)}

.kopf{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--grund) 88%,transparent);
  backdrop-filter:blur(14px) saturate(1.2);border-bottom:1px solid var(--linie)}
/* Der Ladenname ist ein Link zur Startseite — also ein Tap-Ziel, also 44px.
   Gemessen: er war 20px hoch. */
.marke{font-family:var(--kopfschrift);font-weight:var(--kopfgewicht);font-size:var(--t-h3);
  letter-spacing:var(--spur);line-height:1.15;max-width:44vw;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;display:flex;flex-direction:column;
  justify-content:center;min-height:44px}
.marke small{display:block;font-family:var(--textschrift);font-weight:400;
  font-size:var(--t-label);color:var(--matt);letter-spacing:.04em}
.nav{white-space:nowrap;overflow-x:auto;scrollbar-width:none}
.nav::-webkit-scrollbar{display:none}
.nav a{color:var(--matt);padding:var(--r1) 0;border-bottom:2px solid transparent;
  transition:color var(--kurz) var(--raus),border-color var(--kurz) var(--raus)}
.nav a:hover{color:var(--tinte)}
.nav a[aria-current]{color:var(--tinte);border-color:var(--akzent)}
@media(max-width:640px){.marke{font-size:var(--t-body);max-width:32vw}.marke small{display:none}
  /* ⛔ Bei einer Kundenvorschau trägt diese Zeile die Branche — sie ist auf
     „Bilder" und „Kontakt" die einzige Stelle, die sagt, was der Betrieb tut.
     Sie auszublenden hiesse, die Seite dort stumm zu schalten. */
  .marke--logo small{display:block}
  .nav{font-size:var(--t-klein)!important;gap:var(--r3)!important}}

/* Knöpfe: alle Zustände, Tap-Ziel 48. Nur transform und opacity bewegen sich. */
.knopf{display:inline-flex;align-items:center;justify-content:center;gap:var(--r2);
  min-height:48px;padding:0 var(--r4);border-radius:var(--r);border:1px solid var(--linie);
  background:var(--flaeche);color:var(--tinte);font-weight:600;font-size:var(--t-body);
  font-family:var(--textschrift);cursor:pointer;
  transition:transform var(--kurz) var(--raus),border-color var(--kurz) var(--raus),
    box-shadow var(--kurz) var(--raus)}
.knopf:hover{transform:translateY(-2px);border-color:var(--akzent);box-shadow:var(--schatten-2)}
.knopf:active{transform:translateY(0)}
.knopf[disabled]{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
.knopf--haupt{background:var(--akzent);border-color:var(--akzent);color:var(--auf-akzent)}
.knopf--haupt:hover{box-shadow:var(--schatten-3)}
.hero__tat{display:flex;flex-wrap:wrap;gap:var(--r3);margin-top:var(--r5)}
.hero__tat.mitte{justify-content:center}

.merk{display:flex;flex-wrap:wrap;gap:var(--r2);margin-top:var(--r4)}
.merk li{display:inline-flex;align-items:center;gap:var(--r2);border:1px solid var(--linie);
  border-radius:999px;padding:var(--r2) var(--r4);font-size:var(--t-klein);background:var(--flaeche)}
.merk .pkt{width:6px;height:6px;border-radius:50%;background:var(--akzent);flex:none}

.gal{display:grid;gap:var(--r3);grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
/* ⛔ 07.08.2026: Vorher trug nur die erste und fünfte Kachel ein Bild, der Rest
   das Muster mit dem Wort „รูปของคุณ" auf leerer Fläche — das sah aus wie ein
   unfertiger Kasten. Jetzt trägt JEDE Kachel ein echtes Foto, reihum aus drei
   verschiedenen, damit nie zwei gleiche nebeneinander liegen.
   Und jede trägt ihr Abzeichen: das Foto zeigt NICHT diesen Betrieb. */
.gal__f{aspect-ratio:1;border-radius:var(--r);background-image:var(--foto);background-size:cover;
  background-position:center;display:grid;place-items:end start;padding:var(--r3);overflow:hidden;
  position:relative}
.gal__f:nth-child(3n+2){background-image:var(--foto2)}
.gal__f:nth-child(3n+3){background-image:var(--foto3)}
/* Lesbar auf hell wie auf dunkel: das Abzeichen sitzt auf einer eigenen Fläche,
   nicht auf dem Foto. Ein Verlauf am unteren Rand trägt es. */
.gal__f::after{content:"";position:absolute;inset:auto 0 0 0;height:52%;pointer-events:none;
  background:linear-gradient(to top,oklch(0 0 0/.55),transparent)}
.gal__f span{position:relative;z-index:1;font-size:var(--t-label);font-weight:600;
  background:oklch(0 0 0/.62);color:#fff;padding:var(--r1) var(--r3);border-radius:999px;
  backdrop-filter:blur(3px)}

/* ⛔ Auch die grossen Bildflächen der Architekturen tragen ihr Abzeichen —
   Kopfbild, Bildband und Bento-Kachel. Der Text kommt aus einer Eigenschaft,
   damit derselbe Baustein auf Thai und Englisch funktioniert, ohne dass zehn
   Architekturen ihre Auszeichnung ändern müssen. */
.streifen,.b--foto,.buehne{position:relative}
.streifen::after,.b--foto::after,.buehne::before{content:var(--txt-beispiel);
  position:absolute;top:var(--r3);right:var(--r3);z-index:2;
  font-size:var(--t-label);font-weight:600;line-height:1;
  background:oklch(0 0 0/.62);color:#fff;padding:var(--r1) var(--r3);border-radius:999px;
  backdrop-filter:blur(3px);pointer-events:none}

/* Der Satz, der einmal je Seite unübersehbar dastehen muss. */
.fotonote{background:color-mix(in srgb,var(--akzent) 9%,var(--flaeche));
  border-bottom:1px solid var(--linie)}
.fotonote__in{max-width:1180px;margin:0 auto;padding:var(--r3) var(--r4);
  display:flex;gap:var(--r2) var(--r4);align-items:baseline;flex-wrap:wrap}
.fotonote b{font-size:var(--t-klein);color:var(--akzent-text);font-weight:700}
.fotonote i{font-style:normal;font-size:var(--t-label);color:var(--tinte);opacity:.85}
.fotonote em{font-style:normal;font-size:var(--t-label);color:var(--matt)}
/* ⛔ Am Telefon gemessen: Demo-Band und Hinweis zusammen nahmen 380 von 844 px,
   bevor der Betrieb seinen eigenen Namen sah. Der Hinweis muss ehrlich sein,
   nicht laut — deshalb dieselbe Aussage auf halber Höhe. */
@media(max-width:640px){
  .fotonote__in{padding:var(--r2) var(--r3);gap:1px var(--r2);line-height:1.45}
  .fotonote b{font-size:13px}
  .fotonote i,.fotonote em{font-size:11.5px}
}
.gal__f:nth-child(3n+1){aspect-ratio:4/5}
.gal__f:nth-child(4n){aspect-ratio:5/4}

.form{display:grid;gap:var(--r3);max-width:520px}
.form input,.form textarea{font:inherit;font-size:var(--t-body);padding:var(--r3) var(--r4);
  border-radius:var(--r);border:1px solid var(--linie);background:var(--flaeche);
  color:var(--tinte);width:100%}
.form input[disabled],.form textarea[disabled]{opacity:.55}
.form__hinweis{font-size:var(--t-klein);color:var(--matt);border-left:3px solid var(--akzent);
  padding-left:var(--r3)}

.tel{position:fixed;left:0;right:0;bottom:0;z-index:45;display:none;gap:var(--r3);
  padding:var(--r3) var(--r4) calc(var(--r3) + env(safe-area-inset-bottom));
  background:color-mix(in srgb,var(--grund) 94%,transparent);backdrop-filter:blur(14px);
  border-top:1px solid var(--linie)}
.tel .knopf{flex:1}
@media(max-width:720px){.tel{display:flex}body{padding-bottom:86px}}

.angebot{background:var(--tinte);color:var(--grund);text-align:center;padding-block:var(--luft)}
.angebot h2{color:var(--grund)}
.angebot p{color:color-mix(in srgb,var(--grund) 76%,var(--tinte));margin-inline:auto}
.angebot__vertrauen{margin-top:var(--r3);font-weight:600;
  color:color-mix(in srgb,var(--grund) 92%,var(--tinte))!important;max-width:48ch}
.angebot__tat{display:flex;flex-wrap:wrap;gap:var(--r3);justify-content:center;margin-top:var(--r5)}
.angebot .knopf{background:var(--akzent);border-color:var(--akzent);color:var(--auf-akzent)}
.angebot .knopf--rand{background:transparent;border-color:currentColor;color:inherit}

/* ======================================================================
   KUNDENVORSCHAU — unser Anteil an einer Seite, die uns nicht gehört

   ⛔ 07.08.2026, auf 390 px nachgemessen: Band 91 px + Fotohinweis 105 px +
   Angebotsblock 502 px + Fuss 181 px = 879 px von 1788 px. Wir waren 49 %
   der Seite, der Betrieb 42 %. Sun: „man muss echt nicht hier zur zahlung
   gross anzeigen."

   Wie es die machen, die es können: WordPress-Adminleiste 32 px (46 px auf
   dem Telefon), Shopify-Ankündigungsleiste 39 px, Webflow-Signatur 26 px,
   Squarespace bewirbt sein eigenes Produkt auf der eigenen Demo mit einer
   Karte von 243 × 76 px — 9 % der Höhe eines 844-px-Schirms. Keiner von
   ihnen legt einen VerkaufsABSCHNITT in die fremde Seite.

   Zielbudget hier: unter 15 % der Seitenhöhe, ein Preis, ein Knopf.
   ====================================================================== */
.band--kunde{min-height:36px;padding:var(--r1) var(--r3);gap:var(--r2) var(--r3);
  justify-content:space-between;flex-wrap:nowrap;font-size:13px}
.band--kunde .band__satz{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
/* Kein Knopf im Band. Ein Knopf ist eine Aufforderung, und wir fordern hier
   nichts — der Kunde soll SEINE Seite ansehen. */
.band--kunde .band__weg{border:0;padding:0 var(--r1);min-height:32px;flex:none;
  text-decoration:underline;text-underline-offset:3px;opacity:.85;font-weight:500}
.band--kunde .band__weg:hover{background:none;opacity:1}
@media(max-width:640px){.band--kunde{min-height:44px;font-size:14px}}

.fotonote--schmal .fotonote__in{padding:var(--r2) var(--r4);gap:2px var(--r2);line-height:1.4}
.fotonote--schmal b{font-size:var(--t-label)}
.fotonote--schmal i{font-size:var(--t-label)}

/* --- Sprachumschalter ---------------------------------------------------
   ⛔ Er sitzt im Kopf SEINER Seite, nicht in unserem Band. Im Band wäre er
   ein Werkzeug von uns; im Kopf ist er eine Eigenschaft seiner Website —
   und genau die verkaufen wir ihm („ภาษาไทยและอังกฤษ").

   Keine Flaggen (eine Flagge ist ein Land, keine Sprache). Trefferflächen
   nach WCAG 2.5.8: mindestens 24 × 24 px, hier 44 × 32 px, auf dem Telefon
   40 × 36 px. Der aktive Zustand ist eine gefüllte Fläche PLUS Fettung —
   nie allein eine Farbe (Sprünglis Goldton schafft nur 2,8:1). */
.kopf__rechts{display:flex;align-items:center;gap:var(--r3);min-width:0}
.sprachen{display:inline-flex;align-items:center;gap:2px;padding:2px;flex:none;
  border:1px solid var(--linie);border-radius:999px;background:var(--flaeche)}
.sprachen a{display:inline-flex;align-items:center;justify-content:center;
  min-width:44px;min-height:32px;padding:0 var(--r2);border-radius:999px;
  font-size:var(--t-label);font-weight:600;color:var(--matt);white-space:nowrap;
  transition:background var(--kurz) var(--raus),color var(--kurz) var(--raus)}
.sprachen a:hover{color:var(--tinte)}
.sprachen abbr{text-decoration:none;border:0;cursor:inherit}
.sprachen a[aria-current]{background:var(--tinte);color:var(--grund);font-weight:700}
@media(max-width:640px){.sprachen a{min-width:40px;min-height:36px;font-size:12px}}

/* --- Der leise Hinweis am Fuss ------------------------------------------ */
.hinweis{border-top:1px solid var(--linie);background:var(--flaeche);padding-block:var(--r4)}
.hinweis p{margin:0;max-width:64ch;font-size:var(--t-klein);color:var(--matt);line-height:1.5}
.hinweis__marke{font-weight:700;color:var(--tinte)!important;font-size:var(--t-label)!important;
  letter-spacing:.12em;text-transform:uppercase}
.hinweis__satz{margin-top:var(--r2)!important;color:var(--tinte)!important}
.hinweis__preis{margin-top:var(--r2)!important}
.hinweis__mwst{margin-top:var(--r1)!important;font-size:var(--t-label)!important;opacity:.8}
.hinweis__tat{display:flex;flex-wrap:wrap;align-items:center;gap:var(--r3);margin-top:var(--r4)}
.knopf--klein{min-height:44px;padding:0 var(--r4);font-size:var(--t-klein)}
.hinweis__wir{font-size:var(--t-klein);color:var(--matt);text-decoration:underline;
  text-underline-offset:3px;min-height:44px;display:inline-flex;align-items:center}
.hinweis__wir:hover{color:var(--tinte)}
/* Die zur Überschrift beförderte Augenbraue — siehe h1Sichern. */
.seitentitel{font-size:var(--t-h2);letter-spacing:var(--spur);text-transform:none;
  color:var(--tinte);margin-bottom:var(--r3)}

/* --- Das Logo des Kunden ------------------------------------------------
   Vollständig sichtbar (object-fit contain), nie beschnitten, auf ruhiger
   Fläche — ein Logo verträgt keinen Anschnitt, dafür ist es gezeichnet. */
.marke--logo{flex-direction:row;align-items:center;gap:var(--r3);max-width:62vw;white-space:normal}
.marke__logo{width:44px;height:44px;flex:none;border-radius:var(--r-klein);
  /* Weiss, nicht die Seitenfarbe: fast jedes eingesandte Logo hat selbst
     einen weissen Grund. Auf hellblau ergäbe das ein weisses Rechteck mitten
     im Kopf — mit Rahmen und Radius liest es sich als Logoplatte. */
  object-fit:contain;background:#fff;border:1px solid var(--linie);padding:3px}
.marke__wort{display:flex;flex-direction:column;justify-content:center;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.fuss{font-size:var(--t-klein);color:var(--matt);padding-block:var(--r6);
  border-top:1px solid var(--linie)}
.fuss a{color:var(--akzent-text);text-decoration:underline;text-underline-offset:3px}


/* Bewegung: 240 ms Eingang, ease-out, nur transform und opacity. */
[data-auf]{opacity:0;transform:translateY(14px);
  transition:opacity var(--lang) var(--raus),transform var(--lang) var(--raus)}
[data-auf].da{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important}
  [data-auf]{opacity:1;transform:none}
}


.wrap{width:min(100% - 40px,var(--breit));margin-inline:auto}
.sec{padding-block:var(--luft);position:relative}
.eyebrow{font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--matt);font-weight:600}
.lead{color:var(--matt);font-size:clamp(16.5px,1.7vw,19px);max-width:60ch}
.muster{background-image:var(--muster);background-size:cover;background-position:center}

:root{--breit:100%}
/* ⛔ Das Raster sitzt auf <main>, NICHT auf <body>. Auf body würde das
   Demo-Band die erste Zelle belegen und Säule wie Inhalt je eine Spalte
   weiterschieben — die Seite sah dadurch aus wie ein Fehler. */
/* ⛔ Ein blankes 1fr ist NICHT minmax(0,1fr): die zweite Spalte bekommt sonst ihre
   min-content-Breite und schiebt die Seite auseinander — gemessen 270 px
   Überlauf bei 900 px. Das ist der Fehler, den ein Ladenbesitzer auf dem
   Tablet sofort sieht. */
main{display:grid;grid-template-columns:minmax(240px,30%) minmax(0,1fr);align-items:start}
.saeule{position:sticky;top:0;height:100vh;padding:38px 34px;display:flex;flex-direction:column;
  justify-content:space-between;background:var(--tinte);color:var(--grund);overflow:hidden}
.saeule::after{content:'';position:absolute;inset:auto -30% -30% -30%;height:60%;
  background-image:var(--foto);background-size:cover;background-position:center;opacity:.34;
  filter:grayscale(.7) contrast(1.15)}
.saeule h1{font-size:clamp(30px,3.6vw,52px);line-height:1.02;position:relative;z-index:1}
.saeule .nav{display:grid;gap:11px;margin-top:30px;position:relative;z-index:1}
/* ⛔ Farbe MUSS hier stehen. Die Grundregel setzt .nav a auf --matt, und das
   ist ein Ton für hellen Grund; auf der dunklen Säule ergab das Schwarz auf
   Schwarz, gemessen 1:1. Geerbte Farben sind auf umgekehrtem Grund immer
   verdächtig. */
.saeule .nav a{color:var(--grund);font-size:16px;opacity:.78;border:0;padding:0}
.saeule .nav a:hover,.saeule .nav a[aria-current]{color:var(--grund);opacity:1;
  text-decoration:underline;text-underline-offset:5px}
.saeule .knopf{background:var(--grund);color:var(--tinte);border-color:var(--grund);
  position:relative;z-index:1}
.inhalt{min-width:0}
.sec{padding-inline:clamp(24px,4vw,64px)}
.wrap{width:100%;max-width:760px;margin:0}
@media(max-width:1000px){
  main{grid-template-columns:1fr}
  /* ⛔ NICHT static. Das Schmuck-Pseudoelement der Säule ist absolut
     positioniert und mit inset:auto -30% -30% -30% bewusst größer als sie.
     Verliert die Säule ihren Positionsbezug, hängt es sich an body und ragt
     270 px über den Rand hinaus — gemessen bei 900 px. relative behält den
     Bezug, overflow:hidden schneidet ab. */
  .saeule{position:relative;height:auto;padding:var(--r5) var(--r4) var(--r6);overflow:hidden}
  .saeule .nav{display:flex;flex-wrap:wrap;gap:16px}
}


/* ===== Welle 2 ===== gemessene Werte, siehe Kommentar im Bauer ===== */
:root{
  --name-em:15.64;
  /* Fünf Stufen, keine sechste. Mindestwert = 45 % des Höchstwerts, Wachstum
     8vw — das Muster aller fünf geprüften Referenzen. */
  --t-display:min(clamp(34px,8vw,104px),calc((100vw - 44px) * 2 / var(--name-em)));
  --t-h1:var(--t-display);
  --t-h2:clamp(26px,5vw,56px);
  --t-h3:clamp(20px,3vw,30px);
  --t-lead:clamp(17px,2vw,21px);
  --t-body:clamp(15.5px,1vw,18px);
  --t-klein:14px;--t-label:12.5px;
  --lh-kopf:1.35;
  --r:clamp(10px,2.2vw,22px);--r-gross:clamp(14px,3vw,30px);
  /* ⛔ EIN Schattentoken. Sunbeam Bagels hat in einem preisgekrönten Stylesheet
     genau einen; Tiefe kommt dort aus Verlauf und Überlagerung, nicht aus
     Schlagschatten. Weiche graue Kästen sind das Kennzeichen der Vorlage. */
  --schatten-1:0 0 0 1px oklch(0 0 0/.10),0 1px 3px oklch(0 0 0/.10);
  --luft:clamp(96px,11vw,190px);
}
/* Typografie vor Farbe: das ist der billigste Weg zu „teuer". */
h1,h2,.gross,.saeule h1,.b h1,.hero h1{line-height:var(--lh-kopf);letter-spacing:-.02em;
  text-wrap:balance}
/* Thai braucht Kopfraum, sonst stösst die obere Tinte an die Zeile darüber.
   Der gegenläufige Aussenabstand hält den optischen Rhythmus. */
h1,.gross{padding-top:.24em;margin-top:-.24em}
body{line-height:1.75}
.eyebrow{letter-spacing:.16em;text-transform:uppercase;font-size:var(--t-label);font-weight:600}

/* ⛔ Tiefe ohne Schatten: ein Verlauf über jedem Foto, das Text trägt. Der Text
   bleibt lesbar, ohne dass ein Kasten die Bildwirkung zerschneidet. */
.buehne::after,.hero--bild::after{background:linear-gradient(180deg,transparent 35%,oklch(0 0 0/.72) 100%)}

/* Korn über allem — 4 %, überlagernd, nie über dem Text klickbar. Das ist der
   Unterschied zwischen „flache Fläche" und „bedrucktes Papier". */
body::after{content:"";position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.04;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ===== Die EINE grosse Geste: der Kopfbereich baut sich auf ==============
   Bild und Text zeitversetzt, höchstens drei Stufen, danach passiert auf der
   Seite nichts Grosses mehr. Nur transform und opacity — alles andere kostet
   auf einem Telefon im Mobilfunknetz Bilder pro Sekunde. */
.hero>*,.buehne>*,.saeule>*,.b--breit>*{animation:heldRein 700ms cubic-bezier(.16,1,.3,1) both}
.hero>*:nth-child(1),.buehne>*:nth-child(1),.saeule>*:nth-child(1),.b--breit>*:nth-child(1){animation-delay:120ms}
.hero>*:nth-child(2),.buehne>*:nth-child(2),.saeule>*:nth-child(2),.b--breit>*:nth-child(2){animation-delay:180ms}
.hero>*:nth-child(3),.buehne>*:nth-child(3),.saeule>*:nth-child(3),.b--breit>*:nth-child(3){animation-delay:240ms}
.hero>*:nth-child(n+4),.buehne>*:nth-child(n+4),.saeule>*:nth-child(n+4),.b--breit>*:nth-child(n+4){animation-delay:300ms}
@keyframes heldRein{from{opacity:0;transform:translate3d(0,28px,0)}to{opacity:1;transform:none}}

/* Eine einzige Enthüllung je Abschnitt — 600 ms, 24 px, einmalig. */
[data-auf]{transition:opacity 600ms cubic-bezier(.16,1,.3,1),transform 600ms cubic-bezier(.16,1,.3,1)}
[data-auf]:not(.da){opacity:0;transform:translate3d(0,24px,0)}

/* Antippen: kurz und mit Tiefe statt mit Farbe. */
.knopf{transition:transform 160ms cubic-bezier(.16,1,.3,1),box-shadow 160ms}
.knopf:active{transform:scale(.97);transition-duration:120ms}
.knopf--haupt,.knopf--voll{box-shadow:var(--schatten-1)}

/* ⛔ Ohne dieses Netz bleibt eine Demo leer, wenn der Beobachter nie feuert —
   und eine leere Demo ist eine verlorene Demo. */
@media (prefers-reduced-motion:reduce){
  .hero>*,.buehne>*,.saeule>*,.b--breit>*{animation:none}
  [data-auf]:not(.da){opacity:1;transform:none}
}
html:not(.js) [data-auf]:not(.da){opacity:1;transform:none}

/* ⛔ Gemessen am Telefon (390 px): „Takraihom Thai Massage 3" stand als
   „Takraihom Thai M…" im Kopf. „.marke" war auf 32vw gedeckelt — bei einem
   zweispaltigen Kopf sinnvoll, bei einem MITTIGEN Kopf (Siegel, Kassenzettel)
   verschenkt es die halbe Zeile. Der Name des Betriebs ist das Erste, was der
   Inhaber sucht; abgeschnitten wirkt er wie ein Fehler, und ein Fehler
   verkauft nicht. */
@media(max-width:640px){.marke{max-width:54vw}}

/* Die klebende Kopfleiste bekommt Tiefe statt einer Trennlinie. Nur hier —
   „backdrop-filter" auf mehreren Flächen kostet auf dem Telefon spürbar. */
.kopf{backdrop-filter:blur(12px)}

/* ⛔ Die Architektur „Siegel" zeichnete ihren Kopfbereich als Muster, auch wenn
   ein echtes Foto vorlag — genau der leere Kopf, den Sun bemängelt hat. Jetzt
   trägt der grosse Kreis das Foto, ruhig hinterlegt, damit die Schrift darüber
   ihren gemessenen Kontrast behält. */
.hero::before{background-image:var(--foto);opacity:.2}