@charset "UTF-8";
/* =========================================================================
   BRUNE PLACES – style.scss

   INHALT
   01  Variablen (Farben, Typo-Skala, Layout)
   02  Reset & Basis
   03  Typografie
   04  Buttons & Links
   05  Header / Navigation
   06  Header-Bausteine (Hero)
   07  Flex-Bausteine
   08  Places
   09  Magazin
   10  Mobile Filter (Places & Magazin)
   11  Travel-Slider
   12  Events
   13  Event-Modal (CF7)
   14  Magazin-Slider
   15  Footer
   16  Scroll-Top-Button
   ========================================================================= */
/* =========================================================================
   01  VARIABLEN
   ========================================================================= */
/* ---------- Typo-Stufen als Mixins ----------
   Größe, Zeilenabstand und Laufweite gehören zusammen und werden deshalb
   immer gemeinsam gesetzt. Änderungen nur hier oben in den Variablen. */
/* =========================================================================
   02  RESET & BASIS
   ========================================================================= */
* {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  box-sizing: border-box;
}
*:focus {
  outline: none !important;
}
html {
  background-color: #F2F2E8;
}
body {
  font-family: tt-commons-pro, sans-serif;
  color: #000;
  font-size: 22px;
  line-height: 1.4;
  letter-spacing: 0.03em;
  max-width: 1920px;
  width: 100%;
  margin: 0 auto;
  background-color: #F2F2E8;
}
img {
  max-width: 100%;
  height: auto;
}
.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
  clear: both;
}
.inner {
  position: relative;
  width: 100%;
  height: 100%;
  max-width: 1600px;
  margin-inline: auto;
  padding-inline: clamp(20px, 3vw, 40px);
}
.innersmall {
  position: relative;
  width: 100%;
  height: 100%;
  max-width: calc(800px + 2 * clamp(20px, 3vw, 40px));
  margin-inline: auto;
  padding-inline: clamp(20px, 3vw, 40px);
}
.innerfulls {
  position: relative;
  width: 100%;
  padding-inline: clamp(20px, 3vw, 40px);
}
.single-magazin .flexible_content > section {
  max-width: calc(665px + 2 * clamp(20px, 3vw, 40px));
  margin-inline: auto;
}
.single-magazin .flexible_content > section.baustein_zitat, .single-magazin .flexible_content section.baustein_events {
  max-width: none;
}
.single-magazin .flexible_content > section.baustein_fsbild {
  padding-inline: clamp(20px, 3vw, 40px);
}
.single-magazin .flexible_content > section.baustein_fsbild .fsbild-frame {
  border-radius: 20px;
}
.single-magazin .flexible_content > section.baustein_fsbild .fsbild-caption {
  padding-inline: 0;
}
.single-magazin .flexible_content > section.baustein_fsvideo {
  padding-inline: clamp(20px, 3vw, 40px);
}
.single-magazin .flexible_content .seesteg-tile {
  height: auto;
  min-height: 0;
  aspect-ratio: 0.75;
}
.single-magazin .flexible_content .content h1, .single-magazin .flexible_content .content h2, .single-magazin .flexible_content .content h3, .single-magazin .flexible_content .content h4 {
  font-size: clamp(24px, 2.4vw, 36px);
  line-height: 1.25;
  letter-spacing: 0;
  margin: clamp(50px, 6vw, 90px) 0 clamp(18px, 2.2vw, 32px);
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  text-transform: none;
  text-align: center;
}
.single-magazin .flexible_content .content h1:first-child, .single-magazin .flexible_content .content h2:first-child, .single-magazin .flexible_content .content h3:first-child, .single-magazin .flexible_content .content h4:first-child {
  margin-top: 0;
}
.absolutecenter {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.border {
  max-width: 1600px;
  height: 2px;
  margin: 0 auto;
  width: calc(100% - 20px);
}
section {
  position: relative;
  padding: 0;
}
@media (max-width: 640px) {
  section {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
}
section img {
  border-radius: 20px;
}
.header_bg {
  margin-bottom: 0;
}
.header_bg img {
  border-radius: 0;
}
/* =========================================================================
   03  TYPOGRAFIE
   ========================================================================= */
h1 {
  margin: 0;
  padding: 0;
  font-family: ivypresto-headline, serif;
  font-size: clamp(24px, 2.4vw, 36px);
  line-height: 1.25;
  letter-spacing: 0;
  font-weight: 300;
}
h2 {
  margin: 0;
  padding: 0;
  font-family: ivypresto-headline, serif;
  font-size: clamp(36px, 4.2vw, 64px);
  line-height: 1.1;
  letter-spacing: 0.01em;
  font-weight: 300;
}
h3 {
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 0.08em;
  font-weight: 400;
  text-transform: uppercase;
}
p {
  font-weight: 500;
}
em {
  color: unset;
}
a {
  color: #000;
  transition: 0.3s ease-out;
}
a:hover {
  text-decoration: none;
  color: #000;
}
.content a {
  text-decoration: underline;
}
.text_klein {
  display: block;
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 0.08em;
}
.text_gross {
  font-size: clamp(24px, 2.4vw, 36px);
  line-height: 1.25;
  letter-spacing: 0;
  font-weight: 300;
}
.text_ganzgross {
  display: block;
  font-size: clamp(40px, 5.3vw, 80px);
  line-height: 0.95;
  letter-spacing: -0.04em;
  font-weight: 300;
}
/* =========================================================================
   04  BUTTONS & LINKS
   ========================================================================= */
.button {
  display: inline-flex;
  align-items: center;
  gap: 20px;
  text-decoration: none !important;
  color: #000;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  cursor: pointer;
}
.button::after {
  content: "";
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  background-image: url("/wp-content/themes/blankslate/assets/images/Pfeil-Icon.svg");
  background-size: contain;
  background-repeat: no-repeat;
  transform: rotate(-45deg);
  transition: transform 0.3s ease;
}
.button:hover::after {
  transform: rotate(0deg);
}
.places-nav-btn, .travel-nav-btn, .magslider-nav-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-left: 10px;
  border-radius: 50%;
  background: #111;
  color: #fff;
  transition: background 0.2s ease, opacity 0.2s ease;
}
.places-nav-btn:hover, .travel-nav-btn:hover, .magslider-nav-btn:hover {
  background: #333;
  color: #fff;
}
.places-nav-btn.uk-invisible, .travel-nav-btn.uk-invisible, .magslider-nav-btn.uk-invisible {
  opacity: 0.35;
  pointer-events: none;
}
.sterne, .michel {
  display: table;
  background-repeat: no-repeat;
  background-position: right top;
}
.sterne {
  background-image: url("/wp-content/themes/blankslate/assets/images/keys.svg");
  background-size: 53px;
  padding-right: 60px;
}
.michel {
  background-image: url("/wp-content/themes/blankslate/assets/images/star.svg");
  background-size: 21px;
  padding-right: 28px;
}
/* =========================================================================
   05  HEADER / NAVIGATION
   ========================================================================= */
header {
  position: fixed;
  width: 100%;
  height: 60px;
  top: 0;
  left: 0;
  z-index: 99;
  background-color: #F2F2E8;
}
header .logo {
  position: absolute;
  top: 16px;
  left: clamp(20px, 3vw, 40px);
  width: 120px;
}
header nav {
  position: absolute;
  right: clamp(20px, 3vw, 40px);
  top: 12px;
}
@media (max-width: 1023px) {
  header nav {
    display: none;
  }
}
header nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
header nav ul li {
  display: inline-block;
}
@media (max-width: 1023px) {
  header nav ul li {
    display: block;
    text-align: center;
  }
}
header nav ul li a {
  display: block;
  color: #000;
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 8px 20px 15px;
  transition: 0.3s ease-out;
}
@media (max-width: 1023px) {
  header nav ul li a {
    border-bottom: 2px solid transparent;
    padding: 14px 20px 15px;
  }
}
header nav ul li a:last-child {
  padding-right: 0;
}
header nav ul li.current-menu-item > a, header nav ul li.current-menu-parent > a, header nav ul li.current-menu-ancestor > a, header nav ul li.current_page_item > a, header nav ul li.current_page_parent > a, header nav ul li.current_page_ancestor > a {
  font-family: ivypresto-headline, serif;
  font-style: italic;
}
@media (max-width: 1023px) {
  header nav.navioffen {
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    inset: 0;
    right: auto;
    top: auto;
    width: 100%;
    height: 100vh;
    z-index: 999;
    background: #fff;
  }
}
header nav.navioffen ul li a {
  font-size: 28px;
  letter-spacing: 0;
  padding: 12px 20px;
}
.mobilebutton {
  position: absolute;
  top: 15px;
  right: clamp(20px, 3vw, 40px);
  width: 44px;
  height: 20px;
  z-index: 1001;
  display: none;
  padding: 0;
  border: 0;
  background: none;
  color: #000;
  cursor: pointer;
}
@media (max-width: 1023px) {
  .mobilebutton {
    display: block;
  }
}
.mobilebutton .icon-close {
  display: none;
}
.mobilebutton.is-open .icon-burger {
  display: none;
}
.mobilebutton.is-open .icon-close {
  display: block;
}
/* =========================================================================
   06  HEADER-BAUSTEINE (HERO)
   ========================================================================= */
.header-item {
  position: relative;
  width: 100%;
}
.header-item.is-full {
  height: 100vh;
  height: 100dvh;
}
.header-media {
  position: relative;
  width: 100%;
  height: 100%;
}
.header-img {
  display: block;
  width: 100%;
}
.header-img--mobile {
  display: none;
}
.header-video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.header-item.is-cover .header-img--desktop {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.header-item.is-cover:not(.is-full) .header-media, .header-item.is-cover:not(.is-full) .header-img--desktop {
  height: auto;
}
.header-item.is-center .header-media {
  display: flex;
  align-items: center;
  justify-content: center;
}
.header-item.is-center .header-img--desktop {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.header-item.is-center:not(.is-full) .header-media {
  height: auto;
}
.header-item.is-center:not(.is-full) .header-img--desktop {
  max-height: none;
}
.header-item.is-split {
  display: flex;
  min-height: 100vh;
  min-height: 100dvh;
}
.header-item.is-split .header-media {
  flex: 0 0 50%;
  max-width: 50%;
  height: auto;
}
.header-item.is-split .header-img--desktop {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.header-item.is-split .header-caption {
  position: static;
  transform: none;
  flex: 0 0 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 40px;
}
.header-item.is-split .header-caption h1, .header-item.is-split .header-caption p {
  color: #111;
}
.header-item.is-split .header-caption h1 {
  font-size: clamp(32px, 3.4vw, 48px);
  letter-spacing: 0;
}
.header-caption {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  text-align: center;
  padding: 0 clamp(20px, 3vw, 40px);
  color: #fff;
}
.header-caption p {
  margin: 0;
  font-weight: 300;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  color: inherit;
}
.header-caption h1 {
  margin: 0;
  font-family: tt-commons-pro, sans-serif;
  font-style: normal;
  font-weight: 300;
  font-size: clamp(56px, 11.9vw, 180px);
  line-height: 0.9;
  letter-spacing: -0.05em;
  color: inherit;
}
.header-caption h1 em, .header-caption h1 i, .header-caption p em, .header-caption p i {
  font-family: ivypresto-headline, serif;
  font-style: italic;
  font-weight: 300;
  letter-spacing: -0.01em;
}
@media (max-width: 767px) {
  .header-item.is-split {
    display: block;
  }
  .header-item.is-split .header-media, .header-item.is-split .header-caption {
    flex: none;
    max-width: 100%;
  }
  .header-item.is-split .header-img--desktop {
    max-width: 100%;
  }
  .header-img--desktop {
    display: none;
  }
  .header-img--mobile {
    display: block;
    width: 100%;
    height: auto;
  }
  .header-item.is-full {
    height: auto;
  }
  .header-item .header-media {
    height: auto;
  }
  .header-caption {
    width: calc(100% - 40px);
  }
}
.uk-slideshow-items .is-split {
  display: flex;
}
@media (max-width: 768px) {
  .uk-slideshow-items .is-split {
    flex-direction: column;
  }
}
.is-split .header-split-img {
  flex: 0 0 50%;
  max-width: 50%;
  height: 100%;
}
.is-split .header-split-cover {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.is-split .caption {
  flex: 0 0 50%;
  max-width: 50%;
  position: static;
  transform: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 40px;
}
.is-split .slidernav {
  display: none;
}
@media (max-width: 768px) {
  .is-split .header-split-img, .is-split .caption {
    flex: 0 0 auto;
    max-width: 100%;
  }
}
/* =========================================================================
   07  FLEX-BAUSTEINE
   ========================================================================= */
/* ---------- Text ---------- */
/* ---------- Zitat ---------- */
.baustein_zitat {
  padding-inline: max(clamp(20px, 3vw, 40px), calc((100% - 1600px) / 2 + clamp(20px, 3vw, 40px)));
  text-align: center;
}
.baustein_zitat .zitat-text {
  margin: 0;
  font-family: ivypresto-headline, serif;
  font-size: clamp(36px, 4.2vw, 64px);
  line-height: 1.1;
  letter-spacing: 0.01em;
  font-weight: 300;
}
.baustein_zitat .zitat-text p {
  margin: 0;
  font-weight: inherit;
}
.baustein_zitat .zitat-text p + p {
  margin-top: 0.4em;
}
.baustein_zitat .zitat-quelle {
  margin: clamp(24px, 3vw, 46px) 0 0;
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
/* ---------- Text + Bild ---------- */
.baustein_text_bild .tb-row {
  align-items: stretch;
}
.baustein_text_bild .tb-image {
  overflow: hidden;
}
.baustein_text_bild .tb-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.baustein_text_bild .tb-text {
  display: flex;
  align-items: center;
  justify-content: center;
}
.baustein_text_bild .tb-text .content {
  width: 100%;
  max-width: 700px;
  padding: 60px;
}
@media (max-width: 680px) {
  .baustein_text_bild .tb-text .content {
    padding: 20px;
  }
}
/* ---------- Text + Slider ---------- */
.baustein_text_slider {
  /* ---------- Dotnav, zentriert unter dem Bild ---------- */
  /* ---------- Textspalte: gleiche Maße wie bei "Text & Bild" ---------- */
}
.baustein_text_slider .ts-row {
  align-items: center;
}
.baustein_text_slider .ts-slider {
  position: relative;
}
.baustein_text_slider .ts-items {
  aspect-ratio: 1 / 1;
  margin: 0;
  padding: 0;
  border-radius: 20px;
  overflow: hidden;
}
.baustein_text_slider .ts-img {
  border-radius: 0;
}
.baustein_text_slider .ts-dots {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}
.baustein_text_slider .ts-dots > * {
  margin: 0;
  padding: 0;
}
.baustein_text_slider .ts-dots > * > * {
  display: block;
  width: 10px;
  height: 10px;
  border: 0;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.22);
  transition: background 0.2s ease;
}
.baustein_text_slider .ts-dots > :hover > * {
  background: rgba(0, 0, 0, 0.45);
}
.baustein_text_slider .ts-dots > .uk-active > * {
  background: #000;
}
.baustein_text_slider .ts-text {
  display: flex;
  align-items: center;
  justify-content: center;
}
.baustein_text_slider .ts-text .content {
  width: 100%;
  max-width: 700px;
  padding: 60px;
}
@media (max-width: 680px) {
  .baustein_text_slider .ts-text .content {
    padding: 20px 0 0;
  }
}
@media (max-width: 959px) {
  .baustein_text_slider .ts-row {
    align-items: stretch;
  }
  .baustein_text_slider .ts-dots {
    margin-top: 18px;
  }
}
/* ---------- Text + Bild (Bild sticky) ---------- */
.tbf-grid {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: 40px;
  padding-inline: max(clamp(20px, 3vw, 40px), calc((100% - 1600px) / 2 + clamp(20px, 3vw, 40px)));
}
@media (min-width: 960px) {
  .tbf-grid {
    grid-template-columns: 1fr 1fr !important;
    align-items: start !important;
  }
}
@media (min-width: 960px) {
  .tbf-col-image {
    align-self: start !important;
    position: sticky;
    top: 60px;
    max-width: 700px;
  }
  .tbf-col-image img {
    display: block;
    width: 100%;
    height: auto;
    max-height: calc(100vh - 60px);
    object-fit: cover;
  }
}
/* ---------- Bild + Bild ---------- */
.baustein_bild_bild .seesteg-tile {
  position: relative;
  overflow: hidden;
  border-radius: 20px;
}
@media (max-width: 959px) {
  .baustein_bild_bild [uk-grid] > div:nth-child(2) {
    display: none;
  }
}
.baustein_bild_bild.is-original .bb-tile--original {
  position: relative;
  display: flex;
  justify-content: center;
}
.baustein_bild_bild.is-original .bb-img {
  display: block;
  width: 100%;
  height: auto;
}
.baustein_bild_bild.is-original .bb-caption {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  padding: 20px 16px 14px;
  color: #fff;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0));
}
.baustein_bild_bild.is-original .bb-caption h3, .baustein_bild_bild.is-original .bb-caption p {
  margin: 0;
  color: #fff;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  font-weight: 300;
  text-transform: none !important;
}
.is-original .uk-grid {
  align-items: center;
}
.seesteg-tile {
  height: 80vh;
  min-height: 500px;
}
.seesteg-tile__caption {
  padding: 30px;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0));
}
.seesteg-tile__caption h3 {
  color: #fff;
  font-size: 14px;
  letter-spacing: 0.03em;
}
.seesteg-tile__caption p {
  color: rgba(255, 255, 255, 0.85);
}
/* ---------- Logoslider ---------- */
.baustein_logoslider .logodiv {
  display: flex;
  align-items: center;
  justify-content: center;
}
.baustein_logoslider .innerteaser {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 0 30px;
}
.baustein_logoslider .logosvg {
  display: block;
  width: 100%;
  height: 100px;
  max-width: 300px;
  object-fit: contain;
}
@media (max-width: 767px) {
  .baustein_logoslider .logosvg {
    height: 50px;
  }
}
.baustein_logoslider .uk-slider-items {
  justify-content: center;
}
@media (max-width: 1599px) {
  .baustein_logoslider .uk-position-center-right-out {
    right: 0;
    left: auto;
  }
  .baustein_logoslider .uk-position-center-left-out {
    left: 0;
    right: auto;
  }
}
/* ---------- Bildleiste (Scroll) ---------- */
.baustein_bildleiste {
  overflow: hidden;
}
.baustein_bildleiste .bl-viewport {
  overflow: hidden;
}
.baustein_bildleiste .bl-track {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 15px;
  padding-inline: max(clamp(20px, 3vw, 40px), calc((100% - 1600px) / 2 + clamp(20px, 3vw, 40px)));
  will-change: transform;
}
.baustein_bildleiste .bl-card {
  flex: 0 0 auto;
  width: clamp(240px, 28vw, 460px);
  margin: 0;
}
@media (max-width: 639px) {
  .baustein_bildleiste .bl-card {
    width: 72vw;
  }
}
.baustein_bildleiste .bl-media {
  border-radius: 14px;
  overflow: hidden;
}
.baustein_bildleiste .bl-img {
  display: block;
  width: 100%;
  aspect-ratio: 0.75;
  object-fit: cover;
  border-radius: 0;
}
.baustein_bildleiste .bl-caption {
  margin-top: 16px;
  font-size: 22px;
  line-height: 1.4;
  letter-spacing: 0.03em;
  color: rgba(0, 0, 0, 0.5);
}
@media (max-width: 639px) {
  .baustein_bildleiste .bl-caption {
    margin-top: 12px;
    font-size: 16px;
  }
}
.baustein_bildleiste.is-static .bl-viewport {
  overflow-x: auto;
  scrollbar-width: none;
}
.baustein_bildleiste.is-static .bl-viewport::-webkit-scrollbar {
  display: none;
}
/* ---------- Text versetzt (Headline links, Text rechts darunter) ---------- */
.baustein_text_versetzt .tv-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(30px, 4vw, 60px);
}
.baustein_text_versetzt .tv-left {
  grid-column: 1;
  grid-row: 1;
}
.baustein_text_versetzt .tv-left p, .baustein_text_versetzt .tv-left h1, .baustein_text_versetzt .tv-left h2 {
  margin: 0;
  font-size: clamp(40px, 5.3vw, 80px);
  line-height: 0.95;
  letter-spacing: -0.04em;
  font-weight: 300;
}
.baustein_text_versetzt .tv-left em, .baustein_text_versetzt .tv-left i {
  font-family: ivypresto-headline, serif;
  font-style: italic;
  font-weight: 300;
  letter-spacing: -0.01em;
}
.baustein_text_versetzt .tv-right {
  grid-column: 2;
  grid-row: 2;
  margin-top: clamp(60px, 9vw, 120px);
  font-size: 22px;
  line-height: 1.4;
  letter-spacing: 0.03em;
}
.baustein_text_versetzt .tv-right p {
  margin: 0 0 1em;
}
.baustein_text_versetzt .tv-right p:last-child {
  margin-bottom: 0;
}
@media (max-width: 767px) {
  .baustein_text_versetzt .tv-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .baustein_text_versetzt .tv-left, .baustein_text_versetzt .tv-right {
    grid-column: 1;
    grid-row: auto;
  }
  .baustein_text_versetzt .tv-right {
    margin-top: 40px;
  }
}
/* ---------- Abschnitte mit Subnavi (z. B. 5 Säulen) ---------- */
.baustein_abschnitte {
  padding-inline: max(clamp(20px, 3vw, 40px), calc((100% - 1600px) / 2 + clamp(20px, 3vw, 40px)));
}
.baustein_abschnitte .ab-head {
  border-top: 1px solid rgba(0, 0, 0, 0.45);
  padding-top: 14px;
  margin-bottom: clamp(80px, 12vw, 180px);
}
.baustein_abschnitte .ab-head-text {
  font-family: ivypresto-headline, serif;
  font-style: italic;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
}
.baustein_abschnitte .ab-layout {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) minmax(0, 3fr);
  column-gap: clamp(30px, 4vw, 60px);
  align-items: start;
}
@media (max-width: 959px) {
  .baustein_abschnitte .ab-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}
.baustein_abschnitte .ab-subnav {
  position: sticky;
  top: 110px;
  align-self: start;
  padding-top: 10px;
}
@media (max-width: 959px) {
  .baustein_abschnitte .ab-subnav {
    display: none;
  }
}
.baustein_abschnitte .ab-subnav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.baustein_abschnitte .ab-subnav li {
  margin: 0;
}
.baustein_abschnitte .ab-subnav a {
  display: block;
  padding: 2px 0;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  color: rgba(0, 0, 0, 0.5);
  text-decoration: none;
  transition: color 0.2s ease;
}
.baustein_abschnitte .ab-subnav a:hover {
  color: #000;
}
.baustein_abschnitte .ab-subnav .uk-active > a {
  color: #000;
}
.baustein_abschnitte .ab-item {
  margin-bottom: clamp(70px, 8vw, 110px);
  scroll-margin-top: 110px;
}
.baustein_abschnitte .ab-item:last-child {
  margin-bottom: 0;
}
.baustein_abschnitte .ab-title {
  margin: 0 0 clamp(24px, 3vw, 50px);
  font-family: ivypresto-headline, serif;
  font-size: clamp(36px, 4.2vw, 64px);
  line-height: 1.1;
  letter-spacing: 0.01em;
  font-weight: 300;
}
.baustein_abschnitte .ab-media {
  margin-bottom: clamp(30px, 4vw, 60px);
  border-radius: 14px;
  overflow: hidden;
}
.baustein_abschnitte .ab-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0;
}
.baustein_abschnitte .ab-text {
  max-width: 640px;
  font-size: 22px;
  line-height: 1.4;
  letter-spacing: 0.03em;
}
.baustein_abschnitte .ab-text p {
  margin: 0 0 0.8em;
}
.baustein_abschnitte .ab-text p:last-child {
  margin-bottom: 0;
}
/* ---------- Spa Anwendungen (Raster + Filter + Modal) ---------- */
.baustein_spa {
  /* ---------- Filterleiste ---------- */
  /* ---------- Raster ---------- */
}
.baustein_spa .spa-head {
  margin: 0 0 clamp(40px, 5vw, 70px);
  font-family: ivypresto-headline, serif;
  font-size: clamp(36px, 4.2vw, 64px);
  line-height: 1.1;
  letter-spacing: 0.01em;
  font-weight: 300;
  text-align: center;
}
.baustein_spa .spa-filter {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px;
  margin: 0 0 clamp(40px, 5vw, 70px);
  padding: 0;
  list-style: none;
}
.baustein_spa .spa-filter > li {
  margin: 0;
}
.baustein_spa .spa-filter > li > a {
  display: block;
  padding: 12px 28px;
  border: 1px solid #000;
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  color: #000;
  white-space: nowrap;
  transition: background 0.25s ease, color 0.25s ease;
}
.baustein_spa .spa-filter > li > a:hover {
  background: rgba(0, 0, 0, 0.06);
}
.baustein_spa .spa-filter > li:first-child {
  flex: 0 0 100%;
  display: flex;
  justify-content: center;
  margin-bottom: 10px;
}
.baustein_spa .spa-filter > li.uk-active > a {
  background: #000;
  color: #F2F2E8;
}
@media (max-width: 639px) {
  .baustein_spa .spa-filter {
    gap: 10px;
  }
  .baustein_spa .spa-filter > li > a {
    padding: 10px 18px;
  }
}
.baustein_spa .spa-grid {
  margin: 0 0 0 calc(-1 * clamp(12px, 2vw, 30px));
  padding: 0;
  list-style: none;
}
.baustein_spa .spa-grid > li {
  margin: 0;
  padding-left: clamp(12px, 2vw, 30px);
}
.baustein_spa .spa-grid > li.uk-grid-margin {
  margin-top: clamp(12px, 2vw, 30px);
}
.baustein_spa .spa-card {
  position: relative;
  display: block;
  text-decoration: none;
}
.baustein_spa .spa-card:hover .spa-card-label {
  background: rgba(0, 0, 0, 0.35);
}
.baustein_spa .spa-card:hover .spa-card-img {
  transform: scale(1.04);
}
.baustein_spa .spa-card-media {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  background: rgba(0, 0, 0, 0.05);
  aspect-ratio: 0.8;
}
.baustein_spa .spa-card-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
  transition: transform 0.5s ease;
}
.baustein_spa .spa-card-label {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 20px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, 0.9);
  color: #fff;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: center;
  transition: background 0.25s ease;
}
@media (max-width: 639px) {
  .baustein_spa .spa-card-media {
    aspect-ratio: 1;
  }
  .baustein_spa .spa-card-label {
    left: 8px;
    right: 8px;
    bottom: 10px;
    padding: 7px 4px;
    font-size: 14px;
    letter-spacing: 0.03em;
    line-height: 1.3;
  }
  .baustein_spa .spa-head {
    margin-bottom: 30px;
  }
  .baustein_spa .spa-filter {
    margin-bottom: 30px;
  }
}
/* ---------- Modal ---------- */
.spa-modal .spa-modal-dialog {
  width: min(1100px, 92vw);
  padding: clamp(40px, 6vw, 90px) clamp(24px, 6vw, 110px);
  background: #fff;
  text-align: center;
}
.spa-modal .uk-modal-close-default {
  color: #000;
}
.spa-modal .spa-modal-title {
  margin: 0;
  font-family: ivypresto-headline, serif;
  font-size: clamp(36px, 4.2vw, 64px);
  line-height: 1.1;
  letter-spacing: 0.01em;
  font-weight: 300;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.spa-modal .spa-modal-sub {
  margin: 14px 0 0;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.5);
}
.spa-modal .spa-modal-line {
  display: block;
  width: 90px;
  height: 1px;
  margin: clamp(26px, 3vw, 40px) auto;
  background: #000;
}
.spa-modal .spa-modal-text {
  max-width: 760px;
  margin-inline: auto;
  font-size: 22px;
  line-height: 1.4;
  letter-spacing: 0.03em;
}
.spa-modal .spa-modal-text p {
  margin: 0 0 1em;
}
.spa-modal .spa-modal-text p:last-child {
  margin-bottom: 0;
}
.spa-modal .spa-modal-meta {
  margin: clamp(26px, 3vw, 40px) 0 0;
  font-size: 22px;
  line-height: 1.4;
  letter-spacing: 0.03em;
  font-weight: 400;
}
/* =========================================================================
   08  PLACES
   ========================================================================= */
