/* Page-only layout for /ask. Question visuals live in component-question-card.css. */
.page-heading::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  bottom: 0;
  width: 54%;
  background:
    linear-gradient(90deg, #000 0%, rgb(0 0 0 / 0.72) 20%, rgb(0 0 0 / 0.12) 62%, rgb(0 0 0 / 0.04) 100%),
    var(--bess-page-hero-image, none) center 50% / cover no-repeat;
  filter: saturate(0.76) brightness(0.88) contrast(0.98);
}

.study-layout { display: block; padding-bottom: 110px; }
.course-content { min-width: 0; }
.course-section { padding: 0; border-bottom: 0; margin-bottom: 84px; }
.course-section:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: 0; }

@media (max-width: 1023px) {
  .study-layout { padding-bottom: 88px; }
  .course-section { margin-bottom: 72px; }
}

@media (max-width: 767px) {
  .study-layout { padding-bottom: var(--space-section); }
  .course-section { margin-bottom: var(--space-section); }
  .page-heading::before {
    width: 100%;
    background:
      linear-gradient(180deg, rgb(0 0 0 / 0.42) 0%, rgb(0 0 0 / 0.82) 58%, #000 100%),
      var(--bess-page-hero-image, none) center 52% / cover no-repeat;
  }
}

@media (max-width: 479px) {
  .content-grid--4 { grid-template-columns: 1fr; }
}