/* Eigene Anpassungen nach der Migration (Konsistenz/Layout). Wird nach site.css und Seiten-CSS geladen. */

/* Menü: übergeordneten Punkt „Angebot“ auf Unterseiten hervorheben.
   Die Originalregel schließt Links mit „#“ aus – „Angebot“ zeigt auf /#angebot-boxen. */
.ck-header__menu li.current-menu-ancestor > a,
.ck-header__mobile-list li.current-menu-ancestor > a {
  color: var(--color-primary);
  font-weight: 600;
}
.ck-header__menu li.current-menu-ancestor > a:after {
  transform: scaleX(1);
}

/* Abkürzungen wie „MSc“ in Versal-Überschriften nicht in Großbuchstaben setzen */
.nocaps {
  text-transform: none;
}

/* Überschriften ohne ck-heading-Klasse (UA-Default: fett, 1.5em) an die übrigen H2 angleichen */
.layout--page h2.heading-title,
.layout--page .ck-image-text__content h2:not([class]) {
  font-size: var(--h2-size);
  font-weight: var(--h2-weight);
  line-height: var(--h2-lh);
}
.layout--page h3.heading-title {
  font-weight: 500;
}

/* Reine Textabschnitte auf dieselbe Spaltenbreite wie „Text + Button“ (850 px) bringen */
.layout--page .block.sec-text-editor > .con__inner,
.layout--page .block.sec-heading:not(:has(img)) > .con__inner,
.layout--page .block.sec-heading-2 > .con__inner {
  max-width: min(100%, 850px);
}

/* Startseite: Angebots-Raster auf breiten Bildschirmen zentrieren statt links ausrichten */
.layout--page .block.home-page-six-grid {
  margin-inline: auto;
}

@media (min-width: 1025px) {
  /* Bild + Textbox: Box mindestens so hoch wie das Bild */
  .ck-image-text__content {
    align-self: stretch;
  }
}

@media (min-width: 768px) {
  /* Bild fest links neben der Box, oben bündig mit ihr.
     Im Original war das Bild bei langen Boxen (Angebot/Info) um -467 px nach oben versetzt und durch
     overflow:hidden fast ganz abgeschnitten. */
  .ck-image-text__image,
  .ck-bild-textbox-copy-widget .ck-image-text__image {
    align-self: flex-start;
    margin-top: 0;
  }
  /* Bild ragt 100 px in die Box (margin-right:-100px), die Box hat genau 100 px Innenabstand –
     der Text klebte am Bild. 48 px Luft dazu. */
  .ck-image-text__content {
    padding-left: 148px;
  }
}

/* Über mich: Mitgliedschafts-Logos optisch angleichen – ÖBVP und COURAGE haben viel Leerraum in der Bilddatei */
.ck-members__logo-img[alt="ÖBVP Logo"],
.ck-members__logo-img[alt="Courage Logo"] {
  height: 72px !important; /* Original setzt 50px !important */
  width: auto;
}

/* Impressum/Datenschutz: Abstand unter dem Seitentitel (die doppelte Inhalts-Überschrift ist entfallen) */
.layout--page .block.sec-heading-2 {
  padding-top: 48px;
}

/* Kontakt/Notfallkontakte: Telefonnummer auf schmalen Bildschirmen unter den Namen der Stelle setzen */
@media (max-width: 767px) {
  .layout--page li > a[href^="tel:"] {
    display: block;
  }
}

/* Mobiles Menü, Unterpunkte: Trennlinie entfernt – am Inline-Link lief sie bei umbrochenen Einträgen
   mitten durch den Text. Schrift etwas größer (Original 18 px). */
.ck-header__mobile-list .sub-menu li + li a {
  border-top: 0;
}
/* Als Block, damit der Innenabstand auch vertikal greift und umbrochene Einträge sauber getrennt sind */
.ck-header__mobile-list .sub-menu li a {
  display: block;
  padding-top: 10px !important; /* site.css setzt 16px !important */
  padding-bottom: 10px !important;
  font-size: 20px;
  line-height: 28px;
}

/* Lange deutsche Wörter („psychotherapeutischen“, „Themenschwerpunkte“, „Propädeutikum/Bachelor“)
   passten auf schmalen Bildschirmen nicht in die Zeile und liefen seitlich aus der Box bzw. machten
   die Seite seitlich scrollbar. Silbentrennung (lang="de") nur für Wörter, die nicht in ihre Zeile
   passen: main.js packt genau diese in <span class="ck-hy"> – sonst keine Trennstriche im Text.
   Notfalls (ohne JS, vor dem Messen) harter Umbruch per overflow-wrap.
   „anywhere“ statt „break-word“: nur „anywhere“ verkleinert die Mindestbreite (min-content) von
   Flex-Elementen; mit „break-word“ wuchsen Boxen auf die Breite des längsten Wortes und ragten
   über den Bildschirmrand (iOS Safari, v. a. mit größerer Schrift/Display-Zoom).
   -webkit-hyphens für iOS < 17. */
@media (max-width: 767px) {
  .layout--page {
    overflow-wrap: anywhere;
  }
  .ck-hy {
    -webkit-hyphens: auto;
    hyphens: auto;
  }
  /* Nur während main.js misst: lange Wörter nicht umbrechen, damit ihre volle Breite sichtbar ist */
  .ck-hy-measure .layout--page {
    overflow-wrap: normal;
  }
  /* Buttons („Zu den Rahmenbedingungen“) nicht breiter als die Spalte; Text darf umbrechen */
  .ck-btn {
    max-width: 100%;
    padding-inline: 24px;
    text-align: center;
  }
}

/* Sicherheitsnetz: Seite auf dem Handy nie seitlich scrollbar. „clip“ statt „hidden“ – erzeugt
   keinen Scroll-Container (sticky Header bleibt intakt) und greift in iOS Safari auch am body. */
@media (max-width: 767px) {
  html,
  body {
    overflow-x: clip;
  }
}

/* Über mich, Hero: „(Humanistische Therapie)“ auf dem Handy in eigener Zeile unter „Psychotherapeutin“ */
@media (max-width: 767px) {
  .ck-hero__name-sub {
    display: block;
  }
}

/* Selbsterfahrung/Propädeutikum: Textblöcke stecken dort in einem verschachtelten Container
   (con--full ohne con__inner) mit .responsive-padding (32px). Die Regel aus site.css, die diesen
   Innenabstand bei Text-/Bild-Text-Blöcken auf 0 setzt, greift nur bei con > con__inner – daher
   war der Text auf dem Handy weiter eingerückt als auf allen anderen Seiten. */
@media (max-width: 767px) {
  .con--full.responsive-padding:has(
      .ck-text-section,
      .ck-image-text,
      .ck-toggle,
      .ck-members,
      .ck-contact,
      .ck-emergency
    ) {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}