.places-filter-bar, .magazin-filter-bar {
  border-top: 1px solid #000;
  padding-top: 5px;
}
.places-page {
  padding-inline: max(clamp(20px, 3vw, 40px), calc((100% - 1600px) / 2 + clamp(20px, 3vw, 40px)));
}
/* ---------- Layout: Subnavi links, Liste rechts ---------- */
.places-layout {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  column-gap: clamp(30px, 4vw, 80px);
  align-items: start;
}
.places-layout--nonav {
  grid-template-columns: minmax(0, 1fr);
}
@media (max-width: 1023px) {
  .places-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}
/* ---------- Subnavi ---------- */
.places-subnav {
  position: sticky;
  top: 110px;
  align-self: start;
}
@media (max-width: 1023px) {
  .places-subnav {
    display: none;
  }
}
.places-subnav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.places-subnav li {
  margin: 0;
}
.places-subnav a {
  display: block;
  padding: 3px 0;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  color: rgba(0, 0, 0, 0.5);
  text-decoration: none;
  transition: color 0.2s ease;
}
.places-subnav a:hover {
  color: #000;
}
.places-subnav .uk-active > a {
  color: #000;
}
/* ---------- Liste ---------- */
.places-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.places-item {
  margin-bottom: 90px;
  scroll-margin-top: 110px;
}
.places-item:last-child {
  margin-bottom: 0;
}
/* ---------- Filterleiste (Desktop) ---------- */
.places-filter-label {
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  font-family: ivypresto-headline, serif !important;
  font-style: italic !important;
}
.places-filter-nav {
  margin: 0;
}
.places-filter-nav > * {
  padding-left: 22px;
}
.places-filter-nav > * > a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #111;
  text-transform: none;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
}
.places-filter-nav > * > a::after {
  content: '';
  width: 11px;
  height: 11px;
  border-radius: 50%;
  border: 1.5px solid #111;
  background: transparent;
  transition: background 0.2s ease;
}
.places-filter-nav > .uk-active > a::after {
  background: #111;
}
/* ---------- Titelzeile + Slider-Navigation ---------- */
.places-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 18px;
}
@media (max-width: 639px) {
  .places-head {
    margin-bottom: 14px;
  }
}
.places-title {
  margin: 0;
  font-family: ivypresto-headline, serif;
  font-size: clamp(36px, 4.2vw, 64px);
  line-height: 1.1;
  letter-spacing: 0.01em;
  font-weight: 300;
}
.places-nav {
  display: flex;
  flex: 0 0 auto;
}
/* ---------- Slider: 1 volles Bild + angeschnittenes zweites ---------- */
.places-slider .uk-slider-items {
  margin: 0;
  padding: 0;
  gap: 15px;
}
.places-slider .uk-slider-items > li {
  width: calc(100% - 100px - 15px);
}
@media (max-width: 639px) {
  .places-slider .uk-slider-items {
    gap: 10px;
  }
  .places-slider .uk-slider-items > li {
    width: calc(100% - 40px);
  }
}
.places-slide-inner {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
}
.places-slide-img {
  display: block;
  width: 100%;
  aspect-ratio: 1.3333333333;
  object-fit: cover;
  border-radius: 0;
}
.places-slide-caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 28px 16px 14px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  color: #fff;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.55), rgba(0, 0, 0, 0));
}
.places-slide-title {
  font-weight: 600;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
}
.places-slide-text {
  font-size: 14px;
  letter-spacing: 0.03em;
  opacity: 0.9;
}
/* ---------- Zwei Spalten – bündig zum ersten (vollen) Bild ---------- */
.places-cols {
  display: grid;
  width: calc(100% - 100px - 15px);
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
  column-gap: 30px;
  margin-top: 30px;
  align-items: start;
}
@media (max-width: 639px) {
  .places-cols {
    width: 100%;
    grid-template-columns: 1fr;
    row-gap: 24px;
    margin-top: 24px;
  }
}
.places-stichpunkte p {
  margin: 0;
  font-size: clamp(24px, 2.4vw, 36px);
  line-height: 1.25;
  letter-spacing: 0;
  font-weight: 300;
}
.places-text {
  font-size: 22px;
  line-height: 1.4;
  letter-spacing: 0.03em;
}
/* =========================================================================
   09  MAGAZIN
   ========================================================================= */
