/* =========================================================================
   FINANZ-CHECK UND DANKESEITE

   Zwei Seiten mit genau einer Aufgabe. Deshalb bewusst arm an Elementen:
   keine Bewertungswand, keine Fallbeispiele, kein Ablauf. Wer hier
   ankommt, hat sich entschieden — jeder weitere Absatz ist eine
   Gelegenheit, es sich anders zu überlegen.
   ========================================================================= */

/* -------------------------------------------------------------------------
   1 · Finanz-Check
   ------------------------------------------------------------------------- */

.fc-hero {
  background: var(--cream);
  padding: calc(var(--kopf-hoehe, 84px) + clamp(28px, 4vw, 56px)) 0 clamp(48px, 6vw, 96px);
  min-height: 100vh;
}

.fc-kopf {
  max-width: 46rem;
  margin: 0 auto clamp(28px, 3.4vw, 44px);
  text-align: center;
}
.fc-kopf .eyebrow { justify-content: center; }

.fc-kopf h1 {
  font-family: var(--serif);
  font-size: clamp(1.9rem, 1.4rem + 2.4vw, 3rem);
  font-weight: 700;
  line-height: 1.14;
  letter-spacing: -0.03em;
  color: var(--charcoal);
  margin: 10px 0 14px;
}

.fc-meta {
  display: inline-block;
  font-family: var(--sans);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--orange-dark);
  background: var(--peach);
  border-radius: 100px;
  padding: 8px 18px;
  margin: 0 0 18px;
}

.fc-satz {
  font-family: var(--sans);
  font-size: clamp(1rem, 0.96rem + 0.3vw, 1.12rem);
  line-height: 1.7;
  color: #5F4E42;
  margin: 0 auto;
  max-width: 44ch;
}

.fc-proof {
  font-family: var(--sans);
  font-size: 0.82rem;
  color: var(--warm-grey);
  margin: 18px 0 0;
}
.fc-proof span[aria-hidden] { color: var(--orange); letter-spacing: 0.08em; }

/* --- Die Terminauswahl --- */

.fc-calendly {
  max-width: 56rem;
  margin: 0 auto;
  min-height: 300px;
}

.fc-rahmen {
  display: block;
  width: 100%;
  /* Calendly braucht Höhe. Weniger als 680 px erzwingt im Kalender eine
     eigene Bildlaufleiste — zwei Scrollbereiche ineinander sind auf dem
     Handy kaum zu bedienen. */
  height: 780px;
  border: 0;
  border-radius: var(--r);
  background: var(--white);
}
@media (max-width: 640px) {
  .fc-rahmen { height: 1000px; }
}

.fc-laedt {
  padding: 60px 20px;
  text-align: center;
  font-family: var(--sans);
  font-size: 0.9rem;
  color: var(--warm-grey);
}

/* --- Platzhalter, solange keine Einwilligung vorliegt --- */

.fc-platzhalter {
  background: var(--white);
  border: 1px solid rgba(90, 60, 35, 0.14);
  border-radius: var(--r);
  padding: clamp(28px, 4vw, 48px);
  text-align: center;
  box-shadow: var(--shadow-soft);
}
.fcp-titel {
  font-family: var(--serif);
  font-size: clamp(1.1rem, 1rem + 0.5vw, 1.35rem);
  font-weight: 700;
  color: var(--charcoal);
  margin: 0 0 10px;
}
.fcp-text {
  font-family: var(--sans);
  font-size: 0.92rem;
  line-height: 1.65;
  color: #5F4E42;
  margin: 0 auto 22px;
  max-width: 46ch;
}
.fcp-klein {
  font-family: var(--sans);
  font-size: 0.8rem;
  color: var(--warm-grey);
  margin: 18px 0 0;
}
.fcp-klein a { color: var(--orange-dark); }

/* -------------------------------------------------------------------------
   2 · Dankeseite
   ------------------------------------------------------------------------- */

.fc-danke {
  background: var(--cream);
  padding: calc(var(--kopf-hoehe, 84px) + clamp(36px, 5vw, 72px)) 0 clamp(56px, 7vw, 110px);
  min-height: 84vh;
  display: flex;
  align-items: center;
}

.fcd-inner {
  max-width: 40rem;
  margin: 0 auto;
  text-align: center;
}

.fcd-haken {
  font-size: 3rem;
  line-height: 1;
  margin-bottom: 16px;
}

.fcd-inner h1 {
  font-family: var(--serif);
  font-size: clamp(2rem, 1.5rem + 2.6vw, 3.1rem);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -0.03em;
  color: var(--charcoal);
  margin: 0 0 14px;
}

.fcd-lede {
  font-family: var(--serif-lesbar);
  font-style: italic;
  font-size: clamp(1.08rem, 1rem + 0.5vw, 1.3rem);
  color: var(--orange-dark);
  margin: 0 0 18px;
}

.fcd-text {
  font-family: var(--sans);
  font-size: 0.98rem;
  line-height: 1.72;
  color: #5F4E42;
  margin: 0 auto;
  max-width: 46ch;
}

/* --- Drei Wege weiter --- */

.fcd-weiter {
  margin-top: clamp(34px, 4vw, 54px);
  text-align: left;
}
.fcdw-label {
  font-family: var(--sans);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--warm-grey);
  margin: 0 0 12px;
  text-align: center;
}

.fcdw-link {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  min-height: 64px;
  padding: 14px 18px;
  margin-bottom: 10px;
  background: var(--white);
  border: 1px solid rgba(90, 60, 35, 0.12);
  border-radius: var(--r-sm);
  text-decoration: none;
  transition: border-color 0.22s ease, transform 0.22s ease;
}
.fcdw-link:hover { border-color: var(--orange); transform: translateY(-2px); }
.fcdw-zeichen { font-size: 1.4rem; line-height: 1; text-align: center; }
.fcdw-link b {
  display: block;
  font-family: var(--sans);
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--charcoal);
}
.fcdw-link small {
  display: block;
  font-family: var(--sans);
  font-size: 0.8rem;
  color: var(--warm-grey);
  margin-top: 2px;
}
.fcdw-pfeil { color: var(--orange); font-size: 0.95rem; }

/* Auf diesen beiden Seiten wäre der feste Knopf unten sinnlos: Man ist
   schon da beziehungsweise schon fertig. */
.fc-hero ~ * .sticky-cta,
body[data-seite="finanz-check"] .sticky-cta,
body[data-seite="finanz-check-danke"] .sticky-cta { display: none !important; }

@media (prefers-reduced-motion: reduce) {
  .fcdw-link { transition: none; }
  .fcdw-link:hover { transform: none; }
}

/* Pflichtangaben im schlanken Footer dieser beiden Seiten. */
.footer-recht {
  list-style: none;
  margin: 0 0 14px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0 6px;
  align-items: baseline;
}
.footer-recht li + li::before { content: "·"; margin-right: 6px; opacity: 0.45; }
.footer-recht a {
  font-family: var(--sans);
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.72);
  text-decoration: none;
  line-height: 2;
}
.footer-recht a:hover { color: var(--white); }
