img[data-src],
img[data-image] {
  max-width: 100%;
}

.sqs-block-image .image-block-outer-wrapper.layout-caption-below .image-caption-wrapper {
  padding-top: 32px !important;
}

.sqs-block-image,
.sqs-block-image .sqs-block-content,
.sqs-block-image .image-block-outer-wrapper,
.sqs-block-image .sqs-block-image-figure,
.sqs-block-image .sqs-block-image-link,
.sqs-block-image .image-block-wrapper {
  display: block !important;
  width: 100% !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.sqs-block-image .sqs-image-shape-container-element {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  overflow: hidden !important;
}

.sqs-block-image .sqs-image-shape-container-element.has-aspect-ratio img,
.sqs-block-image [data-sqsp-image-classic-block-image-container] img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.sqs-block-image img.loaded,
.sqs-block-image img[data-src],
.sqs-block-image img[data-image] {
  opacity: 1 !important;
}

.Index-gallery {
  position: relative;
  width: 100%;
  min-height: calc(100vh - 95px);
  overflow: hidden;
  background: #f7f7f7;
}

.Index-gallery-wrapper {
  position: relative;
  width: 100%;
  height: calc(100vh - 95px);
  min-height: 620px;
}

.Index-gallery-item {
  position: absolute !important;
  inset: 0;
  display: block !important;
  width: 100%;
  height: 100%;
  opacity: 0 !important;
  visibility: visible !important;
  pointer-events: none;
  transition: opacity 700ms ease !important;
}

.Index-gallery-item.editable-active {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto;
  z-index: 1 !important;
}

.Index-gallery-item-inner,
.Index-gallery-item-image {
  display: block !important;
  width: 100%;
  height: 100%;
  margin: 0 !important;
}

.Index-gallery-item-image img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover;
  opacity: 1 !important;
  visibility: visible !important;
}

.Index-gallery-control {
  position: absolute;
  top: 50%;
  z-index: 5;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 84px;
  padding: 0;
  border: 0;
  color: rgba(255, 255, 255, 0.92);
  background: transparent;
  cursor: pointer;
  transform: translateY(-50%);
}

.Index-gallery-control--left {
  left: 28px;
}

.Index-gallery-control--right {
  right: 28px;
}

.Index-gallery-control svg {
  display: none !important;
}

.Index-gallery-control::before {
  display: block;
  font-family: Arial, sans-serif;
  font-size: 70px;
  font-weight: 200;
  line-height: 1;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.22);
}

.Index-gallery-control--left::before {
  content: "\2039";
}

.Index-gallery-control--right::before {
  content: "\203A";
}

.Index-gallery-indicators {
  position: absolute;
  right: 0;
  bottom: 30px;
  left: 0;
  z-index: 6;
  display: flex !important;
  justify-content: center;
  gap: 10px;
}

.Index-gallery-indicators-item {
  display: block !important;
  width: 10px;
  height: 10px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.95);
  border-radius: 999px;
  background: transparent;
  cursor: pointer;
}

.Index-gallery-indicators-item.editable-active {
  background: rgba(255, 255, 255, 0.95);
}

.Index-gallery-indicators-item-inner {
  display: none;
}

.Header--top,
.Header-search,
.Mobile-bar-search {
  display: none !important;
}

.Header--bottom {
  display: block !important;
  position: sticky !important;
  top: 0 !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  z-index: 1000;
  width: 100%;
  min-height: 95px;
  background: #fff !important;
  box-shadow: 0 6px 20px -14px rgba(34, 50, 59, 0.3);
  visibility: visible !important;
  transform: none !important;
}

.Header-inner--bottom {
  display: grid !important;
  grid-template-columns: auto 1fr auto auto;
  align-items: center;
  gap: 30px;
  width: 100%;
  min-height: 95px;
  padding: 0 50px;
}

.Header-inner--bottom [data-nc-container="bottom-left"],
.Header-inner--bottom [data-nc-container="bottom-center"],
.Header-inner--bottom [data-nc-container="bottom-right"] {
  display: flex !important;
  align-items: center;
}

.Header-inner--bottom [data-nc-container="bottom-left"] {
  grid-column: 3;
  justify-content: flex-start;
}

.Header-inner--bottom [data-nc-container="bottom-center"] {
  grid-column: 1;
  grid-row: 1;
  justify-content: flex-start;
  min-width: 150px;
}

.Header-inner--bottom [data-nc-container="bottom-right"] {
  grid-column: 4;
  justify-content: flex-end;
}

.Header-nav,
.Header-nav-inner,
.Header-branding,
.Header-branding-logo {
  visibility: visible !important;
  opacity: 1 !important;
}

.Header-branding {
  display: flex !important;
  align-items: center;
  width: auto !important;
  height: auto !important;
}