/* ---------- Filterleiste ---------- */
.magazin-filter-label {
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  font-family: ivypresto-headline, serif !important;
  font-style: italic !important;
}
.magazin-filter-nav {
  margin: 0;
}
.magazin-filter-nav > * {
  padding-left: 22px;
}
.magazin-filter-nav > * > a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #111;
  text-transform: none;
  font-size: 16px;
  letter-spacing: 0.03em;
  line-height: 1;
}
.magazin-filter-nav > * > a::after {
  content: '';
  flex: 0 0 auto;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  border: 1.5px solid #111;
  background: transparent;
  transition: background 0.2s ease;
}
.magazin-filter-nav > .uk-active > a::after {
  background: #111;
}
/* ---------- Karten ---------- */
.magazin-card-media {
  display: block;
}
.magazin-card-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 20px;
}
.magazin-card-cat {
  display: block;
  margin: 14px 0 6px;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  color: #111;
}
.magazin-card-title {
  margin: 0 0 10px;
  font-size: 22px;
  letter-spacing: 0.03em;
  font-weight: 300;
  line-height: 1.25;
}
.magazin-card-title a {
  color: #111;
  text-decoration: none;
}
.magazin-card-title a:hover {
  opacity: 0.7;
}
.magazin-card-text {
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
}
.magazin-card-text p {
  margin: 0 0 0.6em;
}
.magazin-card-text p:last-child {
  margin-bottom: 0;
}
/* =========================================================================
   10  MOBILE FILTER (Places & Magazin) – ab unter 1024px
   ========================================================================= */
