/* Make the product and its first action clear before the interactive tour. */
.hero-experience .hero-copy {
  max-width: 1080px;
  padding-top: 76px;
  padding-bottom: 37px;
}
.hero-experience h1 {
  font-size: clamp(48px, 5.5vw, 76px);
  line-height: 1.04;
  margin-top: 22px;
  margin-bottom: 20px;
}
.hero-experience .hero-lead {
  max-width: 790px;
  font-size: 17px;
  line-height: 1.55;
  margin-bottom: 25px;
}
.hero-experience .hero-actions .button {
  min-height: 49px;
  padding-inline: 20px;
  font-size: 14px;
}
.hero-download-note {
  margin: 14px auto 0;
  font-size: 11px;
  letter-spacing: .015em;
  color: #dce9ec;
}
.hero-download-note span { padding-inline: 6px; }
html[data-theme="light"] .hero-download-note { color: #617c89; }
html[data-theme="dark"] .hero-experience .hero-actions .button-dark {
  background: #eaf4f5;
  border-color: #eaf4f5;
  color: #153448;
}
html[data-theme="dark"] .hero-experience .hero-actions .button-dark:hover {
  background: #fff;
  border-color: #fff;
}
html[data-theme="dark"] .hero-experience .hero-actions .button-quiet {
  background: #244759;
  border-color: #8babb7;
  color: #f6fbfc;
}
html[data-theme="dark"] .hero-experience .hero-actions .button-quiet:hover {
  background: #315a6e;
}
.site-header .nav-cta {
  background: #254b5f;
  border-color: #254b5f;
  color: #fff;
  font-weight: 700;
}
.site-header .nav-cta:hover {
  background: #356579;
  border-color: #356579;
  color: #fff;
}
html[data-theme="dark"] .site-header .nav-cta {
  background: #d8e9ed;
  border-color: #d8e9ed;
  color: #153448;
}
html[data-theme="dark"] .site-header .nav-cta:hover {
  background: #fff;
  border-color: #fff;
  color: #153448;
}
@media (max-width: 700px) {
  .hero-experience .hero-copy { padding: 66px 19px 31px; }
  .hero-experience h1 { font-size: clamp(42px, 8vw, 58px); }
  .hero-experience .hero-lead { font-size: 15px; }
  .hero-experience .hero-actions .button { width: auto; }
}
@media (max-width: 430px) {
  .hero-experience h1 { font-size: 42px; }
  .hero-experience .hero-actions .button { width: 100%; }
  .hero-download-note { max-width: 250px; line-height: 1.5; }
}