.Header-nav-inner {
  display: flex !important;
  align-items: center;
  gap: 28px;
}

.Header-branding-logo {
  display: block !important;
  width: 150px !important;
  height: auto !important;
  max-width: 150px !important;
  max-height: 74px !important;
}

.Header-nav-item,
.Header-nav-folder-title {
  color: #7f7f7f !important;
}

.Header-nav-item--folder {
  position: relative;
}

.Header-nav-folder {
  position: absolute !important;
  top: 100%;
  left: 50%;
  z-index: 200;
  display: block !important;
  min-width: 240px;
  padding: 14px 0;
  background: #fff;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(-50%) translateY(8px);
  transition: opacity 160ms ease, transform 160ms ease, visibility 160ms ease;
}

.Header-nav-item--folder:hover .Header-nav-folder,
.Header-nav-item--folder.editable-folder-hover .Header-nav-folder,
.Header-nav-item--folder:focus-within .Header-nav-folder {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

.Header-nav-folder-item {
  display: block !important;
  white-space: nowrap;
}

.Mobile {
  display: none;
}

.Parallax-host-outer {
  display: none !important;
}

.Index-page--has-image {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.Index-page--has-image .Index-page-content {
  position: relative;
  z-index: 1;
}

.Index-page--has-image .Index-page-image {
  position: absolute !important;
  inset: 0;
  z-index: 0;
  display: block !important;
  width: 100%;
  height: 100%;
  margin: 0 !important;
  overflow: hidden;
  pointer-events: none;
}

.Index-page--has-image .Index-page-image img {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 100%;
  height: 112%;
  max-width: none;
  object-fit: cover;
  transform: translate3d(-50%, calc(-50% + var(--editable-parallax-offset, 0px)), 0);
  will-change: transform;
}

#home-oben {
  height: auto !important;
  min-height: calc(100vh - 95px) !important;
}

/* Telefonnummer und „Termin buchen“ sollen ohne Scrollen sichtbar sein (Feedback 10/2026):
   site.css setzt hier 180–210px Abstand oben, das schob beides unter die Falz. */
@media (min-width: 641px) {
  #home-oben .Index-page-content {
    padding-top: 100px;
  }
}
@media (min-width: 1024px) and (max-height: 720px) {
  #home-oben .Index-page-content {
    padding-top: 30px;
  }
}

#home-oben .Index-page-image img {
  top: 0;
  height: 165%;
  object-position: 0% 50% !important;
  transform: translate3d(-50%, var(--editable-parallax-offset, 0px), 0);
}

/* Startseiten-Titelbild oben ausrichten (Pendant zu object-position: top), damit der
   obere Bildbereich immer sichtbar bleibt und die Köpfe nie abgeschnitten werden.
   Horizontale Position bleibt beim Focal Point, damit mobil alle drei im Bild sind.
   !important, weil main.js die background-position inline aus dem Focal Point setzt. */
#home-oben .Index-page-image {
  background-position: 32% top !important;
}

/* ===== Mobiles Menü: vollflächiges Panel, das von oben aufklappt ===== */
.Mobile-overlay {
  display: block !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 9000;
  background: #fff;
  padding: 90px 28px 40px;
  overflow-y: auto;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-16px);
  transition: opacity .3s ease, transform .3s ease, visibility .3s ease;
}

body.editable-mobile-open {
  overflow: hidden;
}