.mfilter-trigger, .mfilter-panel {
  display: none;
}
@media (max-width: 1023px) {
  .mfilter-desktop {
    display: none !important;
  }
  .mfilter-trigger {
    display: inline-flex;
  }
  .mfilter-panel {
    display: block;
  }
}
/* ---------- Trigger-Pille (fixed unten mittig) ---------- */
.mfilter-trigger {
  position: fixed;
  left: 50%;
  bottom: 20px;
  transform: translate(-50%, 30px);
  z-index: 1010;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-width: min(86vw, 420px);
  background: #fff;
  border: 0;
  border-radius: 999px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.18);
  padding: 16px 22px;
  font-size: 22px;
  letter-spacing: 0.03em;
  color: #111;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.35s ease, transform 0.35s ease;
}
.mfilter-trigger.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, 0);
}
.mfilter-trigger-icon {
  display: inline-flex;
  color: #111;
}
/* ---------- Bottom-Sheet Panel ---------- */
.mfilter-panel {
  position: fixed;
  inset: 0;
  z-index: 1020;
  background: rgba(0, 0, 0, 0.35);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
.mfilter-panel.is-open {
  opacity: 1;
  pointer-events: auto;
}
.mfilter-panel.is-open .mfilter-panel-inner {
  transform: translate(-50%, 0);
}
.mfilter-panel-inner {
  position: absolute;
  left: 50%;
  bottom: 20px;
  transform: translate(-50%, 20px);
  width: min(86vw, 420px);
  background: #fff;
  border-radius: 18px;
  padding: 26px 24px 18px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
  transition: transform 0.3s ease;
}
/* ---------- Optionen als Kreis-Buttons ---------- */
.mfilter-nav {
  margin: 0 0 10px;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.mfilter-nav > * {
  padding-left: 0;
  margin: 0;
  width: auto;
}
.mfilter-nav > * > a {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 18px;
  padding: 10px 0;
  color: #111;
  font-size: 24px;
  letter-spacing: 0;
  text-transform: none;
}
.mfilter-nav > * > a::before {
  content: '';
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  border-radius: 50%;
  border: 1.5px solid #111;
  background: transparent;
  transition: background 0.2s ease;
}
.mfilter-nav > .uk-active > a::before {
  background: #111;
}
.mfilter-panel-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 18px;
  margin-top: 6px;
  border-top: 1px solid #ececec;
  color: #111;
}
.mfilter-panel-foot > span {
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
}
.mfilter-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  color: #111;
}
.mfilter-close svg {
  width: 26px;
  height: 26px;
}
/* =========================================================================
   11  TRAVEL-SLIDER
   ========================================================================= */
