/* =========================================================================
   Podcast Stories – Komponenten-Styles
   Portiert aus der bestehenden Webflow-Website (daniel-w.webflow.shared.css).
   Klassennamen wurden bewusst beibehalten, damit ein Abgleich mit dem
   Original jederzeit moeglich bleibt.
   ========================================================================= */

/* --- Design Tokens (identisch zur Webflow-:root-Definition) -------------- */
:root {
  --base-color-neutral--white: #ffffff;
  --base-color-neutral--black: #252525;
  --base-color-neutral--neutral-darkest: #252525;
  --base-color-neutral--neutral-darker: #222222;
  --base-color-neutral--neutral-dark: #444444;
  --base-color-neutral--neutral: #666666;
  --base-color-neutral--neutral-light: #aaaaaa;
  --base-color-neutral--neutral-lighter: #cccccc;
  --base-color-neutral--neutral-lightest: #eeeff2;
  --base-color-brand--white: #ffffff;
  --base-color-brand--black: #252525;
  --color-2: #252525;
  --color: #0b636e;
  --yellow: #fac100;
  --yellow-transp: #fac10040;
  --helllgrau: #eeeff2;
  --transparent: #fff0;
  --background-color--background-primary: var(--base-color-neutral--white);
  --background-color--background-secondary: var(--base-color-neutral--neutral-lightest);
  --background-color--background-alternate: var(--color-2);
  --text-color--text-primary: var(--color-2);
  --text-color--text-alternate: var(--base-color-neutral--white);
  --link-color--link-primary: var(--color-2);
  --link-color--link-alternate: var(--base-color-neutral--white);
  --border-color--border-primary: var(--color-2);
  --border-color--border-alternate: var(--base-color-neutral--white);
}

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

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background-color: var(--background-color--background-primary);
  color: var(--text-color--text-primary);
  font-family: "DM Sans", sans-serif;
  font-size: 1rem;
  line-height: 1.5;
  overflow-x: hidden;
}

img { max-width: 100%; height: auto; display: inline-block; vertical-align: middle; }

h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: 0; font-family: "Poppins", sans-serif; font-weight: 700; }
h1 { font-size: 3.5rem;  line-height: 1.2; }
h2 { font-size: 3rem;    line-height: 1.2; }
h3 { font-size: 2.5rem;  line-height: 1.2; }
h4 { font-size: 2rem;    line-height: 1.3; }
h5 { font-size: 1.5rem;  line-height: 1.4; }
h6 { font-size: 1.25rem; line-height: 1.4; }

p { margin-top: 0; margin-bottom: 0; }
a { color: var(--link-color--link-primary); text-decoration: underline; }
ul { margin-top: 1rem; margin-bottom: 1rem; padding-left: 1.25rem; }
ol { margin-top: 1rem; margin-bottom: 1rem; padding-left: 1.5rem; }
li { margin-top: .25rem; margin-bottom: .25rem; padding-left: .5rem; }
figure { margin: 0; }
strong, b { font-weight: 700; }

/* Gutenberg-Grundabstaende neutralisieren, damit das Webflow-Spacing greift */
.wp-block-group, .wp-block-columns, .wp-block-column { margin-block: 0; }
.wp-block-image { margin: 0; }
.wp-block-image img { display: block; }
.wp-block-list { margin-top: 1rem; margin-bottom: 1rem; }

/* --- Utility-Klassen (Webflow "Client-First") ---------------------------- */
.hide { display: none !important; }
@media screen and (max-width: 991px) { .hide, .hide-tablet { display: none !important; } }
@media screen and (max-width: 767px) { .hide-mobile-landscape { display: none !important; } }
@media screen and (max-width: 479px) { .hide-mobile { display: none !important; } }

.z-index-1 { z-index: 1; position: relative; }
.align-center { margin-left: auto; margin-right: auto; }
.text-align-center { text-align: center; }
.text-color-white { color: var(--base-color-neutral--white); }
.text-weight-bold { font-weight: 700; }
.text-weight-semibold { text-align: left; font-weight: 600; }
.inherit-color * { color: inherit; }

.container-large  { width: 100%; max-width: 80rem; margin-left: auto; margin-right: auto; }
.container-medium { width: 100%; max-width: 64rem; margin-left: auto; margin-right: auto; }
.container-small  { width: 100%; max-width: 48rem; margin-left: auto; margin-right: auto; }
.max-width-large  { width: 100%; max-width: 48rem; }

.padding-global { padding-left: 5%; padding-right: 5%; }
.padding-section-large        { padding-top: 7rem; padding-bottom: 7rem; }
.padding-section-large-hero   { padding-top: 7rem; padding-bottom: 0; }
.padding-section-large-copy   { padding-top: 7rem; padding-bottom: 7rem; }
.padding-section-large-testim { padding-top: 0;    padding-bottom: 7rem; }
.padding-section-small-copy   { padding-top: 1rem; padding-bottom: 1rem; }
.padding-section-large.banner-padding { padding-top: 0; }

:root .margin-xxsmall { margin: .5rem; }
:root .margin-xsmall  { margin: 1rem; }
:root .margin-small   { margin: 1.5rem; }
:root .margin-medium  { margin: 2rem; }
:root .margin-large   { margin: 3rem; }
:root .margin-xlarge  { margin: 4rem; }
:root .margin-xxlarge { margin: 5rem; }
.padding-medium  { padding: 2rem; }
.padding-xxlarge { padding: 5rem; }

.margin-top      { margin-bottom: 0 !important; margin-left: 0 !important; margin-right: 0 !important; }
.margin-bottom   { margin-top: 0 !important; margin-left: 0 !important; margin-right: 0 !important; }
.margin-left     { margin-top: 0 !important; margin-bottom: 0 !important; margin-right: 0 !important; }
.margin-right    { margin-top: 0 !important; margin-bottom: 0 !important; margin-left: 0 !important; }
.margin-vertical { margin-left: 0 !important; margin-right: 0 !important; }
.margin-horizontal { margin-top: 0 !important; margin-bottom: 0 !important; }
.padding-top      { padding-bottom: 0 !important; padding-left: 0 !important; padding-right: 0 !important; }
.padding-bottom   { padding-top: 0 !important; padding-left: 0 !important; padding-right: 0 !important; }
.padding-vertical { padding-left: 0 !important; padding-right: 0 !important; }
.padding-horizontal { padding-top: 0 !important; padding-bottom: 0 !important; }

.margin-top.margin-medium { display: flex; }
.margin-top.margin-medium.align-below { flex-flow: column; align-items: stretch; }
.margin-top.margin-xlarge { display: flex; }
.margin-bottom.margin-xxlarge { margin: 0 0 2rem !important; }
.margin-bottom.margin-small { text-align: left; align-self: flex-start; }
.margin-bottom.spacer-small { background-color: transparent; }
.margin-bottom.margin-xsmall.background-petrol {
  background-color: var(--color-2);
  color: var(--border-color--border-alternate);
  border-radius: 7.5px;
  padding: .5rem;
}

.spacer-xsmall { width: 100%; padding-top: 1rem; }
.spacer-small  { background-color: var(--base-color-neutral--white); width: 100%; padding-top: 1.5rem; }
.spacer-medium { width: 100%; padding-top: 2rem; }

