/* Schramm Consulting - Anpassungen gegenüber dem Ursprungs-Template */

/* ---- Farben: Grün und Gold aus der bisherigen Schramm-Seite ---- */
:root,
[data-wf--section--variant],
[data-text-theme] {
  --_primitive-colors---brand--mahogany: #0b241b;   /* dunkle Markenfläche */
  --_primitive-colors---brand--ruby:     #1d5a48;   /* Akzent */
  --_primitive-colors---brand--obsidian: #15201a;   /* fast schwarz, leicht grün */
  --_primitive-colors---brand--walnut:   #0f3427;   /* dunkel sekundär */
  --_primitive-colors---walnut--walnut-800: #0f3427;
  --_primitive-colors---walnut--walnut-700: #1d5a48;
  --_primitive-colors---walnut--walnut-50:  #f7f5f0;
  --_primitive-colors---walnut--walnut-100: #f1ede4;
  --brand--ruby: #1d5a48;
  --brand--mahogany: #0b241b;
}

/* ---- Logos ---- */
          /* oben links größer */
img.footer3_company-logo { max-width: 210px; width: 42%; height: auto; }  /* unten kleiner */

/* ---- Ablauf-Karten: mehr Luft zwischen den Punkten ---- */
.news_item-collection { gap: 3.5rem 3rem; }
.news_item { padding-right: 1.5rem; }
.news_item .text { max-width: 34ch; }
@media (max-width: 991px){ .news_item-collection { gap: 2.5rem; } }

/* ---- Rechtsseiten: Titel zentriert wie im Original ---- */
.main-wrapper > div > section .padding-section-large .max-width-large h1.heading-style-h1 { text-align: center; }
.main-wrapper > div > section .padding-section-large .max-width-large { margin: 0 auto; max-width: 48rem; }

/* ---- Breitbild im 16:9-Format statt hochkant ---- */
.media_image-desktop, .media_image-mobile {
  aspect-ratio: 16 / 9; width: 100%; height: auto; object-fit: cover;
}
.media_component, .media_wrapper { max-height: none; }

/* ---- einfache Navigation statt Mega-Menü ---- */
.sc-nav { display: flex; align-items: center; gap: 2rem; }
.sc-nav__link { white-space: nowrap; text-decoration: none; color: inherit; font-size: .95rem; }
.sc-nav__link:hover { text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 991px){
  .sc-nav { flex-direction: column; align-items: flex-start; gap: 1.25rem; padding: 1.5rem 0; }
  .sc-nav__link { font-size: 1.25rem; }
}

