/* Dark public-site presentation. Tour content, editor and embedded client data are unchanged. */
@font-face {
  font-family: Archivo;
  src: url(/fonts/archivo.woff2) format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
:root {
  color-scheme: dark;
  --ink: #0c1116;
  --ink-2: #161d25;
  --paper: #0c1116;
  --white: #161d25;
  --text: #f6f5f1;
  --muted: #b2beca;
  --line: #33414d;
  --accent: #ff5a1f;
  --accent-soft: #2a211c;
  --accent-ink: #0c1116;
  --r: 5px;
  --radius: 5px;
}
body {
  background: #0c1116;
  color: #f6f5f1;
  font-family: Archivo, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.hero {
  background: #0c1116;
  color: #f6f5f1;
}
.hero .lead,
.hero p.lead {
  color: #b2beca;
}
h1,
h2,
h3,
.logo,
.btn {
  font-family: Archivo, Arial, sans-serif;
}
h1,
h2 {
  font-weight: 800;
  letter-spacing: -0.05em;
}
h1 {
  line-height: 1.01;
}
.serif,
.hero h1 em {
  font-family: inherit;
  font-style: normal;
  color: inherit;
}
.hero h1 {
  font-size: clamp(44px, 5.8vw, 82px);
  letter-spacing: -0.055em;
  font-weight: 800;
}
header,
header.solid {
  background: #0c1116f5;
  color: #f6f5f1;
  border-bottom: 1px solid #33414d;
}
.nav,
.logo,
.nav ul a {
  color: #f6f5f1;
}
.logo {
  flex-wrap: wrap;
  gap: 9px;
  font-size: 29px;
  letter-spacing: -0.065em;
  font-weight: 850;
}
.logo img {
  display: none;
}
.family-by {
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0;
  color: #b2beca;
}
.btn {
  border-radius: 3px;
  font-family: inherit;
}
.btn-accent {
  background: #f6f5f1;
  color: #0c1116;
}
.btn-dark {
  background: #f6f5f1;
  color: #0c1116;
}
.btn-ghost {
  color: #f6f5f1;
  box-shadow: inset 0 0 0 1px #64645e;
}
.btn:hover {
  transform: none;
  background: #ff5a1f;
  color: #0c1116;
}
.eyebrow {
  letter-spacing: 0;
  text-transform: none;
  color: #ff5a1f;
}
.eyebrow::before {
  background: none;
  animation: none;
  border: 1px solid currentColor;
  width: 10px;
  height: 10px;
}
.grain,
.wa-float {
  display: none;
}
.bframe {
  box-shadow: none;
  border: 1px solid #33414d;
  border-radius: 5px;
  animation: none;
}
.bbar {
  background: #242726;
}
.bbar i,
.bbar i:first-child {
  background: #5d605b;
}
.bbar span {
  background: #0c1116;
}
.bbar b {
  color: #ddd9d0;
}
.hero .tabs button {
  font-family: inherit;
}
.menu-btn {
  color: #f6f5f1;
  border-color: #64645e;
}
.hero .hero-stats div {
  color: #b2beca;
}
.hero .hero-stats b {
  color: #f6f5f1;
}
.shine {
  animation: none;
  background: none;
  color: inherit;
  -webkit-text-fill-color: currentColor;
  filter: none;
}
.hero .chips span {
  background: #161d25;
  color: #b2beca;
  border-color: #454742;
}
.tabs button,
.demo-tabs button,
.tabs button.d3,
.demo-tabs button.d3 {
  background: #161d25;
  color: #ddd9d0;
  border-color: #454742;
  border-radius: 3px;
  font-family: inherit;
}
.tabs button:hover,
.demo-tabs button:hover {
  background: #303232;
}
.tabs button.on,
.demo-tabs button.on,
.tabs button.d3.on,
.demo-tabs button.d3.on {
  background: #ff5a1f;
  color: #0c1116;
  border-color: #ff5a1f;
}
.tabs button.on .k,
.demo-tabs button.on .k,
.tabs button.d3.on .k,
.demo-tabs button.d3.on .k {
  background: #0c1116;
  color: #f6f5f1;
}
.tabs button.d3 .k,
.demo-tabs button.d3 .k {
  background: #ff5a1f;
  color: #0c1116;
}
.card,
.plan {
  background: #161d25;
  border-color: #33414d;
  box-shadow: none;
}
.qty button {
  color: #f6f5f1;
}
.opt.dark {
  border-color: #64645e;
}
.opt .tag {
  color: #ff5a1f;
  background: #2a211c;
}
.opt.rec .tag,
.opt.dark .tag {
  background: #ff5a1f;
  color: #0c1116;
}
.opt.dark .sub,
.opt.dark ul {
  color: #b2beca;
}
.opt .big,
.opt.dark .big {
  font-family: Archivo, Arial, sans-serif;
}
.plan.pop {
  border-color: #ff5a1f;
}
.plan .badge {
  background: #ff5a1f;
  color: #0c1116;
}
.ico {
  border-radius: 3px;
}
.q {
  background: #0c1116;
}
.cta {
  background: #161d25;
  color: #f6f5f1;
  border-top: 1px solid #33414d;
}
.cta p,
.cta small {
  color: #b2beca;
}
.next a,
.next a:hover,
.credit {
  color: #b2beca;
}
.next a i {
  background: #ff5a1f;
  color: #0c1116;
}
.hero .lens {
  border-color: #5d605b;
  box-shadow: none;
}
.demo {
  background: #0c1116;
}
.demo .sec-head p {
  color: #b2beca;
}
.tile,
.fstep {
  border-radius: 5px;
}
footer {
  background: #080d12;
  color: #b2beca;
  border-top: 1px solid #33414d;
}
footer a {
  color: #f6f5f1;
}
/* These demos represent a client's website. Keep their own light surface legible. */
.site {
  color-scheme: light;
  background: #f6f5f1;
  color: #1b222b;
}
.site .snav {
  border-color: #d5d4cd;
}
.site .v360 {
  color: #5c4828;
  background: #e7dfcf;
}
.site .v360 i {
  background: #5c4828;
  color: #fff;
}
.site .snote {
  color: #5b6673;
}
.site .media::before {
  background: #bca780;
  animation: none;
}
.site .media-in {
  border-radius: 3px;
}
.site .badge b {
  color: #ff5a1f;
}
.site .photo button {
  background: #f6f5f1;
  color: #0c1116;
}
.site .slogo i {
  background: #8f7d5d;
  animation: none;
}
.site .thumbs button.on {
  border-color: #8f7d5d;
}
.site .info h3 {
  font-weight: 750;
}
.site .sbtn {
  background: #1b222b;
  color: #fff;
}
.site .thumbs {
  color: #fff;
}
a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible {
  outline: 3px solid #ff5a1f;
  outline-offset: 4px;
}
.site a:focus-visible,
.site button:focus-visible {
  outline-color: #735929;
}
::selection {
  background: #ff5a1f;
  color: #0c1116;
}
@media (max-width: 860px) {
  header.open,
  .nav ul {
    background: #0c1116 !important;
  }
  .nav ul a {
    color: #f6f5f1;
  }
  .family-by {
    display: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

.family-menu {
  position: relative;
  z-index: 20;
  font-size: 13px;
}
.family-menu summary {
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  list-style: none;
  min-height: 44px;
  padding: 4px 0;
  color: var(--hq-muted);
}
.family-menu summary::-webkit-details-marker {
  display: none;
}
.family-menu summary::after {
  content: "+";
  font-size: 18px;
}
.family-menu[open] summary::after {
  content: "−";
}
.family-menu .family-links {
  position: absolute;
  top: 100%;
  right: 0;
  width: 228px;
  background: #161d25;
  border: 1px solid #454643;
  padding: 8px;
  box-shadow: 0 15px 50px #0008;
}
.family-links a {
  display: flex;
  justify-content: space-between;
  padding: 13px 12px;
  min-height: 46px;
  border-radius: 2px;
  font-weight: 600;
}
.family-links a:hover {
  background: #303232;
  text-decoration: none !important;
}
.family-links small {
  font-size: 12px;
  font-weight: 400;
  color: var(--hq-muted);
}
.family-links [aria-current="page"] {
  background: #303232;
}
.hq-mark {
  font-size: 12px;
  letter-spacing: -0.02em;
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  padding: 5px 7px 3px 0;
  color: var(--hq-muted);
}

.family-menu {
  --hq-muted: #b2beca;
  color: #f6f5f1;
  margin-left: auto;
  margin-right: 24px;
  font-family: Archivo, Arial, sans-serif;
  font-weight: 400;
  letter-spacing: 0;
}
.family-menu a {
  text-decoration: none;
  color: #f6f5f1;
}
.nav .family-links a {
  color: #f6f5f1;
}
.family-menu .hq-mark {
  font-size: 12px;
}
.family-menu summary {
  font-size: 12px;
}
.family-menu .family-links {
  z-index: 100;
}
.nav ul {
  margin-left: 20px;
}
.hero .serif,
.hero h1 em {
  font-weight: inherit;
}
.plan .tag,
.tile.go .ico,
.poster:hover .play {
  color: #0c1116;
}
@media (max-width: 860px) {
  .nav .family-menu {
    margin-right: 14px;
    margin-left: auto;
  }
  .nav .family-menu summary {
    font-size: 0;
    gap: 5px;
  }
  .nav .menu-btn {
    margin-left: 0;
  }
  .nav .family-links {
    right: -20px;
  }
}
.price-asof,
.page-updated {
  margin: 8px 0 0;
  font-size: 13px;
  line-height: 1.4;
  color: var(--muted);
}
footer .wrap .page-updated {
  flex-basis: 100%;
  margin: 10px 0 0;
}