.btl-wrapper {
  --btl-line-color: #c7962d;
  --btl-dot-color: #e7a4b1;
  --btl-dot-bg: #fff;
  width: 100%;
  position: relative;
  box-sizing: border-box;
  overflow: hidden;
}
.btl-wrapper *, .btl-wrapper *::before, .btl-wrapper *::after { box-sizing: border-box; }
.btl-rows { width: 100%; margin: 0 auto; position: relative; }
.btl-spine {
  position: absolute; top: 0; bottom: 0; left: 50%; width: 2px; transform: translateX(-50%); z-index: 1;
  background: repeating-linear-gradient(to bottom, var(--btl-line-color) 0, var(--btl-line-color) 7px, transparent 7px, transparent 13px);
}
.btl-row {
  --btl-center-gap: 64px;
  position: relative; display: grid; grid-template-columns: minmax(0,1fr) var(--btl-center-gap) minmax(0,1fr); align-items: center; z-index: 2;
}
.btl-row:last-child { margin-bottom: 0 !important; }
.btl-content { min-width: 0; }
.btl-content-left { padding-right: 42px; }
.btl-content-right { padding-left: 42px; }
.btl-dot { position: relative; margin: 0 auto; border: 4px solid var(--btl-dot-color); border-radius: 50%; background: var(--btl-dot-bg); z-index: 5; }
.btl-text-block { max-width: 460px; }
.btl-content-left .btl-text-block { margin-left: auto; text-align: right; }
.btl-content-right .btl-text-block { margin-right: auto; text-align: left; }
.btl-year { display: inline-block; margin-bottom: 12px; font-size: 42px; font-weight: 800; line-height: 1; }
.btl-title { margin-bottom: 14px; font-family: Georgia,"Times New Roman",serif; font-size: 30px; font-weight: 700; line-height: 1.15; }
.btl-description { font-size: 17px; line-height: 1.7; }
.btl-video-card { position: relative; width: 100%; overflow: hidden; background: #eee; cursor: pointer; isolation: isolate; }
.btl-content-left .btl-video-card { margin-left: auto; }
.btl-content-right .btl-video-card { margin-right: auto; }
.btl-video-media { position: relative; width: 100%; overflow: hidden; }
.btl-video-media video, .btl-video-media img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.btl-play-overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; transition: opacity .25s ease, background .25s ease; pointer-events: none; }
.btl-play-button { display: flex; align-items: center; justify-content: center; border: 5px solid #fff; border-radius: 50%; background: rgba(0,0,0,.08); box-shadow: 0 3px 12px rgba(0,0,0,.15); }
.btl-play-button svg { width: 43%; height: 43%; margin-left: 5%; }
.btl-video-card.btl-playing .btl-play-overlay { opacity: 0; }
.btl-video-card.btl-playing:hover .btl-play-overlay { opacity: 1; background: rgba(0,0,0,.08); }
.btl-mobile-content { display: none; }
.btl-end-arrow { position: relative; display: flex; flex-direction: column; align-items: center; width: 40px; margin: 30px auto; color: #842d3c; }
.btl-arrow-line { display: block; width: 2px; height: 45px; background: currentColor; }
.btl-end-arrow svg { display: block; margin-top: -2px; }
.btl-cta-wrap { display: flex; justify-content: center; width: 100%; padding: 5px 20px 20px; }
.btl-cta-button { display: inline-flex; align-items: center; justify-content: center; min-height: 56px; text-align: center; text-decoration: none; transition: background .2s ease,color .2s ease,transform .2s ease; }
.btl-cta-button:hover { transform: translateY(-2px); }

@media (max-width: 900px) and (min-width: 768px) {
  .btl-content-left { padding-right: 25px; }
  .btl-content-right { padding-left: 25px; }
}

@media (max-width: 767px) {
  .btl-rows { max-width: none !important; }
  .btl-spine { top: 12px; bottom: 0; left: 36px; width: 2px; transform: none; background: repeating-linear-gradient(to bottom,var(--btl-line-color) 0,var(--btl-line-color) 6px,transparent 6px,transparent 11px); }
  .btl-row { display: grid; grid-template-columns: 72px minmax(0,1fr); grid-template-rows: auto auto; align-items: start; column-gap: 6px; row-gap: 16px; }
  .btl-dot { grid-column: 1; grid-row: 1; align-self: start; justify-self: start; margin: 4px 0 0 29px; }
  .btl-content { padding: 0; min-width: 0; }
  .btl-video-left .btl-content-left, .btl-video-right .btl-content-right { grid-column: 2; grid-row: 2; }
  .btl-video-left .btl-content-right, .btl-video-right .btl-content-left { grid-column: 2; grid-row: 1; }
  .btl-text-block { width: 100%; max-width: none; margin: 0 !important; text-align: left !important; }
  .btl-text-block .btl-year { display: block; margin: 0; font-size: 28px; line-height: 1; }
  .btl-text-block .btl-title, .btl-text-block .btl-description { display: none; }
  .btl-video-card { display: flex; flex-direction: column; max-width: none !important; height: auto; margin: 0 !important; background: #fff; }
  .btl-mobile-content { display: block; width: 100%; }
  .btl-mobile-content .btl-title { display: block; margin: 0 0 10px; font-size: 23px; line-height: 1.12; text-align: left; }
  .btl-mobile-content .btl-description { display: block; margin: 0; font-size: 16px; line-height: 1.65; text-align: left; }
  .btl-end-arrow { margin-left: 16px; margin-right: 0; }
  .btl-cta-wrap { justify-content: flex-start; padding-left: 78px; }
  .btl-cta-button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .btl-wrapper[data-playback-mode="scroll_keep"] video,
  .btl-wrapper[data-playback-mode="scroll_pause"] video { animation: none; }
}
