body.cht-page {
  margin: 0;
  background: #0a111b;
  color: #f5f7fa;
  font: 16px/1.6 Arial,Helvetica,sans-serif;
  color-scheme: dark;
}

.cht-page * {
  box-sizing: border-box;
}

.cht-page a {
  color: inherit;
  text-decoration: none;
}

.cht-page button {
  font: inherit;
}

.cht-page :focus-visible {
  outline: 3px solid #81ceff;
  outline-offset: 5px;
}

.cht-page h1, .cht-page h2, .cht-page h3, .cht-page p {
  margin-top: 0;
}

.cht-page h1, .cht-page h2, .cht-page h3 {
  text-wrap: balance;
}

.cht-page [id] {
  scroll-margin-top: 30px;
}

.cht-nav, .cht-hero, .cht-section, .cht-footer {
  max-width: 1400px;
  margin: auto;
  padding: 30px 5%;
}

.cht-nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #263341;
  gap: 24px;
}

.cht-brand {
  display: flex;
  align-items: center;
  gap: 15px;
  font-weight: 800;
  letter-spacing: 2px;
}

.cht-brand small {
  display: block;
  color: #a6b6c8;
  font-size: 10px;
  letter-spacing: 3px;
}

.cht-nav nav {
  display: flex;
  gap: 28px;
  font-size: 13px;
}

.cht-nav nav a {
  padding: 12px 0;
}

.cht-nav a:hover, .cht-footer a:hover {
  color: #81ceff;
}

.cht-hero {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 32px;
  align-items: center;
  padding-top: 80px;
  padding-bottom: 78px;
}

.cht-kicker {
  font: 11px/1.6 Consolas,monospace;
  letter-spacing: 2px;
  color: #8bcdf3;
  margin-bottom: 24px;
}

.cht-page h1 {
  font-family: 'Arial Narrow',Arial,sans-serif;
  font-stretch: condensed;
  font-size: clamp(42px,4.6vw,76px);
  line-height: 1.03;
  letter-spacing: -3px;
  font-weight: 500;
  margin-bottom: 28px;
}

.cht-page h1 span {
  color: #a9bdcd;
}

.cht-lead {
  max-width: 450px;
  color: #c1ccd6;
  font-size: 18px;
}

.cht-button {
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  gap: 30px;
  min-height: 50px;
  padding: 14px 23px;
  border: 1px solid #6e8297;
  font-size: 13px;
  font-weight: 700;
  transition: background .2s,transform .2s;
}

.cht-button:hover {
  background: #21354a;
  transform: translateY(-2px);
}

.cht-page .cht-white {
  background: #f0f5fa;
  color: #0a111b;
  border-color: #f0f5fa;
}

.cht-page .cht-white:hover {
  background: #cceaff;
}

.cht-note, .cht-caption {
  font-size: 12px;
  color: #9babbc;
  margin: 18px 0 0;
}

.cht-monitor {
  margin-top: 50px;
  background: radial-gradient(ellipse at center,#132a3d,#0d1825 70%);
  border: 1px solid #2f475c;
  box-shadow: 18px 22px 0 #07101a;
}

.cht-monitor-head, .cht-monitor-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px;
  font: 10px Consolas,monospace;
  letter-spacing: 1px;
}

.cht-monitor-head {
  border-bottom: 1px solid #2f475c;
}

.cht-live {
  color: #9de2ff;
}

.cht-monitor svg {
  display: block;
  width: 100%;
  height: auto;
}

.cht-monitor button {
  background: transparent;
  color: #c3d8ea;
  border: 1px solid #4c6378;
  padding: 10px;
  font-size: 11px;
  cursor: pointer;
  min-height: 44px;
}

.cht-monitor button:hover {
  background: #253c50;
}

.cht-monitor .cht-caption {
  padding: 0 18px 18px;
  margin: 0;
}

.cht-route[hidden] {
  display: none;
}

.cht-strip {
  display: flex;
  justify-content: space-evenly;
  gap: 20px;
  padding: 20px 5%;
  border-block: 1px solid #263341;
  color: #a8b8ca;
  font: 11px Consolas,monospace;
  letter-spacing: 2px;
  flex-wrap: wrap;
}

.cht-section {
  padding-top: 85px;
  padding-bottom: 85px;
}

.cht-section-title {
  display: flex;
  justify-content: space-between;
  gap: 30px;
  align-items: end;
  margin-bottom: 36px;
}

.cht-page h2 {
  font-size: clamp(28px,3vw,42px);
  font-weight: 400;
  line-height: 1.16;
  letter-spacing: -1px;
  margin-bottom: 0;
}

.cht-section-title > p {
  font-size: 14px;
  color: #a8b8ca;
}

.cht-products {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

.cht-product {
  border: 1px solid #344759;
  background: #101c2a;
  min-width: 0;
}

.cht-product-top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 20px;
  font: 10px Consolas,monospace;
  letter-spacing: 1px;
}

.cht-platform {
  color: #bbc8d5;
}

.cht-beta {
  color: #9de2ff;
}

