/* Landing Page Styles – Flexcademy Startseite */
/* Strukturelle Wrapper-Klassen. Alle Inhalts-Stile liegen in den jeweiligen ContentBlock-block.css-Dateien. */

/* ── Outer Wrapper ────────────────────────── */

.landingPage {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* ── Generic Section Layout ───────────────── */

.landing_section {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--distance_1_5);
  padding: var(--distance_double) 0;
}

/* ── Feature Grid ─────────────────────────── */

.landing_featureGrid {
  display: flex;
  flex-wrap: wrap;
  gap: var(--distance_normal);
  width: 100%;
  justify-content: center;
}

.landing_featureGrid > .contentblocks_featurecard_holder {
  flex: 1 1 260px;
  max-width: 380px;
}

/* ── Steps / How it Works ─────────────────── */

.landing_steps {
  display: flex;
  flex-wrap: wrap;
  gap: var(--distance_1_5);
  width: 100%;
  justify-content: center;
}

/* ── Highlight Row (icon left + text right) ── */

.landing_highlightRow {
  display: flex;
  flex-wrap: wrap;
  gap: var(--distance_double);
  width: 100%;
  align-items: flex-start;
}

/* ── Testimonials Row ─────────────────────── */

.landing_testimonials {
  display: flex;
  flex-wrap: wrap;
  gap: var(--distance_normal);
  width: 100%;
  justify-content: center;
}

.landing_testimonials > .contentblocks_testimonial_holder {
  flex: 1 1 300px;
  max-width: 480px;
}

/* ── FAQ Section ──────────────────────────── */

.landing_faqList {
  display: flex;
  flex-direction: column;
  gap: var(--distance_half);
  width: 100%;
  max-width: 720px;
}

/* ── Responsive Tweaks ────────────────────── */

@media only screen and (max-width: 600px) {
  .landing_section {
    padding: var(--distance_1_5) 0;
  }
}