/* =============================================
   Praxis für Naturheilkunde – Daniela Plenk
   main.css – Angepasster lokaler Entwurf
   ============================================= */

/* ---- Oswald (lokal vorhanden) ---- */
@font-face {
  font-family: 'Oswald'; font-style: normal; font-weight: 300;
  src: url('../fonts/oswald-light-webfont.woff') format('woff'),
       url('../fonts/oswald-light-webfont.ttf') format('truetype');
}
@font-face {
  font-family: 'Oswald'; font-style: normal; font-weight: 400;
  src: url('../fonts/oswald-regular-webfont.woff') format('woff'),
       url('../fonts/oswald-regular-webfont.ttf') format('truetype');
}
@font-face {
  font-family: 'Oswald'; font-style: normal; font-weight: 700;
  src: url('../fonts/oswald-bold-webfont.woff') format('woff'),
       url('../fonts/oswald-bold-webfont.ttf') format('truetype');
}

/* ---- Open Sans + Raleway ---- */
@font-face { font-family:'Open Sans'; font-style:normal; font-weight:400; font-display:swap; src:url('../fonts/open-sans-v44-latin-regular.woff2') format('woff2'); }
@font-face { font-family:'Open Sans'; font-style:normal; font-weight:600; font-display:swap; src:url('../fonts/open-sans-v44-latin-600.woff2') format('woff2'); }
@font-face { font-family:'Open Sans'; font-style:normal; font-weight:700; font-display:swap; src:url('../fonts/open-sans-v44-latin-700.woff2') format('woff2'); }
@font-face { font-family:'Raleway'; font-style:normal; font-weight:100; font-display:swap; src:url('../fonts/raleway-v37-latin-100.woff2') format('woff2'); }
@font-face { font-family:'Raleway'; font-style:normal; font-weight:400; font-display:swap; src:url('../fonts/raleway-v37-latin-regular.woff2') format('woff2'); }

/* =============================================
   BASE
   ============================================= */
*, *::before, *::after { box-sizing: border-box; }

html, body {
  height: 100%;
  margin: 0; padding: 0;
  overflow: hidden;
  font-size: 14px;
  font-weight: 100;
  font-family: 'Raleway', 'Open Sans', Arial, sans-serif;
  color: #242424;
  background-color: #3a4551;
}

h1 {
  font-size: 30px; color: #333; margin-top: 0;
  font-weight: 400; text-transform: uppercase;
  padding-bottom: 12px; font-family: 'Oswald', Arial, sans-serif;
  letter-spacing: 1px;
}

