/* Compact landing-page system: shared spacing, type and scanability. */
:root {
  --compact-space: clamp(2.5rem, 5vw, 5rem);
  --compact-gap: clamp(1rem, 2vw, 2rem);
}

main section {
  padding-block: var(--compact-space) !important;
}

.page-width {
  width: min(100% - 3rem, 1280px) !important;
}

h1, h2, h3, h4 {
  text-wrap: balance;
}

h1 {
  font-size: clamp(2.8rem, 6vw, 6.2rem) !important;
  line-height: .94 !important;
}

h2 {
  font-size: clamp(2rem, 4vw, 4.3rem) !important;
  line-height: .98 !important;
}

.hero-grid.page-width {
  grid-template-columns: minmax(0, 1fr) minmax(28rem, .9fr) !important;
  align-items: start;
  gap: clamp(2rem, 5vw, 6rem) !important;
}

.hero-copy > p,
.hero-lede,
.hero-copy .hero-lede {
  max-width: 48rem;
  font-size: clamp(1.1rem, 1.6vw, 1.55rem) !important;
  line-height: 1.18 !important;
}

.hero-offer-stack,
.offer-stack {
  gap: .75rem !important;
}

.offer-panel,
.offer-choice,
.hero-offer {
  min-height: 0 !important;
  padding: clamp(1.25rem, 2vw, 2rem) !important;
}

.offer-panel h3,
.offer-choice h3 {
  font-size: clamp(1rem, 1.25vw, 1.4rem) !important;
}

.offer-panel p,
.offer-choice p {
  font-size: clamp(.95rem, 1.15vw, 1.15rem) !important;
  line-height: 1.22 !important;
}

.offer-panel .button,
.offer-choice .button {
  margin-top: 1rem;
}

/* The conversion buttons should read as one CTA row, not as card content. */
.hero-offer-stack + .hero-actions,
.hero-offer-stack ~ .hero-actions,
.offer-grid + .offer-actions,
.offer-grid ~ .offer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem 1.25rem;
  align-items: center;
  margin-top: 1rem;
}

.logo-wall,
.logo-strip {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: clamp(.75rem, 2vw, 2rem);
  flex-wrap: nowrap;
  overflow: hidden;
  padding: .8rem 1rem !important;
  background: #fff !important;
}

.logo-wall .logo-cell,
.logo-strip img {
  flex: 0 1 auto;
  max-width: 8rem;
  max-height: 2rem;
  object-fit: contain;
}

.deliverables-list,
.deliverables-grid,
.sprint-steps {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0 !important;
}

.deliverables-list > li,
.deliverables-grid > *,
.sprint-steps > li {
  min-width: 0;
  padding: 1.25rem !important;
  border-top: 1px solid currentColor;
  border-bottom: 0 !important;
}

.deliverable-visual {
  margin-top: 1rem !important;
  transform: scale(.82);
  transform-origin: left top;
  min-height: 7rem !important;
}

.self-check-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.25fr) minmax(18rem, .75fr) !important;
  gap: 2rem !important;
  align-items: start;
}

#self-check-result {
  grid-column: 2;
  grid-row: 1;
  position: sticky;
  top: 5rem;
  margin: 0 !important;
}

#erster-monat .sprint-steps {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.faq-list,
.accordion-list,
.faq-accordion,
.faq-grid > .faq-items {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 2rem;
  align-items: start;
}

.faq-list > *,
.accordion-list > *,
.faq-accordion > * {
  min-width: 0;
}

@media (max-width: 900px) {
  .hero-grid.page-width {
    grid-template-columns: 1fr !important;
  }

  .hero-offer-stack {
    max-width: none;
  }
}

@media (max-width: 700px) {
  main section {
    padding-block: 2.5rem !important;
  }

  .page-width {
    width: min(100% - 1.5rem, 1280px) !important;
  }

  .deliverables-list,
  .deliverables-grid,
  .sprint-steps,
  #erster-monat .sprint-steps,
  .self-check-grid,
  .faq-list,
  .accordion-list,
  .faq-accordion,
  .faq-grid > .faq-items {
    grid-template-columns: 1fr !important;
  }

  #self-check-result {
    grid-column: auto;
    grid-row: auto;
    position: static;
  }

  .logo-wall,
  .logo-strip {
    justify-content: flex-start;
    overflow-x: auto;
  }
}