/* ==============================================================
   BEGEGNUNG: Ergänzung zur bestehenden styles.css
   Die vorhandene Kopfzeile, Navigation und Fußzeile bleiben erhalten.
   ============================================================== */

/* 01: Gemeinsame Breite und Begegnungs-Comic */
.begegnung-main {
  box-sizing: border-box;
  max-width: 1160px;
  margin: 0 auto;
  padding: 2.5rem 1.25rem 1rem;
  font-family: Georgia, serif;
}
.begegnung-main *, .begegnung-main *::before, .begegnung-main *::after { box-sizing: border-box; }
.begegnung-main a { color: #315a54; text-underline-offset: 3px; }
.begegnung-intro { max-width: 760px; margin: 0 auto 3.2rem; text-align: center; line-height: 1.65; }
.begegnung-eyebrow { display: block; color: #a17b38; font-size: 1.08rem; letter-spacing: .06em; }
.begegnung-intro h1 { margin: .3rem 0 .7rem; color: #315a54; font-size: clamp(2.7rem,5vw,4.2rem); font-weight: normal; }
.begegnung-intro p { font-size: 1.08rem; margin: .75rem 0; }
.begegnung-lead { color: #765a3c; font-size: clamp(1.22rem,2.3vw,1.5rem) !important; }


/* Begegnungs-Comic statt der früheren Anfangstexte */
.begegnung-intro--comic { max-width: 100%; margin-bottom: 3.2rem; }
.begegnung-intro-comic-link { display: block; border-radius: 16px; }
.begegnung-intro-comic-link:focus-visible { outline: 3px solid #315a54; outline-offset: 5px; }
.begegnung-intro-comic {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 6px 24px rgba(96,73,39,.10);
}

/* 02: Überschriften und die Kachelgitter */
.begegnung-section { margin: 0 auto 3.5rem; }
.begegnung-section-title { display: flex; justify-content: center; align-items: center; gap: 1rem; color: #b99451; margin: 0 0 1.1rem; }
.begegnung-section-title h2 { margin: 0; color: #315a54; font-size: clamp(1.45rem,3vw,1.9rem); font-weight: normal; text-align: center; }
.begegnung-section-intro { text-align: center; line-height: 1.55; color: #645e55; margin: 0 auto 1.45rem; }
.begegnung-grid { display: grid; gap: 1.3rem; align-items: stretch; }
.begegnung-grid--drei { grid-template-columns: repeat(3,minmax(0,1fr)); }
.begegnung-grid--zwei { grid-template-columns: repeat(2,minmax(0,1fr)); }
.begegnung-card {
  min-width: 0; padding: 1.65rem 1.7rem; border: 1px solid #e7d7b9;
  border-radius: 20px; background: linear-gradient(145deg,#fffdf8,#f6edda);
  box-shadow: 0 5px 20px rgba(96,73,39,.07); line-height: 1.6;
  display: flex; flex-direction: column; align-items: flex-start;
}
.begegnung-grid--drei .begegnung-card:nth-child(2) { background: linear-gradient(145deg,#fffdf8,#eaf2ec); }
.begegnung-grid--drei .begegnung-card:nth-child(3) { background: linear-gradient(145deg,#fffdf9,#f5e9e8); }
.begegnung-card-kicker { color: #9a783f; font-size: .84rem; letter-spacing: .07em; }
.begegnung-card h3 { color: #315a54; font-size: clamp(1.3rem,2.1vw,1.6rem); font-weight: normal; line-height: 1.25; margin: .7rem 0 .7rem; }
.begegnung-card p { margin: .45rem 0 .75rem; }
.begegnung-date { font-size: 1.02rem; font-weight: bold; color: #78582f; }
.begegnung-card-note { margin-top: auto !important; color: #695c4e; }
.begegnung-text-link { font-weight: bold; margin-top: auto; }
.begegnung-access { margin-top: auto !important; padding-top: .6rem; font-size: .97rem; color: #6e5a48; }
.begegnung-freedom { max-width: 840px; margin: 1.6rem auto 0; padding: 1rem 1.4rem; text-align: center; color: #315a54; line-height: 1.7; }

/* 03: Verbleibender Comic-Platzhalter */
.begegnung-comic { max-width: 790px; margin: 0 auto 4rem; }
.begegnung-comic-placeholder {
  min-height: 260px; display: flex; align-items: center; justify-content: center;
  flex-direction: column; gap: .8rem; border: 2px dashed #d6be92;
  border-radius: 22px; background: linear-gradient(135deg,#fffdf9,#e9f2ec 52%,#faf1ef);
  color: #85683d; font-size: clamp(1.15rem,2vw,1.6rem); text-align: center;
  box-shadow: 0 4px 20px rgba(96,73,39,.04);
}
.begegnung-comic-symbol { font-size: 2.4rem; color: #b99254; }

/* 04: Persönliche Intensivbegleitung */
.begegnung-card--breit { max-width: 890px; margin: 0 auto; background: linear-gradient(145deg,#fffefa,#edf4f1); }
.begegnung-lead-small { font-size: 1.2rem; color: #765a3c; }
.begegnung-prices { width: 100%; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; margin: 1rem 0 .5rem; }
.begegnung-price { border: 1px solid #dccaa7; border-radius: 14px; background: rgba(255,255,255,.75); text-align: center; padding: 1rem; }
.begegnung-price span, .begegnung-price strong { display: block; }
.begegnung-price strong { font-size: 1.55rem; color: #315a54; margin-top: .3rem; }
.begegnung-small { color: #645e55; font-size: .94rem; }
.begegnung-button { display: inline-block; padding: .85rem 1.3rem; margin-top: .7rem; border-radius: 99px; background: #315a54; color: #fff !important; font-weight: bold; text-decoration: none; }
.begegnung-button:hover { background: #244942; }

/* 05: Beiträge, Geschenke und Zahlung */
.begegnung-card--gruen { background: linear-gradient(145deg,#fffefa,#e8f2ec); }
.begegnung-card--rosa { background: linear-gradient(145deg,#fffefa,#f8ebe9); }
.begegnung-amount { color: #7d5d2f; font-size: clamp(1.25rem,2vw,1.65rem); font-weight: bold; }
.begegnung-amount span { font-size: 1rem; font-weight: normal; }
.begegnung-card--zahlung { background: #fffdf8; }
.begegnung-copy-text { overflow-wrap: anywhere; font-size: clamp(.96rem,2vw,1.12rem); }
.begegnung-break { overflow-wrap: anywhere; }
.begegnung-copy-button { background: #eef3ef; color: #315a54; font-family: inherit; font-size: .96rem; padding: .6rem .95rem; border: 1px solid #a5c2b7; border-radius: 9px; cursor: pointer; margin-top: auto; }
.begegnung-copy-button:hover { background: #dfece4; }
.begegnung-payment-note { max-width: 830px; margin: 1.2rem auto 0; text-align: center; line-height: 1.65; }
.begegnung-ending { text-align: center; color: #9a783f; font-size: 1.05rem; margin: 3rem 0 1rem; }

/* ======================================
   ABSTAND ZUM FOOTER VERKLEINERN
   ====================================== */

.begegnung-section:last-child {
  margin-bottom: 1rem;
}

footer .begegnung-ending {
  margin: 0;
}

/* 06: Handy und schmalere Bildschirme */
@media (max-width: 950px) { .begegnung-grid--drei { grid-template-columns: 1fr; } }
@media (max-width: 768px) {
  .begegnung-main { padding: 1.5rem 1rem 0; }
  .begegnung-intro { margin-bottom: 2.3rem; }
  .begegnung-section { margin-bottom: 2.6rem; }
  .begegnung-section-title { gap: .5rem; }
  .begegnung-grid--zwei { grid-template-columns: 1fr; }
  .begegnung-card { padding: 1.35rem; }
  .begegnung-comic { margin-bottom: 2.6rem; }
  .begegnung-comic-placeholder { min-height: 200px; }
}
@media (max-width: 380px) { .begegnung-prices { grid-template-columns: 1fr; } }