.cht-product-art {
  height: 210px;
  position: relative;
  background: repeating-linear-gradient(0deg,transparent 0 29px,#203043 30px),repeating-linear-gradient(90deg,#0d1723 0 29px,#203043 30px);
  display: grid;
  place-items: center;
  overflow: hidden;
}

.cht-vector {
  width: 190px;
  height: 110px;
  border: 1px solid #80c9f5;
  position: relative;
  transform: rotate(-9deg);
  background: repeating-conic-gradient(#245c80 0 25%,#102e45 0 50%) 0/44px 44px;
}

.cht-vector:before, .cht-vector:after, .cht-vector span, .cht-vector i {
  content: '';
  position: absolute;
  width: 8px;
  height: 8px;
  background: #e9f4ff;
  border: 1px solid #249bec;
}

.cht-vector:before {
  left: -5px;
  top: -5px;
}

.cht-vector:after {
  right: -5px;
  bottom: -5px;
}

.cht-vector span {
  right: -5px;
  top: -5px;
}

.cht-vector i {
  left: -5px;
  bottom: -5px;
}

.cht-vector b {
  position: absolute;
  right: -30px;
  bottom: -20px;
  background: #2c180b;
  color: #ffad60;
  border: 1px solid #a36b34;
  padding: 6px 12px;
  font-size: 26px;
  transform: rotate(9deg);
}

.cht-art-label {
  position: absolute;
  bottom: 12px;
  font: 10px Consolas,monospace;
  letter-spacing: 2px;
  color: #a3b6c8;
}

.cht-mini {
  display: flex;
  align-items: end;
  gap: 12px;
  position: relative;
  padding-bottom: 15px;
}

.cht-mini div {
  width: 48px;
  height: 112px;
  background: repeating-conic-gradient(#207bb0 0 25%,#145077 0 50%) 0/24px 24px;
  border: 1px solid #78c1ef;
}

.cht-mini div:nth-child(2) {
  width: 168px;
  height: 84px;
}

.cht-mini span {
  position: absolute;
  left: 86px;
  bottom: 43px;
  background: #0c1824;
  padding: 7px;
  color: #eff9ff;
  font: 10px Consolas,monospace;
}

.cht-product-copy {
  padding: 32px;
}

.cht-product-copy > img {
  object-fit: contain;
  object-position: left;
  margin-bottom: 20px;
}

.cht-wordmark {
  font-size: 27px;
  letter-spacing: -1px;
  height: 40px;
  margin-bottom: 20px;
}

.cht-wordmark span {
  color: #66bbf1;
}

.cht-page h3 {
  font-weight: 400;
  font-size: 25px;
  line-height: 1.2;
  letter-spacing: -.5px;
}

.cht-product-copy p:not(.cht-wordmark), .cht-product-copy li {
  color: #b8c6d3;
  font-size: 15px;
}

.cht-product-copy ul {
  padding-left: 20px;
  margin: 25px 0;
}

.cht-product-copy li {
  padding: 5px 0;
}

.cht-product-copy .cht-button {
  width: 100%;
}

.cht-page .cht-blue {
  background: #aadfff;
  border-color: #aadfff;
  color: #09263b;
}

.cht-page .cht-blue:hover {
  background: #d8f0ff;
}

.cht-product-copy small {
  display: block;
  margin-top: 16px;
  color: #99abba;
  font-size: 12px;
}

.cht-choice {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  border-top: 1px solid #263341;
}

.cht-answers details {
  border-bottom: 1px solid #344759;
  padding: 20px 0;
}

.cht-answers summary {
  cursor: pointer;
  min-height: 44px;
  font-size: 17px;
}

.cht-answers p {
  color: #afc0ce;
  font-size: 15px;
  margin: 12px 0;
}

.cht-contact {
  text-align: center;
  padding: 75px 24px;
  background: #12283b;
  border-block: 1px solid #35536d;
}

.cht-contact h2 {
  margin-bottom: 30px;
}

.cht-footer {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  font-size: 11px;
  color: #b7c4d0;
}

.cht-skip {
  position: fixed;
  top: -100px;
  left: 20px;
  background: #fff;
  color: #000!important;
  padding: 12px;
  z-index: 10;
}

.cht-skip:focus {
  top: 10px;
}

@media (max-width:850px) {
  .cht-hero {
    grid-template-columns: 1fr;
    padding-top: 45px;
  }
}

@media (max-width:850px) {
  .cht-monitor {
    margin-top: 0;
  }
}

@media (max-width:850px) {
  .cht-page h1 {
    font-size: clamp(44px,8vw,65px);
  }
}

@media (max-width:850px) {
  .cht-choice {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

@media (max-width:850px) {
  .cht-section-title {
    display: block;
  }
}

@media (max-width:850px) {
  .cht-section-title > p {
    margin-top: 18px;
  }
}

@media (max-width:580px) {
  .cht-products {
    grid-template-columns: 1fr;
  }
}

@media (max-width:580px) {
  .cht-nav {
    align-items: start;
    flex-direction: column;
    gap: 12px;
  }
}

@media (max-width:580px) {
  .cht-nav nav {
    width: 100%;
    justify-content: space-between;
    gap: 12px;
  }
}

@media (max-width:580px) {
  .cht-hero {
    padding-bottom: 48px;
  }
}

@media (max-width:580px) {
  .cht-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}

@media (max-width:580px) {
  .cht-product-copy {
    padding: 24px;
  }
}

@media (max-width:580px) {
  .cht-monitor-head, .cht-monitor-foot {
    font-size: 9px;
    padding: 12px;
  }
}

@media (max-width:580px) {
  .cht-page h1 {
    letter-spacing: -2px;
  }
}

@media (max-width:580px) {
  .cht-strip {
    justify-content: start;
    font-size: 9px;
  }
}

@media (max-width:580px) {
  .cht-footer {
    flex-direction: column;
  }
}

@media (prefers-reduced-motion:reduce) {
  .cht-page * {
    transition: none!important;
    scroll-behavior: auto!important;
  }
}