/* ---- schlanker Footer ---- */
.sc-footer { background: var(--_primitive-colors---brand--mahogany, #0b241b); color: #f7f5f0; padding: 3.5rem 0 2.5rem; }
.sc-footer__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem 2.5rem; }
.sc-footer__logo img { height: 30px; width: auto; display: block; }
.sc-footer__links { display: flex; flex-wrap: wrap; gap: 1.75rem; }
.sc-footer__links a { color: inherit; text-decoration: none; font-size: .9375rem; opacity: .85; }
.sc-footer__links a:hover { opacity: 1; text-decoration: underline; text-underline-offset: 4px; }
.sc-footer__note { font-size: .8125rem; opacity: .6; margin: 0; width: 100%; padding-top: 1.5rem; border-top: 1px solid rgba(247,245,240,.14); }
@media (max-width: 767px){ .sc-footer__inner { flex-direction: column; align-items: flex-start; } }

/* ---- Logo groesser ---- */
.navbar1_logo img, .navbar1_logo-link img { height: 46px !important; width: auto !important; }
@media (max-width: 767px){ .navbar1_logo img, .navbar1_logo-link img { height: 42px !important; } }


/* ---- Navigation faerbt sich beim Scrollen schwarz ---- */
#navbar_component, #navbar_component .navbar1_container { transition: background-color .25s ease, box-shadow .25s ease; }
html.nav-solid #navbar_component { background-color: #0b0d0c !important; box-shadow: 0 10px 30px rgba(0,0,0,.2); }
html.nav-solid #navbar_component .sc-nav__link { color: #f7f5f0; }

/* ---- Kontaktformular im Termin-Dialog ---- */
.sc-form-panel { padding: .5rem 3.5rem 3.5rem; }
.sc-form { display: flex; flex-direction: column; gap: 1.5rem; color: #f7f5f0; }
.sc-form__title { margin: 0; font-size: 1.5rem; line-height: 1.25; color: #f7f5f0; }
.sc-form__intro { margin: -1rem 0 0; font-size: .9375rem; color: rgba(247,245,240,.62); }
.sc-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem 1.5rem; }
.sc-form__field { display: flex; flex-direction: column; gap: .45rem; }
.sc-form__field.is-wide { grid-column: 1 / -1; }
.sc-form__label { font-size: .8125rem; letter-spacing: .01em; color: rgba(247,245,240,.72); }
.sc-form__label em { font-style: normal; color: rgba(247,245,240,.4); }
.sc-form__input {
  width: 100%; padding: .85rem 1rem; font: inherit; font-size: .9375rem; color: #f7f5f0;
  background: rgba(247,245,240,.06); border: 1px solid rgba(247,245,240,.18);
  border-radius: .5rem; transition: border-color .2s ease, background-color .2s ease;
}
.sc-form__input::placeholder { color: rgba(247,245,240,.35); }
.sc-form__input:focus {
  outline: none; border-color: rgba(247,245,240,.55); background: rgba(247,245,240,.1);
}
textarea.sc-form__input { resize: vertical; min-height: 7rem; line-height: 1.6; }
.sc-form__consent { display: flex; gap: .7rem; align-items: flex-start;
  font-size: .8125rem; line-height: 1.55; color: rgba(247,245,240,.62); }
.sc-form__consent input { margin-top: .2rem; width: 1rem; height: 1rem; accent-color: #1d5a48; flex: 0 0 auto; }
.sc-form__consent a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.sc-form__trap { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.sc-form__footer { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; }
.sc-form__submit {
  padding: .9rem 1.6rem; font: inherit; font-size: .9375rem; color: #0b241b; cursor: pointer;
  background: #f7f5f0; border: 0; border-radius: 999px; transition: opacity .2s ease, transform .2s ease;
}
.sc-form__submit:hover { opacity: .88; }
.sc-form__submit:disabled { opacity: .5; cursor: default; }
.sc-form__note { margin: 0; font-size: .8125rem; color: rgba(247,245,240,.5); }
.sc-form__note a { color: rgba(247,245,240,.82); text-decoration: underline; text-underline-offset: 3px; }
.sc-form__status:empty { display: none; }
.sc-form__status { margin: 0; font-size: .875rem; color: rgba(247,245,240,.85); }
@media (max-width: 767px){
  .sc-form-panel { padding: .25rem 1.5rem 2rem; }
  .sc-form__grid { grid-template-columns: 1fr; }
  .sc-form__title { font-size: 1.25rem; }
}

/* ---- zentrierter Abschnittskopf ---- */
.section_header-content.sc-center { justify-content: center !important; align-items: center !important; }
.section_header-content.sc-center .section_header-content-left {
  display: flex !important; flex-direction: column !important; align-items: center !important;
  width: 100%; text-align: center;
}
.section_header-content.sc-center .w-layout-hflex { justify-content: center !important; }
.section_header-content.sc-center .max-width-left-h2 { max-width: 40rem; margin: 0 auto; }
.section_header-content.sc-center h2 { text-align: center; }

/* ---- Strich-Illustration in der Spaltenreihe ---- */
.step-item.sc-ill { display: flex; align-items: center; justify-content: center;
  border: 0 !important; padding: 0 !important; }
.step-item.sc-ill svg { width: 100%; max-width: 6.5rem; height: auto;
  color: var(--_primitive-colors---brand--obsidian, #15201a); opacity: .9; }
@media (max-width: 991px){ .step-item.sc-ill { display: none; } }

/* ---- Vorstellung ---- */
.sc-about { display: grid; grid-template-columns: 1fr 0.85fr; gap: 3rem 4rem; align-items: center; }
.sc-about__media { position: relative; }
.sc-about__image { width: 100%; height: auto; aspect-ratio: 4 / 5;
  object-fit: cover; object-position: 50% 20%; border-radius: .75rem; display: block; }
.sc-about__title { margin: .75rem 0 1.5rem; }
.sc-about__text p { margin: 0 0 1rem; line-height: 1.7; max-width: 34rem; }

/* ---- Ablauf mit Illustration: fuenf Spalten ---- */
@media (min-width: 992px){
  .steps-grid.sc-steps-5 { grid-template-columns: 1fr 1fr .85fr 1fr 1fr; }
}

/* ---- keine Versalien in den Labels ---- */
.tag, .text-mono { text-transform: none !important; letter-spacing: .02em; }

/* ---- Sprungziele nicht unter die Navigation schieben ---- */
#anlagewege, #ansatz, #person, #warum, #ablauf { scroll-margin-top: 6rem; }

/* ---- Logo mittig in der Leiste ---- */
#navbar_component .navbar1_container { align-items: center; }
#navbar_component .navbar1_logo-link, #navbar_component .navbar1_logo {
  display: flex !important; align-items: center; height: 100%;
}
#navbar_component .navbar1_logo img, #navbar_component .navbar1_logo-link img {
  display: block; align-self: center;
}
@media (max-width: 991px){
  #navbar_component { min-height: 4.5rem; }
  #navbar_component .navbar1_container { min-height: 4.5rem; }
  .navbar1_logo img, .navbar1_logo-link img { height: 38px !important; }
}

#navbar_component, #navbar_component .navbar1_container { min-height: 5rem; height: auto; }

/* ---- schwebende Bilder: eigene Abrundung und Zuschnitt ---- */
.image-scroll { object-fit: cover; border-radius: .5rem; }
.image-scroll-wrapper { will-change: transform; }
.image-scroll-wrapper .image-scroll { filter: blur(0); transition: filter .7s ease; }
.image-scroll-wrapper.is-blurred .image-scroll { filter: blur(7px); }
.image-scroll-mobile { object-fit: cover; border-radius: .5rem; }

/* ---- Fragen ---- */
.sc-faq-section { background: #fff; }
.sc-faq-section .container-large { display: grid; grid-template-columns: 1fr; }
.sc-faq__head { display: flex; flex-direction: column; gap: 1.25rem; }
.sc-faq__head h2 { margin: 0; }
.sc-faq__intro { margin: 0; max-width: 32rem; font-size: 1rem; line-height: 1.6; opacity: .68; }
.sc-faq { max-width: none; margin: 0; }
.sc-faq__group + .sc-faq__group { margin-top: 3.5rem; }
.sc-faq__group-title { margin: 0 0 .25rem; font-size: 1.375rem; }
.sc-faq__group-title span { font-size: .9375rem; opacity: .4; margin-left: .35rem; }
.sc-faq__list { border-top: 1px solid rgba(15,52,39,.16); }
.sc-faq__item { border-bottom: 1px solid rgba(15,52,39,.16); }
.sc-faq__question { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
  width: 100%; padding: 1.35rem 0; background: none; border: 0; cursor: pointer;
  font: inherit; font-size: 1rem; color: inherit; text-align: left; }
.sc-faq__question:hover .sc-faq__text { opacity: .6; }
.sc-faq__text { transition: opacity .2s ease; }
.sc-faq__icon { flex: 0 0 auto; display: inline-flex; opacity: .45; transition: transform .25s ease, opacity .2s ease; }
.sc-faq__question[aria-expanded="true"] .sc-faq__icon { transform: rotate(180deg); opacity: .8; }
.sc-faq__answer { max-height: 0; overflow: hidden; transition: max-height .3s ease; }
.sc-faq__answer p { margin: 0 0 1.5rem; max-width: 44rem; font-size: .9375rem; line-height: 1.75; opacity: .75; }
@media (max-width: 767px){
  .sc-faq__head { text-align: left; align-items: flex-start; margin-bottom: 2.5rem; }
  .sc-faq__question { font-size: .9375rem; padding: 1.15rem 0; }
  .sc-faq__group + .sc-faq__group { margin-top: 2.5rem; }
}

/* ---- neue Abschnitte ueber den Hintergrundflaechen halten ---- */
.sc-scroll { position: relative; z-index: 3; background: var(--_primitive-colors---walnut--walnut-50, #f7f5f0); }
.sc-faq-section { position: relative; z-index: 3; }

/* ---- Text laenger sticky halten, Bilder ziehen innerhalb der Sektion vorbei ---- */
@media (min-width: 992px){
  .sc-scroll .image-scroll-section { height: 190dvh; }
  .sc-scroll .images-scroll-outwrap { height: 188dvh; margin-top: -190dvh; }
}

/* ---- Fragen zweispaltig: links der Text, rechts die Akkordeons ---- */
@media (min-width: 992px){
  .sc-faq-layout { display: grid; grid-template-columns: 0.8fr 1fr; gap: 4rem 5rem; align-items: start; }
  .sc-faq__head { position: sticky; top: 7rem; margin: 0; max-width: 24rem; }
  .sc-faq__head h2 { font-size: clamp(2rem, 2.6vw, 2.5rem); }
  .sc-faq__group + .sc-faq__group { margin-top: 2.75rem; }
}

.sc-faq__head .tag { align-self: flex-start; }

/* ---- Bilder weiter nach aussen, damit sie den Text weniger ueberdecken ---- */
@media (min-width: 992px){
  .sc-scroll .image-scroll-wrapper.scroll-3 { margin-left: -13.5rem; }
  .sc-scroll .image-scroll-wrapper.scroll-4 { margin-right: -17.5rem; }
  .sc-scroll .image-scroll-wrapper.scroll-5 { margin-right: -10.5rem; }
  .sc-scroll .image-scroll-wrapper.scroll-6 { margin-left: -15.5rem; }
}

/* ---- CTA-Abschnitt: Text und Button unten am Abschnitt ---- */
@media (min-width: 992px) {
  .sc-cta-sec .padding-global { min-height: inherit; display: flex; flex-direction: column; }
  .sc-cta-sec .container-large { flex: 1 1 auto; position: relative; }
  .sc-cta-sec .section_header-content { position: static; }
  .sc-cta-sec .section_header-right-col {
    position: absolute; right: 0; bottom: 160px;
    width: 40%; max-width: 28rem; }
}
