.website-lesson-columns {
  display: grid !important;
  grid-template-columns: repeat(var(--website-columns, 1), minmax(0, 1fr)) !important;
  gap: clamp(1rem, 2.2vw, 2rem) !important;
}

.website-lesson-columns > * { min-width: 0; }

/*
 * Редактируемые заголовок, подзаголовок и медиа всегда участвуют в высоте
 * первого блока. Сетка растёт вслед за любой колонкой и не позволяет видео
 * перекрывать следующий раздел при длинном тексте.
 */
.detail-hero {
  display: grid !important;
  grid-template-columns: minmax(0, 600px) minmax(280px, 800px);
  align-items: start !important;
  justify-content: center;
  gap: clamp(1rem, 3vw, 3rem);
  height: auto !important;
  min-height: 0;
}
.detail-hero > * { min-width: 0; }
.detail-hero-start {
  align-self: start;
  width: 100% !important;
  max-width: 600px;
}
.detail-hero-middle {
  align-self: start;
  justify-self: center;
  width: 100%;
  max-width: 800px;
  min-height: 0 !important;
}
.detail-hero-middle .wrapper-video {
  box-sizing: border-box;
  width: 100%;
}
.detail-hero-middle .wrapper-video > video,
.detail-hero-middle .wrapper-video > iframe,
.detail-hero-middle .wrapper-video > img {
  max-width: 100%;
}
.detail-hero + .detail-block,
.detail-block,
.website-lesson-columns,
.website-lesson-columns > * {
  height: auto !important;
  min-height: 0;
}
.detail-gallery-list.website-review-list,
.website-custom-videos {
  display: flex !important;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
  gap: clamp(.85rem, 1.4vw, 1.35rem);
}
.website-review-card {
  flex: 0 1 430px;
  width: min(100%, 430px);
  max-width: 430px;
  min-height: 0;
  padding: 0 !important;
  overflow: visible;
  background: transparent !important;
  text-align: left;
}
.website-review-card.is-portrait {
  flex-basis: 220px;
  width: min(100%, 220px);
  max-width: 220px;
}
.website-review-card.is-square {
  flex-basis: 280px;
  width: min(100%, 280px);
  max-width: 280px;
}
.website-review-media {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 20px;
  background: #1d171a;
  box-shadow: 0 14px 38px rgb(54 25 39 / 12%);
}
.website-review-card.is-portrait .website-review-media { aspect-ratio: 9 / 16; }
.website-review-card.is-square .website-review-media { aspect-ratio: 1; }
.website-review-card video {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit !important;
  background: #1d171a;
  object-fit: contain;
}
.website-review-play {
  position: absolute;
  inset: 50% auto auto 50%;
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  transform: translate(-50%, -50%);
  padding: .7rem 1rem;
  border: 0;
  border-radius: 999px;
  background: rgb(255 255 255 / 92%);
  color: #2d2529;
  box-shadow: 0 10px 30px rgb(37 18 27 / 22%);
  cursor: pointer;
  white-space: nowrap;
}
.website-review-play[hidden] { display: none; }
.website-review-play > span {
  display: block;
  flex: 0 0 auto;
  width: 0;
  height: 0;
  margin-left: .1rem;
  border-top: .45rem solid transparent;
  border-bottom: .45rem solid transparent;
  border-left: .72rem solid #d71962;
}
.website-review-play > strong { line-height: 1.15; }
.website-review-play:is(:hover, :focus-visible) { background: #fff; color: #b70f4e; }
.website-review-card .card-text {
  min-height: 0;
  margin: .7rem 0 0;
  padding: 0;
  background: transparent;
  text-align: left;
}
.detail-hero-middle .wrapper-video > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.website-related { box-sizing: border-box; width: min(100%, 92rem); margin: 2.5rem auto; padding: 0 clamp(1.25rem, 3.25vw, 4rem); }
.website-related > h2 { margin-bottom: 1.5rem; text-align: center; }
.website-related-card { min-height: 220px; background-position: center; background-size: cover; }
.website-preview-mode .legacy-analytics-consent { display: none !important; }
.website-managed-text {
  min-width: 0;
  max-width: 100%;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word;
  hyphens: auto;
}
.lesson_title,.detail-hero-list--disc,.detail-title,.website-lesson-columns,.teachers-title,
.website-custom-hero,.website-custom-columns,.website-custom-teacher,.website-related-card,
.legacy-event-card,.website-event-dialog-content { min-width: 0; max-width: 100%; }
.website-lesson-columns *,.teachers-title *,.website-custom-hero *,.website-custom-columns *,
.website-custom-teacher *,.website-related-card *,.legacy-event-card *,.website-event-dialog-content * {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.website-custom-section { padding: clamp(2rem, 5vw, 5rem) 0; }
#website-custom-page { max-width: 92rem; margin: 0 auto; overflow-wrap: anywhere; }
#website-custom-page > h1 { margin: 0 0 1.5rem; text-align: center; }
#website-custom-page > h2 { margin: clamp(2rem, 4vw, 3.5rem) 0 1.25rem; }
.website-custom-hero { display: grid; grid-template-columns: minmax(0, .85fr) minmax(280px, 1.15fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: center; }
.website-custom-hero h1 { margin: 0 0 1rem; }
.website-custom-hero p { margin-bottom: 1.5rem; }
.website-custom-hero img,.website-custom-hero video,.website-custom-cover { display: block; width: 100%; max-height: 560px; border-radius: 24px; object-fit: cover; }
.website-custom-columns { display: grid; grid-template-columns: repeat(var(--website-columns, 1), minmax(0, 1fr)); gap: clamp(1rem, 2.2vw, 2rem); }
.website-custom-columns > article { min-width: 0; }
.website-custom-teacher { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 2rem; align-items: center; margin: 1rem 0; padding: clamp(1rem, 2vw, 2rem); border-radius: 24px; box-shadow: 0 10px 36px rgb(54 25 39 / 8%); }
.website-custom-teacher img { display: block; width: 190px; height: 190px; border-radius: 50%; object-fit: cover; }
.website-custom-gallery,.website-custom-videos { margin-top: 1.5rem; }
.website-custom-gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.website-custom-gallery img { display: block; width: 100%; height: 260px; border-radius: 20px; object-fit: cover; }
.website-custom-meta { color: #756a70; font-weight: 600; }
.website-custom-summary { font-size: 1.12rem; }
.website-custom-caption { font-weight: 600; }

.website-event-dialog { width: min(960px, calc(100% - 2rem)); max-height: calc(100% - 2rem); padding: 0; border: 0; border-radius: 24px; }
.website-event-dialog::backdrop { background: rgb(25 19 22 / 68%); backdrop-filter: blur(4px); }
.website-event-dialog-panel { position: relative; display: grid; grid-template-columns: minmax(260px, .9fr) minmax(0, 1.1fr); overflow: auto; max-height: calc(100vh - 2rem); }
.website-event-dialog-image { display: block; width: 100%; height: 100%; min-height: 430px; object-fit: cover; }
.website-event-dialog-content { padding: clamp(2rem, 5vw, 4rem); overflow-wrap: anywhere; }
.website-event-dialog-content h2 { margin-top: 0; }
.website-event-dialog-close { position: absolute; z-index: 2; top: .8rem; right: .8rem; display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; padding: 0; border: 1px solid #ded7da; border-radius: 50%; background: #fff; font-size: 1.6rem; line-height: 1; cursor: pointer; }

@media (max-width: 900px) {
  .website-lesson-columns,.website-custom-columns { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .website-custom-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1199.98px) {
  .detail-hero { grid-template-columns: minmax(0, 1fr); }
  .detail-hero-middle { order: -1; }
}

@media (max-width: 680px) {
  .website-lesson-columns,.website-custom-columns,.website-custom-hero,.website-custom-teacher,.website-event-dialog-panel { grid-template-columns: 1fr !important; }
  .website-custom-gallery { grid-template-columns: 1fr; }
  .website-custom-gallery img { height: auto; max-height: 440px; }
  .website-review-card { flex-basis: min(100%, 430px); width: min(100%, 430px); max-width: 430px; }
  .website-review-card.is-square { flex-basis: min(100%, 280px); width: min(100%, 280px); max-width: 280px; }
  .website-review-card.is-portrait { flex-basis: min(100%, 220px); width: min(100%, 220px); max-width: 220px; }
  .website-review-play { gap: .5rem; padding: .6rem .75rem; font-size: .86rem; }
  .website-custom-teacher img { width: 130px; height: 130px; }
  .website-event-dialog-image { min-height: 240px; max-height: 340px; }
}

@media (prefers-reduced-motion: reduce) {
  .website-event-dialog::backdrop { backdrop-filter: none; }
}