.hero .btn, .hero .btn-plain { color: #171717; }
.hero .btn-plain { background: #fff; }

.hv-switch { margin-left: 10px; }
@media (max-width: 609px) { .hv-switch { display: block; margin: 4px 0 0; } }
.hv-switch a { color: #fff; opacity: 0.7; margin-left: 6px; padding: 2px 8px; border-radius: 20px; }
html[data-hero="a"] .hv-switch a[data-v="a"],
html[data-hero="b"] .hv-switch a[data-v="b"],
html[data-hero="c"] .hv-switch a[data-v="c"],
html[data-hero="d"] .hv-switch a[data-v="d"],
html[data-film="light"] .hv-switch a[data-f="light"],
html[data-film="full"] .hv-switch a[data-f="full"] { opacity: 1; background: #B1F445; color: #171717; }

html[data-hero="b"] .hero .badge-progress,
html[data-hero="b"] .hero .badge-id .role,
html[data-hero="b"] .hero .badge-social,
html[data-hero="b"] .hero .hero-location,
html[data-hero="c"] .hero .badge-progress,
html[data-hero="c"] .hero .badge-id .role,
html[data-hero="c"] .hero .badge-social,
html[data-hero="c"] .hero .hero-location,
html[data-hero="d"] .hero .badge-progress,
html[data-hero="d"] .hero .badge-id .role,
html[data-hero="d"] .hero .badge-social,
html[data-hero="d"] .hero .hero-location { display: none; }
html[data-hero="b"] .hero .badge-top,
html[data-hero="c"] .hero .badge-top,
html[data-hero="d"] .hero .badge-top { gap: 10px; }
html[data-hero="b"] .hero .badge-avatar,
html[data-hero="c"] .hero .badge-avatar,
html[data-hero="d"] .hero .badge-avatar { width: 36px; height: 36px; }
html[data-hero="b"] .hero .badge-id .name,
html[data-hero="c"] .hero .badge-id .name,
html[data-hero="d"] .hero .badge-id .name { font-size: 18px; font-weight: 600; }

html[data-hero="b"] .hero .badge-inner { gap: 30px; padding-top: 0; padding-bottom: 0; }
html[data-hero="b"] .hero-rig { padding: 0 0 84px; }
@media (min-width: 610px) {
  html[data-hero="d"] .hero .badge-inner { gap: 30px; padding-top: 0; padding-bottom: 0; }
  html[data-hero="d"] .hero-rig { padding: 0 0 84px; }
}

@media (min-width: 610px) {
  html[data-hero="c"] .hero-stage { align-items: flex-end; justify-content: flex-start; }
  html[data-hero="c"] .hero-rig { width: min(560px, 40vw); margin-left: 6vw; padding: 0 0 10vh; }
  html[data-hero="c"] .hero .badge-inner { padding: 0; gap: 24px; }
  html[data-hero="c"] .hero-headline--v2 .hh-lead { font-size: 37px; }
  html[data-hero="c"] .hero-headline--v2 .hh-big { font-size: 66px; }
  html[data-hero="c"] .hero-headline--v2 .hh-conn { font-size: 26px; }
  html[data-hero="c"] .hero-headline--v2 .hh-flipline { font-size: 80px; }
  html[data-hero="c"] .hero-scrim {
    background:
      radial-gradient(ellipse 72% 78% at 0% 100%, rgba(0,0,0,.58), rgba(0,0,0,.28) 46%, rgba(0,0,0,0) 74%),
      linear-gradient(to bottom, rgba(0,0,0,.16), rgba(0,0,0,0) 18%);
  }
}

@media (max-width: 609px) {
  html[data-hero="c"] .hero-stage ,
  html[data-hero="d"] .hero-stage { align-items: flex-end; }
  html[data-hero="c"] .hero-rig ,
  html[data-hero="d"] .hero-rig { width: calc(100% - 32px); padding: 0 0 106px; }
  html[data-hero="c"] .hero .badge-inner ,
  html[data-hero="d"] .hero .badge-inner { padding: 0 6px; gap: 18px; }
  html[data-hero="c"] .hero-headline--v2 .hh-lead ,
  html[data-hero="d"] .hero-headline--v2 .hh-lead { font-size: 26px; }
  html[data-hero="c"] .hero-headline--v2 .hh-big ,
  html[data-hero="d"] .hero-headline--v2 .hh-big { font-size: 46px; }
  html[data-hero="c"] .hero-headline--v2 .hh-conn ,
  html[data-hero="d"] .hero-headline--v2 .hh-conn { font-size: 18px; }
  html[data-hero="c"] .hero-headline--v2 .hh-flipline ,
  html[data-hero="d"] .hero-headline--v2 .hh-flipline { font-size: 54px; }
  html[data-hero="c"] .hero .hero-meta ,
  html[data-hero="d"] .hero .hero-meta { gap: 14px; }
  html[data-hero="c"] .hero-scrim ,
  html[data-hero="d"] .hero-scrim {
    background: linear-gradient(to bottom, rgba(0,0,0,.22), rgba(0,0,0,0) 12%, rgba(0,0,0,0) 42%, rgba(0,0,0,.6) 74%, rgba(0,0,0,.74));
  }
}

html[data-hero="c"] .hero .rating-badge { display: none; }

html[data-hero="c"] .hero .badge-top {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 11px;
  padding: 7px 18px 7px 7px;
  border-radius: 999px;
  background: rgba(10,10,10,0.56);
  -webkit-backdrop-filter: blur(10.95px) saturate(140%);
  backdrop-filter: blur(10.95px) saturate(140%);
  border: 1px solid rgba(255,255,255,0.10);
}
html[data-hero="c"] .hero .badge-avatar { width: 40px; height: 40px; }
html[data-hero="c"] .hero .badge-id .role { display: block; font-size: 12px; font-weight: 400; color: rgba(255,255,255,0.82); margin-top: 1px; }
html[data-hero="c"] .hero .badge-id .name { font-size: 16px; font-weight: 600; line-height: 1.2; }

@media (min-width: 610px) {
  html[data-hero="c"] .hero-rig,
  html[data-hero="c"] .hero .badge-card,
  html[data-hero="c"] .hero .badge-inner { width: max-content; }
  html[data-hero="c"] .hero .hero-desc,
  html[data-hero="c"] .hero-headline--v2 .hh-flipline { width: 0; min-width: 100%; max-width: none; }
}
@media (min-width: 610px) { .hv-switch { display: none; } }