p {
  font-size: 15px; font-weight: 400; color: #919191;
  line-height: 26px; text-align: justify;
  font-family: 'Open Sans', Arial, sans-serif; letter-spacing: 1px;
}
p span { color: #e8313a; }
p a { font-size: 16px; color: #e8313a; line-height: 24px; text-decoration: none; }
p a:hover { color: #3a4551; transition: 0.5s; }

a { color: #fff; text-decoration: none; }
img { border: none; }

.container {
  width: 100%; max-width: 1170px;
  margin: 0 auto; padding: 0 15px;
}

/* =============================================
   PRELOADER
   ============================================= */
#preloader {
  position: fixed; inset: 0;
  background: #3a4551; z-index: 9999;
  display: flex; align-items: center; justify-content: center;
}
#preloader.hidden { opacity: 0; visibility: hidden; transition: opacity .5s, visibility .5s; }

.spinner { width: 80px; height: 80px; position: relative; }
.cube {
  float: left; width: 25%; height: 25%;
  background-color: #e8313a;
  animation: cubeGridScaleDelay 1.3s infinite ease-in-out;
}
.c0{animation-delay:.2s}.c1{animation-delay:.3s}.c2{animation-delay:.4s}.c3{animation-delay:.1s}
.c4{animation-delay:.2s}.c5{animation-delay:.3s}.c6{animation-delay:0s}.c7{animation-delay:.1s}
.c8{animation-delay:.2s}.c9{animation-delay:.3s}.c10{animation-delay:.4s}.c11{animation-delay:.5s}
.c12{animation-delay:.4s}.c13{animation-delay:.5s}.c14{animation-delay:.6s}.c15{animation-delay:.7s}
@keyframes cubeGridScaleDelay {
  0%,70%,100% { transform: scale3D(1,1,1); }
  35%          { transform: scale3D(0,0,1); }
}

/* =============================================
   HORIZONTAL SCROLL LAYOUT
   ============================================= */
#wrapper {
  width: 100%; height: 100%;
  position: absolute; top: 0; left: 0;
  overflow: hidden;
  z-index: 3;
}
#mask {
  display: flex;
  height: 100%;
  transition: transform 0.9s cubic-bezier(0.77, 0, 0.175, 1);
}
.item {
  flex: 0 0 100vw; width: 100vw; height: 100%;
  overflow: hidden; position: relative;
}

/* =============================================
   HINTERGRUND
   ============================================= */
.bgimg {
  background: url(../img/naturheilpraxis-plenk-passau-deggendorf.png) center center no-repeat;
  background-size: contain;
  position: fixed; inset: 0; height: 100%; width: 100%;
  z-index: 1; pointer-events: none;
}
.pattern_bg {
  background: url(../img/pattern.png) repeat fixed;
  position: fixed; inset: 0; height: 100%; width: 100%;
  z-index: 2; pointer-events: none;
}

/* =============================================
   GLOBALE NAVBAR – fixed, immer sichtbar
   Desktop Startseite: unten + 30px höher, größeres Logo
   Desktop Unterseiten: oben (Klasse .at-top per JS)
   ============================================= */
#mainheader {
  position: fixed; left: 0; width: 100%;
  bottom: calc(15% + 30px); z-index: 100;
  transition: bottom 0.5s cubic-bezier(0.77,0,0.175,1),
              top    0.5s cubic-bezier(0.77,0,0.175,1);
}
#mainheader.at-top {
  bottom: auto; top: 0;
}
#mainheader .menu-inner { background: #f0f0f0; }
.menu-inner { position: relative; }
.header-table {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 15px; min-height: 80px;
}
/* Startseite: größeres Logo */
.logo img { height: 60px; display: block; transition: height 0.3s; }
#mainheader.at-top .logo img { height: 45px; }