.travel-section {
  background: #f2f0e9;
  padding-block: clamp(50px, 6vw, 90px);
  width: 100%;
}
.travel-title {
  font-family: ivypresto-headline, serif;
  font-size: clamp(36px, 4.2vw, 64px);
  line-height: 1.1;
  letter-spacing: 0.01em;
  font-weight: 300;
}
.travel-slider .uk-slider-items > li {
  width: 28%;
}
@media (max-width: 1200px) {
  .travel-slider .uk-slider-items > li {
    width: 33%;
  }
}
@media (max-width: 959px) {
  .travel-slider .uk-slider-items > li {
    width: 45%;
  }
}
@media (max-width: 639px) {
  .travel-slider .uk-slider-items > li {
    width: 72%;
  }
}
.travel-slide-link {
  display: block;
  color: #111;
  text-decoration: none;
}
.travel-slide-link:hover .travel-slide-title {
  opacity: 0.7;
}
.travel-slide-media {
  overflow: hidden;
}
.travel-slide-img {
  display: block;
  width: 100%;
  aspect-ratio: 0.75;
  object-fit: cover;
}
.travel-slide-title {
  display: block;
  margin-top: 14px;
  font-size: 22px;
  letter-spacing: 0.03em;
  line-height: 1.25;
  font-weight: 300;
}
/* =========================================================================
   12  EVENTS
   ========================================================================= */
/* ---------- Linke Karte (nächstes Event) ---------- */
.event-next-card {
  border-radius: 10px;
  padding-bottom: 20px;
}
.event-next-card .text_klein {
  margin-bottom: 0;
}
.event-next-img {
  display: block;
  width: 100%;
  height: auto;
  margin-bottom: 14px;
}
.event-next-title {
  margin: 0 0 16px;
  font-size: clamp(24px, 2.4vw, 36px);
  line-height: 1.25;
  letter-spacing: 0;
  font-weight: 300;
  text-transform: none;
}
/* ---------- Intro-Text (nur Events-Seite) ---------- */
.events-intro {
  padding-left: 200px;
  margin-bottom: clamp(60px, 8vw, 120px);
  font-size: 22px;
  line-height: 1.4;
  letter-spacing: 0.03em;
}
.events-intro p {
  margin: 0 0 1em;
}
.events-intro p:last-child {
  margin-bottom: 0;
}
@media (max-width: 959px) {
  .events-intro {
    padding-left: 0;
    margin-bottom: 50px;
  }
}
/* ---------- Monats-Accordion ---------- */
.events-months {
  margin: 0;
  padding-left: 200px;
}
@media (max-width: 959px) {
  .events-months {
    padding-left: 0;
  }
}
.events-months li {
  margin-top: 0 !important;
}
.event-month-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: ivypresto-headline, serif;
  font-size: clamp(36px, 4.2vw, 64px);
  line-height: 1.1;
  letter-spacing: 0.01em;
  font-weight: 300;
  color: #111;
  padding: 14px 0;
  border-top: 1px solid #111;
}
.event-month-title::before {
  display: none;
}
.event-month-icon {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #111;
  border-radius: 50%;
  transition: transform 0.25s ease;
}
.uk-open > .event-month-title .event-month-icon {
  transform: rotate(180deg);
}
/* ---------- Vorschaubild + Kategorie-Badge ---------- */
.event-media {
  position: relative;
  aspect-ratio: 1;
  border-radius: 14px;
  overflow: hidden;
}
.event-media--next {
  margin-bottom: 24px;
}
.event-media-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
}
.event-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  padding: 2px 14px;
  border-radius: 999px;
  background: #d8d5ab;
  color: #111;
  font-family: ivypresto-headline, serif;
  font-style: italic;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
}
.event-badge--inline {
  position: static;
  display: inline-block;
  margin-bottom: 12px;
}
/* ---------- Event-Zeile ---------- */
.event-row {
  padding: 22px 0;
  border-top: 1px solid #e2e2e2;
}
.event-row:first-child {
  border-top: 0;
}
.event-row-head {
  display: grid;
  grid-template-columns: 230px 1fr;
  gap: 24px;
  align-items: start;
  margin-bottom: 28px;
}
.event-row-head--noimg {
  grid-template-columns: 1fr;
}
@media (max-width: 639px) {
  .event-row-head {
    grid-template-columns: 110px 1fr;
    gap: 16px;
  }
  .event-row-head--noimg {
    grid-template-columns: 1fr;
  }
}
.event-row-title {
  margin: 0 0 16px;
  font-family: tt-commons-pro, sans-serif;
  font-size: clamp(24px, 2.4vw, 36px);
  line-height: 1.25;
  letter-spacing: 0;
  font-weight: 300;
}
@media (max-width: 639px) {
  .event-row-title {
    margin-bottom: 8px;
  }
}
.event-row-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  color: #777;
}
.event-row-desc {
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  margin-bottom: 16px;
}
.event-row-desc p {
  margin: 0 0 0.6em;
}
/* ---------- Anmelden-Button ---------- */
.event-anmeldung-btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  color: #111;
}
.event-anmeldung-btn:hover .event-anmeldung-icon {
  background: #333;
}
.event-anmeldung-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #111;
  color: #fff;
  flex: 0 0 auto;
  transition: background 0.2s ease;
}
/* =========================================================================
   13  EVENT-MODAL (CF7)
   ========================================================================= */
.event-modal-dialog {
  padding: 40px;
  border-radius: 18px;
  max-width: 560px;
  background-color: #E4E3CE;
}
.event-modal-label {
  display: block;
  color: #888;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
}
.event-modal-title {
  display: block;
  font-size: 22px;
  letter-spacing: 0.03em;
  margin-bottom: 18px;
}
.event-modal-when {
  font-size: clamp(24px, 2.4vw, 36px);
  line-height: 1.25;
  letter-spacing: 0;
  margin-bottom: 30px;
}
.event-modal-when span {
  display: block;
}
/* ---------- CF7-Felder als Underline-Inputs ---------- */
.event-modal-form .wpcf7-form-control-wrap {
  display: block;
  margin-bottom: 26px;
}
.event-modal-form input.wpcf7-form-control[type="text"], .event-modal-form input.wpcf7-form-control[type="email"], .event-modal-form select.wpcf7-form-control {
  width: 100%;
  border: 0;
  border-bottom: 1px solid #cfcfcf;
  border-radius: 0;
  padding: 8px 0;
  font-family: inherit;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  color: #000;
  background: transparent;
}
.event-modal-form input::placeholder {
  color: #9a9a9a;
}
.event-modal-form input[type="hidden"] {
  display: none;
}
.event-modal-form select.wpcf7-form-control {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23111' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 2px center;
  padding-right: 24px;
  cursor: pointer;
}
.event-modal-form select.wpcf7-form-control:invalid, .event-modal-form select.wpcf7-form-control option[value=""] {
  color: #9a9a9a;
}
.event-modal-form form {
  position: relative;
  padding-bottom: 90px;
}
.event-modal-form .wpcf7-not-valid-tip {
  display: block;
  margin-top: 6px;
  color: #d33;
  font-size: 14px;
  line-height: 1.3;
}
.event-modal-form .wpcf7-not-valid {
  border-bottom-color: #d33 !important;
}
.event-modal-form .wpcf7-response-output {
  order: 99;
  margin: 20px 0 0;
  padding: 12px 16px;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.4;
}
.event-modal-form form.invalid .wpcf7-response-output, .event-modal-form form.unaccepted .wpcf7-response-output {
  border: 1px solid #e0b400;
  background: #fdf6e3;
  color: #7a5c00;
}
.event-modal-form form.sent .wpcf7-response-output {
  border: 1px solid #3a9d3a;
  background: #eef8ee;
  color: #256d25;
}
.wpcf7-spinner, .event-submit-icon {
  display: none;
}
/* ---------- Absenden-Button (Pfeil) ---------- */
.wpcf7-submit-btn {
  position: absolute;
  bottom: 25px;
  right: 40px;
  display: inline-flex;
  align-items: center;
  gap: 20px;
  background: none;
  border: 0;
  padding: 0;
  text-decoration: none !important;
  color: #000;
  font-size: 22px;
  letter-spacing: 0.03em;
  cursor: pointer;
}
.wpcf7-submit-btn::after {
  content: "";
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  background-image: url("/wp-content/themes/blankslate/assets/images/Pfeil-Icon.svg");
  background-size: contain;
  background-repeat: no-repeat;
  transform: rotate(-45deg);
  transition: transform 0.3s ease;
}
.wpcf7-submit-btn:hover::after {
  transform: rotate(0deg);
}
/* ---------- Abbrechen-Button (X im Kreis) ---------- */
.event-cancel {
  position: absolute;
  bottom: 25px;
  left: 0;
  display: inline-flex;
  align-items: center;
  gap: 20px;
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  color: #000;
  font-size: 22px;
  letter-spacing: 0.03em;
  cursor: pointer;
  text-decoration: none;
}
.event-form-actions {
  display: flex;
  align-items: center;
}
.event-submit-wrap {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
/* ---------- Mobil: Buttons übereinander ---------- */
@media (max-width: 639px) {
  .event-modal-dialog {
    padding: 30px 24px;
  }
  .event-modal-form form {
    padding-bottom: 150px;
  }
  .wpcf7-submit-btn {
    right: 0;
    bottom: 25px;
    gap: 14px;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0.03em;
  }
  .wpcf7-submit-btn::after {
    width: 34px;
    height: 34px;
  }
  .event-cancel {
    left: 24px;
    bottom: 105px;
    gap: 14px;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0.03em;
  }
}
/* =========================================================================
   14  MAGAZIN-SLIDER
   ========================================================================= */
.magslider-section {
  padding-block: clamp(50px, 6vw, 90px);
  background-color: #f2f0e9;
}
.magslider-title {
  font-family: ivypresto-headline, serif;
  font-size: clamp(36px, 4.2vw, 64px);
  line-height: 1.1;
  letter-spacing: 0.01em;
  font-weight: 300;
}
.magslider .uk-slider-items > li {
  width: 28%;
}
@media (max-width: 1200px) {
  .magslider .uk-slider-items > li {
    width: 33%;
  }
}
@media (max-width: 959px) {
  .magslider .uk-slider-items > li {
    width: 45%;
  }
}
@media (max-width: 639px) {
  .magslider .uk-slider-items > li {
    width: 72%;
  }
}
.magslider-slide-link {
  display: block;
  color: #111;
  text-decoration: none;
}
.magslider-slide-link:hover .magslider-slide-title {
  opacity: 0.7;
}
.magslider-slide-media {
  overflow: hidden;
}
.magslider-slide-img {
  display: block;
  width: 100%;
  aspect-ratio: 0.75;
  object-fit: cover;
}
.magslider-slide-cat {
  display: block;
  margin-top: 14px;
  font-size: 14px;
  letter-spacing: 0.03em;
  color: #111;
}
.magslider-slide-title {
  display: block;
  margin-top: 4px;
  font-size: 22px;
  letter-spacing: 0.03em;
  line-height: 1.25;
  font-weight: 300;
}
/* ---------- Events-Slider ("Events Before") ---------- */
.evslider-section {
  background-color: transparent;
}
.evslider .evslider-slide-media {
  border-radius: 20px;
  overflow: hidden;
}
.evslider .evslider-slide-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0;
}
.evslider .magslider-slide-title {
  margin-top: 18px;
}
.evslider .evslider-slide-text {
  margin-top: 10px;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
}
.evslider .evslider-slide-text p {
  margin: 0 0 0.6em;
}
.evslider .evslider-slide-text p:last-child {
  margin-bottom: 0;
}
.evslider .uk-slider-items {
  align-items: flex-start;
}
/* =========================================================================
   15  FOOTER
   ========================================================================= */
