:root {
  --hc-accent: #FF61A3;
}

.hc-tldr .hc-body {
  color: var(--hc-accent);
}

.hc-ext-link {
  color: var(--hc-accent);
}

.gen2-reel {
  display: flex;
  gap: calc(var(--space-xl) * 3);
  justify-content: center;
  align-items: center;
  height: calc(100vh - var(--header-h));
  padding: var(--space-xl) 4%;
  overflow: hidden;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  box-sizing: border-box;
  margin-top: var(--space-xl);
}

.gen2-side {
  height: 100%;
  flex: 0 0 auto;
  aspect-ratio: 9 / 16;
  overflow: hidden;
}

.gen2-side-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transform: scale(1.3);
  transform-origin: center;
}

.gen-video-inner {
  position: relative;
  display: inline-block;
}

.gen-video-inner video {
  height: 80vh;
  width: auto;
  display: block;
}

#soundToggle,
#fullscreenToggle {
  position: absolute;
  top: var(--space-md);
  background: var(--bg);
  border: none;
  font-family: var(--font);
  font-size: var(--text-sm);
  color: var(--text-main);
  cursor: pointer;
  padding: var(--space-xs) var(--space-md);
}

#soundToggle { right: var(--space-md); }
#fullscreenToggle { right: calc(var(--space-md) + 6rem); }

.hc-ext-link { margin-block-start: var(--space-md); }

.gen2-bts-intro {
  color: var(--text-main);
}

#bts {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

#bts .gen-reel {
  margin-top: var(--space-xl);
}

#soundToggle2,
#fullscreenToggle2 {
  position: absolute;
  top: var(--space-md);
  background: var(--bg);
  border: none;
  font-family: var(--font);
  font-size: var(--text-sm);
  color: var(--text-main);
  cursor: pointer;
  padding: var(--space-xs) var(--space-md);
}

#soundToggle2 { right: var(--space-md); }
#fullscreenToggle2 { right: calc(var(--space-md) + 6rem); }

#bts .hc-ext-link {
  margin-block-start: var(--space-xl);
}

.case-study > .hc-section:last-child {
  padding-bottom: calc(var(--space-xl) * 3);
}