@charset "utf-8";
/* CSS Document */

:root {
  --font-family-base: 'Nunito Sans', sans-serif;
  --font-family-base2: 'Open Sans', sans-serif;
  --font-h1: 34px;
  --font-h2: 30px;
  --font-h3: 24px;
  --font-h4: 20px;
  --font-h5: 18px; 
  --font-h6: 16px; 
  --color-h1: #333; --color-h2:#333; --color-h3:#333; --color-h4:#333; --color-h5:#333; --color-h6:#333 }

p, .text { font-size:24px; font-family:var(--font-family-base); font-weight:400; }
h1, h2, h3, h4, h5, h6 { margin:0; font-family:var(--font-family-base);}
h1 { font-size: var(--font-h1); font-weight: 700; color: var(--color-h1) }
h2 { font-size: var(--font-h2); font-weight: 700; color: var(--color-h2) }
h3 { font-size: var(--font-h3); font-weight: 400; color: var(--color-h3) }
h4 { font-size: var(--font-h4); font-weight: 400; color: var(--color-h4) }
h5 { font-size: var(--font-h5); font-weight: 400; color: var(--color-h5) }
h6 { font-size: var(--font-h6); font-weight: 400; color: var(--color-h6) }

.material-icons { color: var(--icon-color);}

/* Texte */
.txtblue1 { font-weight:700; color:#045096 }
.txtred1 { font-weight:700; color:#e11e1a }

/* Colors */
.red1 { color:#e11e1a }
.red2 { color:#CB4240 }
.red3 { color:#993300 }
.green1 { color:#63AC3E }
.green2 { color:#467C2B }
.blue1 { color:#045096 }
.blue2 { color:#2878C2 }

bold { font-weight:700 }
strong { font-weight:700 }

/* --- Hilfsklassen für kleinere Texte ------------------------------------ */
.txt2-ki { left:0px; padding: 10px 0 0 0; font-size:12px; color:#bbb; font-family: var(--font-family-base); }
.txt1-ki { padding: 5px 0 0 10px; font-size:12px; color:#bbb; font-family: var(--font-family-base); }

.text-small { font-size: var(--font-small); }
.text-xs    { font-size: var(--font-xs);    }
.text-brand { color: var(--color-brand); }

/* --- Buttons langSelector ------------------------------------ */
.langSelector1 { position:absolute; z-index:1000; bottom:58px; left:40px; display:flex; gap:8px; }
.langSelector2 { position:absolute; z-index:1000; top:80px; left:30px; display:flex; gap:12px; }

#side-menu-top {
  position: absolute;
  z-index: 1000;
  top: 20px;
  left: 20px;
  width: 210px;
  height: 120px;
  background-color: rgba(180,180,180,0.8);
  background-image: url('../layout/ani/diagramm3_a1.svg');
  background-repeat: no-repeat;
  background-position: center 5px;
  background-size: cover;            /* oder contain, je nach gewünschtem Effekt */
  border-radius: 10px;
  padding: 12px 30px;
  box-shadow: inset 0 2px 2px rgba(0,0,0,0.2);
}

.Language { position:absolute; z-index:1000; top:40px; left:30px; font-family:var(--font-family-base); font-size:16px; font-weight:700; color:#333; line-height:20px;}
.langBtn { width:30px; height:20px; background:center/cover no-repeat; border:none; padding:0; cursor:pointer; transition:.15s ease; opacity:.6; }
.langBtn:hover { transform:scale(1.1); box-shadow:0 4px 8px rgba(0,0,0,.4); }
.langBtn:active { transform:scale(.95); box-shadow:0 2px 4px rgba(0,0,0,.25); }
.langBtn.active { opacity:1; box-shadow:0 4px 12px rgba(0,0,0,.3); }
.langBtn[data-lang="de"] { background-image:url("../bm/de1a.svg"); }
.langBtn[data-lang="en"] { background-image:url("../bm/en1a.svg"); }
.langBtn[data-lang="fr"] { background-image:url("../bm/fr1a.svg"); }

:root { 
--font-size-nav1:24px; 
--font-size-nav2:18px; 
--font-size-head:18px;  
--font-size-footnav1:20px;  
--font-size-footnav2:12px;}

a { font-family:var(--font-family-base); font-weight:300; margin: 0; text-decoration: none; }

.nav1 a, .nav2 a, .nav3 a, .footnav1 a, .footnav2 a { font-family: var(--font-family-base); font-weight:400; margin:0; padding:0; text-decoration:none; list-style:none }
.nav1 a, .nav1 a:active   { font-size: var(--font-size-nav1); color: #173330; }
.nav1 a:hover             { font-size: var(--font-size-nav1); color: #ff0000; }
.nav2 a, .nav2 a:active   { font-size: var(--font-size-nav2); color: #0373D9; }
.nav2 a:hover             { font-size: var(--font-size-nav2); color: #0CF; }
.nav3 a, .nav3 a:active   { font-size: var(--font-size-nav3); color: #137066; }
.nav3 a:hover             { font-size: var(--font-size-nav3); color: #ff0000; }
.head a, .head a:active   { font-size: var(--font-size-head); color: #333; font-weight:400;}
.head a:hover             { font-size: var(--font-size-head); color: #ff0000; font-weight:400;}
.footnav1 a, .footnav1 a:active { font-size: var(--font-size-footnav1); color: #999; }
.footnav1 a:hover               { font-size: var(--font-size-footnav1); color: #fff; }
.footnav2 a, .footnav2 a:active { font-size: var(--font-size-footnav2); color: #888; }
.footnav2 a:hover               { font-size: var(--font-size-footnav2); color: #fff; }

li_foot { list-style-type:none; text-decoration:none }
.foot-adrs  { position:absolute; top:45px; left:40px; font-size:16px; font-weight:normal; font-family: var(--font-family-base); color:#ddd; margin:0px }
.foot-btn   { position:absolute; top:40px; left:300px }

.foot-links { position:absolute; top:40px;  height:auto; right:40px; display: flex; gap:3rem; letter-spacing:0;}
.foot-link1 { position:relative; top:0px }
.foot-link2 { position:relative; top:0px }
.foot-link3 { position:relative; top:0px }

.webstyle { position:absolute; z-index:90; bottom:10px; left:40px;}
.barrierefrei { position:absolute; z-index:90; bottom:10px; left:310px; font-size:12px; font-weight:normal; font-family: var(--assist-label-font-family); color:#888; }


/* Hauptmenu --------------------------------------------------------------------------------------------------------------------------------------------------- */
#menu{position:absolute;z-index:950;top:0;right:0;margin:0;height:auto;width:100%;}
.menupos{position:relative;z-index:1000;width:1090px;top:0;right:0;margin-left:auto;margin-right:0;}

.overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.3);opacity:0;visibility:hidden;transition:opacity 0.4s ease;z-index:999;}
.overlay.show{opacity:1;visibility:visible;}

#side-menu-right{position:fixed;top:0;right:-270px;width:250px;height:100%;background-image:url('../layout/side_menu_bg1.svg');background-repeat:no-repeat;border-left:2px solid #fff;background-size:cover;background-position:center;box-shadow:-2px 0 5px rgba(0,0,0,0.1);transition:right 0.4s ease;z-index:1000;display:flex;flex-direction:column;padding-top:130px;padding-left:20px;overflow-y:auto;overflow-x:visible;}
#side-menu-right.open{right:0;}
#side-menu-right.open::before{content:"";position:absolute;top:176px;left:-2px;width:150px;height:110px;background-color:#f0f0f0;border-top-right-radius:20px;border-bottom-right-radius:20px;border-top:1px solid #fff;border-bottom:1px solid #fff;border-right:1px solid #fff;box-shadow:inset 0 0 5px rgba(0,0,0,0.6);z-index:1000;}

/* === Menü === */
.menu-items{width:calc(100% + 20px);margin-left:-20px;margin-top:180px;}
.menu-items ul{list-style:none;padding:0;margin:0;width:100%;}
.menu-items>ul>li{margin:10px 0;}
.menu-items ul li a{display:flex;align-items:center;font-family:var(--font-family-base);text-decoration:none;color:#444;font-size:22px;font-weight:bold;padding:8px 16px;transition:background-color 0.3s,color 0.3s;cursor:pointer;}
.menu-link-icon{width:20px;height:20px;margin-right:12px;fill:#555;flex-shrink:0;transition:fill 0.3s;}
.menu-items ul li a:hover .menu-link-icon{fill:#fff;}
.menu-items ul li a.active,.menu-items ul li a:hover{background-color:#ddd;color:#fff;}

.submenu{list-style:none;padding:0;padding-left:20px;max-height:0;overflow:hidden;transition:max-height 0.4s ease;background-color:#928484;border-radius:4px;width:calc(100% - 20px);}
.submenu.open{transition:max-height 0.8s ease;max-height:500px;border-top:1px solid #ddd;border-bottom:1px solid #ddd;}
.submenu>li{margin:5px 0;}
.menu-items .submenu li a{font-family:var(--font-family-base);font-size:20px;font-weight:700;padding:6px 16px 6px 50px;color:#444;cursor:pointer;display:block;width:100%;box-sizing:border-box;}
.menu-items .submenu li a:hover{background-color:rgba(131,64,64,0.40);}

/* === Menü-Button === */
.menu-toggle{position:fixed;top:180px;right:40px;width:100px;height:100px;padding-top:8px;background-color:#ccc;border-radius:20%;border-top:3px solid #fff;border-bottom:1px solid #ddd;border-left:2px solid #fff;border-right:1px solid #ddd;box-shadow:0 4px 8px rgba(0,0,0,0.5);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;cursor:pointer;transform:translateX(180px);will-change:transform;animation:flyIn 0.6s ease-out 0.2s forwards;transition:right 0.4s ease,background-color 0.3s,transform 0.3s;z-index:1001;overflow:hidden;}
.menu-toggle.open{right:108px;background-color:#ddd;}
.menu-toggle:hover{background-color:#e0ffdf;transform:translateX(0) scale(1.05);}
.menu-toggle.open:hover{background-color:#ffdede;transform:translateX(0) scale(1.05);}
@keyframes flyIn{from{transform:translateX(180px);opacity:0;}to{transform:translateX(0);opacity:1;}}

/* === Menü-Label === */
.menu-label{font-family:var(--font-family-base);font-size:18px;font-weight:700;color:#444;margin-top:4px;margin-bottom:2px;user-select:none;transition:color 0.3s;}
.menu-toggle:hover:not(.open) .menu-label{color:#008000;}
.menu-toggle.open:hover .menu-label{color:#ff0000;}
.menu-icon{width:50px;height:50px;}
.menu-icon rect,.menu-icon line{fill:#555;stroke:#555;transition:fill 0.3s,stroke 0.3s;}
.menu-toggle:hover .menu-icon rect,.menu-toggle:hover .menu-icon line{fill:#333;stroke:#333;}
.close-icon{display:none;}
.menu-toggle.open .burger-icon{display:none;}
.menu-toggle.open .close-icon{display:block;}
.menu-toggle:hover .burger-icon rect{fill:green;stroke:green;}
.menu-toggle.open:hover .close-icon line{stroke:red;}
.menu-toggle:hover::before{content:"";position:absolute;top:0;left:-150%;width:150%;height:100%;background:linear-gradient(120deg,rgba(255,255,255,0) 0%,rgba(255,255,255,0.6) 50%,rgba(255,255,255,0) 100%);transform:skewX(-20deg);animation:shimmer 1s ease-in-out infinite;pointer-events:none;}

/* === Link-Icons via background-image === */
.menu-items>ul>li>a::before{content:"";display:inline-block;width:20px;height:20px;margin-right:12px;background-repeat:no-repeat;background-position:center;background-size:contain;transition:filter 0.3s ease;}
.menu-icon-home::before{background-image:url('icons/icon-home.svg');}
.menu-icon-about::before{background-image:url('icons/icon-about.svg');}
.menu-icon-services::before{background-image:url('icons/icon-services.svg');}
.menu-icon-contact::before{background-image:url('icons/icon-contact.svg');}
.menu-items>ul>li>a:hover::before{filter:brightness(0) invert(1);}

/* === Schimmer-Effekt === */
.menu-toggle::before{content:"";position:absolute;top:0;left:-150%;width:150%;height:100%;background:linear-gradient(120deg,rgba(255,255,255,0.1) 0%,rgba(255,255,255,0.6) 50%,rgba(255,255,255,0.1) 100%);transform:skewX(-20deg);pointer-events:none;opacity:0;transition:opacity 0.3s;box-shadow:0 0 8px rgba(255,255,255,0.3);}
.menu-toggle.shimmer::before,.menu-toggle:hover::before{animation:shimmer 1.8s ease-in-out;opacity:1;}
@keyframes shimmer{0%{left:-150%;}50%{left:150%;}100%{left:150%;}}

/* +/− Icon vor Submenu-Links */
.submenu-toggle-icon{display:inline-block;width:20px;text-align:center;margin-right:12px;font-size:20px;font-weight:bold;user-select:none;transition:transform 0.3s ease;}

/* === Alle Link-Icons links (via ::before) ausblenden === */
.menu-items>ul>li>a::before{display:none!important;}
.menu-items>ul>li>a:not(.has-submenu){padding-left:48px;}

/* Wrapper darf schrumpfen */
.menupos{width:100%;max-width:1090px;box-sizing:border-box;}

/*  Tablet & kleiner (<= 1400px) ========================= */
@media (max-width:1400px){
/* SideMenu */
#side-menu-right{ width:280px; right:-300px;  /* width + 20px (Puffer) */ padding-top:100px;  /* weniger „Luft“ oben */ padding-left:16px }
    
/* Kerbe kleiner + bleibt am linken Rand des SideMenus */
#side-menu-right.open::before{ top:158px; left:-2px; width:140px; height:100px; border-top-right-radius:14px; border-bottom-right-radius:14px }
    
/* Navigation kompakter (weniger vertikal auseinander) */
.menu-items{ margin-top:180px; width:calc(100% + 16px); margin-left:-16px }
.menu-items > ul > li{ margin:6px 0; }  /* weniger Abstand */
.menu-items ul li a{ font-size:20px;padding:7px 12px }
.submenu{ padding-left:16px; width:calc(100% - 16px) }
.menu-items .submenu li a{ font-size:17px; padding:7px 12px 7px 40px }
    
/* Kerbe „einrastet“ */
.menu-toggle{ top:162px; right:22px; width:90px; height:90px; border-radius:16px; padding-top:6px; transform:translateX(120px); animation:flyInSm 0.6s ease-out 0.2s forwards }
.menu-toggle.open{ right:145px; transform:translateX(0); background-color:#ddd }
/* Button-Inhalt */
.menu-label{ font-size:16px; margin-top:8px; margin-bottom:1px; }
.menu-icon{ width:40px; height:40px }
}

/*  Tablet & kleiner (<= 1199px) ========================= */
@media (max-width:1199px){
/* SideMenu */
#side-menu-right{ width:280px; right:-300px;  /* width + 20px (Puffer) */ padding-top:100px;  /* weniger „Luft“ oben */ padding-left:16px }
/* Kerbe kleiner + bleibt am linken Rand des SideMenus */
#side-menu-right.open::before{ top:158px; left:-2px; width:120px;  height:86px; border-top-right-radius:14px; border-bottom-right-radius:14px }
/* Navigation kompakter (weniger vertikal auseinander) */
.menu-items{ margin-top:180px; width:calc(100% + 16px); margin-left:-16px; max-height:calc(100vh - 120px);overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding-bottom:18px}
.menu-items > ul > li{ margin:6px 0; }  /* weniger Abstand */
.menu-items ul li a{ font-size:19px;padding:7px 12px }
.submenu{ padding-left:16px; width:calc(100% - 16px) }
.menu-items .submenu li a{ font-size:17px; padding:7px 12px 7px 40px }
/* Kerbe „einrastet“ */
.menu-toggle{ top:162px; right:22px; width:78px; height:78px; border-radius:16px; padding-top:6px; transform:translateX(120px); animation:flyInSm 0.6s ease-out 0.2s forwards }
.menu-toggle.open{ right:165px; transform:translateX(0); background-color:#ddd }
/* Button-Inhalt */
.menu-label{ font-size:15px; margin-top:3px; margin-bottom:1px; }
.menu-icon{ width:38px; height:38px }
}

/*  Tablet & kleiner (<= 991px) ========================= */
@media (max-width:991px){
/* SideMenu */
#side-menu-right.open::before{ top:128px; left:-2px; width:120px;  height:86px; border-top-right-radius:14px; border-bottom-right-radius:14px }
.menu-items{ margin-top:130px; width:calc(100% + 16px); margin-left:-16px; max-height:calc(100vh - 120px);overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding-bottom:18px}
.menu-toggle{ top:132px; right:22px; width:78px; height:78px; border-radius:16px; padding-top:6px; transform:translateX(120px); animation:flyInSm 0.6s ease-out 0.2s forwards }
    
    
    
    
}

/*  Tablet & kleiner (<= 767px) ========================= */
@media (max-width:767px){
/* SideMenu */
#side-menu-right{ width:280px; right:-300px;  /* width + 20px (Puffer) */ padding-top:100px;  /* weniger „Luft“ oben */ padding-left:16px }
/* Kerbe kleiner + bleibt am linken Rand des SideMenus */
#side-menu-right.open::before{ top:108px; left:-2px; width:120px;  height:80px; border-top-right-radius:14px; border-bottom-right-radius:14px }
/* Navigation kompakter (weniger vertikal auseinander) */
.menu-items{ margin-top:130px; width:calc(100% + 16px); margin-left:-16px; max-height:calc(100vh - 120px);overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding-bottom:18px}
.menu-items > ul > li{ margin:6px 0; }  /* weniger Abstand */
.menu-items ul li a{ font-size:19px;padding:7px 12px }
.submenu{ padding-left:16px; width:calc(100% - 16px) }
.menu-items .submenu li a{ font-size:16px; padding:7px 12px 7px 40px }
/* Kerbe „einrastet“ */
.menu-toggle{ top:112px; right:22px; width:70px; height:70px; border-radius:16px; padding-top:6px; transform:translateX(120px); animation:flyInSm 0.6s ease-out 0.2s forwards }
.menu-toggle.open{ right:165px; transform:translateX(0); background-color:#ddd }
/* Button-Inhalt */
.menu-label{ font-size:14px; margin-top:4px; margin-bottom:1px; }
.menu-icon{ width:32px; height:32px }
}

/*  Tablet & kleiner (<= 575px) ========================= */
@media (max-width:575px){
/* SideMenu */
#side-menu-right{width:250px;right:-300px;/* width + 20px (Puffer) */padding-top:100px;/* weniger „Luft“ oben */padding-left:16px;overflow:hidden}
/* Kerbe kleiner + bleibt am linken Rand des SideMenus */
#side-menu-right.open::before{top:108px;left:-2px;width:120px;height:75px; border-top-right-radius:14px;border-bottom-right-radius:14px}
/* Navigation kompakter + scrollbar */
.menu-items{margin-top:100px;width:calc(100% + 16px);margin-left:-16px; max-height:calc(100vh - 120px);overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding-bottom:18px}
.menu-items>ul>li{margin:6px 0}/* weniger Abstand */
.menu-items ul li a{font-size:18px;padding:5px 12px}
.submenu{padding-left:15px;width:calc(100% - 16px)}
.menu-items .submenu li a{font-size:16px;padding:7px 12px 7px 40px}
/* Kerbe „einrastet“ */
.menu-toggle{top:112px;right:22px;width:65px;height:65px;border-radius:16px;padding-top:6px;transform:translateX(120px);animation:flyInSm 0.6s ease-out 0.2s forwards}
.menu-toggle.open{right:135px;transform:translateX(0);background-color:#ddd}
/* Button-Inhalt */
.menu-label{font-size:13px;margin-top:1px;margin-bottom:1px}
.menu-icon{width:30px;height:30px}
}

/*  Tablet & kleiner (<= 400px) ========================= */
@media (max-width:400px){
/* SideMenu */
#side-menu-right{width:250px;right:-300px;/* width + 20px (Puffer) */padding-top:100px;/* weniger „Luft“ oben */padding-left:16px;overflow:hidden}
/* Kerbe kleiner + bleibt am linken Rand des SideMenus */
#side-menu-right.open::before{top:18px;left:-2px;width:120px;height:65px;border-top-right-radius:14px;border-bottom-right-radius:14px}
/* Navigation kompakter + scrollbar */
.menu-items{margin-top:10px;width:calc(100% + 16px);margin-left:-16px;max-height:calc(100vh - 120px);overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding-bottom:18px}
.menu-items>ul>li{margin:6px 0}/* weniger Abstand */
.menu-items ul li a{font-size:16px;padding:5px 12px}
.submenu{padding-left:15px;width:calc(100% - 16px)}
.menu-items .submenu li a{font-size:14px;padding:7px 12px 7px 40px}
/* Kerbe „einrastet“ */
.menu-toggle{top:22px;right:22px;width:55px;height:55px;border-radius:16px;padding-top:6px;transform:translateX(120px);animation:flyInSm 0.6s ease-out 0.2s forwards}
.menu-toggle.open{right:135px;transform:translateX(0);background-color:#ddd}
/* Button-Inhalt */
.menu-label{font-size:12px;margin-top:1px;margin-bottom:1px}
.menu-icon{width:25px;height:25px}
}
@keyframes flyInSm{ from{transform:translateX(120px);opacity:0;} to{transform:translateX(0);opacity:1;} }

  /* 
    Hier: 
      20px = Breite des Icons (.submenu-toggle-icon)
      12px = margin-right des Icons
      16px = dein ursprüngliches linkes Padding
    zusammen: 20 + 12 + 16 = 48px
  */

/* Foot --------------------------------------------------------------------------------------- */
.effect-button2 {position:relative;width:90px;height:90px;margin:10px;padding:10px;color:#fff;background:#888;border:none;border-radius:10px;box-shadow:0 4px 15px rgba(30,30,30,.9);display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease,background .3s ease;}
.effect-button2::before {content:'';position:absolute;top:-110%;left:-110%;width:230%;height:230%;background:linear-gradient(135deg,rgba(255,255,255,.1),rgba(255,255,255,.5),rgba(200,200,200,.1));transform:rotate(45deg);transition:all .8s ease;pointer-events:none;}
.effect-button2:hover {background:#E35553;box-shadow:0 4px 20px rgba(203,66,64,.8);}
.effect-button2:hover::before {top:100%;left:100%;}
.effect-button2:active {transform:scale(.95) translateY(4px);transition:all .1s ease;box-shadow:0 4px 5px rgba(227,85,83,.2),0 4px 10px rgba(227,85,83,.4),0 4px 20px rgba(227,85,83,.8),0 4px 30px rgba(227,85,83,.9);}
.effect-button2:active::before {top:-100%;left:-80%;width:220%;height:220%;background:radial-gradient(circle,rgba(255,255,255,.5),rgba(255,255,255,0));transition:all .1s ease;}
btn_svg {transform:scale(1);transition:transform 0.5s ease;}
btn_svg: hover {transform:scale(1.2) rotate(15deg);} 

.telefon {display:none}

.termin { display:block; position:fixed; z-index:80; bottom:280px; right:-120px; width:220px; height:50px; background: url('../bm/termin1a.svg') bottom no-repeat; background-size:220px; opacity:0; transition:right 0.5s ease, opacity 0.5s ease, bottom 0.5s ease; pointer-events:none; cursor:pointer;}
.termin.visible { right: -60px; /* Endposition – sichtbar */ opacity:1; pointer-events:auto; }
.anker { display:block; position:fixed; z-index:80; bottom:280px; right:-120px; width:220px; height:50px; background: url('../bm/top1a.svg') bottom no-repeat; background-size:220px; opacity:0; transition:right 0.5s ease, opacity 0.5s ease, bottom 0.5s ease; pointer-events:none; cursor:pointer;}
.anker.visible { right: -60px; /* Endposition – sichtbar */ opacity:1; pointer-events:auto; }

/* Laptops & kleinere Desktops (1400px) */
@media (max-width: 1400px) {
:root {  --font-h1:30px; --font-h2:26px; --font-h3:20px; --font-h4:18px; --font-h5:16px;  --font-h6:16px; 
         --font-size-nav1:22px; --font-size-nav2:18px; --font-size-head:18px; --font-size-footnav1:18px; --font-size-footnav2:12px;}
p, .text { font-size:22px; font-family:var(--font-family-base); font-weight:400; }
    
.foot-adrs  { position:absolute; top:45px; left:30px; font-size:16px; font-weight:normal; }
.foot-btn   { position:absolute; top:40px; left:260px }
    
.webstyle { position:absolute; z-index:90; bottom:10px; left:30px;}
.barrierefrei { position:absolute; z-index:90; bottom:10px; left:270px; font-size:12px; }
    
.effect-button2 {position:relative;width:80px;height:80px;margin:10px;padding:10px }
.effect-button2::before {content:'';position:absolute;top:-110%;left:-110%;width:230%;height:230%;}
btn_svg {transform:scale(1);transition:transform 0.5s ease;}
btn_svg: hover {transform:scale(1.2) rotate(15deg);}   
.telefon {display:none} 
}

/* Laptops & kleinere Desktops (992px – 1199px) */
@media (max-width: 1199px) {
:root {  --font-h1:28px; --font-h2:24px; --font-h3:18px; --font-h4:16px; --font-h5:14px;  --font-h6:12px; 
         --font-size-nav1:22px; --font-size-nav2:18px; --font-size-head:18px; --font-size-footnav1:18px; --font-size-footnav2:12px;}
p, .text { font-size:20px; font-family:var(--font-family-base); font-weight:400; }

.foot-adrs  { position:absolute; top:150px; left:30px; font-size:15px; font-weight:normal; color:#bbb;}
.foot-btn   { position:absolute; top:30px; left:20px }
.foot-links { position:absolute; top:40px; right:30px; display: flex; gap:3rem; letter-spacing:-0.5px;}
    
.webstyle { position:absolute; z-index:90; bottom:10px; left:30px;}
.barrierefrei { position:absolute; z-index:90; bottom:10px; left:270px; font-size:12px; }
    
.effect-button2 {position:relative;width:75px;height:75px;margin:10px;padding:10px }
.effect-button2::before {content:'';position:absolute;top:-110%;left:-110%;width:230%;height:230%;}
btn_svg {transform:scale(1);transition:transform 0.5s ease;}
btn_svg: hover {transform:scale(1.2) rotate(15deg);}   
.telefon {display:none} 
}

/* Tablets (quer) & große Tablets (768px – 991px) */
@media (max-width: 991px) {
:root {  --font-h1:26px; --font-h2:20px; --font-h3:18px; --font-h4:16px; --font-h5:14px;  --font-h6:12px; 
         --font-size-nav1:20px; --font-size-nav2:18px; --font-size-head:18px; --font-size-footnav1:18px; --font-size-footnav2:12px;}
p, .text { font-size:18px; font-family:var(--font-family-base); font-weight:400; }
    
.foot-adrs  { position:absolute; top:280px; left:30px; font-size:15px; font-weight:normal; color:#bbb;}
.foot-btn   { position:absolute; top:30px; left:20px }
.foot-links { position:absolute; top:40px; right:30px; width:120px; display:flex; flex-direction: column; gap:1rem; letter-spacing:-0.5px;}
.foot-link2 { order:1; } .foot-link1 { order:2; }

.webstyle { position:absolute; z-index:90; bottom:35px; left:30px;}
.barrierefrei { position:absolute; z-index:90; bottom:10px; left:30px; font-size:12px; }
    
.effect-button2 {position:relative;width:75px;height:75px;margin:10px;padding:10px }
.effect-button2::before {content:'';position:absolute;top:-110%;left:-110%;width:230%;height:230%;}
btn_svg {transform:scale(1);transition:transform 0.5s ease;}
btn_svg: hover {transform:scale(1.2) rotate(15deg);}   
.telefon{display:inline-flex;} 
}

/* Tablets (hochkant) & große Smartphones (576px – 767px) */
@media (max-width: 767px) {
:root {  --font-h1:24px; --font-h2:22px; --font-h3:16px; --font-h4:15px; --font-h5:13px;  --font-h6:12px; 
         --font-size-nav1:18px; --font-size-nav2:18px; --font-size-head:18px; --font-size-footnav1:17px; --font-size-footnav2:12px;}
p, .text { font-size:18px; font-family:var(--font-family-base); font-weight:400; }
    
.foot-adrs  { position:absolute; top:280px; left:30px; font-size:15px; font-weight:normal; color:#bbb;}
.foot-btn   { position:absolute; top:30px; left:20px; width:300px}
.foot-links { position:absolute; top:40px; right:30px; width:120px; display:flex; flex-direction: column; gap:1rem; letter-spacing:-0.5px;}
.foot-link2 { order:1; } .foot-link1 { order:2; }

.webstyle { position:absolute; z-index:90; bottom:35px; left:30px;}
.barrierefrei { position:absolute; z-index:90; bottom:10px; left:30px; font-size:12px; }
    
.effect-button2 {position:relative;width:70px;height:70px;margin:10px;padding:10px }
.effect-button2::before {content:'';position:absolute;top:-110%;left:-110%;width:230%;height:230%;}
btn_svg {transform:scale(1);transition:transform 0.5s ease;}
btn_svg: hover {transform:scale(1.2) rotate(15deg);}   
.telefon{display:inline-flex;}
    
.termin { display:block; position:fixed; z-index:80; bottom:280px; right:-120px; width:200px; height:45px; background: url('../bm/termin1a.svg') bottom no-repeat; background-size:200px; }
.anker { display:block; position:fixed; z-index:80; bottom:280px; right:-120px; width:200px; height:45px; background: url('../bm/top1a.svg') bottom no-repeat; background-size:200px; }
}

/* Standard-Smartphones (400px – 575px) */
@media (max-width: 575px) {
:root {  --font-h1:22px; --font-h2:20px; --font-h3:14px; --font-h4:14px; --font-h5:12px;  --font-h6:11px; 
         --font-size-nav1:16px; --font-size-nav2:18px; --font-size-head:18px; --font-size-footnav1:16px; --font-size-footnav2:12px;}
p, .text { font-size:16px; font-family:var(--font-family-base); font-weight:400; }
    
.foot-adrs  { position:absolute; top:340px; left:30px; font-size:14px; font-weight:normal; color:#bbb;}
.foot-btn   { position:absolute; top:30px; left:20px; width:180px}
.foot-links { position:absolute; top:40px; right:30px; width:100px; display:flex; flex-direction: column; gap:1rem; letter-spacing:-0.5px;}
.foot-link2 { order:1; } .foot-link1 { order:2; }

.webstyle { position:absolute; z-index:90; bottom:35px; left:30px;}
.barrierefrei { position:absolute; z-index:90; bottom:10px; left:30px; font-size:12px; letter-spacing:-0.5px;}
    
.effect-button2 {position:relative;width:65px;height:65px;margin:10px;padding:10px }
.effect-button2::before {content:'';position:absolute;top:-110%;left:-110%;width:230%;height:230%;}
btn_svg {transform:scale(1);transition:transform 0.5s ease;}
btn_svg: hover {transform:scale(1.2) rotate(15deg);}   
.telefon{display:inline-flex;} 
    
.termin { display:block; position:fixed; z-index:80; bottom:280px; right:-120px; width:180px; height:41px; background: url('../bm/termin1a.svg') bottom no-repeat; background-size:180px; }
.anker { display:block; position:fixed; z-index:80; bottom:280px; right:-120px; width:180px; height:41px; background: url('../bm/top1a.svg') bottom no-repeat; background-size:180px; }
}

/* Kleine Smartphones / sehr kleine Displays (<= 400px) */
@media (max-width: 400px) {
:root {  --font-h1:20px; --font-h2:16px; --font-h3:14px; --font-h4:13px; --font-h5:11px;  --font-h6:10px; 
         --font-size-nav1:14px; --font-size-nav2:18px; --font-size-head:18px; --font-size-footnav1:15px; --font-size-footnav2:12px;}
p, .text { font-size:14px; font-family:var(--font-family-base); font-weight:400; }
    
.foot-adrs  { position:absolute; top:340px; left:20px; font-size:14px; font-weight:normal; color:#bbb;}
.foot-btn   { position:absolute; top:30px; left:10px; width:180px}
.foot-links { position:absolute; top:40px; right:10px; width:100px; display:flex; flex-direction: column; gap:1rem; letter-spacing:-0.5px;}
.foot-link2 { order:1; } .foot-link1 { order:2; }

.webstyle { position:absolute; z-index:90; bottom:40px; left:20px; letter-spacing:-0.5px;}
.barrierefrei { position:absolute; z-index:90; bottom:10px; left:20px; width:100%; font-size:11px; letter-spacing:-0.5px;}
    
.effect-button2 {position:relative;width:60px;height:60px;margin:10px;padding:5px }
.effect-button2::before {content:'';position:absolute;top:-110%;left:-110%;width:230%;height:230%;}
btn_svg {transform:scale(1);transition:transform 0.5s ease;}
btn_svg: hover {transform:scale(1.2) rotate(15deg);}   
.telefon{display:inline-flex;}
    
.termin { display:block; position:fixed; z-index:80; bottom:280px; right:-120px; width:180px; height:41px; background: url('../bm/termin1a.svg') bottom no-repeat; background-size:180px; }
.anker { display:block; position:fixed; z-index:80; bottom:280px; right:-120px; width:180px; height:41px; background: url('../bm/top1a.svg') bottom no-repeat; background-size:180px; }
}