/* =========================================================================
   /leistungen/business-webseiten – Präsentation auf Startseiten-Niveau
   Ergänzt business-webseiten.css; alle Regeln sind auf .bw-page begrenzt.
   ========================================================================= */

/* ---------- Problem / „Was eine gute Website leisten muss“ ---------- */
.bw-page .bw-problem-shell { width: min(calc(100% - 80px), 1180px); }
.bw-page .bw-problem-intro { max-width: 820px; color: var(--text-secondary); font-size: clamp(19px, 1.5vw, 23px); }
.bw-page .bw-problem h3 { margin-top: 96px; font-size: clamp(24px, 1.4vw + 16px, 32px); }
.bw-page .bw-problem-points { gap: 32px; border-bottom-color: var(--line); }
.bw-page .bw-problem-points i { width: 40px; height: 2px; background: var(--blue); }
.bw-page .bw-problem-points strong { min-height: 0; color: var(--text); font-size: 19px; font-weight: 600; line-height: 1.25; }
.bw-page .bw-problem-points span { color: var(--text-secondary); font-size: 15px; line-height: 1.47; }
.bw-page .bw-problem-link { color: var(--blue); border-bottom-color: currentColor; font-size: 17px; }

/* ---------- Bento „Eine Website. Unterschiedliche Aufgaben.“ – Fotokarten wie auf der Startseite ---------- */
.bw-page .bw-goals { padding: 136px 0 140px; background: var(--bg-light); }
.bw-page .bw-goals-shell { width: min(calc(100% - 80px), 1180px); }
.bw-page .bw-goals-intro { width: 100%; margin-bottom: 56px; }
.bw-page .bw-goals-intro h2 { max-width: none; }
.bw-page .bw-goals-content { width: 100%; gap: 16px; }
.bw-page .bw-goals-top,
.bw-page .bw-goals-middle { gap: 16px; }
.bw-page .bw-goal {
  position: relative;
  display: flex;
  min-height: 300px;
  flex-direction: column;
  justify-content: flex-end;
  border: 0;
  border-radius: 24px;
  background: #1d1d1f;
  isolation: isolate;
}
.bw-page .bw-goal--primary { min-height: 420px; }
.bw-page .bw-goal--wide { min-height: 280px; }
.bw-page .bw-goal .bw-goal-media {
  position: absolute;
  inset: 0;
  z-index: -2;
  height: auto;
  margin: 0;
  border-radius: 0;
}
.bw-page .bw-goal .bw-goal-media img { width: 100%; height: 100%; object-fit: cover; }
.bw-page .bw-goal::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgb(0 0 0 / 0) 35%, rgb(0 0 0 / .72) 100%);
  pointer-events: none;
}
.bw-page .bw-goal .bw-goal-copy { position: relative; max-width: 460px; padding: 28px 30px 30px; }
.bw-page .bw-goal h3 { margin: 0; color: #fff; font-size: 24px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.15; }
.bw-page .bw-goal--compact h3 { font-size: 21px; }
.bw-page .bw-goal p { margin-top: 8px; color: rgb(255 255 255 / .82); font-size: 15px; line-height: 1.45; }
.bw-page .bw-goal:hover { border-color: transparent; }

/* ---------- Sitemap: Intro-Spalte darf atmen ---------- */
.bw-page .bw-sitemap-editorial-intro h2 { max-width: 12ch; }
.bw-page .bw-sitemap-editorial-intro > p { max-width: 420px; color: var(--text-secondary); font-size: 19px; line-height: 1.47; }
.bw-page .bw-sitemap-editorial-eyebrow { color: var(--blue); font-size: 17px; font-weight: 600; letter-spacing: -0.022em; text-transform: none; }
.bw-page .bw-sitemap-editorial-foot { font-size: 12px; letter-spacing: .08em; }

/* ---------- Redaktion (CMS): Überschrift passend zur schmalen Spalte ---------- */
.bw-page .bw-cms-copy h2 { max-width: none; font-size: clamp(30px, 2.6vw, 40px); line-height: 1.1; }
.bw-page .bw-cms-copy p { color: var(--text-secondary); font-size: 17px; line-height: 1.5; }

/* ---------- Referenzen: ruhige Fläche statt Verlaufs-Glow ---------- */
.bw-page .bw-projects { padding: 136px 0; }
.bw-page .bw-projects-layout { width: min(calc(100% - 80px), 1180px); grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(48px, 7vw, 112px); }
.bw-page .bw-projects-copy h2 { max-width: 14ch; }
.bw-page .bw-projects-layout .bw-projects-copy > p:not(.bw-eyebrow) { margin-top: 24px; color: var(--text-secondary); font-size: 19px; line-height: 1.47; }
.bw-page .bw-projects-layout .bw-text-link { margin-top: 32px; color: var(--blue); border-bottom-color: currentColor; font-size: 17px; font-weight: 400; }
.bw-page .bw-project-slot {
  min-height: 380px;
  padding: 48px;
  border: 1px dashed #c7c7cc;
  border-radius: 28px;
  background: var(--bg-light);
  box-shadow: none;
  color: var(--text);
}
.bw-page .bw-project-slot::before,
.bw-page .bw-project-slot::after { display: none; }
.bw-page .bw-project-slot span { color: var(--blue); font-size: 15px; font-weight: 600; letter-spacing: 0; text-transform: none; }
.bw-page .bw-project-slot strong { max-width: none; margin-top: 12px; color: var(--text); font-size: clamp(28px, 2.4vw, 36px); font-weight: 600; line-height: 1.12; }
.bw-page .bw-project-slot i { color: var(--blue); }

/* ---------- Abschluss ---------- */
.bw-page .bw-closing { padding: 0 0 120px; }
.bw-page .bw-closing-inner { max-width: 1180px; padding: 88px clamp(32px, 6vw, 96px); border-radius: 32px; background: #1d1d1f; }
.bw-page .bw-closing h2 { max-width: 20ch; font-size: clamp(32px, 3.2vw, 48px); line-height: 1.08; }
.bw-page .bw-closing-inner p:not(.bw-eyebrow) { max-width: 560px; color: #a1a1a6; font-size: 19px; line-height: 1.47; }
.bw-page .bw-closing .btn-light { min-height: 44px; padding: 11px 24px; background: var(--blue); color: #fff; }
.bw-page .bw-closing .btn-light:hover { background: var(--blue-hover); color: #fff; }

/* ---------- Responsive ---------- */
@media (max-width: 1068px) {
  .bw-page .bw-problem-points { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bw-page .bw-projects-layout { grid-template-columns: minmax(0, 1fr); }
  .bw-page .bw-goal--primary { min-height: 360px; }
}
@media (max-width: 734px) {
  .bw-page .bw-problem-shell,
  .bw-page .bw-goals-shell,
  .bw-page .bw-projects-layout { width: calc(100% - 44px); }
  .bw-page .bw-problem-points { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .bw-page .bw-problem h3 { margin-top: 64px; }
  .bw-page .bw-goals,
  .bw-page .bw-projects { padding: 88px 0; }
  .bw-page .bw-goals-top,
  .bw-page .bw-goals-middle { grid-template-columns: minmax(0, 1fr); }
  .bw-page .bw-goal,
  .bw-page .bw-goal--primary,
  .bw-page .bw-goal--wide { min-height: 300px; border-radius: 22px; }
  .bw-page .bw-goal .bw-goal-copy { padding: 22px 22px 24px; }
  .bw-page .bw-project-slot { min-height: 280px; padding: 32px 26px; border-radius: 24px; }
  .bw-page .bw-closing { padding-bottom: 72px; }
  .bw-page .bw-closing-inner { width: calc(100% - 44px); padding: 56px 24px; border-radius: 24px; }
}