.background-color-secondary { background-color: var(--background-color--background-secondary); }
.background-frosted-glass { -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); background-color: #ffffffbf; border-radius: 15px; }
.shadow-medium { box-shadow: 0 12px 16px -4px #00000014, 0 4px 6px -2px #00000008; }

.text-size-regular  { font-size: 1rem; }
.text-size-medium   { text-align: left; font-size: 1.125rem; }
.text-size-medium-2 { font-size: 1.125rem; }

.heading-style-h1 { font-size: 3.5rem;  font-weight: 700; line-height: 1.2; }
.heading-style-h2 { font-size: 3rem;    font-weight: 700; line-height: 1.2; }
.heading-style-h4 { font-size: 1.5rem;  font-weight: 700; line-height: 1.3; }
.heading-style-h5 { font-size: 1.5rem;  font-weight: 700; line-height: 1.4; }
.heading-style-h6 { font-size: 1.25rem; font-weight: 700; line-height: 1.4; }

.icon-embed-xsmall  { flex-direction: column; justify-content: center; align-items: center; width: 1.5rem; height: 1.5rem; display: flex; }
.icon-embed-xsmall:hover { color: var(--yellow); }
.icon-embed-xsmall-6 { color: var(--yellow); flex-direction: column; justify-content: center; align-items: center; width: 1.5rem; height: 1.5rem; display: flex; }
.icon-embed-small   { color: var(--yellow); flex-direction: column; justify-content: center; align-items: center; width: 2rem; height: 2rem; display: flex; }
.icon-embed-medium  { color: var(--yellow); flex-direction: column; justify-content: center; align-items: center; width: 3rem; height: 3rem; display: flex; }
.icon-embed-xsmall svg, .icon-embed-xsmall-6 svg, .icon-embed-small svg, .icon-embed-medium svg { width: 100%; height: 100%; fill: currentColor; }
.icon-1x1-medium { background-color: #fac10000; border-radius: 0%; justify-content: center; align-items: center; width: 3rem; height: 3rem; display: flex; }
.icon-1x1-medium-smaller { background-color: #fac10000; border-radius: 0%; justify-content: center; align-items: center; width: 3rem; height: 3rem; padding: .25rem; display: flex; }
.icon-1x1-medium-rund { background-color: var(--yellow); border-radius: 100%; justify-content: center; align-items: center; width: 3rem; height: 3rem; display: flex; }

/* --- Labels & Taglines ---------------------------------------------------- */
.label {
  background-color: var(--base-color-neutral--white);
  color: var(--base-color-neutral--neutral-darker);
  text-align: center;
  white-space: nowrap;
  border: 1px solid #2525251a;
  border-radius: .25rem;
  justify-content: flex-start;
  align-items: center;
  padding: 6px 8px;
  font-size: .75rem;
  font-weight: 500;
  line-height: 100%;
  text-decoration: none;
  display: inline-flex;
  position: relative;
  overflow: hidden;
  box-shadow: 0 1px #e1e1e1;
}
.label.primary { color: var(--color); background-color: #0b636e1a; border-color: #0b636e33; box-shadow: 0 1px #0b636e66; }
.label.secondary { -webkit-backdrop-filter: blur(30px); backdrop-filter: blur(30px); color: var(--yellow); background-color: #fac10033; border-color: #fac1004d; box-shadow: 0 1px #fac10066; }
.label.secondary-white { -webkit-backdrop-filter: blur(30px); backdrop-filter: blur(30px); color: var(--helllgrau); background-color: #e2e2e233; border-color: #9b9a974d; box-shadow: 0 1px #fac10066; }
.text-style-tagline { justify-content: center; align-items: center; font-weight: 600; text-decoration: none; display: inline-block; }
.tagline-highlight-testi {
  border: 1px solid var(--yellow);
  background-color: var(--yellow-transp);
  color: var(--color-2);
  border-radius: .25rem;
  justify-content: center; align-items: center;
  padding: .25rem .5rem;
  font-weight: 600; text-decoration: none; display: inline-block;
}

/* --- Buttons -------------------------------------------------------------- */
.main-button, .main-button-nav {
  -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px);
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 6px;
  padding: .6rem 1rem;
  font-size: 1rem; font-weight: 600; line-height: 120%;
  color: var(--color-2);
  text-decoration: none;
  display: inline-block;
  transition: box-shadow .3s, border-color .3s, color .3s, background-color .3s;
  position: relative; overflow: hidden;
  box-shadow: 0 1px #e1e1e1;
  cursor: pointer;
}
.main-button:hover, .main-button-nav:hover { border-color: var(--yellow); background-color: var(--yellow); box-shadow: 0 1px #fac10066; }
.main-button.primary, .main-button-nav.primary {
  color: var(--base-color-brand--black);
  background-color: #fac100;
  border-color: #fac10080;
  padding: .8rem 1.2rem;
  box-shadow: 0 1px #fac10099;
}
.main-button.primary:hover, .main-button-nav.primary:hover { background-color: #fac1008c; border-color: #fac100; }
.main-button.secondary { border-width: 2px; border-color: var(--yellow); background-color: transparent; box-shadow: none; color: var(--yellow); padding: .8rem 1.2rem; }
.main-button.secondary:hover { background-color: var(--yellow); color: var(--color-2); }
.main-button.terziary { border-width: 2px; border-color: var(--yellow); background-color: transparent; box-shadow: none; color: var(--color-2); padding: .8rem 1.2rem; }
.main-button.terziary:hover { background-color: var(--yellow); color: var(--color-2); }
.main-button-nav.primary.is-small.text-align-center { padding: .4rem .6rem; }
.button-inner-text { word-break: keep-all; }
.button-group { grid-column-gap: 1rem; grid-row-gap: 1rem; flex-wrap: wrap; align-items: center; display: flex; }
.button-group.is-center { justify-content: center; }
.button-position { margin: 0 0 0 0; }
.button-position.margin-xlarge { flex-flow: row; justify-content: flex-start; align-items: flex-end; margin: 1rem 0 0 !important; display: flex; }

/* --- Navbar ---------------------------------------------------------------- */
.navbar_component {
  border-bottom: 1px none var(--border-color--border-primary);
  background-color: #fffffff2;
  align-items: center;
  width: 100%; height: auto; min-height: 4.5rem;
  padding-left: 5%; padding-right: 5%;
  display: flex; position: fixed; top: 0; left: 0; right: 0;
  z-index: 1000;
}
.navbar_container {
  grid-column-gap: 1rem; grid-row-gap: 1rem;
  grid-template-rows: auto; grid-template-columns: .375fr 1fr .375fr; grid-auto-columns: 1fr;
  justify-content: space-between; align-items: center;
  width: 100%; height: 100%; margin-left: auto; margin-right: auto; display: grid;
}
.navbar_logo-link { padding-left: 0; grid-area: span 1 / span 1 / span 1 / span 1; text-decoration: none; display: inline-block; max-width: 100%; }
.navbar7_logo { max-width: 65%; }
.navbar_menu { justify-content: center; align-items: center; display: flex; position: static; justify-self: center; }
.navbar2_link { color: var(--link-color--link-primary); padding: .5rem 1rem; font-weight: 600; text-decoration: none; display: inline-block; }
.navbar2_link:hover { background-color: var(--helllgrau); border-radius: 7.5px; }
.navbar2_link.w--current { background-color: transparent; color: var(--color-2); border-radius: 7.5px; font-weight: 600; }
.navbar_button-wrapper { grid-column-gap: 1rem; margin-left: 1rem; display: flex; justify-self: end; align-items: center; }
.navbar_menu-button { padding: 0; display: none; background: none; border: 0; cursor: pointer; }
.menu-icon2 { flex-direction: column; justify-content: center; align-items: center; width: 48px; height: 48px; margin-right: -.5rem; display: flex; }
.menu-icon2_line-top, .menu-icon2_line-bottom { background-color: var(--base-color-neutral--black); width: 24px; height: 2px; transition: transform .3s, opacity .3s; }
.menu-icon2_line-middle { background-color: var(--base-color-neutral--black); justify-content: center; align-items: center; width: 24px; height: 2px; margin-top: 6px; margin-bottom: 6px; display: flex; transition: opacity .3s; }
.menu-icon2_line-middle-inner { width: 4px; height: 0; }
/* Platzhalter, damit der fixierte Header keinen Inhalt ueberdeckt */
.navbar_spacer { height: 4.5rem; }

@media screen and (max-width: 991px) {
  .navbar_menu-button { display: block; }
  .navbar_container { grid-template-columns: .25fr 1fr; display: flex; justify-content: space-between; }
  .navbar_menu {
    border-bottom: 1px solid var(--border-color--border-primary);
    background-color: var(--background-color--background-primary);
    flex-direction: column;
    justify-content: flex-start;
    width: 100%;
    padding: 1rem 5% 2.5rem;
    display: none;
    position: absolute; top: 100%; left: 0;
    overflow: auto;
  }
  .navbar_menu.is-page-height-tablet { height: 100dvh; padding-bottom: 6.5rem; }
  .navbar_menu.is-open { display: flex; }
  .navbar2_link { text-align: center; padding: .75rem 0; font-size: 1.125rem; width: 100%; }
  .navbar7_logo { max-width: 50%; }
  .navbar_button-wrapper { align-items: center; }
  .navbar_menu-button.is-open .menu-icon2_line-top { transform: translateY(8px) rotate(45deg); }
  .navbar_menu-button.is-open .menu-icon2_line-middle { opacity: 0; }
  .navbar_menu-button.is-open .menu-icon2_line-bottom { transform: translateY(-8px) rotate(-45deg); }
}
@media screen and (max-width: 767px) {
  .navbar_component { min-height: 4rem; }
  .navbar_spacer { height: 4rem; }
  .navbar7_logo { max-width: 40%; }
  .navbar_menu.is-page-height-tablet { padding-bottom: 6rem; }
}
@media screen and (max-width: 479px) {
  .navbar_logo-link { max-width: 100%; }
  .navbar7_logo { max-width: 75%; }
  .navbar_container { grid-column-gap: .25rem; grid-row-gap: .25rem; }
  .navbar_button-wrapper { grid-column-gap: .5rem; }
  .main-button-nav.primary.is-small.text-align-center { font-size: .8rem; }
}

/* --- Werbebanner ------------------------------------------------------------ */
.werbebanner { border-bottom: 1px none var(--border-color--border-primary); background-color: #fff; margin-bottom: 1rem; padding-top: 4.5rem; position: relative; }
.webebanner_content-wrapper { justify-content: center; align-items: center; padding-top: .75rem; padding-bottom: .75rem; display: flex; }
.webebanner_content-wrapper.container-medium { border: 2px solid #000; }
.webebanner_content { grid-column-gap: 1rem; grid-row-gap: 1rem; flex: 1; justify-content: center; align-items: center; margin-left: 3rem; display: flex; }
.banner7_text-wrapper { margin-right: .5rem; }
.webebanner_close-button { width: 2rem; height: 2rem; margin-left: 1rem; margin-right: 1rem; display: inline-block; }
.close-icon-bannr { flex-direction: column; justify-content: center; align-items: center; width: 2rem; height: 2rem; display: flex; }
@media screen and (min-width: 1920px) { .werbebanner { padding-top: 5rem; } }
@media screen and (max-width: 767px) {
  .banner7_text-wrapper { margin-right: 0; }
  .webebanner_content { flex-direction: column; justify-content: space-between; align-items: flex-start; margin-left: 1rem; margin-right: 1rem; }
  .webebanner_content-wrapper { flex-direction: column; align-items: stretch; padding-top: 1rem; padding-bottom: 1rem; }
  .webebanner_close-button { margin-left: 0; position: absolute; inset: .5rem .5rem auto auto; }
}
@media screen and (max-width: 479px) {
  .webebanner_content { margin-left: 1rem; margin-right: 1rem; }
  .webebanner_content-wrapper.container-medium { flex-flow: column; }
  .webebanner_close-button { margin-right: 1rem; }
}

/* --- Hero ------------------------------------------------------------------- */
.header1_content { grid-column-gap: 3rem; grid-row-gap: 3rem; grid-template-rows: auto; grid-template-columns: 1fr 1fr; align-items: center; display: grid; }
.header1_image { aspect-ratio: 1; object-fit: cover; border-radius: 0; width: 100%; height: 100%; }
.hero-feature-grid { grid-template-rows: auto; grid-template-columns: 1fr 1fr 1fr; grid-column-gap: 16px; grid-row-gap: 16px; margin-top: 2rem; display: grid; }
.features { border: 2px none var(--yellow); background-color: var(--base-color-brand--white); text-align: center; border-radius: 5px; width: 100%; height: 100%; padding: .75rem; font-weight: 600; place-self: center; }

/* --- Logo-Liste -------------------------------------------------------------- */
.section_home_logo-list.background-color-banner { background-color: var(--helllgrau); background-image: linear-gradient(#ffffff80, #ffffff80); }
.zuhause_logo-list_component { grid-column-gap: 4rem; grid-row-gap: 1rem; grid-template-rows: auto; grid-template-columns: max-content 1fr; justify-content: space-between; align-items: center; display: grid; }
.zuhause_logo-list_content-left { max-width: 20rem; }
.zuhause_logo-list_logo-list { grid-column-gap: 2rem; grid-row-gap: 1rem; flex-wrap: wrap; grid-template-rows: auto; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; justify-content: flex-end; align-items: center; display: grid; }
.zuhause_logo-list_wrapper { background-color: #fff; border-radius: 5px; justify-content: center; align-items: center; height: 100%; padding: .5rem 1rem; display: flex; }
.zuhause_logo-list_logo { mix-blend-mode: luminosity; max-height: 3.5rem; width: auto; }

/* --- Intro -------------------------------------------------------------------- */
.layout461_content-left { flex-direction: column; height: 100%; display: flex; }
.content-wrap-left-background { background-color: var(--helllgrau); border-radius: 15px; padding: 2rem; }

/* --- Gruende (layout65) --------------------------------------------------------- */
.layout65_content { grid-column-gap: 5rem; grid-row-gap: 4rem; grid-template-rows: auto; grid-template-columns: 1fr 1fr; align-items: start; display: grid; }
.layout65_content-right { margin-top: 3rem; }
.layout65_item-list { grid-column-gap: 2rem; grid-row-gap: 2rem; grid-template-rows: auto; grid-template-columns: 1fr; padding-top: .5rem; padding-bottom: .5rem; display: grid; }
.layout65_item { grid-column-gap: 1rem; grid-row-gap: 1rem; display: flex; align-self: start; }
.layout65_item-icon-wrapper { flex: none; align-self: flex-start; }

/* --- Challenges + Stats ---------------------------------------------------------- */
.section_home_challenges { position: relative; }
.layout302_list { grid-column-gap: 2rem; grid-row-gap: 4rem; grid-template-rows: auto; grid-template-columns: 1fr 1fr 1fr 1fr; place-items: start; display: grid; }
.zuhause_feature_text-wrapper.background-frame { background-color: var(--helllgrau); -webkit-backdrop-filter: blur(30px); backdrop-filter: blur(30px); border-radius: 1rem; height: 100%; padding: 2rem; }
.stats10_component { z-index: 1; margin-top: 0; position: relative; }
.stats10_list { grid-column-gap: 3rem; grid-row-gap: 4rem; grid-template-rows: auto; grid-template-columns: 1fr 1fr 1fr; place-items: start; width: 100%; display: grid; }
.stats10_list.text-color-yellow { color: var(--yellow); margin-top: 0; }
.stats10_item { border-left: 2px solid var(--yellow); flex-direction: column; align-items: center; width: 100%; padding-left: 2rem; display: flex; }
.stats10_number { font-size: 5rem; font-weight: 700; line-height: 1.3; font-family: "Poppins", sans-serif; }
.stats10_background-image { object-fit: cover; width: 100%; height: 100%; position: absolute; inset: 0%; }
.vorteile_background-image-wrapper { z-index: 0; background-image: linear-gradient(#00000080, #00000080); position: absolute; inset: 0%; }
.image-overlay-layer { z-index: 1; background-color: #00000080; position: absolute; inset: 0%; }

/* --- Video-Testimonials ------------------------------------------------------------ */
.testimonial-wrapper { background-color: var(--helllgrau); border-radius: 15px; padding: 2rem; }
.testimonial14_component { grid-column-gap: 5rem; grid-row-gap: 5rem; grid-template-rows: auto; grid-template-columns: 1fr 1fr; align-items: center; display: grid; }
.testimonial14_content { flex-direction: column; align-items: flex-start; display: flex; }
.testimonial14_client { grid-column-gap: 1.25rem; grid-row-gap: 1.25rem; text-align: left; align-items: center; display: flex; }
.testimonial14_divider { background-color: var(--base-color-neutral--black); align-self: stretch; width: 1px; }
.testimonial14_logo { mix-blend-mode: multiply; max-height: 3rem; width: auto; }
.text-zitat { margin-top: 1rem; font-size: 1.3rem; font-style: italic; }
.figure-video { position: relative; width: 100%; max-width: 100%; height: 0; margin: 0; display: block; }
.figure-video .video-container { width: 100%; }
.figure-video iframe { width: 100%; height: 100%; position: absolute; top: 0; left: 0; border: 0; }

/* --- Ueber mich ---------------------------------------------------------------------- */
.zuhause_about_component { grid-column-gap: 5rem; grid-row-gap: 4rem; grid-template-rows: auto; grid-template-columns: 1fr 1fr; align-items: center; display: grid; }
.zuhause_about_image-wrapper { object-fit: fill; height: 100%; }
.zuhause_about_image { object-fit: cover; border-radius: 15px; width: 100%; height: 100%; }

/* --- Audio-Player --------------------------------------------------------------------- */
.audio-player-wrapper { flex: 1; justify-content: center; align-items: center; margin-top: 2rem; margin-bottom: 1rem; display: flex; }
.audio-track-wrapper { background-color: var(--color-2); -webkit-backdrop-filter: saturate(200%) blur(15px); backdrop-filter: saturate(200%) blur(15px); border: 1px solid #ffffff1a; border-radius: 4px; width: 100%; padding: 25px 30px; }
.podsultant-intro-track { flex-direction: column; justify-content: center; align-items: center; display: flex; }
.track-details-wrapper { justify-content: space-between; align-items: center; width: 100%; margin-bottom: 20px; display: flex; }
.track-title-wrapper { color: #fff; flex-direction: column; align-items: flex-start; font-weight: 500; line-height: 1; display: flex; }
.audio-titel-name { color: #fff; margin-bottom: 10px; font-size: 1rem; font-weight: 500; }
.audio-title { color: #ffffffd9; font-size: .875rem; font-weight: 300; }
.audio-file-thumbnail { border-radius: 4px; width: 50px; height: 50px; }
.audio-file-control-wrapper { align-items: center; width: 100%; display: flex; }
.sp-play, .sp-pause { cursor: pointer; width: 30px; margin-right: 10px; }
.sp-pause { display: none; }
.sp-media-player-bar-wrapper { color: #ffffff73; flex: 1; align-items: center; width: 100%; font-size: 12px; font-weight: 500; line-height: 1; display: flex; }
.sp-elapsed, .sp-duration { display: flex; }
.sp-progress-bar-wrapper { cursor: pointer; flex: 1; height: 3px; margin-left: 20px; margin-right: 20px; padding-top: 10px; padding-bottom: 13px; }
.sp-progress-bar-background { background-color: #f0f0f00f; }
.progress-bar { background-color: #fff; width: 0%; height: 3px; position: relative; }
.true-progress-head { background-color: #fff; border-radius: 20px; width: 10px; height: 10px; position: absolute; inset: -3px 0% auto auto; }
.true-media-player-single-track { display: none; }
@media screen and (max-width: 767px) { .audio-track-wrapper { padding: 20px; } }

/* --- Banner (Outline-Headlines) --------------------------------------------------------- */
.section_home-banner { overflow: hidden; }
.banner13_component { white-space: nowrap; flex-direction: column; display: flex; }
.banner13_heading-top, .banner13_heading-bottom {
  color: var(--base-color-brand--white);
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: var(--yellow);
  font-size: 7rem;
}
.banner13_heading-bottom { align-self: flex-end; }

/* --- Methode / Timeline ------------------------------------------------------------------ */
.section_home_methode { position: relative; }
.ablauf_background-image-wrap { z-index: 0; background-image: linear-gradient(#00000080, #00000080); position: absolute; inset: 0%; }
.zuhause_layout_component { grid-column-gap: 8rem; grid-row-gap: 4rem; grid-template-rows: auto; grid-template-columns: 1fr 1fr; align-items: start; display: grid; }
.zuhause_layout_timeline-wrapper { position: relative; }
.zuhause_layout_progress-bar-wrapper { background-color: #00000026; width: 2px; height: 75%; position: absolute; top: 10%; left: 2.4375rem; right: auto; }
.zuhause_layout_progress-bar { background-color: var(--yellow); width: 2px; height: 0%; }
.zuhause_layout_timeline-step { grid-column-gap: 2.5rem; grid-row-gap: 0px; grid-template-rows: auto; grid-template-columns: max-content 1fr; display: grid; }
.zuhause_layout_timeline-left { flex-direction: column; justify-content: flex-start; align-items: center; padding-top: 2.5rem; padding-bottom: 2.5rem; display: flex; position: relative; }
.zuhause_layout_timeline-right { padding-top: 2.5rem; padding-bottom: 2.5rem; }
.zuhause_layout_timeline-icon-wrapper { z-index: 1; background-color: var(--color-2); margin-top: -1rem; padding: 1rem; position: relative; }

/* --- Dienstleistungen --------------------------------------------------------------------- */
.zuhause_how-it-works_component { text-align: left; flex-direction: column; justify-content: flex-start; align-items: flex-start; display: flex; }
.zuhause_how-it-works_list { grid-column-gap: 2rem; grid-row-gap: 4rem; grid-template-rows: auto; grid-template-columns: 1fr 1fr 1fr; place-items: start center; display: grid; }
.zuhause_how-it-works_item { text-align: left; flex-direction: column; justify-content: flex-start; align-items: flex-start; width: 100%; display: flex; }
.zuhause_how-it-works_item.content-background-grey { background-color: var(--helllgrau); border-radius: 15px; justify-content: space-between; height: 100%; padding: 3rem 2rem; }
.paragraph-3, .paragraph-4, .paragraph-5 { text-align: left; }
.paragraph-6 { text-align: left; font-family: "DM Sans", sans-serif; }
.paragraph-8 { color: var(--base-color-brand--white); text-align: center; font-size: 2rem; font-weight: 700; line-height: 1; font-family: "Poppins", sans-serif; }
.list { text-align: left; }

/* --- Erstgespraech / Timeline 1 ------------------------------------------------------------- */
.section_home_erstgespraech { background-color: var(--background-color--background-primary); }
.timeline1_content { grid-column-gap: 8rem; grid-row-gap: 8rem; grid-template-rows: auto; grid-template-columns: 1fr 1fr; place-items: start center; display: grid; position: relative; }
.timeline1_content-left { padding-right: 1rem; position: sticky; top: 5rem; }
.timeline1_content-right { grid-column-gap: 5rem; grid-row-gap: 5rem; grid-template-rows: auto; grid-template-columns: 1fr; display: grid; }
.timeline1_progress { flex-direction: column; align-items: center; width: 2rem; height: 100%; display: flex; position: absolute; }
.timeline1_line { background-color: var(--base-color-neutral--neutral-lighter); width: 3px; height: 100%; }
.timeline1_progress-line { z-index: -1; background-color: var(--base-color-neutral--black); width: 3px; height: 50vh; margin-top: -50vh; position: sticky; top: 0; }
.timeline1_progress-line-cover { z-index: -1; background-color: var(--background-color--background-primary); width: 100%; height: 50vh; position: absolute; top: -50vh; }
.timeline1_fade-overlay-top { z-index: 1; background-image: linear-gradient(180deg, var(--background-color--background-primary), #0000); width: 4px; height: 4rem; position: absolute; }
.timeline1_fade-overlay-bottom { z-index: 0; background-image: linear-gradient(180deg, #fff0, var(--background-color--background-primary)); width: 4px; height: 4rem; position: absolute; bottom: 0%; }
.timeline1_row { grid-column-gap: 1rem; grid-row-gap: 1rem; grid-template-rows: auto; grid-template-columns: max-content 1fr; position: relative; }
.timeline1_circle-wrapper { justify-content: center; align-items: flex-start; width: 8rem; height: 100%; margin-left: -8rem; display: flex; position: absolute; }
.timeline1_circle { z-index: 2; background-color: var(--base-color-neutral--black); box-shadow: 0 0 0 8px var(--background-color--background-primary); border-radius: 100%; justify-content: center; align-items: center; width: .9375rem; height: .9375rem; margin-top: 2rem; }
.timeline1_item { z-index: 2; grid-template-rows: auto; grid-template-columns: 1fr 12rem 1fr; }

/* --- Einfach Podcasten ------------------------------------------------------------------------ */
.zuhause_podcast_component { grid-column-gap: 2rem; grid-row-gap: 4rem; grid-template-rows: auto; grid-template-columns: 48rem auto; align-items: start; display: grid; }
.zuhause_vorteile-sektion_content-left { max-width: 48rem; }
.hier-hoeren-grid { grid-template-rows: auto; grid-template-columns: 1fr 1fr 1fr 1fr; grid-column-gap: 16px; grid-row-gap: 16px; display: grid; }
.hier-hoeren-grid.spacer-small { background-color: transparent; grid-template-columns: 1fr 1fr 1fr; align-content: stretch; }
.social_image-podcast { width: 100%; }
.image-9 { width: 100%; }
.content-wrapper-right { object-fit: contain; width: 100%; height: 100%; }
.podcast_image-copy { object-fit: contain; border-radius: 15px; max-width: 100%; height: 100%; }

/* --- Text-Testimonials --------------------------------------------------------------------------- */
.testimonial6_grid-list { grid-column-gap: 1.5rem; grid-row-gap: 4rem; grid-template-rows: auto; grid-template-columns: 1fr 1fr 1fr; display: grid; }
.testimonial6_content { background-color: var(--base-color-brand--white); border-radius: 15px; padding: 2rem; }
.testimonial6_rating-wrapper { display: flex; }
.testimonial6_rating-icon { color: var(--base-color-neutral--black); flex-direction: column; justify-content: center; align-items: center; margin-right: .25rem; display: flex; }
.testimonial6_client { text-align: left; }

/* --- CTA-Sektion ---------------------------------------------------------------------------------- */
.section_home_cta-sektion { position: relative; }
.zuhause_cta-sektion_background-image-wrapper { z-index: -1; background-image: linear-gradient(#00000080, #00000080); position: absolute; inset: 0%; }
.zuhause_cta-sektion_background-image { object-fit: cover; transform-style: preserve-3d; width: 100%; height: 100%; position: absolute; inset: 0%; transform: rotateX(0) rotateY(180deg) rotate(0); }

/* --- FAQ -------------------------------------------------------------------------------------------- */
.section_home_faq.background-color-secondary { background-image: none; }
.zuhause_faq_list { grid-column-gap: 1rem; grid-row-gap: 1rem; grid-template-rows: auto; grid-template-columns: 100%; place-items: start stretch; display: grid; }
.zuhause_faq_accordion { border: 1px solid var(--border-color--border-primary); flex-direction: column; justify-content: flex-start; align-items: stretch; display: flex; }
.zuhause_faq_accordion.background-frosted-glass { -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); background-color: #ffffffbf; border-style: none; }
.zuhause_faq_accordion.background-frosted-glass.shadow-medium { -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); }
.zuhause_faq_question { grid-column-gap: 1.5rem; grid-row-gap: 1.5rem; cursor: pointer; justify-content: space-between; align-items: center; padding: 1.25rem 1.5rem; display: flex; background: none; border: 0; width: 100%; text-align: left; font: inherit; color: inherit; }
.zuhause_faq_icon-wrapper { align-self: flex-start; width: 2rem; display: flex; }
.zuhause_faq_icon-wrapper svg { transition: transform .3s; }
.zuhause_faq_question[aria-expanded="true"] .zuhause_faq_icon-wrapper svg { transform: rotate(45deg); }
.zuhause_faq_answer { padding-left: 1.5rem; padding-right: 1.5rem; overflow: hidden; display: grid; grid-template-rows: 0fr; transition: grid-template-rows .3s ease; }
.zuhause_faq_answer > * { overflow: hidden; min-height: 0; margin-bottom: 0 !important; }
.zuhause_faq_accordion.is-open .zuhause_faq_answer { grid-template-rows: 1fr; padding-bottom: 1.5rem; }

/* --- Footer --------------------------------------------------------------------------------------------- */
.footer4_top-wrapper { grid-column-gap: 4vw; grid-template-rows: auto; grid-template-columns: 1fr 1fr .25fr; justify-content: space-between; align-items: center; display: grid; }
.footer4_logo-link { padding-left: 0; justify-self: start; display: inline-block; }
.image-7 { max-width: 40%; }
.footer4_link-list { grid-column-gap: 1.5rem; grid-row-gap: 0px; grid-template-rows: auto; grid-template-columns: max-content; grid-auto-columns: max-content; grid-auto-flow: column; justify-content: center; justify-items: start; display: grid; }
.footer4_link { color: var(--link-color--link-primary); text-align: center; font-size: 1rem; font-weight: 600; text-decoration: none; }
.footer4_link:hover { color: var(--yellow); }
.footer4_social-list { grid-column-gap: .75rem; grid-row-gap: 0rem; grid-auto-columns: max-content; grid-auto-flow: column; place-items: start; display: grid; justify-self: end; }
.footer4_social-link { background-color: var(--base-color-brand--white); color: var(--link-color--link-primary); border: 1px solid #0000; border-radius: .25rem; justify-content: center; align-items: center; width: 2.25rem; height: 2.25rem; font-size: 14px; text-decoration: none; transition: border-color .3s, background-color .3s, color .3s; display: flex; box-shadow: 0 1px #e1e1e1; }
.footer4_social-link:hover { background-color: var(--yellow); border-color: #ededed; }
.footer4_social-link svg { width: 1.5rem; height: 1.5rem; fill: currentColor; }
.footer4_bottom-wrapper { grid-column-gap: 1.5rem; grid-row-gap: 0rem; grid-template-rows: auto; grid-template-columns: max-content; grid-auto-columns: max-content; grid-auto-flow: column; justify-content: center; display: grid; }
.footer4_credit-text { font-size: .875rem; justify-self: start; }
.footer4_legal-link { color: var(--link-color--link-primary); font-size: .875rem; text-decoration: underline; }
.padding-vertical.padding-xxlarge.padding-footer { padding-top: 0; }

/* --- Cookie-Platzhalter ------------------------------------------------------------------------------------ */
.cookie-placeholder { aspect-ratio: 16/9; position: relative; }
.cookie-placeholder-content { grid-column-gap: 2rem; grid-row-gap: 2rem; background-color: var(--base-color-brand--white); flex-flow: column; justify-content: center; align-items: center; width: 100%; padding: 3rem; display: flex; position: absolute; inset: 0%; }
.cookie-placeholder-icon { height: 4rem; }

/* =========================================================================
   Breakpoint: Tablet (max-width 991px)
   ========================================================================= */
@media screen and (max-width: 991px) {
  h1 { font-size: 3.25rem; } h2 { font-size: 2.75rem; } h3 { font-size: 2.25rem; } h4 { font-size: 1.75rem; }
  .heading-style-h1 { font-size: 3.25rem; } .heading-style-h2 { font-size: 2.75rem; } .heading-style-h4 { font-size: 1.75rem; }
  :root .margin-large { margin: 2.5rem; } :root .margin-xlarge { margin: 3.5rem; } :root .margin-xxlarge { margin: 4.5rem; }
  .padding-xxlarge { padding: 4.5rem; }
  .padding-section-large { padding-top: 6rem; padding-bottom: 6rem; }
  .padding-section-large-hero { padding-top: 7rem; padding-bottom: 6rem; }
  .padding-section-large-copy, .padding-section-large-testim { padding-top: 6rem; padding-bottom: 6rem; }
  .zuhause_logo-list_logo-list { grid-template-columns: 1fr 1fr 1fr; }
  .zuhause_logo-list_content-left { max-width: 16rem; }
  .zuhause_logo-list_component { grid-column-gap: 3rem; }
  .zuhause_how-it-works_list { grid-column-gap: 2rem; }
  .zuhause_layout_component { grid-column-gap: 3rem; grid-row-gap: 2rem; }
  .zuhause_layout_timeline-step { grid-column-gap: 24px; }
  .zuhause_about_component { grid-column-gap: 3rem; grid-template-columns: 1fr 1fr; min-height: auto; }
  .footer4_top-wrapper { grid-row-gap: 3rem; grid-template-columns: 1fr; justify-content: center; justify-items: center; }
  .footer4_logo-link, .footer4_social-list { justify-self: center; }
  .testimonial14_component { grid-column-gap: 2.5rem; grid-row-gap: 2.5rem; grid-template-columns: 1fr 1fr; min-height: auto; }
  .header1_content { grid-column-gap: 4rem; grid-row-gap: 4rem; grid-template-columns: 1fr; min-height: auto; }
  .layout65_content { grid-column-gap: 3rem; grid-row-gap: 2rem; }
  .stats10_list { grid-column-gap: 2rem; }
  .stats10_number { font-size: 4rem; }
  .layout302_list { grid-template-columns: 1fr 1fr; }
  .timeline1_item { grid-template-columns: 1fr 10rem 1fr; }
  .timeline1_content { grid-column-gap: 6rem; grid-row-gap: 6rem; }
  .timeline1_circle-wrapper { width: 6rem; margin-left: -6rem; }
  .testimonial6_grid-list { grid-column-gap: 2rem; }
  .zuhause_podcast_component { grid-column-gap: 3rem; grid-row-gap: 2rem; }
  .banner13_heading-top, .banner13_heading-bottom { font-size: 4rem; }
}

/* =========================================================================
   Breakpoint: Mobile Landscape (max-width 767px)
   ========================================================================= */
@media screen and (max-width: 767px) {
  h1 { font-size: 2.5rem; } h2 { font-size: 2.25rem; } h3 { font-size: 2rem; }
  h4 { font-size: 1.5rem; line-height: 1.4; } h5 { font-size: 1.25rem; } h6 { font-size: 1.125rem; }
  .heading-style-h1 { font-size: 2.5rem; } .heading-style-h2 { font-size: 2.25rem; }
  .heading-style-h4 { font-size: 1.5rem; line-height: 1.4; } .heading-style-h5 { font-size: 1.25rem; } .heading-style-h6 { font-size: 1.125rem; }
  .text-size-medium, .text-size-medium-2 { font-size: 1rem; }
  :root .margin-xsmall { margin: .75rem; } :root .margin-small { margin: 1.25rem; } :root .margin-medium { margin: 1.5rem; }
  :root .margin-large { margin: 2rem; } :root .margin-xlarge { margin: 2.5rem; } :root .margin-xxlarge { margin: 3rem; }
  .padding-medium { padding: 1.5rem; } .padding-xxlarge { padding: 3rem; }
  .padding-section-large { padding-top: 4rem; padding-bottom: 4rem; }
  .padding-section-large-hero { padding-top: 7rem; padding-bottom: 4rem; }
  .padding-section-large-copy, .padding-section-large-testim { padding-top: 4rem; padding-bottom: 4rem; }
  .padding-section-small-copy { padding-top: 2rem; padding-bottom: 2rem; }
  .spacer-xsmall { padding-top: .75rem; } .spacer-small { padding-top: 1.25rem; } .spacer-medium { padding-top: 1.5rem; }
  .zuhause_logo-list_component { grid-row-gap: 2rem; flex-direction: column; grid-template-columns: 1fr; justify-content: flex-start; align-items: flex-start; }
  .zuhause_logo-list_logo-list { grid-column-gap: 1rem; padding-top: 1rem; }
  .zuhause_logo-list_wrapper { padding: .75rem 1rem; }
  .zuhause_logo-list_content-left { max-width: none; }
  .zuhause_logo-list_logo { max-height: 3rem; }
  .zuhause_how-it-works_list { grid-row-gap: 3rem; grid-template-columns: 1fr; }
  .zuhause_layout_timeline-icon-wrapper { padding-left: .5rem; padding-right: .5rem; }
  .zuhause_layout_component { grid-template-columns: 1fr; }
  .zuhause_layout_progress-bar-wrapper { left: 2rem; }
  .zuhause_faq_question { padding: 1rem 1.25rem; }
  .zuhause_faq_icon-wrapper { width: 1.75rem; }
  .zuhause_faq_answer { padding-left: 1.25rem; padding-right: 1.25rem; }
  .zuhause_about_component { grid-row-gap: 3rem; grid-template-columns: 1fr; }
  .zuhause_about_content { order: -9999; }
  .footer4_logo-link { justify-content: center; align-items: center; margin-left: auto; margin-right: auto; display: flex; }
  :root .footer4_credit-text { margin-top: 1rem; justify-self: center; grid-area: 4 / 1 / 5 / 2; }
  .footer4_link-list { grid-column-gap: 0px; grid-row-gap: 1.5rem; grid-auto-flow: row; justify-items: center; }
  .footer4_bottom-wrapper { grid-column-gap: 0rem; grid-row-gap: 1rem; grid-auto-flow: row; justify-items: center; padding-bottom: 1rem; }
  .testimonial14_component { grid-row-gap: 3rem; grid-template-columns: 1fr; }
  .testimonial14_content { order: -9999; }
  .testimonial14_client { align-items: center; width: 100%; }
  .header1_content { grid-column-gap: 3rem; grid-row-gap: 3rem; }
  .layout65_content { grid-column-gap: 1.25rem; grid-row-gap: 1.25rem; grid-template-columns: 1fr; }
  .stats10_list { grid-row-gap: 2rem; grid-template-columns: 1fr; }
  .stats10_number { font-size: 3.5rem; }
  .layout302_list { grid-row-gap: 3rem; grid-template-columns: 1fr; }
  .timeline1_progress { z-index: 0; grid-area: 2 / 1 / 3 / 2; justify-self: start; }
  .timeline1_content-right { grid-column-gap: 3rem; grid-row-gap: 3rem; }
  .timeline1_item { grid-template-rows: auto auto; grid-template-columns: 4rem 1fr; margin-left: 3rem; }
  .timeline1_circle { margin-top: .75rem; }
  .timeline1_content { grid-column-gap: 3rem; grid-row-gap: 3rem; grid-template-columns: 1fr; }
  .timeline1_circle-wrapper { width: 2rem; margin-left: 0; }
  .timeline1_content-left { z-index: 1; padding-right: 0; position: relative; top: 0; }
  .testimonial6_client { flex-direction: column; align-items: flex-start; width: 100%; }
  .testimonial6_grid-list { grid-row-gap: 3rem; grid-template-columns: 1fr; }
  .image-7 { max-width: 45%; }
  .zuhause_podcast_component { grid-column-gap: 1.25rem; grid-row-gap: 1.25rem; grid-template-columns: 1fr; }
  .cookie-placeholder-content { grid-column-gap: 1rem; grid-row-gap: 1rem; }
  .cookie-placeholder-icon { height: 3rem; }
}

/* =========================================================================
   Breakpoint: Mobile Portrait (max-width 479px)
   ========================================================================= */
@media screen and (max-width: 479px) {
  h1 { font-size: 2.5rem; }
  .heading-style-h1 { font-size: 2.25rem; } .heading-style-h2 { font-size: 1.75rem; } .heading-style-h4 { font-size: 1.5rem; }
  .text-weight-bold { font-size: .75rem; }
  .margin-top.margin-medium { flex-flow: column; }
  .padding-section-large { padding-bottom: 1.25rem; }
  .padding-section-large-hero { padding-top: 6rem; padding-bottom: 2rem; }
  .padding-section-large-copy { padding-bottom: 4rem; }
  .padding-section-large-testim { padding-bottom: 1.25rem; }
  .padding-section-small-copy { padding-top: 0; }
  .zuhause_logo-list_logo-list { grid-template-rows: auto auto auto; grid-template-columns: 1fr 1fr; }
  .zuhause_logo-list_wrapper { justify-content: center; align-items: flex-start; width: 100%; }
  .zuhause_feature_text-wrapper.background-frame, .zuhause_how-it-works_item.content-background-grey { padding: 1rem; }
  .zuhause_how-it-works_list { grid-row-gap: 1.25rem; grid-template-columns: 1fr; }
  .zuhause_layout_component, .zuhause_about_component { grid-template-columns: 1fr; }
  .footer4_logo-link { margin-left: auto; margin-right: auto; place-self: center; }
  .footer4_social-list { grid-column-gap: 1.5rem; }
  .hier-hoeren-grid.spacer-small { grid-column-gap: .5rem; grid-row-gap: .5rem; grid-template-rows: auto auto auto; grid-template-columns: 1fr; }
  .testimonial14_component { grid-row-gap: 1.25rem; grid-template-columns: 1fr; }
  .testimonial14_client { grid-column-gap: 1rem; grid-row-gap: 1rem; flex-flow: column; justify-content: flex-start; align-items: flex-start; }
  .testimonial14_logo { max-height: 4rem; }
  .testimonial14_divider { width: 100%; height: 1px; margin-left: 0; margin-right: 1rem; }
  .testimonial-wrapper { padding: 1rem; }
  .header1_content, .layout65_content { grid-template-columns: 1fr; }
  .text-style-tagline { text-align: left; line-height: 120%; }
  .layout65_content-right { margin-top: 0; }
  .stats10_list { grid-row-gap: 2rem; grid-template-columns: 1fr; }
  .layout302_list { grid-column-gap: 1.25rem; grid-row-gap: 1.25rem; grid-template-columns: 1fr; }
  .content-wrap-left-background { padding: 1rem; }
  .timeline1_content-right { grid-row-gap: 2rem; }
  .timeline1_item { grid-template-columns: 3rem 1fr; }
  .timeline1_row { grid-column-gap: 1rem; }
  .timeline1_progress-line-cover, .timeline1_fade-overlay-top, .timeline1_progress-line { display: none; }
  .timeline1_content { grid-column-gap: 1.5rem; grid-row-gap: 1.5rem; }
  .testimonial6_content { padding: 1rem; }
  .hero-feature-grid { grid-template-rows: auto auto auto; grid-template-columns: 1fr; }
  .features { font-size: 1.2rem; }
  .image-7 { vertical-align: baseline; max-width: 75%; margin-left: auto; margin-right: auto; display: block; }
  .text-zitat { font-size: 1.1rem; }
  .zuhause_podcast_component { grid-template-columns: 1fr; }
  .label.secondary, .label.secondary-white { white-space: break-spaces; word-break: normal; }
  .banner13_heading-top, .banner13_heading-bottom { -webkit-text-stroke-width: 1.5px; font-size: 3rem; }
  .image-9 { width: 100%; }
  .cookie-placeholder-content { grid-column-gap: 1rem; grid-row-gap: 1rem; padding: 1rem; }
  .cookie-placeholder-icon { height: 2rem; }
  .cookie-placeholder-text { font-size: .75rem; }
}

/* =========================================================================
   WordPress-Block-Layout neutralisieren
   Gutenberg setzt ueber :where(.is-layout-flow) > * einen Standardabstand
   (block gap, 24px). Das Spacing kommt aus den Webflow-Utility-Klassen,
   deshalb wird der Standardabstand hier global auf 0 gesetzt.
   ========================================================================= */
/* Der Standardabstand (block gap) wird in theme.json auf 0 gesetzt,
   damit die Webflow-Margin-Utilities nicht ueberschrieben werden. */
.wp-block-template-part { margin-block: 0; }
.entry-content, .wp-block-post-content { margin: 0; max-width: none; }
.screen-reader-text {
  border: 0; clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden;
  padding: 0; position: absolute; white-space: nowrap; width: 1px;
}

/* =========================================================================
   Seite: Podcast Services
   Komponenten aus der Webflow-Vorlage /podcast-services.
   Klassennamen 1:1 uebernommen.
   ========================================================================= */

/* Hero */
.section_podcast-services.background-color-secondary { padding-top: 4rem; }

/* Text-/Bild-Abschnitt (layout192) */
.layout192_content {
  grid-column-gap: 3rem; grid-row-gap: 4rem;
  grid-template-rows: auto; grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr; align-items: center; display: grid;
}
.layout192_image-wrapper { height: 100%; align-self: start; }
.layout192_image { object-fit: cover; border-radius: 15px; width: 100%; height: 100%; }

/* Service-Karten */
.padding-section-small-service { padding-top: 0; padding-bottom: 7rem; }
.podcast-service-grid {
  grid-column-gap: 1rem; grid-row-gap: 1rem;
  grid-template-rows: auto auto auto auto;
  grid-template-columns: 1fr 1fr; grid-auto-columns: 1fr; display: grid;
}
.service-card {
  background-color: var(--helllgrau); border-radius: 15px;
  flex-flow: column; justify-content: space-between; align-items: stretch;
  padding: 4rem 2rem; display: flex;
}
.card-content {
  flex-direction: column; justify-content: flex-start; align-items: stretch;
  width: auto; max-width: none; height: 100%; display: flex; position: relative;
}
.layout423_card-content-bottom { flex-direction: column; align-items: flex-start; display: flex; }
.card-button-container { justify-content: flex-start; align-items: flex-end; margin-top: 2rem; display: flex; }

@media screen and (max-width: 991px) {
  .layout192_content { grid-column-gap: 3rem; grid-template-columns: 1fr 1fr; grid-auto-flow: row; min-height: auto; }
}

@media screen and (max-width: 767px) {
  .layout192_content { grid-row-gap: 3rem; grid-template-columns: 1fr; }
  .podcast-service-grid { grid-template-rows: auto auto auto auto auto auto auto auto; grid-template-columns: 1fr; }
  .padding-section-small-service { padding-top: 2rem; padding-bottom: 2rem; }
}

@media screen and (max-width: 479px) {
  .layout192_content { grid-template-columns: 1fr; }
}

/* =========================================================================
   Seite "Ueber mich" (Session 3)
   ========================================================================= */

/* Hero */
.section_header-about.background-color-secondary,
.section_podcasten.background-color-secondary { padding-top: 4rem; }

/* Abschnittspaddings */
.padding-section-small       { padding-top: 3rem; padding-bottom: 3rem; }
.padding-section-large-about { padding-top: 2rem; padding-bottom: 2rem; }

/* Ueberschrift H3 (global, bisher nicht benoetigt) */
.heading-style-h3 { font-size: 2.5rem; font-weight: 700; line-height: 1.2; }

/* Breiten-Utility */
.max-width-full { width: 100%; max-width: none; }

/* Text-/Bild-Abschnitt (layout1) */
.layout1_content {
  grid-column-gap: 5rem; grid-row-gap: 4rem;
  grid-template-rows: auto; grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr; align-items: center; display: grid;
}
.layout1_image-wrapper { object-fit: fill; height: 100%; }
.layout1_image { object-fit: cover; object-position: 80% 50%; border-radius: 15px; width: 100%; height: 100%; }

/* Abschluss-Karte (layout35) */
.layout35_component { background-color: var(--base-color-brand--white); border-radius: 15px; padding: 4rem; }

@media screen and (max-width: 991px) {
  .heading-style-h3 { font-size: 2.25rem; }
  .layout1_content { grid-column-gap: 3rem; grid-template-columns: 1fr 1fr; grid-auto-flow: row; min-height: auto; }
  .padding-section-large-about { padding-top: 6rem; padding-bottom: 6rem; }
}

@media screen and (max-width: 767px) {
  .heading-style-h3 { font-size: 2rem; }
  .padding-section-small { padding-top: 2rem; padding-bottom: 2rem; }
  .layout1_content { grid-row-gap: 3rem; grid-template-columns: 1fr; }
  .padding-section-large-about { padding-top: 4rem; padding-bottom: 4rem; }
  /* 1:1 aus Webflow: nur diese eine Node-ID, Suffix = Seiten-ID von /ueber-mich */
  #w-node-c18a736d-ec26-9197-4805-ed2229633d02-f296f407 { order: -9999; }
}

@media screen and (max-width: 479px) {
  .layout35_component { padding: 1rem; }
  .layout1_content { grid-template-columns: 1fr; }
}

/* =========================================================================
   Blogartikel /podcast-stories/<slug>            (Session 4)
   Portiert aus daniel-w.webflow.shared.css, Klassennamen unveraendert.
   ========================================================================= */

/* --- Groessen-Utilities, die bisher nicht gebraucht wurden --------------- */
:root .margin-tiny { margin: .25rem; }
.padding-xhuge { padding: 7rem; }
.spacer-xlarge { width: 100%; padding-top: 4rem; }
.padding-section-large-blog { padding-top: 7rem; padding-bottom: 2rem; }

.text-size-small    { font-size: .875rem; }
.text-size-medium-3 { text-align: left; font-size: 1.125rem; }
.primary-color      { color: var(--yellow); }
.paragraph-9        { text-align: left; }

.button.is-secondary { border: 2px solid var(--yellow); color: var(--color-2); background-color: transparent; }
.button.is-secondary.is-alternate { color: var(--base-color-neutral--white); background-color: transparent; }
.button.is-secondary.is-small { padding-top: .25rem; padding-bottom: .25rem; }
.button.is-secondary.is-small:hover { background-color: var(--yellow); }

/* --- Rich Text (Webflow .w-richtext) ------------------------------------ */
.w-richtext::before, .w-richtext::after { content: " "; grid-area: 1 / 1 / 2 / 2; display: table; }
.w-richtext::after { clear: both; }
.w-richtext ol, .w-richtext ul { overflow: hidden; }
/* Webflow-Normalize setzt figure auf 0 0 10px; das Theme hat global figure { margin: 0 }.
   Innerhalb des Rich Text gilt wieder der Webflow-Wert. */
.w-richtext figure { max-width: 60%; margin: 0 0 10px; position: relative; }
.w-richtext figure img { width: 100%; }
.w-richtext figure div { color: transparent; font-size: 0; }
.w-richtext figure.w-richtext-figure-type-image { display: table; }
.w-richtext figure.w-richtext-figure-type-image > div { display: inline-block; }
.w-richtext figure.w-richtext-figure-type-image > figcaption { caption-side: bottom; display: table-caption; }
.w-richtext figure.w-richtext-align-center { clear: both; margin-left: auto; margin-right: auto; }
.w-richtext figure.w-richtext-align-center.w-richtext-figure-type-image > div { max-width: 100%; }
.w-richtext figure.w-richtext-align-normal { clear: both; }
.w-richtext figure.w-richtext-align-fullwidth { text-align: center; clear: both; width: 100%; max-width: 100%; margin-left: auto; margin-right: auto; display: block; }
.w-richtext figure.w-richtext-align-fullwidth > div { padding-bottom: inherit; display: inline-block; }
.w-richtext figure.w-richtext-align-fullwidth > figcaption { display: block; }
.w-richtext figure.w-richtext-align-floatleft  { float: left;  clear: none; margin-right: 15px; }
.w-richtext figure.w-richtext-align-floatright { float: right; clear: none; margin-left: 15px; }

.text-rich-text h1 { margin-top: 2rem;    margin-bottom: 1rem; font-size: 3rem; }
.text-rich-text h2 { margin-top: 1.5rem;  margin-bottom: 1rem; font-size: 2.5rem; }
.text-rich-text h3 { margin-top: 1.5rem;  margin-bottom: 1rem; font-size: 2rem; }
.text-rich-text h4 { margin-top: 1.5rem;  margin-bottom: 1rem; font-size: 1.75rem; }
.text-rich-text h5, .text-rich-text h6 { margin-top: 1.25rem; margin-bottom: 1rem; }
.text-rich-text p  { margin-bottom: 1rem; }
.text-rich-text blockquote { margin-top: 1.5rem; margin-bottom: 1.5rem; font-style: italic; }
.text-rich-text figcaption { border-left: 2px solid var(--text-color--text-primary); text-align: left; margin-top: .5rem; padding-left: .5rem; font-size: .875rem; }

/* --- Breadcrumb --------------------------------------------------------- */
.breadcrumb_component { grid-column-gap: .25rem; grid-row-gap: .25rem; align-items: center; width: 100%; display: flex; }
.breadcrumb-link { text-decoration: none; }
.breadcrumb-link.w--current { color: var(--yellow); font-weight: 600; }
.breadcrumb-divider { justify-content: center; align-items: center; width: 1rem; height: 1rem; display: flex; }

/* --- Artikelkopf -------------------------------------------------------- */
.blog-post-header1_content-top { justify-content: space-between; align-items: flex-end; width: 100%; display: flex; }
.blog-post-header1_author-wrapper { grid-column-gap: 1rem; grid-row-gap: 1rem; align-items: center; display: flex; }
.blog-post-header1_author-image { object-fit: cover; border-radius: 100%; width: 3.5rem; min-width: 3.5rem; height: 3.5rem; min-height: 3.5rem; }
.author_podcast-name { font-size: 1.125rem; font-weight: 600; }
.blog-post-header1_date-wrapper { grid-column-gap: .5rem; grid-row-gap: .5rem; display: flex; }
.blog-post-header1_share {
  grid-column-gap: 1rem; grid-row-gap: 1rem;
  grid-template-rows: auto; grid-template-columns: max-content;
  grid-auto-columns: 1fr; grid-auto-flow: column;
  justify-items: start; display: flex;
}
.blog-post-header1_social-link {
  background-color: var(--color); opacity: 1;
  color: var(--base-color-neutral--white);
  border-radius: .5rem; justify-content: center; align-items: center;
  width: 2.5rem; height: 2.5rem; padding: .25rem;
  transition: all .3s; display: flex;
}
.blog-post-header1_social-link:hover { opacity: .8; color: var(--base-color-brand--white); }
.blog-post-header1_image-wrapper { width: 100%; margin-left: auto; margin-right: auto; overflow: hidden; }

/* --- Artikelinhalt ------------------------------------------------------ */
.blog-post1-content_content { margin-bottom: 4rem; }
.blog-post1-content_content-bottom { justify-content: space-between; align-items: flex-end; display: flex; }
.blog-post1-content_share-wrapper { flex-direction: column; align-items: flex-start; width: 50%; display: flex; }

/* --- Beitragsliste (auch auf /podcast verwendet) ------------------------ */
.section_blog-post1-related { background-color: var(--helllgrau); }
.blog-post1-related_component { flex-direction: column; align-items: center; }
.blog-post1-related_list-wrapper { width: 100%; }
.blog_grid-collection-list {
  grid-column-gap: 1.25rem; grid-row-gap: 1.25rem;
  grid-template-rows: auto; grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr; justify-content: start; display: grid;
}
.blog_grid-item { flex-flow: column; justify-content: space-between; height: 100%; display: flex; }
.blog_grid-post-wrapper {
  background-color: var(--helllgrau); border: 1px solid #0000000d;
  border-radius: .5rem; flex-flow: column; height: 100%; padding: .625rem; display: flex;
}
.blog_grid-image-link { margin-bottom: .5rem; overflow: hidden; }
.blog_grid-image-link.w--current { overflow: hidden; }
/* Webflow gibt hier transform: scale3d(1none,1none,1none) aus. Der Wert ist
   ungueltig und wird von jedem Browser verworfen, der Hover-Zoom greift auf
   der Live-Seite also nicht. Uebernommen wird nur, was tatsaechlich wirkt. */
.blog_grid-image { object-fit: cover; transform-style: preserve-3d; border-radius: .25rem; width: 100%; height: 100%; transition: transform .9s; }
.blog_grid-content-wrapper { padding: .5rem .625rem; }
.blog_grid-item-title { font-size: 1.25rem; text-decoration: none; display: block; }
.blog_grid-item-title.w--current { margin-bottom: .825rem; }

@media screen and (max-width: 991px) {
  .padding-xhuge { padding: 6rem; }
  .spacer-xlarge { padding-top: 3.5rem; }
  .blog-post1-content_content { margin-bottom: 3rem; }
  .padding-section-large-blog { padding-top: 6rem; padding-bottom: 6rem; }
}

@media screen and (max-width: 767px) {
  .padding-xhuge { padding: 4rem; }
  .spacer-xlarge { padding-top: 2.5rem; }
  .blog-post1-content_content { margin-bottom: 2rem; }
  .text-size-medium-3 { font-size: 1rem; }
  .button.is-secondary.is-small { display: none; }
  .blog_grid-collection-list { grid-template-rows: auto auto auto; grid-template-columns: 1fr 1fr; }
  .padding-section-large-blog { padding-top: 4rem; padding-bottom: 0; }
}

@media screen and (max-width: 479px) {
  .button.is-secondary.is-small { display: none; }
  .blog-post-header1_content-top {
    grid-column-gap: 1rem; grid-row-gap: 1rem; text-align: center;
    flex-direction: column; justify-content: space-between; align-items: center;
  }
  .blog-post-header1_author-wrapper { flex-flow: column; width: 100%; }
  .blog-post-header1_author-text { text-align: center; }
  .blog-post1-content_content-bottom { flex-direction: column; align-items: flex-start; }
  /* :root erhoeht die Spezifitaet auf (0,2,0). Sonst setzt Gutenberg ueber
     :where(.is-layout-flow) > :last-child den Abstand auf 0 zurueck. */
  :root .blog-post1-content_share-wrapper { width: 100%; margin-bottom: 2rem; }
  .blog_grid-collection-list { grid-template-rows: auto auto auto auto auto; grid-template-columns: 1fr; }
}


/* =========================================================================
   Seite /podcast (Session 5)
   Reihenfolge wie im Webflow-Stylesheet. Die Klassen der Beitragsliste
   (blog_grid-*, blog-post1-related_*) stehen bereits weiter oben und
   werden unveraendert wiederverwendet.
   ========================================================================= */

/* Hero "Einfach Podcasten" */
.einfach-podcasten_component {
  grid-column-gap: 2rem; grid-row-gap: 4rem;
  grid-template-rows: auto; grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr; align-items: start; display: grid;
}
.image-wrapper-grid, .image-8 { border-radius: 12px; }
/* Traegt in Webflow zusaetzlich .w-layout-grid. Dessen Basiswerte (Abstaende,
   grid-auto-columns, display) sind hier eingefaltet, weil die Marker-Klasse
   wie auf den anderen Seiten nicht uebernommen wird. */
.podcasten-grid {
  grid-column-gap: 16px; grid-row-gap: 16px;
  grid-template-rows: auto; grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr; display: grid;
}
.image-2 { width: 100%; }

/* Player-Einbettung. Klassenname aus Webflow beibehalten, auch wenn darin
   jetzt ein Spotify-Show-Embed statt des toten Podigee-Players steckt. */
.podcast-player-podigee { flex: 1; }
.code-embed { width: 100%; }

/* layout41 – Text links, Text rechts */
.layout41_content {
  grid-column-gap: 5rem; grid-row-gap: 2rem;
  grid-template-rows: auto; grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr; align-items: start; display: grid;
}

/* layout233 – drei Karten mit Icon */
.layout233_list {
  grid-column-gap: 1.25rem; grid-row-gap: 4rem;
  grid-template-rows: auto; grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr; place-items: start; display: grid;
}
.layout233_item {
  background-color: var(--helllgrau); border-radius: 15px;
  flex-direction: column; align-items: center;
  width: 100%; height: 100%; padding: 2rem;
}
.layout233_item-icon-wrapper { display: inline-block; }

/* Kundenstimmen. Achtung: /podcast nutzt testimonial6_*, die Startseite
   dagegen testimonial14_*. Zwei verschiedene Komponenten. .testimonial6_grid-list
   und .testimonial6_client stehen bereits weiter oben (Startseite) und gelten
   unveraendert auch hier; neu ist nur die Karte selbst. Die Startseite nutzt
   dafuer .testimonial6_content, /podcast .testimonial_content. */
.testimonial_content { background-color: var(--base-color-brand--white); border-radius: 15px; padding: 0; }
/* Das Zitat ist in der Karte das erste Kind. Gutenberg setzt ueber
   :where(.is-layout-flow) > :first-child margin-block-start auf 0, in Webflow
   hat .text-zitat dort 1rem. :root hebt die Spezifitaet nur fuer diesen einen
   Fall an, damit die Schriftgroessen-Regel unter 767px unberuehrt bleibt. */
:root .testimonial_content > .text-zitat { margin-top: 1rem; }

/* CTA mit Hintergrundbild */
.section_cta3 { position: relative; }
.cta3_component { z-index: 1; position: relative; }
.cta3_background-image-wrapper {
  z-index: 0; background-image: linear-gradient(#00000080, #00000080);
  position: absolute; inset: 0%;
}
.cta3_background-image {
  object-fit: cover; transform-style: preserve-3d;
  width: 100%; height: 100%; position: absolute; inset: 0%;
  transform: rotateX(0) rotateY(180deg) rotate(0);
}
.text-color-alternate { color: var(--text-color--text-alternate); }

/* Kopf der Beitragsliste */
.blog43_heading-wrapper {
  grid-column-gap: 5rem; grid-row-gap: 1rem;
  grid-template-rows: auto; grid-template-columns: 1fr;
  grid-auto-columns: 1fr; justify-content: space-between;
  align-items: end; display: grid;
}
.blog43_heading { flex: 1; justify-content: flex-start; align-items: flex-end; display: flex; }

/* Autor-/Datumszeile der Karten. Steht auf /podcast genauso unter .hide wie
   im Artikel, ist also unsichtbar. Die Regeln sind trotzdem portiert, damit
   die Liste beim manuellen Aufbau vollstaendig zur Verfuegung steht. */
.flex_horizontal-align-center {
  grid-column-gap: 1rem; grid-row-gap: 1rem;
  justify-content: flex-start; align-items: center; display: flex;
}
.author-image { object-fit: cover; border-radius: 100vw; width: 60px; height: 60px; display: block; }
.author_name-container { font-weight: 600; line-height: 1.2; }
.author_date-podcast { font-size: .875rem; }

/* Paginierung. .w-pagination-* sind Webflow-Basisstile und werden auf der
   Seite nicht ueberschrieben. :root erhoeht die Spezifitaet auf (0,2,0),
   sonst setzt Gutenberg ueber :where(.is-layout-flow) > :first-child den
   oberen Abstand auf 0 zurueck. */
:root .pagination { margin-top: 4rem; }
.w-pagination-wrapper { flex-wrap: wrap; justify-content: center; display: flex; }
.w-pagination-previous, .w-pagination-next {
  color: #333; background-color: #fafafa; border: 1px solid #ccc; border-radius: 2px;
  margin-left: 10px; margin-right: 10px; padding: 9px 20px; font-size: 14px; display: block;
}
.w-pagination-previous-icon { margin-right: 4px; }
.w-pagination-next-icon { margin-left: 4px; }

@media screen and (max-width: 991px) {
  .einfach-podcasten_component { grid-column-gap: 3rem; grid-row-gap: 2rem; }
  .layout41_content { grid-column-gap: 3rem; grid-row-gap: 2rem; }
  .layout233_list { grid-column-gap: 2rem; }
  .blog43_heading-wrapper { grid-column-gap: 3rem; }
  .blog43_heading { margin-right: 3rem; }
}

@media screen and (max-width: 767px) {
  .einfach-podcasten_component { grid-column-gap: 1.25rem; grid-row-gap: 1.25rem; grid-template-columns: 1fr; }
  .layout41_content { grid-column-gap: 1.25rem; grid-row-gap: 1.25rem; grid-template-columns: 1fr; }
  .layout233_list { grid-row-gap: 3rem; grid-template-columns: 1fr; }
  .blog43_heading-wrapper {
    grid-row-gap: 2rem; flex-direction: column; grid-template-columns: 1fr;
    justify-content: flex-start; align-items: flex-start;
  }
  .blog43_heading { margin-right: 0; }
}

@media screen and (max-width: 479px) {
  .einfach-podcasten_component { grid-template-columns: 1fr; }
  .podcasten-grid { grid-template-rows: auto auto auto; grid-template-columns: 1fr; place-content: stretch; }
  .layout41_content, .layout233_list { grid-template-columns: 1fr; }
  .image-10 { width: 100vw; }
  .bold-text, .bold-text-2 { overflow-wrap: break-word; }
}

/* Aus dem Inline-Style-Block jeder Webflow-Seite. Steht nicht im Stylesheet,
   wirkt aber im Rich Text und war bis Session 3 nicht gebraucht worden. */
.w-richtext > :not(div):first-child,
.w-richtext > div:first-child > :first-child { margin-top: 0 !important; }
.w-richtext > :last-child,
.w-richtext ol li:last-child,
.w-richtext ul li:last-child { margin-bottom: 0 !important; }

/* ===========================================================================
   Seite /termin                                                  (Session 6)
   Schlanker Kopf und Fuss plus Kontaktformular. `contact1_component` und
   `footer_termin-component` stehen im Markup, haben im Webflow-Stylesheet
   aber keine Regel – reines Strukturmarkup.
   ======================================================================== */

/* --- navbar_termin -------------------------------------------------------- */
.navbar_termin { border-bottom: 1px none var(--border-color--border-primary); background-color: var(--background-color--background-primary); align-items: center; width: 100%; height: auto; min-height: 4.5rem; padding-left: 5%; padding-right: 5%; display: flex; }
.navbar_termin-container { grid-column-gap: 1rem; grid-row-gap: 1rem; grid-template-rows: minmax(0, 1fr); grid-template-columns: .375fr; grid-auto-columns: 1fr; place-content: center; align-self: auto; place-items: center; width: 100%; height: 100%; margin-left: auto; margin-right: auto; display: grid; }
.navbar_logo-link-termin { justify-content: center; align-items: center; margin-left: auto; margin-right: auto; padding-left: 0; display: flex; }
.navbar_termin-logo-copy { width: 12rem; height: 4rem; margin-left: auto; margin-right: auto; padding-left: 0; }

/* --- Kontaktformular ------------------------------------------------------ */
.section_kontaktformular { display: block; }
.max-width-medium { width: 100%; max-width: 35rem; }
.contact1_form-block { flex-direction: column; align-items: stretch; margin-bottom: 0; }
.contact1_form { grid-column-gap: 1.5rem; grid-row-gap: 1.5rem; grid-template-rows: auto auto; grid-template-columns: 1fr; grid-auto-columns: 1fr; display: grid; }
.form_field-wrapper { position: relative; }
/* display:block kommt in Webflow aus der Basisregel fuer <label>. Nur dieser
   eine Wert wird gebraucht, deshalb steht er hier statt global. */
.form_field-label { display: block; margin-bottom: .5rem; font-weight: 400; }

/* Webflow-Basis fuer Eingabe- und Auswahlfelder. Sie wirkt hier wirklich:
   die Auswahlfelder tragen nur `w-select` und holen sich Hoehe, Schriftgroesse
   und Rahmen ausschliesslich von hier. */
.w-input, .w-select { color: #333; vertical-align: middle; background-color: #fff; border: 1px solid #ccc; width: 100%; height: 38px; margin-bottom: 10px; padding: 8px 12px; font-size: 14px; line-height: 1.42857; display: block; }
.w-input::placeholder, .w-select::placeholder { color: #999; }
.w-input:focus, .w-select:focus { border-color: #3898ec; outline: 0; }
.w-select { background-color: #f3f3f3; }

/* `border` und `border-color` verweisen in Webflow auf eine Variable, die im
   Stylesheet nicht definiert ist (`--<unknown|relume-variable-neutral-shade-7>`).
   Die Deklaration ist damit ungueltig und faellt auf den Anfangswert zurueck:
   das Textfeld hat auf der Live-Seite *keinen* Rahmen (gemessen: 0px none).
   Genau dieser Endzustand steht hier ausdruecklich. Gleiches beim Platzhalter:
   die ungueltige Farbe erbt, der Wert ist also die Textfarbe des Feldes. */
.form_input-2 { background-color: var(--base-color-neutral--neutral-lightest); border: none; border-radius: 0; height: auto; min-height: 2.75rem; margin-bottom: 0; padding: .5rem .75rem; font-size: 1rem; line-height: 1.6; }
.form_input-2::placeholder { color: inherit; }
.form_input-2.is-text-area { height: auto; min-height: 11.25rem; padding-top: .75rem; padding-bottom: .75rem; overflow: auto; }

.paragraph-10 { text-align: left; word-break: normal; font-size: 12px; font-weight: 400; text-decoration: none; }

/* Absenden-Button: Webflow-Node-ID 1:1 uebernommen, wie auf /ueber-mich
   (Abschnitt 8, Punkt 13). Die ID endet auf die Webflow-Seiten-ID und ist
   damit eindeutig. */
#w-node-dba45ae2-1232-f138-10a1-bf79fc17e1bd-1786dac5 { justify-self: center; }

/* --- Erfolgs- und Fehlermeldung ------------------------------------------ */
.w-form-done { text-align: center; background-color: #ddd; padding: 20px; display: none; }
.w-form-fail { background-color: #ffdede; margin-top: 10px; padding: 10px; display: none; }
.form_message-success-wrapper-2 { margin-top: 1rem; padding: 0; }
.form_message-success-2 { color: #027a48; background-color: #ecfdf3; flex-direction: column; justify-content: center; align-items: center; padding: 2.5rem; display: flex; }
.success-text { font-weight: 600; }
.form_message-error-wrapper { margin-top: 1rem; padding: 0; }
.form_message-error-2 { color: #b42318; background-color: #fef3f2; flex-direction: column; justify-content: center; align-items: center; padding: 1rem; display: flex; }
.error-text { color: #e23939; }

/* --- Contact Form 7 an die Vorlage angleichen ----------------------------- */
/* CF7 bringt eigenes Markup mit. Diese drei Regeln halten es aus dem Raster
   des Formulars heraus, damit die Abstaende der Vorlage entsprechen. */
.contact1_form .wpcf7-form-control-wrap { display: block; }
.contact1_form .wpcf7-response-output { display: none; }
.contact1_form .wpcf7-spinner { display: none; }

/* --- footer_termin -------------------------------------------------------- */
.line-divider { background-color: var(--border-color--border-primary); width: 100%; height: 1px; }

@media screen and (max-width: 991px) {
  .navbar_termin-container { grid-template-columns: .25fr 1fr; display: flex; }
  .navbar_termin-logo-copy { width: 9rem; max-width: 100%; height: 3rem; }
}

@media screen and (max-width: 767px) {
  .navbar_termin { min-height: 4rem; }
  .navbar_termin-container { align-self: center; }
  .navbar_termin-logo-copy { max-width: 100%; height: 3rem; }
}

@media screen and (max-width: 479px) {
  .navbar_termin-logo-copy { max-width: 100%; height: 3rem; }
  .contact1_form { grid-row-gap: 1.5rem; }
}

/* --- Formularelemente und Absenden-Button -------------------------------- */
/* Webflows Normalize fuer Formularelemente. Sie wurde bisher nicht gebraucht,
   weil es keine Formulare gab. `font: inherit` ist hier entscheidend: ohne die
   Regel laufen Eingabe- und Auswahlfelder in Arial statt DM Sans und der
   Absenden-Button faellt auf 13,33px zurueck, wodurch der Abschnitt 27px zu
   flach wird. */
button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }
button, [type="button"], [type="reset"] { cursor: pointer; -webkit-appearance: button; border: 0; }
input { line-height: normal; }

/* Basisklasse des Buttons. Auf den bisherigen Seiten heisst der Button
   `main-button`, `.button` kam dort nicht vor und fehlte deshalb. `w-button`
   wird wie bisher nicht uebernommen (Abschnitt 8, Punkt 30); zwei seiner Werte
   wirken hier aber und stehen deshalb eingefaltet: `line-height: inherit`
   (sonst greift `input { line-height: normal }` und der Button ist 45 statt
   48px hoch) und `cursor: pointer`. */
.button { border: 1px none var(--base-color-neutral--black); background-color: var(--yellow); color: var(--base-color-neutral--neutral-darker); text-align: center; border-radius: 5px; padding: .75rem 1.5rem; font-weight: 600; line-height: inherit; text-decoration: none; cursor: pointer; }

/* --- /impressum und /datenschutz ----------------------------------------- */
/* Von den Klassen dieser beiden Seiten haben im Webflow-Stylesheet nur vier
   ueberhaupt eine Regel. `header23_component` (steht schon auf /ueber-mich),
   `impressum_content`, `datenschutz-content`, `main-wrapper` und
   `section_impressum-content` sind reines Strukturmarkup ohne Deklaration:
   die Klassennamen bleiben im Markup stehen, CSS gibt es dazu keines.
   Die `.w-richtext`-Regeln, die der Datenschutz-Inhalt braucht, liegen
   bereits weiter oben in dieser Datei (Session 4). */
.section_header-datenschutz.background-color-secondary,
.section_header-impressum.background-color-secondary { padding-top: 4rem; }
.padding-section-large-impress { padding-top: 2rem; padding-bottom: 7rem; }

@media screen and (max-width: 991px) {
  .padding-section-large-impress { padding-top: 6rem; padding-bottom: 6rem; }
}

@media screen and (max-width: 767px) {
  .padding-section-large-impress { padding-top: 4rem; padding-bottom: 4rem; }
}

@media screen and (max-width: 479px) {
  .padding-section-large-impress { padding-bottom: 1.25rem; }
  .section_content-datenschutz { overflow: hidden; }
}