footer {
  background-color: #E4E3CE;
  padding-block: clamp(80px, 9vw, 140px) clamp(60px, 6vw, 100px);
}
footer a {
  text-decoration: none;
}
footer p {
  margin: 0;
}
/* ---------- Oben: Job-Teaser links, Newsletter rechts ---------- */
.footer-top {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(40px, 8vw, 160px);
  row-gap: 80px;
  align-items: start;
}
@media (max-width: 959px) {
  .footer-top {
    grid-template-columns: minmax(0, 1fr);
  }
}
.footer-headline {
  display: block;
  margin: 0 0 30px;
  font-size: clamp(24px, 2.4vw, 36px);
  line-height: 1.25;
  letter-spacing: 0;
  font-weight: 300;
}
/* ---------- Newsletter (CleverReach) ---------- */
.footer-nl .cr_form-input {
  display: block;
  width: 100%;
  height: 50px;
  margin: 0;
  padding: 0;
  border: 0;
  border-bottom: 1px solid #000;
  border-radius: 0;
  background: transparent;
  font-family: inherit;
  font-size: 22px;
  letter-spacing: 0.03em;
  color: #000;
}
.footer-nl .cr_form-input::placeholder {
  color: rgba(0, 0, 0, 0.65);
}
.footer-nl .cr_form-input.clever_form_error {
  border-bottom-color: #d33;
}
.footer-nl .cr_ipe_item label {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin-top: 16px;
  font-size: 14px;
  line-height: 20px;
  opacity: 0.6;
}
.footer-nl .cr_ipe_item label input {
  flex: 0 0 auto;
  margin-top: 3px;
}
.footer-nl .cr_ipe_item.clever_form_error label {
  opacity: 1;
  color: #d33;
}
.footer-nl .clever_form_note {
  margin-top: 8px;
  font-size: 14px;
  color: #d33;
}
.footer-nl .wpcf7-submit-btn {
  position: static;
  margin-top: 30px;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
}
/* ---------- Unten: Adresse + Links ---------- */
.footer-bottom {
  margin-top: clamp(120px, 16vw, 300px);
}
@media (max-width: 959px) {
  .footer-bottom {
    margin-top: 100px;
  }
}
.footer-address {
  font-size: 22px;
  line-height: 1.4;
  letter-spacing: 0.03em;
}
.footer-address p + p {
  margin-top: 1.5em;
}
.footer-links {
  display: grid;
  grid-template-columns: repeat(2, max-content);
  column-gap: clamp(60px, 10vw, 170px);
  margin-top: 60px;
}
.footer-links ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.footer-links li a {
  display: inline-block;
  padding: 2px 0;
  font-size: 22px;
  line-height: 1.4;
  letter-spacing: 0.03em;
}
.footer-links li a:hover {
  opacity: 0.6;
}
/* =========================================================================
   16  SCROLL-TOP-BUTTON
   ========================================================================= */
.scroll-top {
  position: fixed;
  right: 30px;
  bottom: 30px;
  z-index: 990;
  width: 60px;
  height: 60px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #ed6a2e;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity 0.4s ease, transform 0.4s ease, visibility 0s linear 0.4s;
}
.scroll-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition: opacity 0.4s ease, transform 0.4s ease, visibility 0s;
}
.scroll-top:hover, .scroll-top:focus-visible {
  background: #e85714;
}
@media (prefers-reduced-motion: reduce) {
  .scroll-top {
    transition: none;
  }
}
/* ---------- Fullscreen Bild mit Text ---------- */
.baustein_fsbild {
  /* Text oben links über dem Bild */
  /* Mobil: Bild hochkant zuschneiden, damit der Text Platz hat */
}
.baustein_fsbild .fsbild-frame {
  position: relative;
  overflow: hidden;
}
.baustein_fsbild .fsbild-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0;
}
.baustein_fsbild .fsbild-caption {
  position: absolute;
  inset: 0 0 auto 0;
  z-index: 2;
  padding-inline: max(clamp(20px, 3vw, 40px), calc((100% - 1600px) / 2 + clamp(20px, 3vw, 40px)));
  padding-top: clamp(40px, 6vw, 90px);
  color: #fff;
}
.baustein_fsbild .fsbild-caption > * {
  max-width: min(620px, 100%);
}
.baustein_fsbild .fsbild-caption h2, .baustein_fsbild .fsbild-caption h1 {
  margin: 0 0 0.5em;
  font-size: clamp(36px, 4.2vw, 64px);
  line-height: 1.1;
  letter-spacing: 0.01em;
  color: #fff;
}
.baustein_fsbild .fsbild-caption h3 {
  margin: 0 0 1.2em;
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 0.08em;
  color: #fff;
}
.baustein_fsbild .fsbild-caption p {
  font-size: 22px;
  line-height: 1.4;
  letter-spacing: 0.03em;
  margin: 0 0 0.8em;
}
.baustein_fsbild .fsbild-caption em, .baustein_fsbild .fsbild-caption i {
  font-family: ivypresto-headline, serif;
  font-style: italic;
  font-weight: 300;
  letter-spacing: -0.01em;
}
.baustein_fsbild .fsbild-caption .button {
  margin-top: 1.5em;
  color: #fff;
}
.baustein_fsbild .fsbild-caption .button::after {
  filter: invert(1);
}
.baustein_fsbild .fsbild-caption a {
  color: #fff;
}
@media (max-width: 767px) {
  .baustein_fsbild .fsbild-caption {
    padding-top: 40px;
  }
  .baustein_fsbild .fsbild-img {
    aspect-ratio: 0.75;
    object-fit: cover;
  }
}
/* ---------- Beitragsteaser ---------- */
.baustein_beitragsteaser .bt-head {
  margin-bottom: clamp(30px, 4vw, 60px);
}
.baustein_beitragsteaser .bt-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: clamp(20px, 2.5vw, 40px);
  row-gap: 60px;
  align-items: start;
}
@media (max-width: 959px) {
  .baustein_beitragsteaser .bt-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 639px) {
  .baustein_beitragsteaser .bt-grid {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 40px;
  }
}
.baustein_beitragsteaser .bt-card-link {
  display: block;
  color: #000;
  text-decoration: none;
}
.baustein_beitragsteaser .bt-card-link:hover .bt-title {
  opacity: 0.7;
}
.baustein_beitragsteaser .bt-media {
  border-radius: 20px;
  overflow: hidden;
}
.baustein_beitragsteaser .bt-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0;
}
.baustein_beitragsteaser .bt-title {
  margin: 20px 0 14px;
  font-size: 22px;
  letter-spacing: 0.03em;
  line-height: 1.25;
  font-weight: 300;
  text-transform: none;
}
.baustein_beitragsteaser .bt-text {
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
}
.baustein_beitragsteaser .bt-text p {
  margin: 0 0 0.6em;
}
.baustein_beitragsteaser .bt-text p:last-child {
  margin-bottom: 0;
}
/* ---------- Event-Teaser (Startseite, fest unten rechts) ---------- */
.event-teaser {
  position: fixed;
  right: 80px;
  bottom: 80px;
  z-index: 980;
  width: 295px;
  padding: 24px;
  border-radius: 20px;
  background: #ed6a2e;
  color: #fff;
  opacity: 0;
  visibility: hidden;
  transform: translateY(14px);
  transition: opacity 0.45s ease, transform 0.45s ease, visibility 0s linear 0.45s;
}
.event-teaser.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition: opacity 0.45s ease, transform 0.45s ease, visibility 0s;
}
@media (prefers-reduced-motion: reduce) {
  .event-teaser {
    transition: none;
  }
}
.event-teaser .event-teaser-close {
  position: absolute;
  top: 14px;
  right: 14px;
  display: inline-flex;
  padding: 4px;
  border: 0;
  background: none;
  color: #fff;
  cursor: pointer;
  opacity: 0.9;
  transition: opacity 0.2s ease;
}
.event-teaser .event-teaser-close:hover {
  opacity: 1;
}
.event-teaser .event-teaser-label {
  display: block;
  margin: 22px 0 18px;
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55);
}
.event-teaser .event-teaser-title {
  margin: 0 0 clamp(40px, 7vw, 70px);
  font-size: 22px;
  letter-spacing: 0.03em;
  line-height: 1.25;
  font-weight: 300;
}
.event-teaser .event-teaser-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  color: #fff;
  text-decoration: none;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
}
.event-teaser .event-teaser-link:hover {
  color: #fff;
}
.event-teaser .event-teaser-link:hover .event-teaser-icon {
  transform: translate(2px, -2px);
}
.event-teaser .event-teaser-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #fff;
  color: #ed6a2e;
  transition: transform 0.25s ease;
}
@media (max-width: 767px) {
  .event-teaser {
    right: 20px;
    bottom: 20px;
    width: calc(100% - 40px);
    max-width: 295px;
  }
}
/* ---------- Events als Flex-Baustein ---------- */
.baustein_events .events-block-head {
  margin: 0 0 clamp(30px, 4vw, 60px);
  font-family: ivypresto-headline, serif;
  font-size: clamp(36px, 4.2vw, 64px);
  line-height: 1.1;
  letter-spacing: 0.01em;
  font-weight: 300;
}
.ts-items > * {
  transition-duration: 1.4s !important;
}
/* =========================================================================
   HERO (Flexible Content "header_flex")

   Layouts:
     .hero-item--medium      Bild/Video vollflächig, Text optional darüber
     .hero-item--text        nur Text auf Hintergrundfarbe
     .hero-item--text-bild   Text + gerundetes Bild nebeneinander
     .hero-item--split       Bild + Text je zur Hälfte, randlos

   Einrückung: alles am Seitenraster ($inset bzw. .inner), also bündig zum Logo.

   Modifier:
     is-cover / is-original      Bild formatfüllend oder in Originalproportion
     is-full                     volle Fensterhöhe
     pos-unten-links / pos-mitte / pos-unten-rechts    Overlay-Textposition
     img-links / img-rechts      Bildseite
     align-links / align-mitte   Textausrichtung
     v-oben / v-mitte            vertikale Ausrichtung der Spalten
     text-m / text-l / text-xl   Textgröße (36 / 80 / 180)
     color-hell / color-dunkel   Textfarbe im Overlay
   ========================================================================= */
