/*
 * KJP Knappmeyer – Gemeinsames Stylesheet
 * ─────────────────────────────────────────
 * Farbpalette:
 *   Sage dunkel  #4D7A72   (Hauptfarbe, Header, Dark-Sections)
 *   Sage mittel  #6E9E97   (Links, Akzente)
 *   Sage hell    #C5DBD8   (Hintergründe, helle Elemente)
 *   Sage BG      #EBF3F1   (Sektions-Hintergrund)
 *   Terra Cotta  #C5714F   (CTA-Buttons, Tags, Dots)
 *   Cream        #FAF8F4   (Seiten-Hintergrund)
 *   Cream dunkel #F0EBE3   (Wechsel-Sektionen)
 *   Charcoal     #263832   (Footer, Überschriften)
 */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

body {
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    background: #FAF8F4;
    color: #3A3A3A;
    line-height: 1.7;
}

/* ── Layout ── */
.container { max-width: 1100px; margin: 0 auto; padding: 0 40px; }
.section    { padding: 100px 0; }

/* ── Hintergründe ── */
.bg-cream2    { background: #F0EBE3; }
.bg-sage-bg   { background: #EBF3F1; }
.bg-sage-dark { background: #4D7A72; }
.bg-charcoal  { background: #263832; }

/* ── Typografie ── */
h1, h2, h3, h4 {
    font-family: 'Lora', serif;
    color: #263832;
    line-height: 1.2;
}

.tag {
    display: inline-block;
    font-size: 11.5px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #C5714F;
    font-weight: 500;
    margin-bottom: 16px;
}
.tag--white { color: #C5DBD8; }

/* ── Buttons ── */
.btn {
    display: inline-block;
    padding: 13px 30px;
    border-radius: 3px;
    font-size: 14.5px;
    font-weight: 500;
    text-decoration: none;
    border: none;
    transition: all 0.2s ease;
    letter-spacing: 0.02em;
    cursor: pointer;
}
.btn-terra          { background: #C5714F; color: #fff; }
.btn-terra:hover    { background: #A85A3A; transform: translateY(-1px); }
.btn-sage           { background: #4D7A72; color: #fff; }
.btn-sage:hover     { background: #3D6560; transform: translateY(-1px); }
.btn-outline-white  { border: 1.5px solid rgba(255,255,255,0.55); color: #fff; }
.btn-outline-white:hover { border-color: #fff; background: rgba(255,255,255,0.08); }

/* ── Bild-Platzhalter ── */
.img-ph {
    width: 100%; height: 100%;
    background: #B5CCC9;
    display: flex; flex-direction: column;
    gap: 10px; align-items: center; justify-content: center;
    color: #4D7A72; font-size: 12.5px;
    letter-spacing: 0.07em; text-transform: uppercase;
}
.img-ph svg { opacity: 0.35; }

/* ════════════════════════════════
   NAVIGATION
════════════════════════════════ */
.nav {
    position: sticky; top: 0; z-index: 100;
    background: #FAF8F4;
    border-bottom: 1px solid rgba(77,122,114,0.18);
    padding: 15px 48px;
    display: flex; align-items: center; justify-content: space-between;
}

.nav__logo {
    font-family: 'Lora', serif;
    font-size: 16.5px; color: #263832;
    text-decoration: none; line-height: 1.35;
}
.nav__logo-img {
    height: 48px;
    width: auto;
    display: block;
}
.nav__logo small {
    display: block;
    font-family: 'Inter', sans-serif;
    font-size: 11px; font-weight: 300;
    color: #6E9E97; letter-spacing: 0.07em; text-transform: uppercase;
}

.nav__menu {
    display: flex; align-items: center;
    list-style: none; gap: 36px;
}
.nav__menu a {
    font-size: 15px; color: #263832;
    text-decoration: none; position: relative; transition: color 0.2s;
}
.nav__menu a:not(.nav__btn)::after {
    content: ''; position: absolute;
    bottom: -3px; left: 0; width: 0; height: 1.5px;
    background: #C5714F; transition: width 0.25s;
}
.nav__menu a:not(.nav__btn):hover { color: #C5714F; }
.nav__menu a:not(.nav__btn):hover::after { width: 100%; }
.nav__menu a.active      { color: #C5714F; }
.nav__menu a.active::after { width: 100%; }
.nav__menu a.nav__active { color: #C5714F; }
.nav__menu a.nav__active::after { width: 100%; }

.nav__btn {
    background: #C5714F; color: #fff !important;
    padding: 9px 22px; border-radius: 3px; font-size: 14px !important;
}
.nav__btn:hover { background: #A85A3A !important; }
.nav__btn::after { display: none !important; }

/* ════════════════════════════════
   HAMBURGER BUTTON
════════════════════════════════ */
.nav__hamburger {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 40px; height: 40px;
    background: none; border: none;
    cursor: pointer; padding: 4px;
    flex-shrink: 0;
}
.nav__hamburger span {
    display: block;
    width: 24px; height: 1.5px;
    background: #263832; border-radius: 2px;
    transition: transform 0.3s ease, opacity 0.2s ease;
}
.nav__hamburger.is-open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.nav__hamburger.is-open span:nth-child(2) { opacity: 0; }
.nav__hamburger.is-open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* ════════════════════════════════
   PAGE HERO (Unterseiten)
════════════════════════════════ */
.page-hero { background: #4D7A72; padding: 72px 40px; text-align: center; }
.page-hero h1 { font-size: clamp(28px, 4vw, 44px); color: #fff; margin-top: 8px; margin-bottom: 16px; }
.page-hero p { color: rgba(255,255,255,0.8); font-size: 16.5px; max-width: 540px; margin: 0 auto; line-height: 1.8; }

/* ════════════════════════════════
   HERO (Startseite)
════════════════════════════════ */
blockquote {
  position: relative;
  padding: 20px 40px;
  font-family: 'Lora', serif;
  font-style: italic;
  font-size: 1.2rem;
}

blockquote::before {
  content: "\201C"; /* Großes öffnendes Anführungszeichen (Unicode) */
  position: absolute;
  top: 0;
  left: 0;
  font-size: 5rem; /* Größe des Zeichens */
  line-height: 1;
  color: #4D7A72; /* Farbe des Anführungszeichens */
}

blockquote::after {
  content: "\201D"; /* Großes schließendes Anführungszeichen (optional) */
  position: absolute;
  bottom: -20px;
  right: 0;
  font-size: 5rem;
  line-height: 1;
  color: #4D7A72;
}




.hero {
    display: grid; grid-template-columns: 1fr 1fr;
    min-height: calc(88vh - 108px);
}
.hero__left {
    background: #4D7A72;
    padding: 72px 72px 72px 56px;
    display: flex; flex-direction: column; justify-content: center;
}
.hero__eyebrow {
    font-size: 11.5px; letter-spacing: 0.2em; text-transform: uppercase;
    color: #C5DBD8; margin-bottom: 28px;
}
.hero__h1 {
    font-family: 'Lora', serif;
    font-size: clamp(44px, 5.5vw, 68px);
    color: #fff; line-height: 1.1; margin-bottom: 28px;
}
.hero__h1 span { font-style: italic; color: #C5DBD8; }

.hero__h2 {
    font-family: 'Lora', serif;
    font-size: clamp(44px, 5.5vw, 42px);
    color: #fff; line-height: 1.1; margin-bottom: 28px;
}
.hero__h2 span { font-style: italic; color: #4D7A72; }
.hero__h1 span { font-style: italic; color: #C5DBD8; }

.hero__h3 {
    font-family: 'Lora', serif;
    font-size: clamp(44px, 5.5vw, 42px);
    color: #fff; line-height: 1.1; margin-bottom: 28px;
}
.hero__h3 span { font-style: italic; color: #C5DBD8; }

.hero__p {
    font-size: 16.5px; color: rgba(255,255,255,0.82);
    line-height: 1.8; max-width: 400px; margin-bottom: 44px;
}
.hero__actions { display: flex; gap: 16px; flex-wrap: wrap; }
.hero__right { background: #C5DBD8; overflow: hidden; }

/* ════════════════════════════════
   INTRO GRID (Startseite)
════════════════════════════════ */
.intro-grid {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: 88px; align-items: center;
}
.intro-grid h2 { font-size: clamp(26px, 3vw, 40px); margin-bottom: 20px; }
.intro-grid p { color: #5E706A; font-size: 16px; line-height: 1.85; margin-bottom: 16px; }
.intro-grid p:last-of-type { margin-bottom: 32px; }
.intro-grid__img { height: 520px; border-radius: 2px; overflow: hidden; }

/* ════════════════════════════════
   KARTEN
════════════════════════════════ */
.cards-header { text-align: center; margin-bottom: 56px; }
.cards-header h2 { font-size: clamp(26px, 3vw, 38px); margin-bottom: 14px; }
.cards-header p { color: #5E706A; font-size: 16px; max-width: 540px; margin: 0 auto; }

.cards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }

.card {
    background: #FAF8F4;
    border: 1px solid rgba(77,122,114,0.18);
    border-radius: 4px; padding: 44px 36px;
    transition: box-shadow 0.25s, transform 0.25s;
}
.card:hover {
    box-shadow: 0 10px 40px rgba(38,56,50,0.1);
    transform: translateY(-4px);
}
.card__icon {
    width: 52px; height: 52px;
    background: #EBF3F1; border-radius: 50%;
    display: grid; place-items: center; margin-bottom: 24px;
}
.card__icon svg {
    width: 22px; height: 22px;
    stroke: #4D7A72; fill: none;
    stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
}
.card h3 { font-size: 19px; margin-bottom: 12px; }
.card p  { font-size: 15px; color: #5E706A; line-height: 1.78; }
.card__link {
    display: inline-block; margin-top: 20px;
    font-size: 13.5px; font-weight: 500;
    color: #C5714F; text-decoration: none;
}
.card__link:hover { text-decoration: underline; }

/* ════════════════════════════════
   METHODEN-LEISTE
════════════════════════════════ */
.methods-wrap { max-width: 1100px; margin: 0 auto; padding: 0 40px; }
.methods-strip { display: grid; grid-template-columns: repeat(5, 1fr); }
.method-item {
    padding: 44px 24px; text-align: center;
    border-right: 1px solid rgba(255,255,255,0.12);
}
.method-item:last-child { border-right: none; }
.method-item h4 {
    font-family: 'Lora', serif; font-size: 16px;
    color: #fff; margin-bottom: 6px;
}
.method-item p { font-size: 13px; color: rgba(255,255,255,0.6); line-height: 1.5; }

/* ════════════════════════════════
   ÜBER MICH
════════════════════════════════ */
.about-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 88px; align-items: center; }
.about-img-wrap { position: relative; }
.about-img      { height: 540px; border-radius: 2px; overflow: hidden; }
.about-img-wrap::after {
    content: '';
    position: absolute; bottom: -20px; right: -20px;
    width: 90px; height: 90px;
    border: 2.5px solid #C5714F;
    border-radius: 2px; z-index: -1;
}
.about-text h2 { font-size: clamp(26px, 3vw, 38px); margin-bottom: 8px; }
.about-text .sub { font-size: 14px; color: #6E9E97; letter-spacing: 0.04em; margin-bottom: 20px; }
.about-text p { color: #5E706A; font-size: 16px; line-height: 1.85; margin-bottom: 16px; }
.qual-list { list-style: none; margin: 24px 0 36px; }
.qual-list li {
    font-size: 15px; color: #5E706A;
    padding: 11px 0;
    border-bottom: 1px solid rgba(77,122,114,0.18);
    display: flex; align-items: center; gap: 14px;
}
.qual-list li::before {
    content: ''; width: 5px; height: 5px;
    border-radius: 50%; background: #C5714F; flex-shrink: 0;
}

/* ════════════════════════════════
   FAKTEN
════════════════════════════════ */
.facts-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.fact-item {
    padding: 56px 32px; text-align: center;
    border-right: 1px solid rgba(77,122,114,0.18);
}
.fact-item:last-child { border-right: none; }
.fact-item__num {
    font-family: 'Lora', serif; font-size: 52px;
    color: #4D7A72; line-height: 1; margin-bottom: 10px;
}
.fact-item__num sup { font-size: 26px; vertical-align: super; }
.fact-item__label { font-size: 14px; color: #5E706A; max-width: 150px; margin: 0 auto; line-height: 1.55; }

/* ════════════════════════════════
   CTA-BOX / CTA-CENTER
════════════════════════════════ */
.cta-box { text-align: center; max-width: 660px; margin: 0 auto; }
.cta-box h2 { font-size: clamp(26px, 3vw, 38px); margin-bottom: 20px; }
.cta-box p  { color: #5E706A; font-size: 16.5px; line-height: 1.85; margin-bottom: 40px; }
.cta-box__btns { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

.cta-center { text-align: center; max-width: 660px; margin: 0 auto; }
.cta-center h2 { font-size: clamp(26px, 3vw, 38px); margin-bottom: 20px; }
.cta-center p { color: #5E706A; font-size: 16.5px; line-height: 1.85; margin-bottom: 40px; }
.cta-center__btns { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

/* ════════════════════════════════
   KONTAKT-SPLIT (Startseite)
════════════════════════════════ */
.contact-split { display: grid; grid-template-columns: 1fr 1fr; min-height: 480px; }
.contact-split__info {
    background: #4D7A72; padding: 72px 64px;
    display: flex; flex-direction: column; justify-content: center; gap: 24px;
}
.contact-split__info h2 { font-family: 'Lora', serif; font-size: 30px; color: #fff; }
.ci-row { display: flex; gap: 20px; align-items: flex-start; }
.ci-row__label {
    font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
    color: #C5DBD8; min-width: 96px; padding-top: 3px; flex-shrink: 0;
}
.ci-row__val { font-size: 15px; color: rgba(255,255,255,0.88); line-height: 1.65; }
.ci-row__val a { color: rgba(255,255,255,0.88); text-decoration: none; }
.ci-row__val a:hover { text-decoration: underline; }
.contact-split__map { background: #B5CCC9; overflow: hidden; }

/* ════════════════════════════════
   FOOTER
════════════════════════════════ */
.footer { background: #263832; padding: 40px 0; }
.footer__inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.footer__brand { font-family: 'Lora', serif; font-size: 15px; color: rgba(255,255,255,0.88); }
.footer__brand small {
    display: block; font-family: 'Inter', sans-serif;
    font-size: 11px; font-weight: 300;
    color: rgba(255,255,255,0.4); letter-spacing: 0.06em;
}
.footer__links { display: flex; gap: 28px; list-style: none; }
.footer__links a { color: rgba(255,255,255,0.55); font-size: 13.5px; text-decoration: none; transition: color 0.2s; }
.footer__links a:hover { color: rgba(255,255,255,0.88); }
.footer__copy { font-size: 12.5px; color: rgba(255,255,255,0.35); }

/* ════════════════════════════════
   HALTUNG-BOX (Über mich)
════════════════════════════════ */
.haltung-box { max-width: 700px; margin: 0 auto; text-align: center; }
.haltung-box h2 { font-size: clamp(26px, 3vw, 38px); margin-bottom: 20px; }
.haltung-box p { color: #5E706A; font-size: 16.5px; line-height: 1.85; margin-bottom: 16px; }

/* ════════════════════════════════
   METHODS-GRID (Über mich)
════════════════════════════════ */
.methods-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 56px; }

/* ════════════════════════════════
   DETAIL-KARTEN (Leistungen)
════════════════════════════════ */
.detail-card { background: #FAF8F4; border: 1px solid rgba(77,122,114,0.18); border-radius: 4px; padding: 52px 48px; margin-bottom: 24px; }
.detail-card:last-child { margin-bottom: 0; }
.detail-card__header { display: flex; align-items: center; gap: 20px; margin-bottom: 20px; }
.detail-card h3 { font-size: 22px; }
.detail-card p { color: #5E706A; font-size: 16px; line-height: 1.85; margin-bottom: 14px; }
.detail-card p:last-child { margin-bottom: 0; }
.detail-card ul { list-style: none; margin: 16px 0; }
.detail-card ul li { font-size: 15px; color: #5E706A; padding: 8px 0; border-bottom: 1px solid rgba(77,122,114,0.12); display: flex; align-items: center; gap: 12px; }
.detail-card ul li::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: #C5714F; flex-shrink: 0; }
.detail-card ul li:last-child { border-bottom: none; }
.detail-card .card__icon { width: 60px; height: 60px; background: #EBF3F1; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0; }
.detail-card .card__icon svg { width: 26px; height: 26px; stroke: #4D7A72; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }

/* Elternberatung */
.eltern-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 72px; align-items: center; }
.eltern-img { height: 360px; border-radius: 2px; overflow: hidden; }

/* FAQ */
.faq-list { max-width: 760px; margin: 48px auto 0; }
.faq-item { padding: 28px 0; border-bottom: 1px solid rgba(77,122,114,0.18); }
.faq-item:last-child { border-bottom: none; }
.faq-item h3 { font-size: 17px; color: #4D7A72; margin-bottom: 12px; font-family: 'Lora', serif; }
.faq-item p { font-size: 15px; color: #5E706A; line-height: 1.8; }

/* Methoden Detail Grid */
.methods-detail-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 48px; }

/* ════════════════════════════════
   SCHRITTE & KOSTEN (Ablauf)
════════════════════════════════ */
.steps-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin-top: 56px; position: relative; }
.step-card { background: #FAF8F4; border: 1px solid rgba(77,122,114,0.18); border-radius: 4px; padding: 44px 36px; text-align: center; position: relative; }
.step-number { font-family: 'Lora', serif; font-size: 64px; color: #C5714F; line-height: 1; margin-bottom: 16px; }
.step-card h3 { font-size: 20px; margin-bottom: 14px; }
.step-card p { font-size: 15px; color: #5E706A; line-height: 1.8; }
.step-hint { margin-top: 32px; padding: 20px 24px; background: rgba(197,113,79,0.06); border-left: 3px solid #C5714F; border-radius: 2px; font-size: 14.5px; color: #5E706A; line-height: 1.65; font-style: italic; }

.price-display { text-align: center; margin: 40px 0 32px; }
.price-display__num { font-family: 'Lora', serif; font-size: 80px; color: #4D7A72; line-height: 1; }
.price-display__num sup { font-size: 40px; vertical-align: super; }
.price-display__label { font-size: 16px; color: #5E706A; margin-top: 8px; }
.cost-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; margin-top: 40px; }
.cost-text p { color: #5E706A; font-size: 16px; line-height: 1.85; margin-bottom: 14px; }
.benefits-list { list-style: none; }
.benefits-list li { font-size: 15px; color: #5E706A; padding: 10px 0; border-bottom: 1px solid rgba(77,122,114,0.15); display: flex; align-items: flex-start; gap: 12px; line-height: 1.65; }
.benefits-list li::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: #C5714F; flex-shrink: 0; margin-top: 9px; }
.pkv-hint { margin-top: 24px; padding: 18px 20px; background: rgba(77,122,114,0.08); border-left: 3px solid #6E9E97; border-radius: 2px; font-size: 14px; color: #5E706A; line-height: 1.65; }

.section-header { text-align: center; }
.section-header h2 { font-size: clamp(26px, 3vw, 38px); margin-bottom: 14px; }
.section-header p { color: #5E706A; font-size: 16px; max-width: 540px; margin: 0 auto; }

.kosten-header h2 { font-size: clamp(26px, 3vw, 38px); margin-bottom: 14px; }
.kosten-header p { color: #5E706A; font-size: 16px; margin-bottom: 0; }

/* ════════════════════════════════
   KONTAKTSEITE
════════════════════════════════ */
.contact-layout { display: grid; grid-template-columns: 1fr 1.4fr; min-height: 640px; }
.contact-info { background: #263832; padding: 72px 56px; display: flex; flex-direction: column; justify-content: center; gap: 28px; }
.contact-info h2 { font-family: 'Lora', serif; font-size: 28px; color: #fff; margin-bottom: 8px; }
.contact-info__note { margin-top: 8px; padding: 20px; background: rgba(255,255,255,0.07); border-left: 3px solid #C5714F; border-radius: 2px; font-size: 14px; color: rgba(255,255,255,0.7); line-height: 1.65; }
.contact-form-wrap { background: #FAF8F4; padding: 64px 56px; display: flex; flex-direction: column; justify-content: center; }
.contact-form-wrap h2 { font-size: 26px; margin-bottom: 8px; }
.contact-form-wrap > p { color: #5E706A; font-size: 15px; margin-bottom: 36px; }
.contact-form { display: flex; flex-direction: column; gap: 20px; }
.hp-field { position: absolute; left: -9999px; top: -9999px; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-group { display: flex; flex-direction: column; gap: 6px; }
.form-label { font-size: 13.5px; font-weight: 500; color: #263832; letter-spacing: 0.01em; }
.form-label .req { color: #C5714F; margin-left: 2px; }
.form-label .opt { color: #8A9E98; font-weight: 400; font-size: 12px; }
.form-input { padding: 11px 14px; border: 1.5px solid rgba(77,122,114,0.3); border-radius: 3px; font-family: 'Inter', sans-serif; font-size: 15px; color: #263832; background: #fff; transition: border-color 0.2s, box-shadow 0.2s; outline: none; width: 100%; }
.form-input:focus { border-color: #6E9E97; box-shadow: 0 0 0 3px rgba(110,158,151,0.15); }
.form-input.is-error { border-color: #C5714F; }
textarea.form-input { resize: vertical; min-height: 140px; line-height: 1.65; }
.char-count { font-size: 12px; color: #8A9E98; text-align: right; margin-top: 4px; }
.checkbox-label { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; }
.checkbox-label input[type="checkbox"] { width: 18px; height: 18px; flex-shrink: 0; accent-color: #4D7A72; margin-top: 2px; cursor: pointer; }
.checkbox-text { font-size: 13.5px; color: #5E706A; line-height: 1.6; }
.checkbox-text a { color: #4D7A72; }
.checkbox-text a:hover { text-decoration: none; }
.form-note { font-size: 12.5px; color: #8A9E98; line-height: 1.5; }
.btn-submit { width: 100%; text-align: center; padding: 14px; font-size: 15px; }
.alert { padding: 16px 20px; border-radius: 3px; font-size: 14.5px; line-height: 1.65; }
.alert--error { background: #fdf2f0; border: 1px solid rgba(197,113,79,0.35); color: #a04030; }
.alert--error ul { margin: 8px 0 0 16px; }
.alert--error li { margin-bottom: 4px; }
.success-box { text-align: center; padding: 56px 32px; }
.success-box__icon { width: 64px; height: 64px; border-radius: 50%; background: #EBF3F1; display: grid; place-items: center; margin: 0 auto 24px; }
.success-box__icon svg { width: 28px; height: 28px; stroke: #4D7A72; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.success-box h2 { font-size: 26px; margin-bottom: 12px; }
.success-box p  { color: #5E706A; font-size: 16px; line-height: 1.8; margin-bottom: 8px; }
.success-box a  { color: #4D7A72; }
.honeypot-note { background: #f5f5f5; border: 1px dashed #ccc; padding: 12px; font-size: 12px; color: #888; margin-bottom: 4px; border-radius: 2px; }
.anfahrt-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; }
.anfahrt-text h3 { font-size: 18px; margin-bottom: 10px; color: #263832; }
.anfahrt-text p { font-size: 15px; color: #5E706A; line-height: 1.8; margin-bottom: 24px; }
.map-ph { height: 300px; border-radius: 2px; overflow: hidden; }
.barrierefrei-note { text-align: center; margin-top: 32px; font-size: 14px; color: #5E706A; }
.barrierefrei-note strong { color: #4D7A72; }

/* ════════════════════════════════
   RESPONSIVE – TABLET (≤ 900px)
════════════════════════════════ */
@media (max-width: 900px) {
    .container    { padding: 0 28px; }
    .section      { padding: 72px 0; }
    .methods-wrap { padding: 0 28px; }

    /* Nav */
    .nav { padding: 12px 28px; }
    .nav__hamburger { display: flex; }
    .nav__menu {
        display: none;
        position: fixed;
        top: 102px; left: 0; right: 0;
        background: #FAF8F4;
        flex-direction: column;
        padding: 16px 28px 28px;
        gap: 0;
        border-bottom: 1px solid rgba(77,122,114,0.2);
        box-shadow: 0 8px 24px rgba(38,56,50,0.08);
        z-index: 99;
    }
    .nav__menu.is-open { display: flex; }
    .nav__menu li { width: 100%; }
    .nav__menu a:not(.nav__btn) {
        display: block;
        padding: 14px 0;
        font-size: 17px;
        border-bottom: 1px solid rgba(77,122,114,0.1);
    }
    .nav__menu a:not(.nav__btn)::after { display: none; }
    .nav__menu li:last-child { margin-top: 20px; }
    .nav__btn { display: inline-block; font-size: 15px !important; padding: 12px 24px; }

    /* Hero */
    .hero       { grid-template-columns: 1fr; min-height: auto; }
    .hero__left { padding: 64px 40px; }
    .hero__right { height: auto; overflow: visible; }

    /* Intro */
    .intro-grid     { grid-template-columns: 1fr; gap: 40px; }
    .intro-grid__img { height: 300px; }

    /* Karten */
    .cards-grid { grid-template-columns: 1fr 1fr; }

    /* Methoden-Leiste: 3 Spalten */
    .methods-strip { grid-template-columns: repeat(3, 1fr); }
    .method-item   { border-right: 1px solid rgba(255,255,255,0.12); }
    .method-item:nth-child(3n)  { border-right: none; }
    .method-item:nth-child(n+4) { border-top: 1px solid rgba(255,255,255,0.12); }

    /* Über mich */
    .about-grid { grid-template-columns: 1fr; gap: 48px; }
    .about-img  { height: 360px; }
    .about-img-wrap::after { display: none; }

    /* Fakten: 2x2 */
    .facts-grid { grid-template-columns: repeat(2, 1fr); }
    .fact-item  { border-right: 1px solid rgba(77,122,114,0.18); }
    .fact-item:nth-child(2n)  { border-right: none; }
    .fact-item:nth-child(n+3) { border-top: 1px solid rgba(77,122,114,0.18); }

    /* Kontakt-Split (Startseite) */
    .contact-split      { grid-template-columns: 1fr; min-height: auto; }
    .contact-split__info { padding: 56px 40px; }
    .contact-split__map { height: 320px; }

    /* Footer */
    .footer__inner { flex-direction: column; text-align: center; gap: 20px; }
    .footer__links { justify-content: center; }

    /* Page hero */
    .page-hero { padding: 56px 28px; }

    /* Methods grid (Über mich) */
    .methods-grid { grid-template-columns: repeat(2, 1fr); }

    /* Detail-Karten (Leistungen) */
    .detail-card { padding: 40px 32px; }
    .eltern-grid { grid-template-columns: 1fr; gap: 40px; }
    .methods-detail-grid { grid-template-columns: repeat(2, 1fr); }

    /* Ablauf */
    .steps-grid { grid-template-columns: 1fr; gap: 20px; }
    .cost-grid  { grid-template-columns: 1fr; gap: 32px; }

    /* Kontaktseite */
    .contact-layout    { grid-template-columns: 1fr; }
    .contact-info      { padding: 56px 40px; }
    .contact-form-wrap { padding: 56px 40px; }
    .anfahrt-grid      { grid-template-columns: 1fr; gap: 32px; }
    .map-ph            { height: 240px; }
}

/* ════════════════════════════════
   RESPONSIVE – MOBILE (≤ 480px)
════════════════════════════════ */
@media (max-width: 480px) {
    .container    { padding: 0 20px; }
    .section      { padding: 56px 0; }
    .methods-wrap { padding: 0; }

    /* Nav */
    .nav            { padding: 10px 20px; }
    .nav__logo-img  { height: 36px; }
    .nav__menu      { top: 90px; }

    /* Hero */
    .hero__left    { padding: 48px 24px; }
    .hero__h1      { font-size: 40px; }
    .hero__p       { font-size: 15.5px; }
    .hero__right   { height: auto; overflow: visible; }
    .hero__actions { flex-direction: column; }
    .hero__actions .btn { text-align: center; }

    /* Intro */
    .intro-grid__img { height: 240px; }

    /* Karten: 1 Spalte */
    .cards-grid { grid-template-columns: 1fr; }

    /* Methoden-Leiste */
    .methods-strip { grid-template-columns: repeat(2, 1fr); }
    .method-item   { padding: 32px 16px; border-right: 1px solid rgba(255,255,255,0.12); }
    .method-item:nth-child(3n) { border-right: 1px solid rgba(255,255,255,0.12); } /* Tablet-Reset */
    .method-item:nth-child(2n) { border-right: none; }
    .method-item:nth-child(n+3) { border-top: 1px solid rgba(255,255,255,0.12); }
    .method-item:nth-child(5)  { grid-column: span 2; border-right: none; }

    /* Über mich */
    .about-img { height: 260px; }

    /* Fakten */
    .fact-item      { padding: 40px 12px; }
    .fact-item__num { font-size: 40px; }

    /* CTA Buttons gestapelt */
    .cta-box__btns    { flex-direction: column; align-items: center; }
    .cta-center__btns { flex-direction: column; align-items: center; }

    /* Kontakt-Split */
    .contact-split__info { padding: 48px 24px; gap: 18px; }
    .contact-split__map  { height: 220px; }

    /* Buttons */
    .btn { padding: 12px 22px; font-size: 14px; }

    /* Page hero */
    .page-hero { padding: 48px 20px; }

    /* Methods grid (Über mich) */
    .methods-grid { grid-template-columns: 1fr; }

    /* Detail-Karten (Leistungen) */
    .detail-card { padding: 32px 24px; }
    .methods-detail-grid { grid-template-columns: 1fr; }

    /* Ablauf */
    .price-display__num { font-size: 60px; }

    /* Kontaktseite */
    .contact-info      { padding: 48px 24px; gap: 20px; }
    .contact-form-wrap { padding: 48px 24px; }
    .form-row          { grid-template-columns: 1fr; }
}

/* ════════════════════════════════
   LEGAL PAGES (Impressum, Datenschutz)
════════════════════════════════ */
.legal-section { max-width: 760px; margin: 0 auto; }

.legal-block { margin-bottom: 48px; }
.legal-block:last-child { margin-bottom: 0; }

.legal-block h2 {
    font-size: 22px; margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(77,122,114,0.2);
}

.legal-block h3 {
    font-size: 15px; font-family: 'Inter', sans-serif;
    font-weight: 500; color: #4D7A72;
    text-transform: uppercase; letter-spacing: 0.08em;
    margin: 24px 0 8px;
}
.legal-block h3:first-child { margin-top: 0; }

.legal-block p {
    font-size: 15.5px; color: #5E706A;
    line-height: 1.8; margin-bottom: 10px;
}
.legal-block p:last-child { margin-bottom: 0; }

.legal-block a { color: #4D7A72; }
.legal-block a:hover { color: #C5714F; }

.legal-table { width: 100%; border-collapse: collapse; }
.legal-table tr { border-bottom: 1px solid rgba(77,122,114,0.1); }
.legal-table tr:last-child { border-bottom: none; }
.legal-table td { padding: 10px 0; font-size: 15.5px; color: #5E706A; line-height: 1.7; vertical-align: top; }
.legal-table td:first-child { color: #263832; font-weight: 500; width: 200px; min-width: 160px; }

.legal-hint {
    background: rgba(77,122,114,0.06);
    border-left: 3px solid #6E9E97;
    border-radius: 2px;
    padding: 16px 20px;
    margin-top: 16px;
    font-size: 14px;
    color: #5E706A;
    line-height: 1.7;
}

.legal-warn {
    background: rgba(197,113,79,0.06);
    border-left: 3px solid #C5714F;
    border-radius: 2px;
    padding: 16px 20px;
    margin-top: 16px;
    font-size: 14px;
    color: #5E706A;
    line-height: 1.7;
}

.legal-block ul {
    list-style: none;
    margin: 12px 0;
}
.legal-block ul li {
    font-size: 15.5px; color: #5E706A;
    padding: 6px 0;
    display: flex; align-items: flex-start; gap: 10px;
    line-height: 1.7;
}
.legal-block ul li::before {
    content: ''; width: 5px; height: 5px;
    border-radius: 50%; background: #C5714F;
    flex-shrink: 0; margin-top: 8px;
}

@media (max-width: 600px) {
    .legal-table td:first-child { display: block; width: auto; padding-bottom: 2px; }
    .legal-table td:last-child  { display: block; padding-top: 0; }
    .legal-table tr             { display: block; padding: 10px 0; }
}