.main-nav { position: relative; }
.main-nav .nav {
  list-style: none; margin: 0; padding: 0;
  display: flex; gap: 30px;
}
.main-nav .nav li a {
  font-family: 'Open Sans', Arial, sans-serif;
  font-size: 13px; font-weight: 700;
  letter-spacing: 1px; text-transform: uppercase;
  cursor: pointer; padding: 5px 0; display: block;
  color: #3a4551;
  border-bottom: 2px solid transparent;
  transition: color .2s, border-color .2s;
}
.main-nav .nav li a:hover { color: #e8313a; }
.main-nav .nav li a.selected {
  color: #e8313a;
  border-bottom: 2px solid #e8313a;
}

.nav-toggle {
  display: none; background: none; border: none;
  color: #3a4551; font-size: 24px; cursor: pointer; padding: 5px;
}

/* =============================================
   HOME SECTION
   ============================================= */
#home { background-color: transparent; }

/* Kontaktzeile oben rechts – gestapelt wie im Original */
.header_details {
  position: absolute; top: 0; left: 0; right: 0;
  margin-top: 14px; z-index: 60;
}
.call {
  display: flex; flex-direction: column;
  align-items: flex-end; gap: 4px;
  font-family: 'Open Sans', Arial, sans-serif;
}
.call a, .home_address a { color: #fff; }
.home_address {
  display: flex; align-items: center; gap: 6px;
  font-size: 13px; color: #fff;
}
.call .phone-line {
  display: flex; align-items: center; gap: 8px;
  font-size: 22px; font-weight: 700; color: #fff;
  letter-spacing: 0.5px;
}
.call .fa { margin-right: 4px; }

/* Hero-Titel (zentriert) */
.hero-center {
  position: absolute; top: 50%; left: 0; right: 0;
  transform: translateY(-50%);
  z-index: 10; text-align: center; padding: 0 15px;
}
.home_title {
  font-size: 55px; color: #ffffff;
  font-family: 'Open Sans', Arial, sans-serif; font-weight: 700;
  line-height: 1.1;
}
.home_title .bold { font-weight: 700; color: #fff; }
.home_title_type {
  color: #fff; font-size: 30px; letter-spacing: 1px; font-weight: 600;
  font-family: 'Open Sans', Arial, sans-serif;
  margin-top: 14px; min-height: 42px;
}
.home_title_type span { color: #e8313a; }
.typed-cursor { color: #e8313a; animation: blink .7s infinite; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0} }

/* =============================================
   CONTENT SECTIONS
   ============================================= */
.content {
  height: 100%; width: 100%; margin: 0 auto;
  position: relative; z-index: 10; padding: 0;
}
.content_overlay {
  width: 50%; height: 100%; right: 0;
  background: rgba(255,255,255,0.93);
  position: absolute; top: 0; z-index: 0;
}
.content_inner {
  padding-top: 100px; padding-left: 90px; height: 100%;
  position: relative; z-index: 2;
}
.contentscroll {
  display: flex;
  height: calc(100% - 60px);
  margin-top: 10px; margin-bottom: 10px;
}
.col-empty { flex: 0 0 50%; }
.content_text {
  flex: 0 0 50%;
  padding-right: 30px; padding-bottom: 50px;
  overflow-y: auto; height: 100%;
  scrollbar-width: thin; scrollbar-color: #e8313a #e9e9e9;
}
.content_text::-webkit-scrollbar { width: 8px; }
.content_text::-webkit-scrollbar-track { background: #e9e9e9; }
.content_text::-webkit-scrollbar-thumb { background: #e8313a; border-radius: 10px; }

/* Fließtext in Content-Bereichen */
.intro-text {
  color: #919191; font-family: 'Open Sans', Arial, sans-serif;
  font-size: 15px; line-height: 26px; letter-spacing: 0.5px;
}
.intro-text .bold { color: #e8313a; font-weight: 700; }

.subtitle {
  font-size: 16px; line-height: 28px; color: #545454;
  margin-top: 15px; margin-bottom: 5px; font-weight: 500;
  text-transform: uppercase; letter-spacing: 1px;
  font-family: 'Oswald', Arial, sans-serif;
}
.about { padding-bottom: 30px; }

/* Rechtstexte (Impressum, DSE) */
.about h2 {
  font-size: 15px; color: #3a4551; margin-top: 22px; margin-bottom: 4px;
  font-weight: 700; text-transform: none; padding-bottom: 4px;
  font-family: 'Open Sans', Arial, sans-serif; letter-spacing: 0;
  border-bottom: 1px solid #e0e0e0;
}
.about h3 {
  font-size: 13px; color: #555; margin-top: 12px; margin-bottom: 4px;
  font-weight: 700; font-family: 'Open Sans', Arial, sans-serif;
}
.about ul, .about .index, .about .glossary, .about .m-elements {
  padding-left: 18px; margin: 6px 0 10px;
}
.about ul li { color: #919191; font-size: 13px; line-height: 22px;
  font-family: 'Open Sans', Arial, sans-serif; margin-bottom: 3px; }
.about .index li { list-style: none; margin-left: -10px; }
.about .index a { color: #e8313a; font-size: 13px; }
.about p { font-size: 13px; line-height: 22px; margin: 6px 0; text-align: left; letter-spacing: 0; }
.about .seal { margin-top: 20px; text-align: left; }
.about .seal img { display: block; }
.pad_top10 { padding-top: 10px; }

/* Kontakt-Details */
.contact-details { margin-top: 20px; }
.contact-details p {
  margin: 0 0 10px;
  color: #555; font-family: 'Open Sans', Arial, sans-serif;
  font-size: 15px; line-height: 28px; letter-spacing: 0.5px;
  font-weight: 400; text-align: left;
}
.contact-details .fa {
  color: #e8313a; font-size: 18px;
  width: 24px; text-align: center; margin-right: 8px;
}
.mail-text {
  display: inline-flex; align-items: center; gap: 10px;
  color: #e8313a; font-size: 15px; margin-top: 8px;
  font-family: 'Open Sans', Arial, sans-serif; font-weight: 400;
}
.mail-text .fa { color: #e8313a; font-size: 18px; }
.mail-text:hover { color: #3a4551; }
.mail-text:hover .fa { color: #3a4551; }

/* =============================================
   FOOTER – zweizeilig, immer sichtbar
   ============================================= */
.footer {
  position: fixed; bottom: 0; left: 0; width: 100%;
  z-index: 200;
  background: rgba(58, 69, 81, 0.95);
}
.footer-links {
  text-align: center;
  padding: 5px 14px 2px;
  font-size: 12px;
  font-family: 'Open Sans', Arial, sans-serif;
  letter-spacing: 1px; text-transform: uppercase;
}
.footer-links a {
  color: #fff; font-weight: 700;
  transition: color .2s;
}
.footer-links a:hover { color: #e8313a; }
.copyright {
  text-align: right;
  padding: 0 14px 5px;
  font-size: 11px; color: rgba(255,255,255,0.7);
  text-shadow: 1px 0 1px rgba(0,0,0,0.3);
  letter-spacing: 1px; text-transform: uppercase;
  font-family: 'Open Sans', Arial, sans-serif;
}

/* =============================================
   RESPONSIVE – MOBIL
   ============================================= */
@media (max-width: 768px) {
  /* Navbar oben */
  #mainheader { bottom: auto; top: 0; }
  .header-table { min-height: 60px; }

  /* Kontaktzeile: unter Navbar, rechts gestapelt */
  .header_details { margin-top: 65px; }
  .call { gap: 3px; }
  .call .phone-line { font-size: 16px; }

  /* Content-Panels */
  .content_overlay { width: 100%; }
  .content_inner { padding-left: 20px; padding-right: 10px; padding-top: 80px; }
  .col-empty { display: none; }
  .content_text { flex: 0 0 100%; padding-right: 10px; }

  /* Hero: linksbündig */
  .hero-center {
    top: 40%; transform: translateY(-50%);
    text-align: left; padding: 0 25px;
  }
  .home_title { font-size: 32px; }
  .home_title_type { font-size: 20px; }

  /* Hamburger */
  .nav-toggle { display: block; }
  .main-nav { position: static; }

  /* Dropdown: grüner Hintergrund, volle Breite */
  .main-nav .nav {
    display: none; flex-direction: column;
    position: absolute; top: 100%; left: 0; right: 0;
    background: #e8313a; padding: 0; gap: 0; width: 100%;
  }
  .main-nav .nav.open { display: flex; }
  .main-nav .nav li { border-bottom: 1px solid rgba(255,255,255,0.2); }
  .main-nav .nav li a {
    color: #fff; padding: 14px 20px;
    font-size: 13px; font-weight: 700;
    text-transform: uppercase; letter-spacing: 1px;
    border-bottom: none;
  }
  .main-nav .nav li a.selected,
  .main-nav .nav li a:hover { background: rgba(0,0,0,0.1); color: #fff; border-bottom: none; }

  /* Footer zweizeilig kompakt */
  .footer-links { font-size: 11px; }
  .copyright { font-size: 10px; }
}

@media (max-width: 480px) {
  .home_title { font-size: 24px; }
  .home_title_type { font-size: 15px; }
}

/* Anpassung der Phoenix-Vorlage für die Naturheilpraxis. */
html,body{font-family:'Open Sans',Arial,sans-serif;font-weight:400;background:#35414b}a:focus-visible,button:focus-visible{outline:3px solid #e8313a;outline-offset:5px}h1:focus{outline:none}a{text-underline-offset:4px}.skip{position:fixed;z-index:500;top:-100px;left:20px;background:white;color:#333;padding:12px}.skip:focus{top:12px}.bgimg{opacity:.13;width:47%;left:2%;background-size:95% auto}.pattern_bg{opacity:.15}#wrapper{height:100dvh}#mask{width:100%;transform:translateX(0);transition:transform .8s cubic-bezier(.65,0,.25,1)}.item{flex:0 0 100%;width:100%;min-width:0}body[data-panel="contact"] #mask{transform:translateX(-100%)}body[data-panel="impressum"] #mask{transform:translateX(-200%)}body[data-panel="datenschutz"] #mask{transform:translateX(-300%)}
#mainheader{top:calc(100dvh - 153px);bottom:auto;transition:top .8s cubic-bezier(.65,0,.25,1)}#mainheader.at-top{top:0;bottom:auto}.header-table{min-height:80px}.logo img,#mainheader.at-top .logo img{height:60px;width:170px;object-fit:contain}.menu-inner{box-shadow:0 0 35px #00000015}.header_details{margin-top:18px}.call{flex-direction:row;justify-content:flex-end;gap:25px}.call .phone-line{font-size:16px}.home_address{font-size:13px}.call a:hover{text-decoration:underline}.hero-center{top:64px;bottom:171px;transform:none;display:flex;align-items:center;justify-content:center;overflow:auto;overscroll-behavior:contain;padding:16px 24px}.hero-center>.container{margin-block:auto;max-width:920px}.hero-logo{display:block;width:190px;max-width:65%;height:auto;margin:0 auto 14px;background:#fffaf6;padding:8px 12px}.home_title{font-size:clamp(26px,3.1vw,40px);line-height:1.2;margin:0 0 8px;text-transform:none;letter-spacing:-.02em;padding:0}.home-sub{color:#d4dbe0;font-size:13px;margin:0 0 21px;text-align:center;letter-spacing:.04em;line-height:1.5}.services{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0 42px;margin:0 auto;padding:0;max-width:790px;text-align:left}.services li{font-size:15px;line-height:1.4;padding:8px 0;border-bottom:1px solid #ffffff22;display:flex;gap:10px;align-items:center}.services li:before{content:'';width:5px;height:5px;background:#e8313a;flex:none;border-radius:50%}.services small{font-size:12px;color:#c6ced4}.is-home .services li{animation:offer-in .65s ease-out both}.services li:nth-child(2){animation-delay:.09s}.services li:nth-child(3){animation-delay:.18s}.services li:nth-child(4){animation-delay:.27s}.services li:nth-child(5){animation-delay:.36s}.services li:nth-child(6){animation-delay:.45s}.services li:nth-child(7){animation-delay:.54s}.services li:nth-child(8){animation-delay:.63s}.services li:nth-child(9){animation-delay:.72s}.services li:nth-child(10){animation-delay:.81s}.services li:nth-child(11){animation-delay:.9s}@keyframes offer-in{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}
.content_overlay{width:57%;background:#fffaf6}.content_inner{padding:112px 0 80px;height:100%}.contentscroll{margin:0;height:100%;display:block}.content_text{width:57%;margin-left:43%;height:100%;padding:20px clamp(25px,4vw,65px) 40px;overflow:auto;overscroll-behavior:contain;scrollbar-color:#e8313a #e9e9e9}.content_text h1{font-family:'Open Sans',Arial,sans-serif;font-size:clamp(24px,3vw,34px);font-weight:600;text-transform:none;letter-spacing:-.02em;line-height:1.25;color:#353039;padding-bottom:0;margin-bottom:25px}.intro-text{color:#615c61;line-height:1.8;letter-spacing:0}.label{font-size:11px;letter-spacing:.15em;color:#e8313a;text-transform:uppercase;margin:30px 0 8px;text-align:left}.mobile-number{display:inline-block;color:#e8313a;font-size:clamp(23px,3vw,35px);font-weight:600;margin-bottom:16px}.mail-text{color:#e8313a;overflow-wrap:anywhere;display:block;font-size:15px}.addresses{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-top:35px;border-top:1px solid #ddd1d2;padding-top:25px}address{font-style:normal;color:#615c61;line-height:1.8;font-size:14px}address strong{display:block;color:#353039;font-size:18px;margin-bottom:5px}.back-home{display:inline-block;color:#e8313a;margin-top:35px;font-size:13px;text-decoration:underline}.pending{border-left:3px solid #e8313a;padding:20px;background:#f1e7e7;color:#615c61;line-height:1.8}.footer{background:#35414b;border-top:1px solid #ffffff18;padding:9px 0;min-height:57px}.footer-links{font-size:11px;letter-spacing:.05em}.copyright{text-align:center;letter-spacing:.04em;font-size:10px;padding-top:5px}.footer a:hover{color:#e8313a}.footer a.selected{text-decoration:underline}.main-nav .nav{display:flex!important;position:static;flex-direction:row;background:none;width:auto;gap:30px}.main-nav .nav li{border:0}.main-nav .nav li a{padding:8px 0}.nav-toggle{display:none!important}
/* Ohne JavaScript bleiben alle Inhalte und Sprunglinks erreichbar. */
body:not(.enhanced){overflow:auto;height:auto}body:not(.enhanced) #wrapper{position:relative;height:auto;overflow:visible;padding-top:90px}body:not(.enhanced) #mask{display:block;height:auto}body:not(.enhanced) .item{height:auto;overflow:visible;margin-bottom:40px}body:not(.enhanced) .hero-center{position:static;display:block;overflow:visible}body:not(.enhanced) #mainheader{top:0}body:not(.enhanced) .header_details{position:static}body:not(.enhanced) .content_inner{padding:25px 0}body:not(.enhanced) .content_text{background:#fffaf6}body:not(.enhanced) .footer{position:relative}body:not(.enhanced) .skip{display:none}
@media(max-width:768px){#mainheader,#mainheader.at-top{top:0}.header-table{min-height:76px;padding:0}.logo img,#mainheader.at-top .logo img{height:55px;width:145px}.main-nav .nav{gap:20px}.main-nav .nav li a{color:#35414b;font-size:11px;letter-spacing:.04em;border-bottom:2px solid transparent}.main-nav .nav li a.selected,.main-nav .nav li a:hover{background:none;color:#e8313a;border-bottom:2px solid #e8313a}.header_details{margin-top:90px}.call{justify-content:center;gap:16px}.call .phone-line{font-size:14px}.home_address{font-size:11px}.hero-center{top:123px;bottom:73px;padding:16px 22px;text-align:center}.hero-center>.container{padding:0;max-width:550px}.hero-logo{width:165px;margin-bottom:16px}.home_title{font-size:28px}.home-sub{font-size:12px;margin-bottom:20px}.services{gap:0 24px}.services li{font-size:13px;padding:10px 0}.content_overlay{width:100%}.content_inner{padding:96px 0 78px}.content_text{width:100%;margin:0;padding:15px 25px 35px}.bgimg{width:90%;opacity:.08}.copyright{font-size:9px}.footer-links{font-size:10px}.addresses{gap:20px}.content_text h1{font-size:28px}}
@media(max-width:480px){.header-table{min-height:74px}.logo img,#mainheader.at-top .logo img{width:125px;height:53px}.main-nav .nav{gap:16px}.home_address{display:none}.hero-center{top:118px}.hero-logo{width:150px}.services{grid-template-columns:1fr}.services li{font-size:15px;padding:10px 0}.hero-center>.container{margin-top:0}.home_title{font-size:25px}.addresses{grid-template-columns:1fr}.mail-text{font-size:14px}.content_text{padding-inline:22px}}
@media(prefers-reduced-motion:reduce){#mask,#mainheader,.is-home .services li{transition:none;animation:none}}

.services{color:#f5f3f1}

.content_text h1{overflow-wrap:anywhere;hyphens:auto}
@media(max-width:480px){.logo img,#mainheader.at-top .logo img{width:105px}.main-nav .nav{gap:12px}.main-nav .nav li a{font-size:10px}.copyright{letter-spacing:0}}

/* Ein einziges großes, unverdecktes Hintergrundlogo statt der hellen Logokachel. */
body{--brand-width:min(60vw,600px,46dvh);--brand-top:clamp(52px,6dvh,80px);--brand-height:calc(var(--brand-width) * .503125)}
.bgimg{inset:auto;left:50%;top:var(--brand-top);width:var(--brand-width);height:var(--brand-height);transform:translateX(-50%);opacity:1;background-size:contain;background-position:center;z-index:2;transition:top .8s cubic-bezier(.65,0,.25,1),left .8s cubic-bezier(.65,0,.25,1),width .8s cubic-bezier(.65,0,.25,1),height .8s cubic-bezier(.65,0,.25,1)}
.pattern_bg{z-index:1}
.hero-center{top:calc(var(--brand-top) + var(--brand-height) + 22px);align-items:flex-start;padding-top:0}
.hero-center>.container{margin-block:0}
body:not([data-panel="home"]) .bgimg{left:21.5%;width:min(39vw,720px);height:calc(min(39vw,720px) * .503125);top:calc(50dvh - min(39vw,720px) * .2515625)}
@media(max-width:768px){
 body{--brand-width:min(74vw,380px,40dvh);--brand-top:121px}
 .hero-center{top:calc(var(--brand-top) + var(--brand-height) + 20px)}
 body:not([data-panel="home"]) .bgimg{left:50%;width:min(68vw,330px,32dvh);height:calc(min(68vw,330px,32dvh) * .503125);top:91px}
 .subpage .content_overlay{top:calc(110px + min(68vw,330px,32dvh) * .503125);height:calc(100% - 110px - min(68vw,330px,32dvh) * .503125)}
 .subpage .content_inner{padding-top:calc(124px + min(68vw,330px,32dvh) * .503125)}
}
@media(prefers-reduced-motion:reduce){.bgimg{transition:none}}
body:not(.enhanced) .bgimg{position:absolute}
body:not(.enhanced) #home{padding-top:calc(var(--brand-height) + 20px)}

/* Name als eigenständige, lokal gesetzte Hauptüberschrift. */
.home_title{font-family:'Raleway','Open Sans',Arial,sans-serif;font-weight:400;font-size:clamp(38px,5vw,64px);letter-spacing:.015em;line-height:1.15;margin-bottom:13px;text-transform:none}
@media(max-width:480px){.home_title{font-size:clamp(32px,10vw,42px);letter-spacing:0}.home-sub{line-height:1.7}}

@media(min-width:769px) and (max-height:850px){body{--brand-width:min(44vw,440px,32dvh);--brand-top:45px}.hero-center{top:calc(var(--brand-top) + var(--brand-height) + 16px)}.home_title{font-size:clamp(42px,4.3vw,56px);margin-bottom:8px}.home-sub{margin-bottom:12px}.topic-grid{margin-top:18px}.topic-card{padding:17px 20px}.topic-card h2{margin-bottom:12px}.topic-offers{gap:8px}.topic-offers li{font-size:13px}}


/* Gewählte Richtung: alte helle Inhaltsflächen und Logo-Rot. */
:root{--logo-red:#e8313a}
html,body{background:#3a4551}.pattern_bg{display:none}
#mainheader .menu-inner{background:#4d5a65;box-shadow:none}
.main-nav .nav li a{font-family:'Oswald','Open Sans',sans-serif;font-size:14px;letter-spacing:.03em;color:#f4f2ef}
.main-nav .nav li a.selected,.main-nav .nav li a:hover{color:var(--logo-red);border-bottom-color:var(--logo-red);background:none}
.content_overlay{background:rgba(255,255,255,.85);border:0}
.content_text{scrollbar-color:var(--logo-red) #e5e5e5}
.content_text h1{font-family:'Oswald','Open Sans',sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:.02em;color:#333;font-size:32px}
.content_text h2{font-family:'Oswald','Open Sans',sans-serif;font-weight:400;text-transform:uppercase;color:#4c4c4c}
.intro-text,address{color:#616161}address strong{color:#3b3b3b}
.label,.mobile-number,.mail-text,.back-home{color:#b6202b}.label{font-family:'Oswald','Open Sans',sans-serif;font-size:15px}
.mobile-number{color:#3e3e3e}.mail-text:hover,.back-home:hover{color:var(--logo-red)}
.addresses{border-color:#d4d4d4}.pending{background:transparent;border-left:2px solid var(--logo-red);color:#616161}.pending strong{color:#414141}
.footer{background:#3a4551;border:0}.footer a:hover,.footer a.selected{color:var(--logo-red)}
body:not([data-panel="home"]) .bgimg{left:50%;width:min(80vw,1100px);height:calc(min(80vw,1100px) * .503125);top:calc(50dvh - min(80vw,1100px) * .2515625)}
.plain-offers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(6,auto);grid-auto-flow:column;gap:14px 65px;max-width:850px;padding:0;margin:28px auto 0;list-style:none;text-align:left;color:#f4f3f1}
.plain-offers li{padding:0;border:0;background:none;font:400 18px/1.55 'Open Sans',Arial,sans-serif;overflow-wrap:anywhere}
.plain-offers small{font-size:13px;color:#d0d5d9}
.is-home .plain-offers{animation:plain-enter .65s ease-out both}
@keyframes plain-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(min-width:769px) and (max-height:850px){.plain-offers{gap:9px 55px;margin-top:22px}.plain-offers li{font-size:16px}}
@media(max-width:768px){.main-nav .nav li a{font-size:13px;color:#f4f2ef}.main-nav .nav li a.selected,.main-nav .nav li a:hover{color:var(--logo-red);border-bottom-color:var(--logo-red)}.content_overlay{background:rgba(255,255,255,.85)}.content_text h1{font-family:'Oswald','Open Sans',sans-serif;font-size:28px}body:not([data-panel="home"]) .bgimg{left:50%;width:min(68vw,330px,32dvh);height:calc(min(68vw,330px,32dvh) * .503125);top:91px}.plain-offers{gap:14px 30px}.plain-offers li{font-size:15px}}
@media(max-width:550px){.plain-offers{grid-template-columns:1fr;grid-template-rows:none;grid-auto-flow:row;gap:13px;margin-top:24px}.plain-offers li{font-size:16px}.main-nav .nav li a{font-size:12px}}
@media(prefers-reduced-motion:reduce){.is-home .plain-offers{animation:none}}

/* Zentrierte Begriffe mit einer sehr leichten, nacheinander laufenden Betonung. */
.plain-offers{max-width:790px;text-align:center;justify-items:center;align-items:center}
.plain-offers li{max-width:100%;transform-origin:center}
.is-home .plain-offers{animation:none}
.is-home .plain-offers li{animation:offer-pop 15.4s ease-in-out infinite}
@keyframes offer-pop{0%,8%,100%{transform:scale(1);color:var(--logo-red)}3.5%{transform:scale(1.045);color:#fff}}
.is-home .plain-offers li:nth-child(1){animation-delay:0.0s}
.is-home .plain-offers li:nth-child(2){animation-delay:1.4s}
.is-home .plain-offers li:nth-child(3){animation-delay:2.8s}
.is-home .plain-offers li:nth-child(4){animation-delay:4.2s}
.is-home .plain-offers li:nth-child(5){animation-delay:5.6s}
.is-home .plain-offers li:nth-child(6){animation-delay:7.0s}
.is-home .plain-offers li:nth-child(7){animation-delay:8.4s}
.is-home .plain-offers li:nth-child(8){animation-delay:9.8s}
.is-home .plain-offers li:nth-child(9){animation-delay:11.2s}
.is-home .plain-offers li:nth-child(10){animation-delay:12.6s}
.is-home .plain-offers li:nth-child(11){animation-delay:14.0s}

body.motion-paused .plain-offers li,body.page-inactive .plain-offers li{animation-play-state:paused}
.animation-toggle{display:block;margin:18px auto 0;padding:6px 10px;background:none;border:0;color:#d0d5d9;font:12px 'Open Sans',Arial,sans-serif;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.animation-toggle[hidden]{display:none}.animation-toggle:hover{color:white}
@media(prefers-reduced-motion:reduce){.is-home .plain-offers li{animation:none;transform:none}.animation-toggle{display:none}}

/* Auch der Methodenzusatz folgt dem Farbverlauf des Angebots. */
.plain-offers small{color:inherit}

/* Grundfarbe gilt auch vor Animationsbeginn und bei reduzierter Bewegung. */
.plain-offers,.plain-offers li{color:var(--logo-red)}

/* Direkter Kontakt unter der Angebotsliste. */
.appointment-banner{display:flex;align-items:center;justify-content:center;gap:35px;max-width:790px;margin:28px auto 0;padding:18px 24px;background:var(--logo-red);color:#fff;text-decoration:none;line-height:1.5;transition:background-color .2s}
.appointment-banner:hover{background:#b8202b;color:#fff}
.appointment-label{font-family:'Oswald','Open Sans',sans-serif;font-size:20px;letter-spacing:.025em}
.appointment-number{font-family:'Open Sans',Arial,sans-serif;font-size:22px;font-weight:600;white-space:nowrap}
.appointment-number span{margin-left:10px;font-size:18px}
@media(min-width:769px) and (max-height:850px){.appointment-banner{margin-top:20px;padding:12px 20px}.appointment-label{font-size:18px}.appointment-number{font-size:20px}}
@media(max-width:550px){.appointment-banner{flex-direction:column;gap:4px;padding:17px 12px;margin-top:25px}.appointment-label{font-size:20px}.appointment-number{font-size:22px}}
@media(prefers-reduced-motion:reduce){.appointment-banner{transition:none}}

/* Vorläufige Rechtstexte: gut lesbar innerhalb der einschiebenden Ansicht. */
.legal-draft{font:400 12px/1.6 'Open Sans',Arial,sans-serif;color:#616161;text-align:left;letter-spacing:0;border-left:2px solid var(--logo-red);padding-left:12px;margin:0 0 25px}
.legal-copy p,.legal-copy ul li{color:#555;font-size:14px;line-height:1.8;letter-spacing:0;text-align:left;overflow-wrap:anywhere}
.legal-copy h2{font-family:'Oswald','Open Sans',sans-serif;font-weight:400;font-size:19px;line-height:1.45;margin-top:28px;color:#414141}
.legal-copy h3{font-size:15px;line-height:1.5;color:#414141}
.legal-copy a,.legal-copy .index a{color:#b6202b;font-size:inherit;line-height:inherit;text-decoration:underline;text-underline-offset:3px}
.legal-copy a:hover{color:#8b1820}.legal-copy .index{margin:12px 0 25px;padding-left:10px}.legal-copy .index li{margin-bottom:8px}