body.editable-mobile-open .Mobile-overlay {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

/* innere Menü-Container: Squarespace-Slide-Transform/Absolut-Position zurücksetzen,
   damit die Links im Panel normal von oben nach unten fließen */
.Mobile-overlay-menu,
.Mobile-overlay-menu-main,
.Mobile-overlay-folder {
  position: static !important;
  transform: none !important;
  left: auto !important;
  top: auto !important;
  width: 100% !important;
  height: auto !important;
  background: transparent !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.Mobile-overlay-folder:not(.editable-active) { display: none !important; }

/* Nav-Einträge als vertikale Liste (höhere Spezifität, um site.css zu schlagen) */
.Mobile-overlay .Mobile-overlay-nav-item,
.Mobile-overlay .Mobile-overlay-folder-item {
  display: block !important;
  width: 100% !important;
  padding: 1rem 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #e7edf0 !important;
  background: transparent !important;
  text-align: left !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  font-family: "Fjalla One", sans-serif !important;
  font-weight: 400 !important;
  font-size: 1.4rem !important;
  line-height: 1.15 !important;
  color: #22323b !important;
  text-decoration: none !important;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}
.Mobile-overlay .Mobile-overlay-nav-item--folder {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
}
.Mobile-overlay .Mobile-overlay-nav-item--folder::after {
  content: "";
  width: 10px; height: 10px;
  border-right: 2px solid #0c6e92;
  border-bottom: 2px solid #0c6e92;
  transform: rotate(-45deg);
}

/* Leistungen-Unterpanel */
.Mobile-overlay-folder { display: none; }
body.editable-folder-open .Mobile-overlay-menu-main { display: none; }
.Mobile-overlay-folder.editable-active { display: block; }
.Mobile-overlay .Mobile-overlay-back,
body.editable-mobile-open .Mobile-overlay-back { display: none !important; }

/* eigener Close-Button im Overlay entfällt: das X in der Leiste schließt */
.Mobile-overlay-close { display: none !important; }

/* Mobile-Leiste statt Desktop-Header bis 1023px: darunter passt die Navigation samt
   „Termin buchen“ nicht mehr in eine Zeile (Einträge überlappten zwischen 768 und 1023px). */
@media (max-width: 1023px) {
  .Header--bottom {
    display: none !important;
  }

  .Mobile {
    display: block;
    position: relative;
    z-index: 300;
  }

  .Mobile-bar--top {
    display: flex !important;
    align-items: center;
    min-height: 72px;
  }

  .Mobile-bar--bottom {
    position: fixed;
    top: 0;
    right: 0;
    left: auto !important;
    z-index: 10000 !important;
    display: block !important;
    width: 72px;
    height: 72px;
    pointer-events: none;
  }

  .Mobile-bar--bottom [data-nc-container="bottom-left"] {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    pointer-events: auto;
  }

  .Mobile-bar--bottom [data-nc-container="bottom-center"],
  .Mobile-bar--bottom [data-nc-container="bottom-right"] {
    display: none !important;
  }

  .Mobile-bar-menu {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    -webkit-appearance: none;
    appearance: none;
    background-color: transparent;
    background-image: linear-gradient(#5f5f5f, #5f5f5f);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 24px 2.5px;
    visibility: visible !important;
    opacity: 1 !important;
    font-size: 0;
    z-index: 10001;
    transition: background-size .2s ease;
  }

  .Mobile-bar-menu svg {
    display: none !important;
  }

  /* die fixierte Leiste liegt sonst über der Seitenüberschrift der Unterseiten */
  .collection-type-page .Main--page {
    padding-top: 74px;
  }

  .Mobile-bar-menu::before,
  .Mobile-bar-menu::after {
    content: "" !important;
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 24px;
    height: 2.5px;
    background: #5f5f5f;
    transition: transform .3s ease;
  }

  .Mobile-bar-menu::before { transform: translate(-50%, -50%) translateY(-7px); }
  .Mobile-bar-menu::after  { transform: translate(-50%, -50%) translateY(7px); }

  /* offen -> X: mittlere Linie weg, äußere kreuzen sich */
  body.editable-mobile-open .Mobile-bar-menu { background-size: 0 2.5px; }
  body.editable-mobile-open .Mobile-bar-menu::before { transform: translate(-50%, -50%) rotate(45deg); }
  body.editable-mobile-open .Mobile-bar-menu::after  { transform: translate(-50%, -50%) rotate(-45deg); }
}

@media (max-width: 767px) {
  .Index-page--has-image .Index-page-image img {
    height: 110%;
  }
}

/* Team-Seite: mehr Luft zwischen Ärztinnen-Foto und Bio-Text.
   Das quadratische Foto füllt seine col-5 randlos und ragt ~einen Gutter in die
   Textspalte; der Bio-Text startet bündig dahinter → wirkt gequetscht. Fix: nur den
   Text-Block (.sqs-block-html) in der col-5 nach rechts einrücken, sodass der Text
   klar hinter dem Foto beginnt. Nur Desktop (über dem 640px-Stapel-Breakpoint) und
   nur auf die Team-Seite gescopet (Body-ID). Alle anderen Seiten bleiben unberührt; Mobile-Stapel bleibt randlos. */
@media (min-width: 641px) {
  #collection-5cf8c28c5ea0ec0001c65673 .sqs-row .sqs-col-5 .sqs-block-html {
    padding-left: 64px;
  }
}

/* Leistungen-Übersicht (collection-5cf8cb26af4a7800015a886d): die Foto-Kacheln klebten
   randlos aneinander. Bild pro col-4 leicht schmaler + zentriert → kleiner Abstand
   dazwischen (wie im Original). Nur Desktop; Mobile stapelt ohnehin full-width. */
@media (min-width: 641px) {
  #collection-5cf8cb26af4a7800015a886d .sqs-row .sqs-col-4 .sqs-block-image .sqs-image-shape-container-element {
    width: calc(100% - 28px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* Startseite „Rundum versorgt" (collection-5d63b18a...): die Leistungs-/Teaser-Bilder (col-6)
   klebten randlos aneinander → gleicher kleiner Abstand wie auf der Leistungen-Seite. Nur Desktop. */
@media (min-width: 641px) {
  #collection-5d63b18af01963000132b6cc .sqs-row .sqs-col-6 .sqs-block-image .sqs-image-shape-container-element {
    width: calc(100% - 28px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* Vollflächige Bilder (.Index-page--has-image): echter Parallax via background-attachment: fixed.
   main.js setzt das Bild als Hintergrund der .Index-page-image-Fläche + Klasse .editable-bg-fixed
   und blendet das <img> aus. Bild bleibt beim Scrollen „stehen", Inhalt scrollt darüber.
   background-attachment: fixed nur ab Desktop (iOS/Mobile unterstützt es schlecht → dort normal). */
.editable-bg-fixed {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.editable-bg-fixed img {
  display: none !important;
}
@media (min-width: 768px) {
  .editable-bg-fixed {
    background-attachment: fixed;
  }
}

/* Karriere-Seite: CTA-Button lesbar + on-brand machen. Im Static-Export ist die Squarespace-
   Button-Komponenten-CSS nicht geladen → die --primary-Farbe fehlt, sonst weißer Text auf
   hellem Grund. Solider Marken-Blau-Button (nur auf der Karriere-Seite gescopet). */
#collection-karriere .sqs-block-button-element {
  background-color: #0C6E92 !important;
  color: #ffffff !important;
  border: none !important;
}
#collection-karriere .sqs-block-button-element:hover,
#collection-karriere .sqs-block-button-element:focus {
  background-color: #0A5C7A !important;
  color: #ffffff !important;
}

/* ============================================================
   KARRIERE-SEITE — eigenes Design-Layer (nur #collection-karriere).
   Zentriertes Layout statt Squarespace-Float-Grid, Marken-Tokens,
   Benefit-Karten, Steps, gerundete Inline-Bilder, Hero-Scrim.
   ============================================================ */
#collection-karriere {
  --kv-ink: #22323b;
  --kv-ink-soft: #51636c;
  --kv-blue: #0c6e92;
  --kv-blue-2: #1391c0;
  --kv-paper: #f6f9fa;
  --kv-tint: #e7f1f4;
  --kv-line: #dbe6ea;
}
#collection-karriere .Index-page-content { padding: 0 !important; max-width: none !important; }
#collection-karriere .Index-page { overflow: visible; }
#collection-karriere .kv-wrap { max-width: 1120px; margin: 0 auto; padding: 92px 40px; }
#collection-karriere .kv-wrap--narrow { max-width: 760px; }
#collection-karriere .kv-tint { background: var(--kv-tint); }
#collection-karriere .kv-paper { background: var(--kv-paper); }
#collection-karriere .kv-center { text-align: center; }

#collection-karriere .kv-eyebrow { font-family:"Libre Franklin",sans-serif; text-transform:uppercase; letter-spacing:.2em; font-size:.72rem; font-weight:600; color:var(--kv-blue); margin:0 0 .55rem; }
#collection-karriere .kv-h2 { font-family:"Fjalla One",sans-serif; font-weight:400; font-size:clamp(1.9rem,3.6vw,2.6rem); line-height:1.1; color:var(--kv-ink); margin:0 0 1rem; letter-spacing:.01em; }
#collection-karriere .kv-lead { font-family:"Libre Franklin",sans-serif; font-size:1.12rem; line-height:1.75; color:var(--kv-ink-soft); max-width:62ch; margin:0; }
#collection-karriere .kv-center .kv-lead { margin-left:auto; margin-right:auto; }
#collection-karriere .kv-body { font-family:"Libre Franklin",sans-serif; font-size:1rem; line-height:1.7; color:var(--kv-ink-soft); }

/* Hero */
#collection-karriere #karriere-hero { min-height: min(86vh, 740px); display:flex; align-items:center; }
/* Kein Parallax auf dem Karriere-Hero: das Titelbild ist ein flaches Panorama (1920x818).
   Mit background-attachment:fixed ist die Positionierungsflaeche der VIEWPORT, d.h. der
   Beschnitt haengt an der Fensterhoehe und schneidet auf hohen/schmalen Fenstern fast
   alles weg. Als normales Background-Image bezieht sich cover auf die Hero-Sektion selbst,
   damit sitzt der Ausschnitt auf allen Groessen. */
#collection-karriere #karriere-hero .Index-page-image { background-attachment: scroll !important; }
/* Mobil greift background-attachment:fixed ohnehin nicht (erst ab 768px, iOS-Kompat) und
   der Hero ist deutlich hoeher als breit: cover skaliert ueber die Hoehe, es bleiben nur
   ~23% der Bildbreite sichtbar. Auf die Kollegin mit Headset im Vordergrund ausrichten.
   !important, weil main.js die background-position aus dem Focal Point inline setzt. */
@media (max-width: 767px) {
  #collection-karriere #karriere-hero .Index-page-image { background-position: 42% 50% !important; }
}
#collection-karriere #karriere-hero .Index-page-image::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(18,32,40,.34) 0%, rgba(18,32,40,.22) 42%, rgba(18,32,40,.62) 100%); }
#collection-karriere #karriere-hero .Index-page-content { position:relative; z-index:2; width:100%; }
#collection-karriere .kv-hero { max-width:1120px; margin:0 auto; padding:0 40px; text-align:center; color:#fff; }
#collection-karriere .kv-hero .kv-eyebrow { color:#c4e4f1; }
#collection-karriere .kv-hero h1 { font-family:"Fjalla One",sans-serif; font-weight:400; font-size:clamp(2.6rem,6vw,4.4rem); line-height:1.05; margin:.4rem 0 1.1rem; color:#fff; text-shadow:0 2px 26px rgba(10,20,26,.4); }
#collection-karriere .kv-hero p { font-family:"Libre Franklin",sans-serif; font-size:1.25rem; line-height:1.6; color:rgba(255,255,255,.94); margin:0 auto; max-width:46ch; text-shadow:0 1px 14px rgba(10,20,26,.35); }

/* Job-Highlight-Karte */
#collection-karriere .kv-job { background:#fff; border:1px solid var(--kv-line); border-radius:22px; padding:2.6rem 2.2rem; box-shadow:0 22px 60px -38px rgba(18,50,64,.5); text-align:center; max-width:620px; margin:0 auto; }
#collection-karriere .kv-job__role { font-family:"Fjalla One",sans-serif; font-weight:400; font-size:1.85rem; line-height:1.2; color:var(--kv-ink); margin:.1rem 0 .5rem; }
#collection-karriere .kv-job__loc { font-family:"Libre Franklin",sans-serif; color:var(--kv-ink-soft); font-size:.98rem; margin:0; }
#collection-karriere .kv-tags { display:flex; gap:.6rem; justify-content:center; flex-wrap:wrap; margin:1.3rem 0 0; }
#collection-karriere .kv-tag { font-family:"Libre Franklin",sans-serif; font-size:.85rem; font-weight:600; color:var(--kv-blue); background:var(--kv-tint); border-radius:999px; padding:.42rem 1.05rem; }

/* Traits + Benefit-Karten + Steps: gemeinsames Grid */
#collection-karriere .kv-grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:1.3rem; margin-top:2.2rem; }
#collection-karriere .kv-ic { display:flex; align-items:center; justify-content:center; border-radius:14px; background:var(--kv-tint); color:var(--kv-blue); }
#collection-karriere .kv-ic svg { width:26px; height:26px; stroke:currentColor; stroke-width:1.7; fill:none; stroke-linecap:round; stroke-linejoin:round; }

#collection-karriere .kv-trait { text-align:center; padding:.5rem; }
#collection-karriere .kv-trait .kv-ic { width:58px; height:58px; margin:0 auto 1rem; border-radius:16px; }
#collection-karriere .kv-trait p { font-family:"Libre Franklin",sans-serif; color:var(--kv-ink); font-size:1.05rem; line-height:1.5; margin:0; }

#collection-karriere .kv-points { display:grid; gap:1.6rem; margin-top:1.6rem; max-width:720px; }
#collection-karriere .kv-point h3 { font-family:"Fjalla One",sans-serif; font-weight:400; font-size:1.28rem; color:var(--kv-ink); margin:0 0 .35rem; }
#collection-karriere .kv-point p { font-family:"Libre Franklin",sans-serif; font-size:1.02rem; line-height:1.65; color:var(--kv-ink-soft); margin:0; }

#collection-karriere .kv-card { background:#fff; border:1px solid var(--kv-line); border-radius:18px; padding:1.7rem; }
#collection-karriere .kv-card .kv-ic { width:46px; height:46px; margin-bottom:1.1rem; }
#collection-karriere .kv-card h3 { font-family:"Fjalla One",sans-serif; font-weight:400; font-size:1.12rem; color:var(--kv-ink); margin:0 0 .35rem; }
#collection-karriere .kv-card p { font-family:"Libre Franklin",sans-serif; font-size:.95rem; line-height:1.55; color:var(--kv-ink-soft); margin:0; }

#collection-karriere .kv-step { background:#fff; border:1px solid var(--kv-line); border-radius:18px; padding:1.9rem 1.7rem; }
#collection-karriere .kv-step__n { font-family:"Fjalla One",sans-serif; font-size:2.5rem; line-height:1; color:var(--kv-blue-2); }
#collection-karriere .kv-step h3 { font-family:"Fjalla One",sans-serif; font-weight:400; font-size:1.18rem; color:var(--kv-ink); margin:.7rem 0 .35rem; }
#collection-karriere .kv-step p { font-family:"Libre Franklin",sans-serif; font-size:.96rem; line-height:1.55; color:var(--kv-ink-soft); margin:0; }

/* Aufzählungen */
#collection-karriere .kv-list { list-style:none; padding:0; margin:1.5rem 0 0; display:grid; gap:.75rem; max-width:54ch; }
#collection-karriere .kv-center .kv-list { margin-left:auto; margin-right:auto; text-align:left; }
#collection-karriere .kv-list li { position:relative; padding-left:1.9rem; font-family:"Libre Franklin",sans-serif; font-size:1.03rem; line-height:1.5; color:var(--kv-ink); }
#collection-karriere .kv-list li::before { content:""; position:absolute; left:.15rem; top:.5em; width:9px; height:9px; border-radius:999px; background:var(--kv-blue-2); }

/* Inline-Bild (gerundet, nicht vollflächig) */
#collection-karriere .kv-figure { max-width:1120px; margin:0 auto; padding:64px 40px; }
#collection-karriere .kv-figure img { width:100%; height:clamp(280px,42vw,460px); object-fit:cover; border-radius:26px; display:block; box-shadow:0 34px 70px -46px rgba(18,50,64,.55); }

/* CTA */
#collection-karriere .kv-btn { display:inline-block; margin-top:1.7rem; background:var(--kv-blue); color:#fff; font-family:"Libre Franklin",sans-serif; font-weight:600; font-size:1rem; letter-spacing:.02em; padding:1rem 2.5rem; border-radius:999px; text-decoration:none; transition:background .25s ease, transform .25s ease, box-shadow .25s ease; box-shadow:0 16px 34px -18px rgba(12,110,146,.7); }
#collection-karriere .kv-btn:hover { background:#0a5c7a; transform:translateY(-2px); box-shadow:0 20px 40px -18px rgba(12,110,146,.8); }
#collection-karriere .kv-cta__mail { display:block; margin-top:1.7rem; color:var(--kv-blue); font-family:"Libre Franklin",sans-serif; font-size:.98rem; }

@media (prefers-reduced-motion: reduce) { #collection-karriere .kv-btn { transition:none; } #collection-karriere .kv-btn:hover { transform:none; } }
@media (max-width:900px) {
  #collection-karriere .kv-grid-3 { grid-template-columns:1fr; }
  #collection-karriere .kv-wrap { padding:60px 22px; }
  #collection-karriere .kv-figure { padding:40px 22px; }
  #collection-karriere .kv-hero { padding:0 22px; }
}

/* René: keine Abrundungen — Icons, Bilder, Kästen, Buttons, Tags, Listen-Punkte eckig
   (der Rest der Website hat ebenfalls keine gerundeten Ecken). */
#collection-karriere .kv-job,
#collection-karriere .kv-tag,
#collection-karriere .kv-ic,
#collection-karriere .kv-trait .kv-ic,
#collection-karriere .kv-card,
#collection-karriere .kv-card .kv-ic,
#collection-karriere .kv-step,
#collection-karriere .kv-figure img,
#collection-karriere .kv-btn,
#collection-karriere .kv-list li::before { border-radius: 0; }

/* Benefits: 4er-Grid (8 Karten, 2 Reihen) */
#collection-karriere .kv-grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:1.1rem; margin-top:2.2rem; }

/* Text-Bild-Split (Was uns ausmacht / Alltag) */
#collection-karriere .kv-split { display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center; }
#collection-karriere .kv-split--rev .kv-split__media { order:-1; }
#collection-karriere .kv-split__text .kv-h2 { margin-top:.2rem; }
#collection-karriere .kv-split__text .kv-points { margin-top:1.4rem; }
#collection-karriere .kv-split__media { align-self:stretch; min-height:100%; }
#collection-karriere .kv-split__media img { width:100%; height:100%; min-height:360px; object-fit:cover; display:block; }

/* Bewerbungsformular (kurz, eckig, on-brand) */
#collection-karriere .kv-form { max-width:560px; margin:2.2rem auto 0; text-align:left; display:grid; gap:1.15rem; }
#collection-karriere .kv-hp { position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }
#collection-karriere .kv-field { display:grid; gap:.4rem; }
#collection-karriere .kv-field label { font-family:"Libre Franklin",sans-serif; font-size:.92rem; font-weight:600; color:var(--kv-ink); }
#collection-karriere .kv-field .kv-opt { font-weight:400; color:var(--kv-ink-soft); }
#collection-karriere .kv-input { width:100%; font-family:"Libre Franklin",sans-serif; font-size:1rem; color:var(--kv-ink); background:#fff; border:1px solid var(--kv-line); border-radius:0; padding:.8rem .9rem; }
#collection-karriere .kv-input:focus { outline:none; border-color:var(--kv-blue); box-shadow:0 0 0 3px rgba(12,110,146,.18); }
#collection-karriere input[type=file].kv-input { padding:.62rem .9rem; cursor:pointer; }
#collection-karriere .kv-input:disabled { background:#eef2f4; color:var(--kv-ink-soft); }
#collection-karriere .kv-consent { display:grid; grid-template-columns:auto 1fr; gap:.7rem; align-items:start; }
#collection-karriere .kv-consent input { margin-top:.15rem; width:18px; height:18px; accent-color:var(--kv-blue); }
#collection-karriere .kv-consent label { font-family:"Libre Franklin",sans-serif; font-size:.9rem; line-height:1.5; color:var(--kv-ink-soft); }
#collection-karriere .kv-consent a { color:var(--kv-blue); text-decoration:underline; }
#collection-karriere .kv-form .kv-btn { margin-top:.3rem; justify-self:start; border:none; cursor:pointer; font-family:"Libre Franklin",sans-serif; font-size:1rem; font-weight:600; letter-spacing:.02em; }
#collection-karriere .kv-form .kv-btn:disabled { opacity:.55; cursor:default; transform:none; }
#collection-karriere .kv-form__status { font-family:"Libre Franklin",sans-serif; background:var(--kv-tint); border:1px solid var(--kv-line); color:var(--kv-ink); padding:1rem 1.1rem; font-size:1rem; line-height:1.55; }
#collection-karriere .kv-form__alt { margin-top:1.6rem; font-family:"Libre Franklin",sans-serif; font-size:.95rem; color:var(--kv-ink-soft); }
#collection-karriere .kv-form__alt a { color:var(--kv-blue); }

@media (max-width:900px) {
  #collection-karriere .kv-grid-4 { grid-template-columns:repeat(2,1fr); }
  #collection-karriere .kv-split { grid-template-columns:1fr; gap:1.8rem; }
  #collection-karriere .kv-split--rev .kv-split__media { order:0; }
  #collection-karriere .kv-split__media img { min-height:260px; }
}
@media (max-width:560px) {
  #collection-karriere .kv-grid-4 { grid-template-columns:1fr; }
}

/* Mobil (≤640px, gestapelte Spalten): Inhalt symmetrisch machen. Squarespace zieht die
   .sqs-row mit negativen Rändern (-17px) auf und die Bild-Blöcke ragen dadurch rechts über
   den Rand (links Abstand, rechts klebt). Row-Ränder + Spalten-Block-Padding neutralisieren
   → Text UND Bilder sitzen bündig in den 20px-Seitenrändern der Seite. */
@media (max-width: 640px) {
  .Index-page-content .sqs-row,
  .Main-content .sqs-row {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .Index-page-content [class*="sqs-col"] .sqs-block,
  .Main-content [class*="sqs-col"] .sqs-block {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* Befristeter Praxis-Hinweis (z. B. Schließung) in Hero, Footer und Kontakt */
.editable-hinweis {
  max-width: 720px;
  margin: 0.6em 0 1em;
  padding: 12px 16px;
  background: #fff6e5;
  border: 1px solid #efd6a2;
  border-radius: 0;
  color: #4d3a12;
  font-size: 15px;
  line-height: 1.5;
  text-shadow: none;
}

.Footer .editable-hinweis {
  padding: 10px 12px;
  font-size: 13px;
}

/* Zertifikate im Footer */
.Footer-certificates {
  margin-top: 40px;
  padding-top: 32px;
  border-top: 1px solid rgba(255, 255, 255, 0.15);
}

.Footer-certificates-title {
  margin: 0 0 16px;
  color: #fff;
  font-family: "Fjalla One", sans-serif;
  font-size: 14px;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.Footer-certificates-list {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.Footer-certificate {
  display: block;
  width: 280px;
  max-width: 100%;
  padding: 10px 14px;
  background: #fff;
  border-radius: 4px;
}

.Footer-certificate img {
  display: block;
  width: 100%;
  height: auto;
}

.Footer-certificate:focus-visible {
  outline: 2px solid #52c2c8;
  outline-offset: 3px;
}

/* Desktop: Zertifizierung rechts neben Navigation und Sprechzeiten statt in eigener Zeile */
@media (min-width: 1280px) {
  .Footer-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: 48px;
    align-items: start;
  }
  .Footer-inner::before,
  .Footer-inner::after { content: none; }
  .Footer-inner > * { grid-column: 1 / -1; }
  .Footer-inner > .Footer-middle { grid-column: 1; grid-row: 2; }
  .Footer-inner > .Footer-certificates {
    grid-column: 2;
    grid-row: 2;
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
  }
}

/* Leistungsübersicht: Kacheltitel mit zwei Zeilen Platz, damit die Reihen bündig bleiben */
@media (min-width: 768px) {
  #page-5cf8cbe29a33d20001f401d9 .sqs-block-image + .sqs-block-html h3 {
    min-height: 2.8em;
  }
}

/* „Termin buchen“ (Doctolib) in Navigation, Mobile-Menü und Footer. Werte wie .kv-btn der
   Karriere-Seite (Marken-Blau, weiße Schrift), eckig nach René-Vorgabe. Die Footer-Variante
   braucht die höhere Spezifität, weil .Footer-blocks p a Farbe und Unterstrich setzt. */
.editable-termin-btn,
.Footer-blocks .sqs-block-html p a.editable-termin-btn {
  display: inline-block;
  background: #0c6e92;
  color: #fff !important;
  border: 0;
  border-radius: 0;
  padding: 0.7em 1.3em;
  font-family: "Libre Franklin", sans-serif;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1.2;
  text-decoration: none;
  transition: background-color 0.2s ease;
}
.editable-termin-btn:hover,
.Footer-blocks .sqs-block-html p a.editable-termin-btn:hover {
  background: #0a5c7a;
  color: #fff !important;
}
/* zweifarbiger Fokusring: sichtbar auf weißem Header und dunklem Footer */
.editable-termin-btn:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 0;
  box-shadow: 0 0 0 4px #0c6e92;
}
/* site.css setzt Header-nav-items über body:not(…) auf padding 0 links/rechts → gleichziehen */
.Header-nav--secondary .Header-nav-item.editable-termin-btn {
  margin-left: 0.8em;
  padding: 0.618em 1.3em !important;
}
/* Mit dem Button wird der Header unter ~1360px zu breit (Einträge überlappten bei 1152px):
   Schrift und Abstände der Navigation dort verdichten. */
@media (min-width: 1024px) and (max-width: 1359px) {
  .Header--bottom .Header-nav-inner {
    gap: 10px;
  }
  .Header--bottom .Header-nav .Header-nav-item {
    margin: 0 0.45em !important;
    font-size: 14px !important;
    letter-spacing: 0.05em !important;
  }
  .Header--bottom .Header-nav--secondary .Header-nav-item.editable-termin-btn {
    padding: 0.6em 1em !important;
  }
}
/* Mobile-Menü: die Eintragsregel oben setzt alles mit !important, daher hier gleichziehen */
.Mobile-overlay .Mobile-overlay-nav-item.editable-termin-btn {
  display: inline-block !important;
  width: auto !important;
  margin-top: 1.2rem !important;
  padding: 0.8rem 1.4rem !important;
  border-bottom: 0 !important;
  background: #0c6e92 !important;
  color: #fff !important;
}
.Mobile-overlay .Mobile-overlay-nav-item.editable-termin-btn:hover {
  background: #0a5c7a !important;
}
.editable-termin-wrap {
  margin: 0.4em 0 1.6em;
}
/* Im dunklen Footer hebt sich Blau kaum ab (1.95:1) → Türkis-Fläche mit Tinte-Schrift */
.Footer-blocks .sqs-block-html p a.editable-termin-btn {
  background: #52c2c8;
  color: #22323b !important;
}
.Footer-blocks .sqs-block-html p a.editable-termin-btn:hover {
  background: #7fd3d8;
  color: #22323b !important;
}
@media (prefers-reduced-motion: reduce) {
  .editable-termin-btn { transition: none; }
}

/* ===== Hinweisleiste oben (wegklickbar, z. B. Praxisschließung) ===== */
.hinweisleiste {
  position: relative;
  z-index: 1002;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 10px 64px 10px 20px;
  background: #fff6e5;
  border-bottom: 1px solid #efd6a2;
  color: #4d3a12;
  font-family: "Libre Franklin", sans-serif;
  font-size: 15px;
  line-height: 1.45;
  text-align: center;
}

.hinweisleiste__text {
  margin: 0;
}

.hinweisleiste__zu {
  position: absolute;
  top: 50%;
  right: 8px;
  width: 44px;
  height: 44px;
  margin-top: -22px;
  border: 0;
  background: transparent;
  color: #4d3a12;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}

.hinweisleiste__zu:hover {
  background: rgba(77, 58, 18, 0.08);
}

.hinweisleiste__zu:focus-visible {
  outline: 2px solid #4d3a12;
  outline-offset: -4px;
}

html.hinweis-zu .hinweisleiste {
  display: none;
}

/* Mobil sind Logo-Leiste und Menüknopf fixiert: solange die Leiste sichtbar ist, darunter */
@media (max-width: 1023px) {
  .hinweisleiste {
    padding-right: 56px;
    font-size: 14px;
  }

  .Mobile-bar--top,
  .Mobile-bar--bottom {
    top: var(--hinweisleiste-h, 0px) !important;
  }
}
