/* =========================================================================
   /leistungen/conversion-optimierung – Feinschliff auf Startseiten-Niveau
   Ergänzt conversion-optimization.css; alle Regeln auf .cro-page begrenzt.
   ========================================================================= */

/* ---------- Hero: Proportionen wie .hh der Startseite ---------- */
.cro-page .cro-hero { padding: 48px 0 72px; }
.cro-page .cro-hero > .container { max-width: 1680px; padding-inline: clamp(22px, 4.7vw, 90px); }
.cro-page .cro-hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(40px, 4.5vw, 88px); min-height: 0; }
.cro-page .cro-hero h1 { max-width: 640px; font-size: clamp(44px, 3.9vw, 64px); text-wrap: balance; }
.cro-page .cro-hero h1 + p,
.cro-page .cro-hero-copy > p:not(.cro-eyebrow) { max-width: 540px; color: var(--text-secondary); font-size: clamp(19px, 1.45vw, 22px); line-height: 1.5; }

/* ---------- Abstand Überschrift → Text (vorher 0) ---------- */
.cro-page h2 { margin-bottom: 20px; }
.cro-page :is([class*="-head"], .cro-section-copy, .cro-areas-intro, .cro-process-intro, .cro-faq-intro, .cro-closing-copy) > p:not(.cro-eyebrow) {
  font-size: 19px;
  line-height: 1.5;
}

/* ---------- Ruhigere Kanten ---------- */
.cro-page :is(.cro-browser, .cro-phone, .cro-hero-flow) { border-radius: 24px; }

@media (max-width: 1068px) {
  .cro-page .cro-hero-grid { grid-template-columns: minmax(0, 1fr); }
  .cro-page .cro-hero h1 { max-width: 720px; font-size: 56px; }
}
@media (max-width: 734px) {
  .cro-page .cro-hero > .container { padding-inline: 22px; }
  .cro-page .cro-hero h1 { font-size: 40px; line-height: 1.1; }
  .cro-page .cro-hero h1 + p,
  .cro-page .cro-hero-copy > p:not(.cro-eyebrow) { font-size: 19px; }
  .cro-page :is([class*="-head"], .cro-section-copy, .cro-areas-intro, .cro-process-intro, .cro-faq-intro, .cro-closing-copy) > p:not(.cro-eyebrow) { font-size: 17px; }
}

/* ---------- Zweispaltige Sections: Copy-Spalte breit genug für die Überschriften ---------- */
@media (min-width: 1069px) {
  .cro-page :is(.cro-problem-grid, .cro-areas-grid, .cro-process-grid) { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(48px, 7vw, 112px); }
  .cro-page .cro-faq-grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(48px, 7vw, 112px); }
}

/* Mehrzeilige Listen-Überschriften kompakt */
.cro-page h3 { line-height: 1.15; }