.hero {
  position: relative;
}
.hero img {
  border-radius: 0;
}
.hero-item {
  position: relative;
  width: 100%;
}
.hero-item.is-full {
  min-height: 100vh;
  min-height: 100dvh;
}
@media (max-width: 767px) {
  .hero-item.is-full {
    min-height: 0;
  }
}
/* ---------- Medien ---------- */
.hero-media {
  position: relative;
  width: 100%;
  height: 100%;
}
.hero-img {
  display: block;
  width: 100%;
  height: auto;
}
.hero-img--mobile {
  display: none;
}
@media (max-width: 767px) {
  .hero-img--desktop {
    display: none;
  }
  .hero-img--mobile {
    display: block;
  }
}
.hero-video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* ---------- Textblock ---------- */
.hero-text h1, .hero-text h2, .hero-text p {
  margin: 0;
  font-family: tt-commons-pro, sans-serif;
  font-style: normal;
  font-weight: 300;
}
.hero-text h1 + p, .hero-text h2 + p, .hero-text p + p {
  margin-top: 0.6em;
}
.hero-text em, .hero-text i, .hero-text h1 em, .hero-text h1 i, .hero-text h2 em, .hero-text h2 i, .hero-text p em, .hero-text p i {
  font-family: ivypresto-headline, serif;
  font-style: italic;
  font-weight: 300;
  letter-spacing: -0.01em;
}
.hero-item.text-m .hero-text h1, .hero-item.text-m .hero-text h2, .hero-item.text-m .hero-text p {
  font-size: clamp(24px, 2.4vw, 36px);
  line-height: 1.25;
  letter-spacing: 0;
}
.hero-item.text-l .hero-text h1, .hero-item.text-l .hero-text h2, .hero-item.text-l .hero-text p {
  font-size: clamp(40px, 5.3vw, 80px);
  line-height: 0.95;
  letter-spacing: -0.04em;
}
.hero-item.text-xl .hero-text h1, .hero-item.text-xl .hero-text h2, .hero-item.text-xl .hero-text p {
  font-size: clamp(56px, 11.9vw, 180px);
  line-height: 0.9;
  letter-spacing: -0.05em;
}
.hero-item.text-m .hero-text h1 ~ p, .hero-item.text-m .hero-text h2 ~ p, .hero-item.text-l .hero-text h1 ~ p, .hero-item.text-l .hero-text h2 ~ p, .hero-item.text-xl .hero-text h1 ~ p, .hero-item.text-xl .hero-text h2 ~ p {
  margin-top: 1.2em;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  font-weight: 500;
}
/* =========================================================================
   1  Vollflächiges Bild oder Video
   ========================================================================= */
.hero-item--medium {
  /* ---------- Text über dem Bild: am Raster, bündig zum Logo ---------- */
}
.hero-item--medium.is-cover .hero-img, .hero-item--medium.is-cover .hero-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero-item--medium.is-cover.is-full .hero-media {
  position: absolute;
  inset: 0;
}
.hero-item--medium.is-original .hero-media {
  display: flex;
  align-items: center;
  justify-content: center;
}
.hero-item--medium.is-original .hero-img {
  width: auto;
  max-width: 100%;
  height: auto;
}
.hero-item--medium .hero-text--overlay {
  position: absolute;
  left: 0;
  right: 0;
  z-index: 2;
  padding-inline: max(clamp(20px, 3vw, 40px), calc((100% - 1600px) / 2 + clamp(20px, 3vw, 40px)));
}
.hero-item--medium .hero-text--overlay > * {
  max-width: min(1100px, 100%);
}
.hero-item--medium.pos-unten-links .hero-text--overlay {
  bottom: 0;
  padding-bottom: clamp(30px, 5vw, 80px);
}
.hero-item--medium.pos-unten-rechts .hero-text--overlay {
  bottom: 0;
  padding-bottom: clamp(30px, 5vw, 80px);
  text-align: right;
}
.hero-item--medium.pos-unten-rechts .hero-text--overlay > * {
  margin-left: auto;
}
.hero-item--medium.pos-mitte .hero-text--overlay {
  top: 50%;
  transform: translateY(-50%);
  text-align: center;
}
.hero-item--medium.pos-mitte .hero-text--overlay > * {
  margin-inline: auto;
}
.hero-item--medium.color-hell .hero-text--overlay {
  color: #fff;
}
.hero-item--medium.color-dunkel .hero-text--overlay {
  color: #000;
}
/* =========================================================================
   2  Nur Text  (Markup enthält .inner)
   ========================================================================= */
.hero-item--text {
  padding-block: clamp(60px, 9vw, 140px);
}
.hero-item--text.is-full {
  display: flex;
  padding-top: 110px;
}
.hero-item--text.is-full > .inner {
  width: 100%;
  height: auto;
}
.hero-item--text.is-full.v-oben {
  align-items: flex-start;
}
.hero-item--text.is-full.v-mitte {
  align-items: center;
}
.hero-item--text.is-full.v-unten {
  align-items: flex-end;
}
.hero-item--text.align-mitte {
  text-align: center;
}
.hero-item--text.align-mitte .hero-text {
  margin-inline: auto;
}
.hero-item--text.align-rechts {
  text-align: right;
}
.hero-item--text.align-rechts .hero-text {
  margin-left: auto;
}
.hero-item--text .hero-text {
  max-width: 60ch;
}
.hero-item--text.text-m .hero-text {
  max-width: 40ch;
}
@media (max-width: 767px) {
  .hero-item--text .hero-text, .hero-item--text.text-m .hero-text {
    max-width: none;
  }
}
/* =========================================================================
   3  Text + Bild nebeneinander  (Markup enthält .inner)
   ========================================================================= */
.hero-item--text-bild {
  padding-block: clamp(40px, 6vw, 90px);
}
.hero-item--text-bild .hero-cols {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(30px, 5vw, 90px);
  align-items: center;
}
.hero-item--text-bild.v-oben .hero-cols {
  align-items: start;
}
.hero-item--text-bild.img-links .hero-col-media {
  grid-column: 1;
  grid-row: 1;
}
.hero-item--text-bild.img-links .hero-col-text {
  grid-column: 2;
  grid-row: 1;
}
.hero-item--text-bild.img-rechts .hero-col-text {
  grid-column: 1;
  grid-row: 1;
}
.hero-item--text-bild.img-rechts .hero-col-media {
  grid-column: 2;
  grid-row: 1;
}
.hero-item--text-bild.align-mitte .hero-col-text {
  text-align: center;
}
.hero-item--text-bild .hero-media--framed {
  border-radius: 20px;
  overflow: hidden;
}
.hero-item--text-bild .hero-media--framed .hero-img {
  width: 100%;
  height: auto;
}
@media (max-width: 767px) {
  .hero-item--text-bild .hero-cols {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 30px;
  }
  .hero-item--text-bild.img-links .hero-col-media, .hero-item--text-bild.img-rechts .hero-col-media {
    grid-column: 1;
    grid-row: 1;
  }
  .hero-item--text-bild.img-links .hero-col-text, .hero-item--text-bild.img-rechts .hero-col-text {
    grid-column: 1;
    grid-row: 2;
  }
  .hero-item--text-bild.align-mitte .hero-col-text {
    text-align: left;
  }
}
/* =========================================================================
   4  Split: je zur Hälfte, randlos
   ========================================================================= */
