/* =============================================================
   bo-studien — Brand Offer Studien Section
   Alle Klassen mit bo-studien- praefixiert
   ============================================================= */

.bo-studien-wrapper {
  background-color: var(--bs-bg, #ffffff);
  padding: var(--bs-pad-top, 32px) 16px var(--bs-pad-bottom, 32px);
  box-sizing: border-box;
  width: 100%;
  display: block;
}

.bo-studien-wrapper *,
.bo-studien-wrapper *::before,
.bo-studien-wrapper *::after {
  box-sizing: border-box;
}

.bo-studien-container {
  max-width: 1280px;
  margin: 0 auto;
}

/* ===== Top-Level Layout ===== */
.bo-studien-layout {
  display: grid;
  grid-template-columns: 1fr;
  column-gap: 24px;
  row-gap: 16px;
  align-items: stretch;
}

.bo-studien-layout-with-image {
  grid-template-columns: var(--bs-cols, 1fr 1fr);
  grid-template-rows: auto auto;
}

/* Desktop mit Bild: Left in row 1, Image spannt beide Reihen, Button in row 2 col 1 */
.bo-studien-layout-with-image .bo-studien-left {
  grid-column: 1;
  grid-row: 1;
}

.bo-studien-layout-with-image .bo-studien-right {
  grid-column: 2;
  grid-row: 1 / span 2;
}

.bo-studien-layout-with-image .bo-studien-button-wrap {
  grid-column: 1;
  grid-row: 2;
}

.bo-studien-left,
.bo-studien-right {
  min-width: 0;
}

.bo-studien-left {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

/* ===== Headline ===== */
.bo-studien-headline {
  margin: 0;
  color: var(--bs-headline-color, #1a1a1a);
  font-size: var(--bs-headline-size, 20px);
  line-height: 1.3;
  text-align: var(--bs-headline-align, left);
  font-weight: 600;
}
.bo-studien-headline p { margin: 0; }
.bo-studien-headline p + p { margin-top: 6px; }

/* ===== Boxen-Grid ===== */
.bo-studien-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.bo-studien-box {
  background-color: var(--bs-box-bg, #ffffff);
  border: 1px solid var(--bs-box-border, #e5e5e5);
  border-radius: 8px;
  padding: 16px 20px;
}

.bo-studien-box-heading {
  margin: 0 0 8px 0;
  color: var(--bs-box-heading-color, #888888);
  font-size: var(--bs-box-heading-size, 13px);
  line-height: 1.3;
  font-weight: 400;
}
.bo-studien-box-heading p { margin: 0; }

.bo-studien-box-results {
  color: var(--bs-box-text-color, #1a1a1a);
  font-size: var(--bs-box-text-size, 14px);
  line-height: 1.5;
}

.bo-studien-box-results p {
  margin: 0;
}
.bo-studien-box-results p + p {
  margin-top: 4px;
}

.bo-studien-box-results ul,
.bo-studien-box-results ol {
  margin: 0;
  padding-left: 18px;
}

.bo-studien-box-results li {
  margin: 0;
}
.bo-studien-box-results li + li {
  margin-top: 4px;
}

/* ===== Right Image ===== */
.bo-studien-right {
  display: flex;
  align-items: stretch;
}

.bo-studien-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 8px;
}

/* ===== Button ===== */
.bo-studien-button-wrap {
  display: flex;
  justify-content: center;
}

.bo-studien-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 22px;
  background-color: var(--bs-btn-bg, #ffffff);
  color: var(--bs-btn-color, #1a1a1a);
  border: 1px solid var(--bs-btn-border, #d4d4d4);
  border-radius: 6px;
  font-size: var(--bs-btn-size, 14px);
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.bo-studien-button:hover {
  background-color: #fafafa;
}

/* ===== Mobile ===== */
@media screen and (max-width: 749px) {
  .bo-studien-wrapper {
    padding-left: 12px;
    padding-right: 12px;
  }

  .bo-studien-layout-with-image {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
  }

  /* Mobile-Reihenfolge: Left -> Bild -> Button */
  .bo-studien-layout-with-image .bo-studien-left {
    grid-column: 1;
    grid-row: 1;
  }
  .bo-studien-layout-with-image .bo-studien-right {
    grid-column: 1;
    grid-row: 2;
  }
  .bo-studien-layout-with-image .bo-studien-button-wrap {
    grid-column: 1;
    grid-row: 3;
  }

  .bo-studien-right-hide-mobile {
    display: none !important;
  }

  .bo-studien-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  /* Resultate fliessen kompakt nebeneinander mit · Separator */
  .bo-studien-box-results p,
  .bo-studien-box-results li {
    display: inline;
    margin: 0;
  }

  .bo-studien-box-results p + p,
  .bo-studien-box-results li + li {
    margin: 0;
  }

  .bo-studien-box-results p + p::before,
  .bo-studien-box-results li + li::before {
    content: " · ";
    color: #aaaaaa;
    margin: 0 2px;
  }

  .bo-studien-box-results ul,
  .bo-studien-box-results ol {
    display: inline;
    padding: 0;
    list-style: none;
  }

  .bo-studien-box {
    padding: 14px 16px;
  }
}