.hero-item--split {
  display: flex;
  align-items: stretch;
}
.hero-item--split .hero-media, .hero-item--split .hero-text {
  flex: 0 0 50%;
  max-width: 50%;
}
.hero-item--split .hero-media {
  overflow: hidden;
}
.hero-item--split .hero-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero-item--split .hero-text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(30px, 5vw, 80px);
}
.hero-item--split.img-rechts .hero-media {
  order: 2;
}
.hero-item--split.img-rechts .hero-text {
  order: 1;
}
@media (max-width: 767px) {
  .hero-item--split {
    display: block;
  }
  .hero-item--split .hero-media, .hero-item--split .hero-text {
    max-width: 100%;
  }
  .hero-item--split .hero-img {
    height: auto;
  }
}
/* =========================================================================
   5  Nur Text, ohne Bild  (is-textonly)

   Greift, wenn das Template den Kopfbereich ohne Medium einbindet:
     get_template_part( 'parts/hero', null, array( 'media' => false ) );
   Gilt für den neuen Flexible Content ebenso wie für den alten Repeater.
   ========================================================================= */
body.single-magazin .header-item, body.single-magazin .hero-item, .hero-item.is-textonly, .header-item.is-textonly {
  display: block;
  min-height: 0;
  height: auto;
  padding-block: clamp(90px, 16vw, 260px) clamp(60px, 10vw, 160px);
  padding-inline: max(clamp(20px, 3vw, 40px), calc((100% - 1600px) / 2 + clamp(20px, 3vw, 40px)));
  text-align: center;
}
body.single-magazin .header-item .hero-media, body.single-magazin .header-item .header-media, body.single-magazin .hero-item .hero-media, body.single-magazin .hero-item .header-media, .hero-item.is-textonly .hero-media, .hero-item.is-textonly .header-media, .header-item.is-textonly .hero-media, .header-item.is-textonly .header-media {
  display: none;
}
body.single-magazin .header-item .hero-text--overlay, body.single-magazin .header-item .header-caption, body.single-magazin .hero-item .hero-text--overlay, body.single-magazin .hero-item .header-caption, .hero-item.is-textonly .hero-text--overlay, .hero-item.is-textonly .header-caption, .header-item.is-textonly .hero-text--overlay, .header-item.is-textonly .header-caption {
  position: static;
  transform: none;
  inset: auto;
  width: 100%;
  max-width: none;
  padding: 0;
  color: #000;
}
body.single-magazin .header-item .hero-text--overlay > *, body.single-magazin .header-item .header-caption > *, body.single-magazin .hero-item .hero-text--overlay > *, body.single-magazin .hero-item .header-caption > *, .hero-item.is-textonly .hero-text--overlay > *, .hero-item.is-textonly .header-caption > *, .header-item.is-textonly .hero-text--overlay > *, .header-item.is-textonly .header-caption > * {
  margin-inline: auto;
}
body.single-magazin .header-item .hero-text--overlay h1, body.single-magazin .header-item .hero-text--overlay h2, body.single-magazin .header-item .hero-text--overlay h3, body.single-magazin .header-item .hero-text--overlay p, body.single-magazin .header-item .hero-text--overlay a, body.single-magazin .header-item .hero-text--overlay span, body.single-magazin .header-item .header-caption h1, body.single-magazin .header-item .header-caption h2, body.single-magazin .header-item .header-caption h3, body.single-magazin .header-item .header-caption p, body.single-magazin .header-item .header-caption a, body.single-magazin .header-item .header-caption span, body.single-magazin .hero-item .hero-text--overlay h1, body.single-magazin .hero-item .hero-text--overlay h2, body.single-magazin .hero-item .hero-text--overlay h3, body.single-magazin .hero-item .hero-text--overlay p, body.single-magazin .hero-item .hero-text--overlay a, body.single-magazin .hero-item .hero-text--overlay span, body.single-magazin .hero-item .header-caption h1, body.single-magazin .hero-item .header-caption h2, body.single-magazin .hero-item .header-caption h3, body.single-magazin .hero-item .header-caption p, body.single-magazin .hero-item .header-caption a, body.single-magazin .hero-item .header-caption span, .hero-item.is-textonly .hero-text--overlay h1, .hero-item.is-textonly .hero-text--overlay h2, .hero-item.is-textonly .hero-text--overlay h3, .hero-item.is-textonly .hero-text--overlay p, .hero-item.is-textonly .hero-text--overlay a, .hero-item.is-textonly .hero-text--overlay span, .hero-item.is-textonly .header-caption h1, .hero-item.is-textonly .header-caption h2, .hero-item.is-textonly .header-caption h3, .hero-item.is-textonly .header-caption p, .hero-item.is-textonly .header-caption a, .hero-item.is-textonly .header-caption span, .header-item.is-textonly .hero-text--overlay h1, .header-item.is-textonly .hero-text--overlay h2, .header-item.is-textonly .hero-text--overlay h3, .header-item.is-textonly .hero-text--overlay p, .header-item.is-textonly .hero-text--overlay a, .header-item.is-textonly .hero-text--overlay span, .header-item.is-textonly .header-caption h1, .header-item.is-textonly .header-caption h2, .header-item.is-textonly .header-caption h3, .header-item.is-textonly .header-caption p, .header-item.is-textonly .header-caption a, .header-item.is-textonly .header-caption span {
  color: #000;
}
body.single-magazin .header-item h1, body.single-magazin .header-item h2, body.single-magazin .hero-item h1, body.single-magazin .hero-item h2, .hero-item.is-textonly h1, .hero-item.is-textonly h2, .header-item.is-textonly h1, .header-item.is-textonly h2 {
  margin: 0;
  max-width: 18ch;
  margin-inline: auto;
  font-family: ivypresto-headline, serif;
  font-size: clamp(36px, 4.2vw, 64px);
  line-height: 1.1;
  letter-spacing: 0.01em;
  font-weight: 300;
  color: #000;
}
body.single-magazin .header-item p, body.single-magazin .hero-item p, .hero-item.is-textonly p, .header-item.is-textonly p {
  margin: 1.2em 0 0;
  font-family: tt-commons-pro, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  font-weight: 500;
  color: #000;
}
@media (max-width: 767px) {
  body.single-magazin .header-item h1, body.single-magazin .header-item h2, body.single-magazin .hero-item h1, body.single-magazin .hero-item h2, .hero-item.is-textonly h1, .hero-item.is-textonly h2, .header-item.is-textonly h1, .header-item.is-textonly h2 {
    max-width: none;
  }
}
body.single-magazin .hero-item.is-full, body.single-magazin .header-item.is-full, .hero-item.is-textonly.is-full, .header-item.is-textonly.is-full {
  display: flex;
  min-height: 100vh;
  min-height: 100dvh;
}
body.single-magazin .hero-item.is-full > .inner, body.single-magazin .hero-item.is-full > .hero-text--overlay, body.single-magazin .hero-item.is-full > .header-caption, body.single-magazin .header-item.is-full > .inner, body.single-magazin .header-item.is-full > .hero-text--overlay, body.single-magazin .header-item.is-full > .header-caption, .hero-item.is-textonly.is-full > .inner, .hero-item.is-textonly.is-full > .hero-text--overlay, .hero-item.is-textonly.is-full > .header-caption, .header-item.is-textonly.is-full > .inner, .header-item.is-textonly.is-full > .hero-text--overlay, .header-item.is-textonly.is-full > .header-caption {
  width: 100%;
  height: auto;
}
body.single-magazin .hero-item.is-full.v-oben, body.single-magazin .header-item.is-full.v-oben, .hero-item.is-textonly.is-full.v-oben, .header-item.is-textonly.is-full.v-oben {
  align-items: flex-start;
}
body.single-magazin .hero-item.is-full.v-mitte, body.single-magazin .header-item.is-full.v-mitte, .hero-item.is-textonly.is-full.v-mitte, .header-item.is-textonly.is-full.v-mitte {
  align-items: center;
}
body.single-magazin .hero-item.is-full.v-unten, body.single-magazin .header-item.is-full.v-unten, .hero-item.is-textonly.is-full.v-unten, .header-item.is-textonly.is-full.v-unten {
  align-items: flex-end;
}
body.single-magazin .hero-item.is-full:not(.v-oben):not(.v-mitte):not(.v-unten), body.single-magazin .header-item.is-full:not(.v-oben):not(.v-mitte):not(.v-unten), .hero-item.is-textonly.is-full:not(.v-oben):not(.v-mitte):not(.v-unten), .header-item.is-textonly.is-full:not(.v-oben):not(.v-mitte):not(.v-unten) {
  align-items: center;
}
@media (max-width: 767px) {
  body.single-magazin .hero-item.is-full, body.single-magazin .header-item.is-full, .hero-item.is-textonly.is-full, .header-item.is-textonly.is-full {
    display: block;
    min-height: 0;
  }
}