@charset "UTF-8";

/* Prototypes/CustomerStory/Styles/prototype.scss */
header.cg-nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 68px;
  padding: 0;
  margin: 0;
  z-index: 50;
  background: #ffffff;
  border-bottom: 1px solid #E5E5E5;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  color: #191919;
  transition: none;
  box-sizing: border-box;
}
header.cg-nav *,
header.cg-nav *::before,
header.cg-nav *::after {
  box-sizing: border-box;
}
header.cg-nav a {
  text-decoration: none;
  color: inherit;
}
header.cg-nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
header.cg-nav button {
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #191919;
  border: none;
  background: transparent;
  cursor: pointer;
  padding: 0;
  margin: 0;
}
header.cg-nav .cg-wrap {
  position: relative;
  height: 100%;
}
header.cg-nav .cg-bar {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 40px;
  height: 68px;
  display: flex;
  align-items: center;
  gap: 40px;
}
header.cg-nav .cg-logo {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}
header.cg-nav .cg-logo img {
  width: 120px;
  height: 24px;
  display: block;
}
header.cg-nav .cg-menu {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  min-width: 0;
}
header.cg-nav .cg-item {
  position: static;
}
header.cg-nav .cg-item.cg-item--pop {
  position: relative;
}
header.cg-nav .cg-top {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 68px;
  padding: 0 14px;
  font-size: 14px;
  font-weight: 600;
  color: #191919;
  white-space: nowrap;
  box-shadow: inset 0 0 0 #2355f0;
  transition: color 0.15s ease, box-shadow 0.15s ease;
}
header.cg-nav a.cg-top:hover {
  color: #2355f0;
}
header.cg-nav .cg-item.is-open > .cg-top {
  box-shadow: inset 0 -2px 0 #2355f0;
}
header.cg-nav .cg-top svg {
  width: 10px;
  height: 10px;
  transition: transform 0.15s ease;
}
header.cg-nav .cg-item.is-open > .cg-top svg {
  transform: rotate(180deg);
}
header.cg-nav .cg-right {
  display: flex;
  align-items: center;
  gap: 16px;
  flex: 0 0 auto;
}
header.cg-nav .cg-lang {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
}
header.cg-nav .cg-lang .cg-lang-active {
  color: #191919;
}
header.cg-nav .cg-lang .cg-lang-off {
  color: #B0B4C0;
}
header.cg-nav .cg-lang .cg-lang-sep {
  color: #CCCCCC;
}
header.cg-nav .cg-lang a {
  color: #666666;
}
header.cg-nav .cg-lang a:hover {
  color: #2355f0;
}
header.cg-nav .cg-login {
  font-size: 14px;
  font-weight: 600;
  color: #191919;
}
header.cg-nav .cg-login:hover {
  color: #2355f0;
}
header.cg-nav .cg-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 0 20px;
  border-radius: 8px;
  background: #2355f0;
  color: #ffffff;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  transition: background 0.15s ease;
}
header.cg-nav .cg-btn:hover {
  background: #1C40C3;
  color: #ffffff;
}
header.cg-nav .cg-mega {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: #ffffff;
  border-top: 1px solid #E5E5E5;
  border-bottom: 1px solid #E5E5E5;
  box-shadow: 0 12px 32px rgba(25, 25, 25, 0.12);
}
header.cg-nav .cg-item.is-open > .cg-mega {
  display: block;
}
header.cg-nav .cg-mega-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 40px;
  display: grid;
  gap: 40px;
}
header.cg-nav .cg-mega--platform .cg-mega-inner {
  grid-template-columns: 1fr 1fr 1fr 1fr 1.2fr;
}
header.cg-nav .cg-mega--solutions .cg-mega-inner {
  grid-template-columns: 1fr 1fr 1fr 1.2fr;
}
header.cg-nav .cg-col {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
header.cg-nav .cg-col-head {
  display: flex;
  align-items: center;
  gap: 8px;
}
header.cg-nav .cg-col-ico {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: #E9EEFD;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 28px;
}
header.cg-nav .cg-col-ico svg {
  width: 14px;
  height: 14px;
}
header.cg-nav .cg-col-title {
  font-family:
    "geomanist bold",
    Geomanist,
    sans-serif;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: -0.5px;
  color: #191919;
}
header.cg-nav .cg-eyebrow {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #2355f0;
}
header.cg-nav .cg-col a {
  font-size: 13px;
  line-height: 18px;
  color: #666666;
}
header.cg-nav .cg-col a:hover {
  color: #2355f0;
}
header.cg-nav .cg-card {
  background: #F4F6FE;
  border-radius: 12px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
header.cg-nav .cg-card-title {
  font-family:
    "geomanist bold",
    Geomanist,
    sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 24px;
  letter-spacing: -0.5px;
  color: #191919;
}
header.cg-nav .cg-card-text {
  font-size: 13px;
  line-height: 20px;
  color: #666666;
}
header.cg-nav .cg-card a.cg-card-link {
  font-size: 13px;
  font-weight: 600;
  color: #2355f0;
}
header.cg-nav .cg-card a.cg-card-link:hover {
  color: #1C40C3;
}
header.cg-nav .cg-pop {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  width: 240px;
  background: #ffffff;
  border: 1px solid #E5E5E5;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(25, 25, 25, 0.08);
  padding: 8px;
  flex-direction: column;
}
header.cg-nav .cg-item.is-open > .cg-pop {
  display: flex;
}
header.cg-nav .cg-pop a {
  padding: 10px 12px;
  border-radius: 8px;
  font-size: 13px;
  color: #191919;
}
header.cg-nav .cg-pop a:hover {
  background: #F4F6FE;
  color: #191919;
}
header.cg-nav .cg-burger {
  display: none;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  flex-direction: column;
  gap: 5px;
}
header.cg-nav .cg-burger span {
  display: block;
  width: 20px;
  height: 2px;
  background: #191919;
  border-radius: 2px;
  transition: transform 0.2s ease, opacity 0.2s ease;
}
header.cg-nav.is-mobile-open .cg-burger span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}
header.cg-nav.is-mobile-open .cg-burger span:nth-child(2) {
  opacity: 0;
}
header.cg-nav.is-mobile-open .cg-burger span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}
header.cg-nav .cg-mobile {
  display: none;
}
header.cg-nav #scroll_progress {
  --scroll:0%;
  background:
    linear-gradient(
      to right,
      rgb(35, 86, 240) var(--scroll),
      transparent 0);
  position: fixed;
  width: 100%;
  height: 2px;
  top: 0;
  left: 0;
  z-index: 100;
}
@media screen and (min-width: 1180px) and (max-width: 1279px) {
  header.cg-nav .cg-bar {
    gap: 24px;
  }
  header.cg-nav .cg-menu {
    gap: 6px;
  }
  header.cg-nav .cg-top {
    padding: 0 11px;
  }
  header.cg-nav .cg-right {
    gap: 12px;
  }
}
@media screen and (max-width: 1179px) {
  header.cg-nav .cg-bar {
    padding: 0 24px;
    gap: 16px;
  }
  header.cg-nav .cg-menu,
  header.cg-nav .cg-right .cg-lang,
  header.cg-nav .cg-right .cg-login,
  header.cg-nav .cg-right .cg-btn {
    display: none;
  }
  header.cg-nav .cg-right {
    margin-left: auto;
  }
  header.cg-nav .cg-burger {
    display: inline-flex;
  }
  header.cg-nav.is-mobile-open .cg-mobile {
    display: block;
    position: fixed;
    top: 68px;
    left: 0;
    right: 0;
    bottom: 0;
    background: #ffffff;
    overflow-y: auto;
    padding: 8px 24px 32px;
    border-top: 1px solid #E5E5E5;
  }
  header.cg-nav .cg-m-item {
    border-bottom: 1px solid #E5E5E5;
  }
  header.cg-nav .cg-m-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 52px;
    font-size: 15px;
    font-weight: 600;
    color: #191919;
  }
  header.cg-nav .cg-m-top svg {
    width: 12px;
    height: 12px;
    transition: transform 0.15s ease;
  }
  header.cg-nav .cg-m-item.is-open .cg-m-top svg {
    transform: rotate(180deg);
  }
  header.cg-nav .cg-m-sub {
    display: none;
    padding: 0 0 16px;
  }
  header.cg-nav .cg-m-item.is-open .cg-m-sub {
    display: block;
  }
  header.cg-nav .cg-m-sub .cg-eyebrow {
    margin: 12px 0 8px;
  }
  header.cg-nav .cg-m-sub a {
    display: block;
    padding: 6px 0;
    font-size: 14px;
    color: #666666;
  }
  header.cg-nav .cg-m-sub a:hover {
    color: #2355f0;
  }
  header.cg-nav .cg-m-foot {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-top: 20px;
  }
  header.cg-nav .cg-m-foot .cg-lang,
  header.cg-nav .cg-m-foot .cg-login {
    display: flex;
  }
  header.cg-nav .cg-m-foot .cg-btn {
    display: inline-flex;
    align-self: flex-start;
  }
}
@media screen and (max-width: 743px) {
  header.cg-nav {
    height: 68px;
  }
}
main.cs-page {
  --b:#2355f0;
  --bh:#1C40C3;
  --t1:#E9EEFD;
  --t2:#F4F6FE;
  --ink:#191919;
  --mute:#666666;
  --line:#E5E5E5;
  --todo:#FFF6D6;
  --todoline:#E8C55A;
  margin-top: 68px;
  color: var(--ink);
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  line-height: 1.65;
  font-weight: 400;
  background: #ffffff;
}
main.cs-page * {
  box-sizing: border-box;
}
main.cs-page a {
  color: var(--b);
  text-decoration: none;
}
main.cs-page a:hover {
  color: var(--bh);
}
.cs-wrap {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 40px;
}
.cs-narrow {
  max-width: 760px;
}
.cs-h {
  font-family:
    "geomanist bold",
    Geomanist,
    sans-serif;
  font-weight: 800;
  letter-spacing: -0.5px;
  color: var(--ink);
  margin: 0;
}
.cs-eyebrow {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--b);
  margin: 0 0 12px;
}
.cs-todo {
  background: var(--todo);
  border: 1px dashed var(--todoline);
  border-radius: 6px;
  padding: 0 6px;
  color: #6B5200;
  font-weight: 600;
}
.cs-hero {
  background: var(--t2);
  border-bottom: 1px solid var(--line);
  padding: 56px 0 64px;
}
.cs-crumb {
  font-size: 13px;
  color: var(--mute);
  margin-bottom: 32px;
}
.cs-crumb a {
  color: var(--mute);
}
.cs-crumb a:hover {
  color: var(--b);
}
.cs-hero-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 56px;
  align-items: center;
}
.cs-hero h1 {
  font-size: 52px;
  line-height: 1.08;
  margin-bottom: 20px;
}
.cs-hero .cs-lede {
  font-size: 19px;
  line-height: 1.6;
  color: #333;
  max-width: 620px;
  margin: 0 0 28px;
}
.cs-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.cs-tags li {
  font-size: 13px;
  font-weight: 600;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 6px 14px;
  color: var(--ink);
}
.cs-logo-card {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  text-align: center;
}
.cs-logo-card img {
  width: 200px;
  height: 112px;
  display: block;
  object-fit: contain;
}
.cs-logo-card p {
  margin: 0;
  font-size: 14px;
  color: var(--mute);
}
.cs-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #ffffff;
  margin: -36px auto 0;
  position: relative;
  overflow: hidden;
}
.cs-stat {
  padding: 28px 32px;
  border-right: 1px solid var(--line);
}
.cs-stat:last-child {
  border-right: none;
}
.cs-stat .n {
  font-family:
    "geomanist bold",
    Geomanist,
    sans-serif;
  font-weight: 800;
  font-size: 44px;
  line-height: 1;
  color: var(--b);
  letter-spacing: -1px;
  margin-bottom: 10px;
}
.cs-stat .l {
  font-size: 14px;
  line-height: 1.5;
  color: var(--mute);
}
.cs-stat.is-todo {
  background: var(--todo);
}
.cs-stat.is-todo .n {
  color: #6B5200;
}
.cs-section {
  padding: 56px 0;
}
.cs-challenge h2 {
  font-size: 34px;
  line-height: 1.15;
  margin-bottom: 20px;
}
.cs-challenge p {
  margin: 0 0 16px;
  font-size: 17px;
}
.cs-layers {
  background: var(--t2);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.cs-layers-head {
  margin-bottom: 48px;
}
.cs-layers-head h2 {
  font-size: 34px;
  line-height: 1.15;
}
.cs-layer {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 48px;
  padding: 40px 0;
  border-top: 1px solid var(--line);
}
.cs-layer:first-of-type {
  border-top: none;
}
.cs-layer-tag {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.cs-layer-num {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--b);
  color: #ffffff;
  font-family:
    "geomanist bold",
    Geomanist,
    sans-serif;
  font-weight: 800;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cs-layer-name {
  font-family:
    "geomanist bold",
    Geomanist,
    sans-serif;
  font-weight: 800;
  font-size: 20px;
  color: var(--b);
  letter-spacing: -0.3px;
}
.cs-layer h3 {
  font-size: 26px;
  line-height: 1.2;
  margin-bottom: 14px;
}
.cs-layer p {
  margin: 0 0 14px;
}
.cs-flow {
  margin: 24px 0 8px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 16px;
  align-items: stretch;
}
.cs-flow-col {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.cs-node {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px 16px;
  font-size: 14px;
  line-height: 1.4;
}
.cs-node b {
  display: block;
  font-size: 12px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: var(--b);
  margin-bottom: 2px;
}
.cs-node.is-core {
  border: 2px solid var(--b);
  background: var(--t1);
}
.cs-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--b);
  font-size: 22px;
  font-weight: 700;
}
.cs-flow-label {
  font-size: 13px;
  color: var(--mute);
  margin-top: 6px;
}
.cs-outcome h2 {
  font-size: 34px;
  line-height: 1.15;
  margin-bottom: 24px;
}
.cs-outcome ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 14px;
}
.cs-outcome li {
  position: relative;
  padding-left: 32px;
  font-size: 17px;
}
.cs-outcome li:before {
  content: "";
  position: absolute;
  left: 0;
  top: 7px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--b);
  box-shadow: inset 0 0 0 5px var(--t1);
}
.cs-quote {
  background: var(--b);
  color: #ffffff;
  padding: 80px 0;
}
.cs-quote blockquote {
  margin: 0;
  max-width: 900px;
}
.cs-quote .q {
  font-family:
    "geomanist bold",
    Geomanist,
    sans-serif;
  font-weight: 800;
  font-size: 34px;
  line-height: 1.25;
  letter-spacing: -0.5px;
  margin: 0 0 24px;
}
.cs-quote .q .cs-todo {
  font-family: "Open Sans", sans-serif;
  font-size: 18px;
  font-weight: 600;
}
.cs-quote cite {
  font-style: normal;
  font-size: 15px;
  opacity: 0.9;
}
.cs-two {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 48px;
  align-items: start;
}
.cs-two h2 {
  font-size: 28px;
  line-height: 1.2;
  margin-bottom: 24px;
}
.cs-sol {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.cs-sol a {
  display: flex;
  flex-direction: column;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 20px;
  color: var(--ink);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.cs-sol a:hover {
  border-color: var(--b);
  box-shadow: 0 4px 12px rgba(25, 25, 25, 0.08);
  color: var(--ink);
}
.cs-sol .t,
.cs-more .t {
  color: var(--ink) !important;
}
.cs-sol .t {
  font-family:
    "geomanist bold",
    Geomanist,
    sans-serif;
  font-weight: 800;
  font-size: 17px;
}
.cs-sol .d {
  font-size: 14px;
  color: var(--mute);
  line-height: 1.5;
}
.cs-sol .go {
  font-size: 13px;
  font-weight: 600;
  color: var(--b);
  margin-top: 4px;
}
.cs-sol-ico {
  display: block;
  width: 40px;
  height: 40px;
  margin-bottom: 8px;
  color: var(--ink);
}
.cs-sol-ico img,
.cs-sol-ico svg {
  display: block;
  width: 100%;
  height: 100%;
}
.cs-facts {
  background: var(--t2);
  border-radius: 16px;
  padding: 28px;
}
.cs-facts h3 {
  font-size: 18px;
  margin-bottom: 16px;
}
.cs-facts dl {
  margin: 0;
  display: grid;
  gap: 14px;
}
.cs-facts dt {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: var(--mute);
}
.cs-facts dd {
  margin: 2px 0 0;
  font-size: 15px;
  line-height: 1.5;
}
.cs-cta {
  padding: 0 0 64px;
}
.cs-cta-box {
  background: var(--ink);
  color: #ffffff;
  border-radius: 20px;
  padding: 56px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 32px;
  flex-wrap: wrap;
}
.cs-cta-box .cs-h {
  color: #ffffff;
  font-size: 38px;
  line-height: 1.1;
}
.cs-cta-box p {
  margin: 10px 0 0;
  color: #CCCCCC;
  font-size: 16px;
}
.cs-btns {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.cs-btn {
  display: inline-flex;
  align-items: center;
  height: 48px;
  padding: 0 24px;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 600;
}
main.cs-page a.cs-btn--p {
  background: var(--b);
  color: #ffffff;
}
main.cs-page a.cs-btn--p:hover {
  background: var(--bh);
  color: #ffffff;
}
main.cs-page a.cs-btn--s {
  border: 1px solid #555;
  color: #ffffff;
}
main.cs-page a.cs-btn--s:hover {
  border-color: #ffffff;
  color: #ffffff;
}
.cs-more {
  border-top: 1px solid var(--line);
  padding: 48px 0 64px;
}
.cs-more h2 {
  font-size: 28px;
  margin-bottom: 24px;
}
.cs-more-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.cs-more a {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 24px;
  color: var(--ink);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cs-more a:hover {
  border-color: var(--b);
  color: var(--ink);
}
.cs-more .who {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: var(--b);
}
.cs-more .t {
  font-family:
    "geomanist bold",
    Geomanist,
    sans-serif;
  font-weight: 800;
  font-size: 19px;
  line-height: 1.3;
}
@media (max-width: 1023px) {
  .cs-wrap {
    padding: 0 24px;
  }
  .cs-hero-grid,
  .cs-two {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .cs-hero h1 {
    font-size: 38px;
  }
  .cs-layer {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .cs-layer-tag {
    flex-direction: row;
    align-items: center;
  }
  .cs-more-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .cs-wrap {
    padding: 0 16px;
  }
  .cs-hero {
    padding: 32px 0 56px;
  }
  .cs-hero h1 {
    font-size: 32px;
  }
  .cs-stats {
    grid-template-columns: 1fr;
  }
  .cs-stat {
    border-right: none;
    border-bottom: 1px solid var(--line);
  }
  .cs-stat:last-child {
    border-bottom: none;
  }
  .cs-section {
    padding: 64px 0;
  }
  .cs-flow {
    grid-template-columns: 1fr;
  }
  .cs-arrow {
    transform: rotate(90deg);
    padding: 4px 0;
  }
  .cs-sol {
    grid-template-columns: 1fr;
  }
  .cs-quote .q {
    font-size: 26px;
  }
  .cs-cta-box {
    padding: 32px;
  }
  .cs-cta-box .cs-h {
    font-size: 30px;
  }
  .cs-challenge h2,
  .cs-layers-head h2,
  .cs-outcome h2 {
    font-size: 28px;
  }
}
.cs-3d {
  padding: 56px 0;
}
.cs-3d-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 32px;
  margin-bottom: 32px;
  flex-wrap: wrap;
}
.cs-3d-head > div:first-child {
  max-width: 640px;
}
.cs-3d-head h2 {
  font-size: 34px;
  line-height: 1.15;
  margin-bottom: 12px;
}
.cs-3d-head p {
  margin: 0;
  font-size: 17px;
  color: #333;
}
.cs-3d-frame {
  aspect-ratio: 16/9;
  width: 100%;
  border-radius: 16px;
  background:
    linear-gradient(
      135deg,
      var(--t1),
      var(--t2));
  border: 2px dashed var(--todoline);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
  overflow: hidden;
}
.cs-3d-ph {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
  max-width: 560px;
}
.cs-3d-ph p {
  margin: 0;
  font-size: 15px;
  line-height: 1.7;
}
.cs-3d-badge {
  width: 72px;
  height: 72px;
  border-radius: 18px;
  background: var(--b);
  color: #ffffff;
  font-family:
    "geomanist bold",
    Geomanist,
    sans-serif;
  font-weight: 800;
  font-size: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 24px rgba(35, 85, 240, 0.25);
}
.cs-logo-ph {
  width: 200px;
  height: 112px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.cs-status {
  font-size: 12px;
  font-weight: 600;
  color: var(--mute);
  margin-top: auto;
  padding-top: 8px;
}
.cs-status.is-live {
  color: var(--b);
}
.cs-overview {
  border-top: none;
  padding-top: 56px;
}
@media (max-width: 720px) {
  .cs-3d {
    padding: 44px 0;
  }
  .cs-3d-head h2 {
    font-size: 28px;
  }
  .cs-3d-frame {
    aspect-ratio: 4/3;
    padding: 20px;
  }
}
main.hm-page {
  --b:#2355f0;
  --bh:#1C40C3;
  --b2:#5B80FF;
  --t1:#E9EEFD;
  --t2:#F4F6FE;
  --ink:#191919;
  --mute:#5E6272;
  --line:#E3E6EF;
  --white:#ffffff;
  --disp:"geomanist bold",Geomanist,"Open Sans",sans-serif;
  --body:"Open Sans",system-ui,sans-serif;
  margin-top: 68px;
  color: var(--ink);
  font-family: var(--body);
  font-size: 16px;
  line-height: 1.65;
  background: var(--white);
  overflow-x: clip;
}
main.hm-page * {
  box-sizing: border-box;
}
main.hm-page a {
  text-decoration: none;
}
main.hm-page img {
  max-width: 100%;
}
.hm-wrap {
  max-width: 1280px;
  margin: 0 auto;
  padding-left: max(24px, env(safe-area-inset-left, 0px));
  padding-right: max(24px, env(safe-area-inset-right, 0px));
}
.hm-h {
  font-family: var(--disp);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: inherit;
  margin: 0;
  text-wrap: balance;
}
.hm-h2 {
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1.08;
}
.hm-eyebrow {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--b);
  margin: 0 0 14px;
}
.hm-eyebrow--light {
  color: rgba(255, 255, 255, 0.8);
}
.hm-sub {
  font-size: 18px;
  color: var(--mute);
  margin: 16px 0 0;
  max-width: 62ch;
}
.hm-section {
  padding-block: clamp(44px, 5vw, 72px);
}
.hm-head {
  margin-bottom: 32px;
  max-width: 760px;
}
.hm-head--split {
  max-width: none;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 32px;
  flex-wrap: wrap;
}
.hm-head--split .hm-sub {
  max-width: 46ch;
  margin: 0;
}
.hm-btns {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.hm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 52px;
  padding: 0 26px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 700;
  transition:
    transform 0.15s ease,
    background 0.15s ease,
    border-color 0.15s ease;
}
.hm-btn:hover {
  transform: translateY(-1px);
}
main.hm-page a.hm-btn--white {
  background: var(--white);
  color: var(--b);
}
main.hm-page a.hm-btn--white:hover {
  background: var(--t1);
  color: var(--bh);
}
main.hm-page a.hm-btn--ghost {
  border: 1.5px solid rgba(255, 255, 255, 0.55);
  color: var(--white);
}
main.hm-page a.hm-btn--ghost:hover {
  border-color: var(--white);
  color: var(--white);
}
main.hm-page a.hm-btn--blue {
  background: var(--b);
  color: var(--white);
}
main.hm-page a.hm-btn--blue:hover {
  background: var(--bh);
  color: var(--white);
}
main.hm-page :focus-visible {
  outline: 3px solid var(--b2);
  outline-offset: 3px;
  border-radius: 6px;
}
.hm-hero {
  background: var(--b);
  color: var(--white);
  padding-block: clamp(48px, 6vw, 80px) clamp(56px, 6vw, 88px);
  position: relative;
  overflow: hidden;
}
.hm-hero:before {
  content: "";
  position: absolute;
  right: -12%;
  top: -30%;
  width: 70%;
  aspect-ratio: 1;
  border-radius: 50%;
  background:
    radial-gradient(
      circle,
      rgba(255, 255, 255, 0.14),
      rgba(255, 255, 255, 0) 65%);
  pointer-events: none;
}
.hm-hero-grid {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 56px;
  align-items: center;
  position: relative;
}
.hm-hero-copy {
  min-width: 0;
}
.hm-hero-h {
  font-size: clamp(38px, 5vw, 68px);
  line-height: 1.04;
  letter-spacing: -0.03em;
  margin-bottom: 24px;
}
.hm-go {
  font-family: var(--disp);
  font-weight: 800;
  font-size: clamp(28px, 3.6vw, 48px);
  line-height: 1.1;
  margin: 10px 0 28px;
  color: #BFD0FF;
  height: 1.15em;
  overflow: hidden;
}
.hm-go-word {
  display: inline-block;
  transition: transform 0.45s cubic-bezier(0.2, 0.7, 0.2, 1), opacity 0.45s ease;
}
.hm-go-word.is-out {
  transform: translateY(-100%);
  opacity: 0;
}
.hm-go-word.is-in {
  transform: translateY(100%);
  opacity: 0;
  transition: none;
}
.hm-hero-lede {
  font-size: clamp(17px, 1.6vw, 20px);
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.88);
  max-width: 56ch;
  margin: 0 0 32px;
}
main.hm-page a.hm-try-link {
  display: inline-block;
  margin-top: 22px;
  color: rgba(255, 255, 255, 0.85);
  font-weight: 600;
  font-size: 15px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.35);
  padding-bottom: 2px;
}
main.hm-page a.hm-try-link:hover {
  color: var(--white);
  border-color: var(--white);
}
.hm-hero-visual {
  position: relative;
  aspect-ratio: 1/1;
  max-width: 560px;
  width: 100%;
  justify-self: end;
}
.hm-shot {
  position: absolute;
  margin: 0;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 24px 60px rgba(8, 20, 80, 0.35);
  border: 4px solid rgba(255, 255, 255, 0.9);
  animation: hm-float 7s ease-in-out infinite;
}
.hm-shot img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hm-shot--a {
  width: 58%;
  left: 0;
  top: 6%;
  z-index: 2;
}
.hm-shot--b {
  width: 44%;
  right: 2%;
  top: 0;
  transform: rotate(3deg);
  animation-delay: -2s;
}
.hm-shot--c {
  width: 48%;
  right: 8%;
  bottom: 2%;
  z-index: 3;
  transform: rotate(-2deg);
  animation-delay: -4s;
}
.hm-chip {
  position: absolute;
  z-index: 4;
  background: var(--white);
  color: var(--ink);
  border-radius: 12px;
  padding: 10px 14px;
  font-size: 13px;
  line-height: 1.35;
  box-shadow: 0 10px 30px rgba(8, 20, 80, 0.25);
}
.hm-chip b {
  display: block;
  font-family: var(--disp);
  font-size: 20px;
  color: var(--b);
}
.hm-chip--years {
  left: 4%;
  bottom: 10%;
}
.hm-chip--live {
  right: -2%;
  top: 46%;
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
}
.hm-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #22C55E;
  box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.6);
  animation: hm-pulse 2s infinite;
}
@keyframes hm-float {
  0%, 100% {
    translate: 0 0;
  }
  50% {
    translate: 0 -10px;
  }
}
@keyframes hm-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.55);
  }
  70% {
    box-shadow: 0 0 0 10px rgba(34, 197, 94, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
  }
}
.hm-logos {
  padding-block: 32px 36px;
  border-bottom: 1px solid var(--line);
}
.hm-logos-label {
  text-align: center;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
  margin: 0 0 24px;
}
.hm-marquee {
  overflow: hidden;
  -webkit-mask-image:
    linear-gradient(
      90deg,
      transparent,
      #000 10%,
      #000 90%,
      transparent);
  mask-image:
    linear-gradient(
      90deg,
      transparent,
      #000 10%,
      #000 90%,
      transparent);
  padding-block: 10px;
}
.hm-marquee-track {
  display: flex;
  align-items: center;
  gap: 64px;
  width: max-content;
  animation: hm-scroll 48s linear infinite;
}
.hm-marquee--reverse .hm-marquee-track {
  animation-direction: reverse;
  animation-duration: 56s;
}
.hm-marquee:hover .hm-marquee-track {
  animation-play-state: paused;
}
.hm-marquee-track img {
  height: 36px;
  width: auto;
  max-width: 170px;
  object-fit: contain;
  filter: grayscale(1);
  opacity: 0.6;
  transition: filter 0.2s ease, opacity 0.2s ease;
}
.hm-marquee-track img:hover {
  filter: none;
  opacity: 1;
}
@keyframes hm-scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}
.hm-layer-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.hm-layer {
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  background: var(--white);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.hm-layer:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px rgba(35, 85, 240, 0.1);
}
.hm-layer-step {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
}
.hm-layer h3 {
  font-size: 30px;
  line-height: 1.1;
  color: var(--b);
}
.hm-layer p {
  margin: 0;
  color: #333;
}
.hm-keys {
  list-style: none;
  margin: auto 0 0;
  padding: 8px 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.hm-keys li {
  font-size: 12px;
  font-weight: 600;
  border-radius: 999px;
  padding: 5px 12px;
  background: var(--t2);
  color: var(--ink);
}
.hm-layer--accent {
  background: var(--b);
  border-color: var(--b);
  color: var(--white);
}
.hm-layer--accent h3,
.hm-layer--accent p {
  color: var(--white);
}
.hm-layer--accent .hm-layer-step {
  color: rgba(255, 255, 255, 0.75);
}
.hm-layer--accent .hm-keys li {
  background: rgba(255, 255, 255, 0.16);
  color: var(--white);
}
.hm-3d {
  background: var(--t2);
  border-block: 1px solid var(--line);
}
.hm-config {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: 24px;
  align-items: stretch;
}
.hm-stage {
  position: relative;
  min-height: 420px;
  border-radius: 24px;
  overflow: hidden;
  background:
    radial-gradient(
      120% 90% at 50% 20%,
      #FFFFFF 0%,
      #E7ECFB 70%,
      #DCE3F8 100%);
  border: 1px solid var(--line);
  min-width: 0;
}
.hm-stage canvas {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  cursor: grab;
  touch-action: pan-y;
}
.hm-stage canvas:active {
  cursor: grabbing;
}
.hm-stage-fallback {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  inset: 0;
}
.hm-stage-hint {
  position: absolute;
  left: 16px;
  bottom: 14px;
  font-size: 12px;
  font-weight: 600;
  color: var(--mute);
  background: rgba(255, 255, 255, 0.8);
  border-radius: 999px;
  padding: 5px 12px;
}
.hm-panel {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  min-width: 0;
}
.hm-panel fieldset {
  border: 0;
  margin: 0;
  padding: 0;
  min-width: 0;
}
.hm-panel legend {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
  margin-bottom: 10px;
  display: flex;
  gap: 8px;
  padding: 0;
}
.hm-panel output {
  color: var(--b);
  letter-spacing: 0;
  text-transform: none;
  font-size: 13px;
}
.hm-seg,
.hm-swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.hm-seg input,
.hm-swatches input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.hm-seg label,
.hm-swatches label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1.5px solid var(--line);
  border-radius: 10px;
  padding: 9px 14px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
  user-select: none;
}
.hm-seg label:hover,
.hm-swatches label:hover {
  border-color: var(--b2);
}
.hm-seg input:checked + label,
.hm-swatches input:checked + label {
  border-color: var(--b);
  background: var(--t1);
  color: var(--b);
}
.hm-seg input:focus-visible + label,
.hm-swatches input:focus-visible + label {
  outline: 3px solid var(--b2);
  outline-offset: 2px;
}
.sw {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.15);
}
.sw--natural {
  background: #C9A06E;
}
.sw--smoked {
  background: #7B5638;
}
.sw--black {
  background: #2A2622;
}
.hm-panel input[type=range] {
  width: 100%;
  accent-color: var(--b);
}
.hm-summary {
  background: var(--t2);
  border-radius: 12px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.hm-summary-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mute);
}
.hm-summary strong {
  font-size: 15px;
  font-variant-numeric: tabular-nums;
}
.hm-note {
  font-size: 13px;
  color: var(--mute);
  margin: 0;
}
.hm-panel .hm-btn {
  align-self: flex-start;
}
.hm-pillars {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border-top: 2px solid var(--ink);
}
.hm-pillar {
  padding: 28px 24px 8px 0;
  border-right: 1px solid var(--line);
  margin-right: 24px;
}
.hm-pillar:last-child {
  border-right: 0;
  margin-right: 0;
}
.hm-pillar h3 {
  font-size: 24px;
  margin-bottom: 8px;
}
.hm-pillar p {
  margin: 0 0 14px;
  color: var(--mute);
  font-size: 15px;
}
.hm-pillar ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
.hm-pillar li {
  font-size: 15px;
  font-weight: 600;
  display: flex;
  gap: 10px;
  align-items: center;
}
.hm-pillar li:before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--b);
  flex: none;
}
.hm-numbers {
  background: var(--ink);
  color: var(--white);
  padding-block: 56px;
}
.hm-num-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  max-width: 960px;
  text-align: center;
}
.hm-num-grid > div {
  padding: 8px 24px;
  border-left: 1px solid rgba(255, 255, 255, 0.18);
}
.hm-num-grid > div:first-child {
  border-left: 0;
}
.hm-num-grid b {
  display: block;
  font-family: var(--disp);
  font-size: clamp(36px, 4.4vw, 60px);
  line-height: 1;
  letter-spacing: -0.03em;
  color: var(--white);
  font-variant-numeric: tabular-nums;
}
.hm-num-grid span {
  display: block;
  margin-top: 10px;
  color: #B9BCC8;
  font-size: 14px;
}
.hm-car {
  overflow: hidden;
  border-radius: 24px;
}
.hm-car-track {
  display: flex;
  transition: transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.hm-slide {
  flex: 0 0 100%;
  display: grid;
  grid-template-columns: minmax(0, 420px) 1fr;
  background: var(--t2);
  border-radius: 24px;
  overflow: hidden;
  min-height: 400px;
}
.hm-slide-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.hm-slide-img--logo {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--white);
}
.hm-slide-img--logo img {
  width: 60%;
  height: auto;
}
.hm-slide-body {
  padding: clamp(28px, 4vw, 56px);
  display: flex;
  flex-direction: column;
  gap: 16px;
  justify-content: center;
  min-width: 0;
}
.hm-slide-who {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--b);
}
.hm-slide-q {
  font-family: var(--disp);
  font-weight: 800;
  font-size: clamp(26px, 3vw, 40px);
  line-height: 1.15;
  letter-spacing: -0.02em;
  margin: 0;
}
.hm-slide-q .cs-todo,
.hm-slide-meta .cs-todo {
  font-family: var(--body);
  font-size: 16px;
  font-weight: 600;
}
.hm-slide-meta {
  margin: 0;
}
.hm-slide-fact {
  margin: 0;
  color: #333;
  font-size: 17px;
  max-width: 52ch;
}
main.hm-page a.hm-slide-link {
  color: var(--b);
  font-weight: 700;
}
.hm-car-ctrl {
  display: flex;
  gap: 10px;
}
.hm-car-btn {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1.5px solid var(--line);
  background: var(--white);
  color: var(--ink);
  font-size: 18px;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.hm-car-btn:hover {
  border-color: var(--b);
  color: var(--b);
}
.hm-car-dots {
  display: flex;
  gap: 8px;
  justify-content: center;
  margin-top: 24px;
}
.hm-car-dots button {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  border: 0;
  background: #C9CFE0;
  padding: 0;
  cursor: pointer;
  transition: width 0.3s ease, background 0.3s ease;
}
.hm-car-dots button[aria-selected=true] {
  width: 32px;
  background: var(--b);
}
main.hm-page a.hm-all-stories {
  display: block;
  text-align: center;
  margin-top: 20px;
  color: var(--b);
  font-weight: 700;
}
.hm-team {
  padding-top: 0;
}
.hm-roles {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.hm-role {
  border-top: 3px solid var(--b);
  padding-top: 18px;
}
.hm-role h3 {
  font-size: 20px;
  margin-bottom: 8px;
}
.hm-role p {
  margin: 0;
  color: var(--mute);
  font-size: 15px;
}
.hm-final {
  padding-bottom: 64px;
}
.hm-final-box {
  background: var(--b);
  color: var(--white);
  border-radius: 28px;
  padding: clamp(32px, 5vw, 64px);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 28px 40px;
  align-items: center;
  position: relative;
  overflow: hidden;
  max-width: 1232px;
}
.hm-final-box .hm-h {
  font-size: clamp(32px, 4.4vw, 56px);
  line-height: 1.02;
  color: var(--white);
}
.hm-final-box p {
  margin: 12px 0 0;
  color: rgba(255, 255, 255, 0.85);
  font-size: 17px;
  max-width: 52ch;
}
.hm-final-box .hm-signoff {
  grid-column: 1/-1;
  margin: 0;
  font-family: var(--disp);
  font-weight: 800;
  font-size: 15px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #BFD0FF;
}
.hm-reveal {
  animation: hm-rise 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}
@keyframes hm-rise {
  from {
    transform: translateY(18px);
  }
  to {
    transform: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hm-marquee-track,
  .hm-shot,
  .hm-dot,
  .hm-reveal {
    animation: none;
  }
  .hm-car-track,
  .hm-go-word,
  .hm-layer,
  .hm-btn {
    transition: none;
  }
}
@media (max-width: 1023px) {
  .hm-hero-grid {
    grid-template-columns: 1fr;
  }
  .hm-hero-visual {
    justify-self: center;
    max-width: 460px;
  }
  .hm-layer-grid {
    grid-template-columns: 1fr;
  }
  .hm-config {
    grid-template-columns: 1fr;
  }
  .hm-stage {
    min-height: 360px;
  }
  .hm-pillars {
    grid-template-columns: 1fr 1fr;
    row-gap: 8px;
  }
  .hm-pillar:nth-child(2) {
    border-right: 0;
    margin-right: 0;
  }
  .hm-roles {
    grid-template-columns: 1fr 1fr;
  }
  .hm-slide {
    grid-template-columns: 1fr;
  }
  .hm-slide-img {
    height: 260px;
  }
  .hm-final-box {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 600px) {
  .hm-wrap {
    padding-left: max(16px, env(safe-area-inset-left, 0px));
    padding-right: max(16px, env(safe-area-inset-right, 0px));
  }
  .hm-pillars {
    grid-template-columns: 1fr;
  }
  .hm-pillar {
    border-right: 0;
    margin-right: 0;
    border-bottom: 1px solid var(--line);
    padding-bottom: 20px;
  }
  .hm-roles {
    grid-template-columns: 1fr;
  }
  .hm-stage {
    min-height: 300px;
  }
  .hm-panel {
    padding: 20px;
  }
  .hm-chip--live {
    right: 0;
  }
  .hm-marquee-track {
    gap: 40px;
  }
  .hm-marquee-track img {
    height: 28px;
  }
}
.hm-foot {
  --b:#2355f0;
  --ink:#191919;
  --mute:#5E6272;
  --line:#E3E6EF;
  background: #F4F6FE;
  border-top: 1px solid var(--line);
  color: var(--ink);
  font-family:
    "Open Sans",
    system-ui,
    sans-serif;
  font-size: 14px;
  line-height: 1.6;
  padding-block: 56px 28px;
}
.hm-foot * {
  box-sizing: border-box;
}
.hm-foot a {
  color: var(--ink);
  text-decoration: none;
}
.hm-foot a:hover {
  color: var(--b);
}
.hm-foot ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
.hm-foot-grid {
  display: grid;
  grid-template-columns: 1.4fr repeat(4, 1fr);
  gap: 32px;
  padding-bottom: 40px;
}
.hm-foot-brand img {
  display: block;
  height: 30px;
  width: auto;
  margin-bottom: 20px;
}
.hm-foot-social {
  display: flex !important;
  gap: 16px !important;
}
.hm-foot-social a {
  color: var(--mute);
  font-weight: 600;
}
.hm-foot-h {
  font-family:
    "geomanist bold",
    Geomanist,
    sans-serif;
  font-weight: 800;
  font-size: 16px;
  margin: 0 0 14px;
}
.hm-foot-bottom {
  display: flex;
  justify-content: space-between;
  gap: 12px 24px;
  flex-wrap: wrap;
  border-top: 1px solid var(--line);
  padding-top: 20px;
  color: var(--mute);
  font-size: 13px;
}
.hm-foot-bottom p {
  margin: 0;
}
.hm-foot-legal {
  display: flex !important;
  gap: 20px !important;
}
.hm-foot-legal a {
  color: var(--mute);
}
@media (max-width: 900px) {
  .hm-foot-grid {
    grid-template-columns: 1fr 1fr;
  }
  .hm-foot-brand {
    grid-column: 1/-1;
  }
}
@media (max-width: 600px) {
  .hm-num-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .hm-num-grid > div {
    border-left: 0;
  }
}
main.hm-page.hm-v2 {
  --paper:#F5F6F8;
  --line:#E2E4EA;
  --mute:#5B5F6B;
}
.hm-v2 .hm-btn {
  border-radius: 6px;
  height: 50px;
}
.hm-v2 .hm-btn:hover {
  transform: none;
}
main.hm-page.hm-v2 a.hm-btn--line {
  border: 1.5px solid var(--ink);
  color: var(--ink);
}
main.hm-page.hm-v2 a.hm-btn--line:hover {
  background: var(--ink);
  color: var(--white);
}
.hm-v2 .hm-photo {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}
.hm-v2 .hm-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 8px;
  background: var(--paper);
}
.hm-v2 .hm-photo figcaption {
  font-size: 13px;
  color: var(--mute);
}
.hm-v2 .hm-photo--todo {
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 20px;
  border: 1.5px dashed var(--todoline, #E8C55A);
  background: var(--todo, #FFF6D6);
  border-radius: 8px;
}
.hm-v2 .hm-photo--todo .cs-todo {
  border: 0;
  background: none;
  padding: 0;
}
.hm-v2 .hm-hero--light {
  background: var(--paper);
  color: var(--ink);
  padding-block: clamp(56px, 7vw, 96px);
}
.hm-v2 .hm-hero--light:before {
  display: none;
}
.hm-v2 .hm-hero--light .hm-hero-grid {
  grid-template-columns: 1fr 1fr;
  gap: clamp(32px, 5vw, 72px);
  align-items: center;
}
.hm-v2 .hm-hero--light .hm-hero-h {
  color: var(--ink);
}
.hm-v2 .hm-hero--light .hm-hero-lede {
  color: #3A3D46;
}
.hm-v2 .hm-hero-photo img {
  aspect-ratio: 1/1;
}
.hm-v2 .hm-layer-grid {
  gap: 32px;
}
.hm-v2 .hm-layer {
  border: 0;
  border-radius: 0;
  padding: 0;
  background: none;
  gap: 12px;
}
.hm-v2 .hm-layer:hover {
  transform: none;
  box-shadow: none;
}
.hm-v2 .hm-layer .hm-photo {
  aspect-ratio: 4/3;
  margin-bottom: 8px;
}
.hm-v2 .hm-layer h3 {
  color: var(--ink);
  font-size: 24px;
}
.hm-v2 .hm-layer-step {
  color: var(--b);
}
.hm-v2 .hm-3d {
  background: var(--paper);
  border-color: var(--line);
}
.hm-v2 .hm-stage {
  background: #ECEEF2;
  border-radius: 8px;
  border: 0;
}
.hm-v2 .hm-panel {
  border-radius: 8px;
}
.hm-v2 .hm-seg label,
.hm-v2 .hm-swatches label {
  border-radius: 6px;
}
.hm-v2 .hm-summary {
  border-radius: 6px;
}
.hm-people-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  grid-template-rows: 240px 240px;
  gap: 12px;
}
.hm-people-a {
  grid-row: 1/3;
}
.hm-people-b {
  grid-column: auto;
}
.hm-people-grid .hm-photo {
  height: 100%;
}
main.hm-page a.hm-text-link {
  display: inline-block;
  margin-top: 20px;
  color: var(--b);
  font-weight: 700;
}
.hm-v2 .hm-numbers {
  background: var(--white);
  color: var(--ink);
  border-block: 1px solid var(--line);
  padding-block: 44px;
}
.hm-v2 .hm-num-grid > div {
  border-left-color: var(--line);
}
.hm-v2 .hm-num-grid b {
  color: var(--b);
}
.hm-v2 .hm-num-grid span {
  color: var(--mute);
}
.hm-v2 .hm-car,
.hm-v2 .hm-slide {
  border-radius: 8px;
}
.hm-v2 .hm-slide {
  background: var(--paper);
}
.hm-v2 .hm-car-btn {
  border-radius: 6px;
}
.hm-v2 .hm-role {
  border-top: 2px solid var(--ink);
}
.hm-v2 .hm-final-box {
  border-radius: 8px;
}
.hm-v2 .hm-final-box:before {
  display: none;
}
@media (max-width: 1023px) {
  .hm-v2 .hm-hero--light .hm-hero-grid {
    grid-template-columns: 1fr;
  }
  .hm-people-grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
  }
  .hm-people-a {
    grid-row: auto;
    grid-column: 1/3;
  }
  .hm-people-b {
    grid-column: auto;
  }
  .hm-people-grid .hm-photo {
    aspect-ratio: 4/3;
    height: auto;
  }
}
@media (max-width: 600px) {
  .hm-people-grid {
    grid-template-columns: 1fr;
  }
  .hm-people-a {
    grid-column: auto;
  }
}
.cs-overview .cs-more-grid a {
  position: relative;
  overflow: hidden;
}
.cs-thumb {
  display: block;
  position: relative;
  margin: -24px -24px 12px;
  aspect-ratio: 16/10;
  overflow: hidden;
  background: var(--t2);
}
.cs-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}
.cs-overview .cs-more-grid a:hover .cs-thumb img {
  transform: scale(1.03);
}
.cs-thumb-tag {
  position: absolute;
  left: 10px;
  top: 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  background: var(--todo);
  color: #6B5200;
  border: 1px dashed var(--todoline);
  border-radius: 4px;
  padding: 2px 8px;
}
@media (prefers-reduced-motion: reduce) {
  .cs-thumb img {
    transition: none;
  }
}
main.t3-page {
  --todo:#FFF6D6;
  --todoline:#E8C55A;
  --dark:#10162B;
  --dark2:#1A2240;
  --darkline:rgba(255,255,255,.12);
  --ok:#1F9D63;
}
main.t3-page [hidden] {
  display: none !important;
}
main.hm-page.t3-page {
  overflow: visible;
  overflow-x: clip;
}
.t3-intro {
  padding-block: clamp(24px, 3vw, 40px) 16px;
  background: var(--paper);
}
.t3-intro-grid {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 16px 48px;
  flex-wrap: wrap;
}
.t3-intro .hm-eyebrow {
  margin-bottom: 10px;
}
.t3-intro .hm-h {
  font-size: clamp(30px, 3.4vw, 46px);
  line-height: 1.05;
  max-width: 24ch;
}
.t3-intro .hm-sub {
  margin: 0;
  max-width: 48ch;
  font-size: 16px;
}
.t3-tabs {
  display: flex;
  gap: 8px;
  margin-top: 20px;
  overflow-x: auto;
  scrollbar-width: none;
  padding-bottom: 2px;
}
.t3-tabs::-webkit-scrollbar {
  display: none;
}
.t3-tab {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 1.5px solid var(--line);
  background: var(--white);
  border-radius: 6px;
  padding: 10px 16px;
  font-size: 14px;
  font-weight: 700;
  color: var(--ink);
  cursor: pointer;
}
.t3-tab small {
  font-size: 12px;
  font-weight: 600;
  color: var(--mute);
}
.t3-tab[aria-selected=true] {
  border-color: var(--b);
  background: var(--t1);
  color: var(--b);
}
.t3-tab[aria-selected=true] small {
  color: var(--b);
}
.t3-tab[aria-disabled=true] {
  cursor: default;
  color: var(--mute);
}
.t3-tab[aria-disabled=true] small {
  background: var(--line);
  border-radius: 999px;
  padding: 1px 8px;
}
.t3-try {
  background: var(--paper);
  padding-bottom: clamp(48px, 6vw, 80px);
}
.t3-config {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(320px, 1fr);
  gap: 16px;
  align-items: stretch;
}
.t3-stage {
  position: relative;
  min-height: clamp(380px, 54vh, 580px);
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}
.t3-stage iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
.t3-stage-poster {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.4s ease;
}
.t3-stage.is-ready .t3-stage-poster {
  opacity: 0;
  pointer-events: none;
}
.t3-stage-load {
  position: absolute;
  inset: auto 16px 16px auto;
  font-size: 12px;
  font-weight: 600;
  color: var(--mute);
  background: rgba(255, 255, 255, 0.9);
  border-radius: 999px;
  padding: 5px 12px;
}
.t3-stage.is-ready .t3-stage-load {
  display: none;
}
.t3-stage-tag {
  position: absolute;
  left: 16px;
  top: 16px;
  font-size: 12px;
  font-weight: 700;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 999px;
  padding: 5px 12px;
  pointer-events: none;
}
.t3-stage-tag b {
  color: var(--b);
}
.t3-panel {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
}
.t3-panel fieldset {
  border: 0;
  margin: 0;
  padding: 0;
  min-width: 0;
}
.t3-panel legend {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
  margin-bottom: 10px;
  display: flex;
  gap: 8px;
  padding: 0;
}
.t3-panel output {
  color: var(--b);
  letter-spacing: 0;
  text-transform: none;
  font-size: 13px;
}
.t3-panel input[type=range] {
  width: 100%;
  accent-color: var(--b);
}
.t3-panel .hm-seg label,
.t3-panel .hm-swatches label {
  padding: 8px 12px;
  font-size: 13px;
}
.t3-panel .hm-seg input:disabled + label {
  opacity: 0.4;
  cursor: not-allowed;
  text-decoration: line-through;
}
.t3-sublegend {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
  margin: 14px 0 10px;
  display: flex;
  gap: 8px;
}
.t3-colours,
.t3-legs {
  display: grid;
  gap: 8px;
}
.t3-colours {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.t3-legs {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.t3-colours input,
.t3-legs input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.t3-colours label,
.t3-legs label {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  border: 1.5px solid var(--line);
  border-radius: 6px;
  padding: 6px 4px;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.25;
  text-align: center;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
  min-width: 0;
}
.t3-colours label:hover,
.t3-legs label:hover {
  border-color: var(--b2);
}
.t3-colours input:checked + label,
.t3-legs input:checked + label {
  border-color: var(--b);
  background: var(--t1);
  color: var(--b);
}
.t3-colours input:focus-visible + label,
.t3-legs input:focus-visible + label {
  outline: 3px solid var(--b2);
  outline-offset: 2px;
}
.t3-colours img {
  width: 100%;
  max-width: 40px;
  aspect-ratio: 1;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}
.t3-legs img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: contain;
  display: block;
  mix-blend-mode: multiply;
}
.t3-legs span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}
.t3-legs small {
  font-size: 11px;
  font-weight: 600;
  color: var(--mute);
}
.t3-legs input:checked + label small {
  color: var(--b);
}
.t3-legs input:disabled + label {
  opacity: 0.45;
  cursor: not-allowed;
}
.t3-legs input:disabled + label small {
  color: #8A5A00;
}
.t3-stage-start {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 10px 30px rgba(16, 22, 43, 0.25);
}
.t3-rule-hint {
  font-size: 12px;
  color: var(--mute);
  margin: 8px 0 0;
  min-height: 1.3em;
}
.t3-rule-hint.is-on {
  color: #8A5A00;
}
.t3-price {
  margin-top: auto;
  border-top: 1px solid var(--line);
  padding-top: 16px;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
}
.t3-price span {
  font-size: 13px;
  color: var(--mute);
}
.t3-price strong {
  font-family: var(--disp);
  font-size: 30px;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.t3-price small {
  display: block;
  font-size: 12px;
  color: var(--mute);
  text-align: right;
}
.t3-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.t3-actions .hm-btn {
  width: 100%;
}
main.hm-page a.t3-actions-link {
  align-self: center;
  font-size: 14px;
  font-weight: 700;
  color: var(--b);
  padding: 6px 0;
}
main.hm-page a.t3-actions-link:hover {
  color: var(--bh);
}
main.hm-page button.hm-btn {
  border: 0;
  cursor: pointer;
}
main.hm-page .hm-btn--blue {
  background: var(--b);
  color: var(--white);
}
main.hm-page .hm-btn--blue:hover {
  background: var(--bh);
}
main.hm-page button.hm-btn--line {
  background: transparent;
  border: 1.5px solid var(--ink);
  color: var(--ink);
}
main.hm-page button.hm-btn--line:hover {
  background: var(--ink);
  color: var(--white);
}
.t3-bts {
  margin-top: 16px;
  background: var(--dark);
  color: #fff;
  border-radius: 8px;
  padding: 20px 24px 24px;
}
.t3-bts-head {
  margin-bottom: 16px;
  display: grid;
  gap: 4px;
}
.t3-bts-title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 700;
  font-size: 15px;
  margin: 0;
}
.t3-live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #7CF0B5;
}
.t3-live:before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2FD98A;
  box-shadow: 0 0 0 0 rgba(47, 217, 138, 0.6);
  animation: t3-pulse 2s infinite;
}
@keyframes t3-pulse {
  70% {
    box-shadow: 0 0 0 8px rgba(47, 217, 138, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(47, 217, 138, 0);
  }
}
.t3-bts-sub {
  margin: 0;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.65);
}
.t3-bts-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.t3-card {
  background: var(--dark2);
  border: 1px solid var(--darkline);
  border-radius: 6px;
  padding: 14px 16px;
  min-width: 0;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.t3-card.is-flash {
  border-color: #5B80FF;
  box-shadow: 0 0 0 3px rgba(91, 128, 255, 0.25);
}
.t3-card h3 {
  margin: 0 0 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
  display: flex;
  justify-content: space-between;
  gap: 8px;
}
.t3-card h3 em {
  font-style: normal;
  color: #9DB4FF;
  letter-spacing: 0;
  text-transform: none;
}
.t3-lines {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 13px;
  display: grid;
  gap: 5px;
  font-variant-numeric: tabular-nums;
}
.t3-lines li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.t3-lines li span:first-child {
  color: rgba(255, 255, 255, 0.75);
  min-width: 0;
}
.t3-lines li span:last-child {
  white-space: nowrap;
}
.t3-lines li.is-total {
  border-top: 1px solid var(--darkline);
  padding-top: 6px;
  margin-top: 2px;
  font-weight: 700;
}
.t3-lines li.is-total span:first-child {
  color: #fff;
}
.t3-rules li {
  display: block;
  padding-left: 20px;
  position: relative;
  color: rgba(255, 255, 255, 0.8);
}
.t3-rules li:before {
  content: "\2713";
  position: absolute;
  left: 0;
  color: #7CF0B5;
  font-weight: 700;
}
.t3-rules li.is-fired:before {
  content: "!";
  color: #FFC861;
}
.t3-rules li.is-fired {
  color: #fff;
}
.t3-code {
  margin: 0;
  font:
    12px/1.55 ui-monospace,
    SFMono-Regular,
    Consolas,
    monospace;
  color: #C9D6FF;
  white-space: pre-wrap;
  word-break: break-all;
  max-height: 170px;
  overflow: auto;
}
.t3-code b {
  color: #7CF0B5;
  font-weight: 400;
}
.t3-bts-foot {
  margin: 14px 0 0;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
}
.t3-dialog {
  border: 0;
  padding: 0;
  border-radius: 8px;
  width: min(880px, 100vw - 32px);
  max-height: calc(100dvh - 32px);
  box-shadow: 0 30px 80px rgba(16, 22, 43, 0.35);
  color: var(--ink);
  font-family:
    "Open Sans",
    system-ui,
    sans-serif;
}
.t3-dialog::backdrop {
  background: rgba(16, 22, 43, 0.55);
}
.t3-dialog-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
}
.t3-quote {
  padding: 28px;
  background: #fff;
  border-right: 1px solid #E3E6EF;
  font-size: 13px;
}
.t3-quote-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 18px;
}
.t3-quote-brand {
  margin: 0;
  font-family:
    "geomanist bold",
    Geomanist,
    sans-serif;
  font-weight: 800;
  font-size: 20px;
  letter-spacing: -0.01em;
  line-height: 1.1;
  color: #191919;
}
.t3-quote-top p.t3-quote-brand {
  text-align: left;
  font-size: 20px;
  color: #191919;
}
.t3-quote-brand small {
  display: block;
  font-family:
    "Open Sans",
    system-ui,
    sans-serif;
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #5E6272;
  margin-top: 4px;
}
.t3-quote-top p {
  margin: 0;
  text-align: right;
  color: #5E6272;
  font-size: 12px;
  line-height: 1.5;
}
.t3-quote-img {
  width: 100%;
  aspect-ratio: 16/9;
  object-fit: cover;
  border-radius: 6px;
  background: #ECEEF2;
  display: block;
  margin-bottom: 16px;
}
.t3-quote table {
  width: 100%;
  border-collapse: collapse;
  font-variant-numeric: tabular-nums;
}
.t3-quote td {
  padding: 6px 0;
  border-bottom: 1px solid #EEF0F4;
}
.t3-quote td:last-child {
  text-align: right;
  white-space: nowrap;
}
.t3-quote tr.is-total td {
  font-weight: 700;
  border-bottom: 0;
  padding-top: 10px;
  font-size: 15px;
}
.t3-mail {
  padding: 28px;
  background: #F4F6FE;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.t3-mail h2 {
  font-family:
    "geomanist bold",
    Geomanist,
    sans-serif;
  font-weight: 800;
  font-size: 26px;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin: 0;
}
.t3-mail p {
  margin: 0;
  font-size: 14px;
  color: #5E6272;
}
.t3-mail label {
  font-size: 13px;
  font-weight: 700;
}
.t3-mail input[type=email] {
  width: 100%;
  height: 48px;
  border: 1.5px solid #E3E6EF;
  border-radius: 6px;
  padding: 0 14px;
  font: inherit;
  font-size: 15px;
  margin-top: 6px;
  background: #fff;
}
.t3-mail input[type=email]:focus {
  outline: 3px solid #5B80FF;
  outline-offset: 1px;
}
.t3-mail .hm-btn {
  width: 100%;
  height: 50px;
  border-radius: 6px;
  font-size: 15px;
  font-weight: 700;
  border: 0;
  cursor: pointer;
  background: #2355f0;
  color: #fff;
}
.t3-mail .hm-btn:hover {
  background: #1C40C3;
}
.t3-mail-done {
  display: none;
}
.t3-mail.is-sent form {
  display: none;
}
.t3-mail.is-sent .t3-mail-done {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.t3-close {
  position: absolute;
  right: 12px;
  top: 12px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 0;
  background: rgba(255, 255, 255, 0.9);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  color: #191919;
}
.t3-dialog .cs-todo {
  background: #FFF6D6;
  border: 1px dashed #E8C55A;
  border-radius: 6px;
  padding: 0 6px;
  color: #6B5200;
  font-weight: 600;
}
.t3-proof-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}
.t3-proof-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background: var(--white);
  display: flex;
  flex-direction: column;
}
.t3-proof-card img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  display: block;
}
.t3-proof-body {
  padding: 20px 22px 22px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}
.t3-proof-body p {
  margin: 0;
  font-size: 15px;
  color: var(--mute);
}
.t3-proof-body p.t3-proof-name {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--b);
}
.t3-proof-body p.t3-proof-num {
  color: var(--ink);
  font-size: 17px;
  line-height: 1.4;
}
.t3-proof-num b {
  font-family: var(--disp);
  font-size: 22px;
}
.t3-proof-links {
  margin-top: auto;
  padding-top: 8px;
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  font-size: 14px;
  font-weight: 700;
}
main.hm-page .t3-proof-links a {
  color: var(--b);
}
.t3-next {
  background: var(--paper);
  border-block: 1px solid var(--line);
}
.t3-next-grid {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 56px;
  align-items: start;
}
.t3-next-points {
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 12px;
}
.t3-next-points li {
  padding-left: 28px;
  position: relative;
}
.t3-next-points li:before {
  content: "\2713";
  position: absolute;
  left: 0;
  color: var(--b);
  font-weight: 800;
}
.t3-quiz {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 28px;
  display: grid;
  gap: 22px;
}
.t3-quiz fieldset {
  border: 0;
  margin: 0;
  padding: 0;
  min-width: 0;
}
.t3-quiz legend {
  font-weight: 700;
  font-size: 15px;
  margin-bottom: 10px;
  padding: 0;
}
.t3-quiz-foot {
  display: grid;
  gap: 10px;
}
.t3-quiz-foot .hm-btn {
  justify-self: start;
}
.t3-faq-grid {
  display: grid;
  grid-template-columns: 1fr 1.6fr;
  gap: 56px;
  align-items: start;
}
.t3-faq-list details {
  border-bottom: 1px solid var(--line);
  padding: 18px 0;
}
.t3-faq-list details:first-child {
  border-top: 1px solid var(--line);
}
.t3-faq-list summary {
  font-weight: 700;
  font-size: 17px;
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  gap: 16px;
}
.t3-faq-list summary::-webkit-details-marker {
  display: none;
}
.t3-faq-list summary:after {
  content: "+";
  color: var(--b);
  font-size: 22px;
  line-height: 1;
  transition: transform 0.2s ease;
}
.t3-faq-list details[open] summary:after {
  transform: rotate(45deg);
}
.t3-faq-list p {
  margin: 12px 0 0;
  color: var(--mute);
}
@media (max-width: 1199px) {
  .t3-bts-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 1023px) {
  .t3-config {
    grid-template-columns: 1fr;
  }
  .t3-stage {
    min-height: 0;
    aspect-ratio: 4/3;
  }
  .t3-proof-grid {
    grid-template-columns: 1fr 1fr;
  }
  .t3-next-grid,
  .t3-faq-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }
}
@media (max-width: 719px) {
  .t3-intro .hm-h {
    font-size: 32px;
  }
  .t3-stage {
    aspect-ratio: 1/1;
  }
  .t3-panel {
    padding: 18px;
  }
  .t3-bts {
    padding: 16px;
  }
  .t3-bts-grid {
    grid-template-columns: 1fr;
  }
  .t3-proof-grid {
    grid-template-columns: 1fr;
  }
  .t3-dialog-grid {
    grid-template-columns: 1fr;
  }
  .t3-quote {
    border-right: 0;
    border-bottom: 1px solid #E3E6EF;
    padding: 20px;
  }
  .t3-mail {
    padding: 20px;
  }
  .t3-quiz {
    padding: 18px;
  }
}
.t3-proof-img {
  position: relative;
}
.t3-proof-img .cs-todo {
  position: absolute;
  left: 12px;
  top: 12px;
  font-size: 12px;
}
main.hm-page a.t3-strip {
  display: none;
}
@media (max-width: 1023px) {
  main.hm-page a.t3-strip {
    position: sticky;
    bottom: 12px;
    z-index: 5;
    margin-top: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--dark);
    color: #fff;
    border-radius: 8px;
    padding: 12px 14px;
    font-size: 13px;
    font-weight: 600;
    box-shadow: 0 10px 30px rgba(16, 22, 43, 0.25);
    transition: box-shadow 0.3s ease;
  }
  main.hm-page a.t3-strip #t3-strip-text {
    flex: 1;
    min-width: 0;
  }
  main.hm-page a.t3-strip.is-flash {
    box-shadow: 0 0 0 3px rgba(91, 128, 255, 0.6), 0 10px 30px rgba(16, 22, 43, 0.25);
  }
}
.t3-match {
  border: 1px solid var(--line);
  border-left: 3px solid var(--b);
  border-radius: 6px;
  background: var(--t2);
  padding: 14px 16px;
  display: grid;
  gap: 4px;
  font-size: 14px;
}
.t3-match p {
  margin: 0;
  color: var(--mute);
}
.t3-match p.t3-match-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--b);
}
.t3-match p.t3-match-name {
  font-family: var(--disp);
  font-size: 20px;
  color: var(--ink);
  letter-spacing: -0.01em;
}
.t3-match p.t3-match-shop {
  color: var(--ink);
  font-weight: 600;
}
main.hm-page .t3-match a {
  font-weight: 700;
  color: var(--b);
  margin-top: 4px;
}
main.fp-page {
  --dark:#10162B;
  --dark2:#1A2240;
  --darkline:rgba(255,255,255,.12);
  --ok:#1F9D63;
}
main.fp-page [hidden] {
  display: none !important;
}
main.fp-page button.hm-btn {
  border: 0;
  cursor: pointer;
  font-family: inherit;
}
main.fp-page button.hm-btn--line {
  background: transparent;
  border: 1.5px solid var(--ink);
  color: var(--ink);
}
main.fp-page button.hm-btn--line:hover {
  background: var(--ink);
  color: var(--white);
}
main.fp-page .hm-btn--blue {
  background: var(--b);
  color: var(--white);
}
main.fp-page .hm-btn--blue:hover {
  background: var(--bh);
}
main.fp-page a.hm-btn--line {
  border: 1.5px solid var(--ink);
  color: var(--ink);
  background: transparent;
}
main.fp-page a.hm-btn--line:hover {
  background: var(--ink);
  color: var(--white);
}
.fp-hero {
  background: var(--paper);
  padding-block: clamp(40px, 6vw, 88px);
  position: relative;
  overflow: hidden;
}
.fp-hero:before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(
      90deg,
      var(--line) 1px,
      transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image:
    radial-gradient(
      70% 80% at 85% 40%,
      #000,
      transparent 75%);
  mask-image:
    radial-gradient(
      70% 80% at 85% 40%,
      #000,
      transparent 75%);
  opacity: 0.7;
  pointer-events: none;
}
.fp-hero-grid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
  gap: clamp(32px, 5vw, 72px);
  align-items: center;
}
.fp-crumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin: 0 0 18px;
  font-size: 13px;
  font-weight: 600;
  color: var(--mute);
}
.fp-crumbs span[aria-hidden] {
  opacity: 0.5;
}
.fp-crumbs b {
  color: var(--b);
  font-weight: 700;
}
.fp-hero .hm-h {
  font-size: clamp(36px, 4.6vw, 62px);
  line-height: 1.03;
  letter-spacing: -0.03em;
  max-width: 15ch;
}
.fp-lede {
  font-size: clamp(17px, 1.5vw, 19px);
  line-height: 1.6;
  color: #3A3D46;
  margin: 22px 0 28px;
  max-width: 54ch;
}
main.fp-page .fp-lede a {
  color: var(--b);
  font-weight: 600;
  border-bottom: 1px solid currentColor;
}
.fp-ticks {
  list-style: none;
  margin: 28px 0 0;
  padding: 0;
  display: grid;
  gap: 10px;
  font-size: 15px;
  font-weight: 600;
}
.fp-ticks li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}
.fp-ticks li:before {
  content: "";
  flex: none;
  width: 20px;
  height: 20px;
  margin-top: 2px;
  border-radius: 50%;
  background: var(--t1) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232355F0' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-8'/%3E%3C/svg%3E") center/12px no-repeat;
}
.fp-works {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 28px;
  font-size: 13px;
  color: var(--mute);
}
.fp-works b {
  font-size: 13px;
  font-weight: 700;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 4px 12px;
  color: var(--ink);
}
.fp-visual {
  position: relative;
  padding: 28px 0 36px;
}
.fp-shot {
  margin: 0;
  border-radius: 14px;
  overflow: hidden;
  background: var(--white);
  box-shadow: 0 30px 70px rgba(16, 22, 43, 0.16), 0 0 0 1px var(--line);
}
.fp-shot img {
  display: block;
  width: 100%;
  height: auto;
}
.fp-float {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--white);
  border-radius: 12px;
  padding: 12px 16px;
  font-size: 13px;
  line-height: 1.35;
  box-shadow: 0 16px 40px rgba(16, 22, 43, 0.18);
  animation: hm-float 7s ease-in-out infinite;
}
.fp-float b {
  display: block;
  font-size: 14px;
  color: var(--ink);
}
.fp-float span {
  color: var(--mute);
}
.fp-float i {
  flex: none;
  width: 34px;
  height: 34px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  background: var(--t1);
  color: var(--b);
  font-style: normal;
  font-weight: 800;
}
.fp-float--a {
  left: -24px;
  top: 0;
}
.fp-float--b {
  right: -16px;
  bottom: 0;
  animation-delay: -3.5s;
}
.fp-float--b i {
  background: #E3F6EC;
  color: var(--ok);
}
.fp-demo {
  border-bottom: 1px solid var(--line);
}
.fp-steps {
  display: flex;
  gap: 8px;
  margin: 0 0 16px;
  overflow-x: auto;
  scrollbar-width: none;
  counter-reset: fp-step;
}
.fp-steps::-webkit-scrollbar {
  display: none;
}
.fp-step {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 1.5px solid var(--line);
  background: var(--white);
  border-radius: 999px;
  padding: 8px 16px 8px 8px;
  font: 700 14px/1 var(--body);
  color: var(--mute);
  cursor: pointer;
  counter-increment: fp-step;
}
.fp-step:before {
  content: counter(fp-step);
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--paper);
  font-size: 12px;
}
.fp-step[aria-selected=true] {
  border-color: var(--b);
  color: var(--b);
  background: var(--t1);
}
.fp-step[aria-selected=true]:before {
  background: var(--b);
  color: var(--white);
}
.fp-step.is-done:before {
  content: "\2713";
  background: var(--ok);
  color: var(--white);
}
.fp-demo-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(300px, 1fr);
  gap: 16px;
  align-items: stretch;
}
.fp-window {
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
  background: var(--white);
  display: flex;
  flex-direction: column;
  min-width: 0;
  box-shadow: 0 18px 40px rgba(16, 22, 43, 0.06);
}
.fp-window-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  color: var(--mute);
}
.fp-window-dots {
  display: flex;
  gap: 6px;
}
.fp-window-dots i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #D5D8E0;
}
.fp-window-url {
  flex: 1;
  min-width: 0;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 4px 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.fp-window-body {
  flex: 1;
  padding: 24px;
  min-height: 520px;
}
.fp-pane {
  animation: fp-in 0.35s ease;
}
@keyframes fp-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fp-product {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 24px;
}
.fp-product-img {
  margin: 0;
  border-radius: 8px;
  overflow: hidden;
  background: var(--paper);
  aspect-ratio: 4/3;
  align-self: start;
}
.fp-product-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.fp-product-name {
  font-family: var(--disp);
  font-size: 22px;
  line-height: 1.15;
  margin: 0 0 4px;
}
.fp-product-by {
  font-size: 13px;
  color: var(--mute);
  margin: 0 0 16px;
}
.fp-opts {
  display: grid;
  gap: 14px;
  border: 0;
  margin: 0;
  padding: 0;
  min-width: 0;
}
.fp-opt {
  border: 0;
  margin: 0;
  padding: 0;
  min-width: 0;
}
.fp-opt legend {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
  margin-bottom: 8px;
  display: flex;
  gap: 8px;
  padding: 0;
}
.fp-opt output {
  color: var(--b);
  letter-spacing: 0;
  text-transform: none;
  font-size: 12px;
}
.fp-opt .hm-seg label {
  padding: 7px 11px;
  font-size: 13px;
  border-radius: 6px;
}
.fp-opt input[type=range] {
  width: 100%;
  accent-color: var(--b);
}
.fp-opt .hm-seg input:disabled + label {
  opacity: 0.4;
  cursor: not-allowed;
}
.fp-swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.fp-swatches input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.fp-swatches label {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.12);
  outline: 2px solid transparent;
  outline-offset: 2px;
  transition: outline-color 0.15s ease;
}
.fp-swatches input:checked + label {
  outline-color: var(--b);
}
.fp-swatches input:focus-visible + label {
  outline-color: var(--b2);
}
.fp-rule {
  font-size: 12px;
  color: #8A5A00;
  margin: 6px 0 0;
  min-height: 1.3em;
}
.fp-buy {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-top: 1px solid var(--line);
  margin-top: 16px;
  padding-top: 16px;
}
.fp-buy strong {
  font-family: var(--disp);
  font-size: 28px;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  display: block;
  line-height: 1.1;
}
.fp-buy small {
  font-size: 12px;
  color: var(--mute);
}
.fp-woo-h {
  font-family: var(--disp);
  font-size: 22px;
  margin: 0 0 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.fp-badge {
  font: 700 12px/1 var(--body);
  border-radius: 999px;
  padding: 5px 10px;
  background: #C6E1C6;
  color: #2C4700;
}
.fp-line {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
}
.fp-line img {
  width: 72px;
  height: 72px;
  border-radius: 6px;
  object-fit: cover;
  display: block;
}
.fp-line-name {
  font-weight: 700;
  margin: 0 0 6px;
}
.fp-meta {
  margin: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 3px 12px;
  font-size: 13px;
}
.fp-meta dt {
  color: var(--mute);
}
.fp-meta dd {
  margin: 0;
  font-weight: 600;
}
.fp-line-price {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.fp-totals {
  margin: 16px 0 0 auto;
  max-width: 320px;
  display: grid;
  gap: 6px;
  font-size: 14px;
}
.fp-totals div {
  display: flex;
  justify-content: space-between;
  gap: 16px;
}
.fp-totals .is-total {
  border-top: 1px solid var(--line);
  padding-top: 8px;
  font-weight: 700;
  font-size: 16px;
}
.fp-next {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 20px;
  flex-wrap: wrap;
}
.fp-admin {
  background: #F0F0F1;
  border-radius: 8px;
  padding: 16px;
  font-size: 14px;
}
.fp-admin-cols {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  background: var(--white);
  border: 1px solid #DCDCDE;
  padding: 16px;
  margin-bottom: 12px;
}
.fp-admin-cols p {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
}
.fp-admin-cols b {
  display: block;
  font-size: 12px;
  color: var(--mute);
  margin-bottom: 4px;
}
.fp-admin .fp-line {
  background: var(--white);
  border-color: #DCDCDE;
  border-radius: 0;
}
.fp-log {
  background: var(--dark);
  color: var(--white);
  border-radius: 10px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.fp-log-title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 700;
  font-size: 15px;
  margin: 0;
}
.fp-log-sub {
  margin: 6px 0 16px;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.65);
}
.fp-log-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
  align-content: start;
  flex: 1;
  max-height: 520px;
  overflow: auto;
}
.fp-log-list li {
  background: var(--dark2);
  border: 1px solid var(--darkline);
  border-radius: 6px;
  padding: 10px 12px;
  font-size: 13px;
  line-height: 1.45;
  animation: fp-in 0.3s ease;
}
.fp-log-list li b {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #9DB4FF;
  margin-bottom: 3px;
}
.fp-log-list li b time {
  color: rgba(255, 255, 255, 0.4);
  letter-spacing: 0;
}
.fp-log-list li.is-rule b {
  color: #FFC86B;
}
.fp-log-list li.is-woo b {
  color: #7CF0B5;
}
.fp-log-list code {
  font:
    12px/1.5 ui-monospace,
    SFMono-Regular,
    Consolas,
    monospace;
  color: #C9D6FF;
  word-break: break-word;
}
.fp-demo-foot {
  margin: 14px 0 0;
  font-size: 13px;
  color: var(--mute);
}
.fp-rows {
  display: grid;
  gap: clamp(56px, 7vw, 96px);
}
.fp-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(32px, 5vw, 80px);
  align-items: center;
}
.fp-row-media {
  margin: 0;
  border-radius: 10px;
  overflow: hidden;
  background: var(--paper);
}
.fp-row-media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  object-fit: cover;
}
.fp-row-media--shot {
  background: #F3F4FB;
}
.fp-row-media--shot img {
  aspect-ratio: auto;
}
.fp-row-media figcaption {
  font-size: 13px;
  color: var(--mute);
  padding: 10px 4px 0;
  background: var(--white);
}
.fp-row-num {
  font-family: var(--disp);
  font-size: 14px;
  font-weight: 800;
  color: var(--b);
  letter-spacing: 0.06em;
  margin: 0 0 12px;
}
.fp-row h3 {
  font-size: clamp(26px, 2.6vw, 36px);
  line-height: 1.1;
  margin-bottom: 16px;
}
.fp-row p {
  color: #3A3D46;
  margin: 0 0 12px;
  max-width: 52ch;
}
.fp-row .fp-ticks {
  margin-top: 20px;
  font-weight: 600;
}
.fp-card {
  background: var(--paper);
  border-radius: 10px;
  padding: clamp(20px, 3vw, 36px);
  display: grid;
  gap: 12px;
}
.fp-card-in {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px 20px;
  box-shadow: 0 12px 30px rgba(16, 22, 43, 0.06);
}
.fp-card-in h4 {
  margin: 0 0 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
}
.fp-card-in ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 6px;
  font-size: 14px;
  font-variant-numeric: tabular-nums;
}
.fp-card-in li {
  display: flex;
  justify-content: space-between;
  gap: 16px;
}
.fp-card-in li.is-total {
  border-top: 1px solid var(--line);
  padding-top: 8px;
  font-weight: 700;
}
.fp-card-in li.is-rule {
  color: #8A5A00;
  font-size: 13px;
}
.fp-card-in--accent {
  background: var(--b);
  border-color: var(--b);
  color: var(--white);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  font-weight: 700;
}
.fp-card-in--accent span {
  font-size: 13px;
  font-weight: 600;
  opacity: 0.85;
}
.fp-story {
  background: var(--paper);
}
.fp-story-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  background: var(--white);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 0 0 1px var(--line);
}
.fp-story-card > img {
  width: 100%;
  height: 100%;
  min-height: 320px;
  object-fit: cover;
  display: block;
}
.fp-story-body {
  padding: clamp(28px, 4vw, 56px);
  display: flex;
  flex-direction: column;
  gap: 14px;
  justify-content: center;
}
.fp-story-logo {
  height: 28px;
  width: auto;
  align-self: flex-start;
}
.fp-story-body .hm-h {
  font-size: clamp(24px, 2.4vw, 34px);
  line-height: 1.12;
}
.fp-story-body p {
  margin: 0;
  color: #3A3D46;
}
.fp-story-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 10px;
}
.fp-related {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
main.fp-page a.fp-rel {
  display: flex;
  flex-direction: column;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 22px;
  color: var(--ink);
  transition: border-color 0.15s ease, transform 0.15s ease;
}
main.fp-page a.fp-rel:hover {
  border-color: var(--b);
  transform: translateY(-2px);
}
.fp-rel small {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--b);
}
.fp-rel b {
  font-family: var(--disp);
  font-size: 20px;
  line-height: 1.2;
}
.fp-rel span {
  font-size: 14px;
  color: var(--mute);
}
.fp-rel em {
  margin-top: auto;
  padding-top: 8px;
  font-style: normal;
  font-weight: 700;
  font-size: 14px;
  color: var(--b);
}
@media (max-width: 1199px) {
  .fp-related {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 1023px) {
  .fp-hero-grid,
  .fp-demo-grid,
  .fp-row,
  .fp-story-card {
    grid-template-columns: 1fr;
  }
  .fp-visual {
    max-width: 640px;
  }
  .fp-float--a {
    left: 0;
  }
  .fp-float--b {
    right: 0;
  }
  .fp-log-list {
    max-height: 320px;
  }
}
@media (max-width: 719px) {
  .fp-product {
    grid-template-columns: 1fr;
  }
  .fp-window-body {
    padding: 16px;
    min-height: 0;
  }
  .fp-admin-cols {
    grid-template-columns: 1fr;
  }
  .fp-line {
    grid-template-columns: 56px minmax(0, 1fr);
  }
  .fp-line img {
    width: 56px;
    height: 56px;
  }
  .fp-line-price {
    grid-column: 2;
  }
  .fp-related {
    grid-template-columns: 1fr;
  }
  .fp-steps {
    flex-wrap: wrap;
  }
  .fp-step {
    font-size: 13px;
    padding-right: 12px;
  }
  .fp-float {
    font-size: 12px;
    padding: 10px 12px;
  }
  .fp-float i {
    width: 28px;
    height: 28px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .fp-float,
  .fp-pane,
  .fp-log-list li {
    animation: none;
  }
}
main.fp-page .rv {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s cubic-bezier(0.2, 0.7, 0.2, 1), transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1);
  transition-delay: calc(var(--rv-i, 0) * 90ms);
}
main.fp-page .rv.is-in {
  opacity: 1;
  transform: none;
}
main.fp-page .rv-load {
  animation: fp-rise 0.8s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}
main.fp-page .fp-hero-grid > .rv-load:nth-child(2) {
  animation-delay: 0.15s;
}
@keyframes fp-rise {
  from {
    opacity: 0;
    transform: translateY(24px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
main.fp-page .fp-row.rv .fp-row-media img {
  transform: scale(1.06);
  transition: transform 1.2s cubic-bezier(0.2, 0.7, 0.2, 1);
}
main.fp-page .fp-row.rv.is-in .fp-row-media img {
  transform: none;
}
main.fp-page .is-hint {
  animation: fp-hint 2.2s ease-in-out infinite;
}
@keyframes fp-hint {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(35, 85, 240, 0.45);
  }
  60% {
    box-shadow: 0 0 0 12px rgba(35, 85, 240, 0);
  }
}
@media (prefers-reduced-motion: reduce) {
  main.fp-page .rv {
    opacity: 1;
    transform: none;
    transition: none;
  }
  main.fp-page .is-hint {
    animation: none;
  }
}
.fp-doc {
  background: var(--white);
  border-radius: 12px;
  box-shadow: 0 30px 70px rgba(16, 22, 43, 0.16), 0 0 0 1px var(--line);
  padding: clamp(20px, 2.4vw, 32px);
  font-size: 14px;
  position: relative;
}
.fp-doc-top {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  border-bottom: 2px solid var(--ink);
  padding-bottom: 14px;
  margin-bottom: 12px;
}
.fp-doc-brand {
  font-family: var(--disp);
  font-size: 20px;
  letter-spacing: 0.04em;
  margin: 0;
}
.fp-doc-brand small {
  display: block;
  font: 600 11px/1.4 var(--body);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
}
.fp-doc-no {
  margin: 0;
  text-align: right;
  font-size: 12px;
  color: var(--mute);
}
.fp-doc-no b {
  display: block;
  font-size: 14px;
  color: var(--ink);
}
.fp-doc table {
  width: 100%;
  border-collapse: collapse;
  font-variant-numeric: tabular-nums;
}
.fp-doc td {
  padding: 9px 0;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.fp-doc td:last-child {
  text-align: right;
  white-space: nowrap;
  padding-left: 16px;
  font-weight: 600;
}
.fp-doc tr.is-sub td {
  color: var(--mute);
  font-weight: 400;
  border-bottom: 0;
}
.fp-doc tr.is-total td {
  border-bottom: 0;
  border-top: 2px solid var(--ink);
  font-weight: 800;
  font-size: 16px;
  padding-top: 12px;
}
.fp-doc-foot {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-top: 14px;
  font-size: 12px;
  color: var(--mute);
}
.fp-stamp {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font: 700 12px/1 var(--body);
  color: var(--ok);
  background: #E3F6EC;
  border-radius: 999px;
  padding: 6px 10px;
}
main.fp-page .fp-hero .fp-doc tr {
  animation: fp-line 4.8s cubic-bezier(0.2, 0.7, 0.2, 1) infinite both;
}
main.fp-page .fp-hero .fp-doc tr:nth-child(2) {
  animation-delay: 0.25s;
}
main.fp-page .fp-hero .fp-doc tr:nth-child(3) {
  animation-delay: 0.5s;
}
main.fp-page .fp-hero .fp-doc tr:nth-child(4) {
  animation-delay: 0.75s;
}
main.fp-page .fp-hero .fp-doc tr:nth-child(5) {
  animation-delay: 1s;
}
main.fp-page .fp-hero .fp-doc tr:nth-child(6) {
  animation-delay: 1.25s;
}
main.fp-page .fp-hero .fp-stamp {
  animation: fp-stamp 4.8s ease infinite both;
  animation-delay: 1.6s;
}
@keyframes fp-line {
  0% {
    opacity: 0;
    transform: translateX(-12px);
  }
  10%, 88% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fp-stamp {
  0%, 8% {
    opacity: 0;
    transform: scale(0.6);
  }
  16%, 88% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
  }
}
.fp-lead {
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
}
.fp-lead-head {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
}
.fp-lead-head i {
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--b);
  color: var(--white);
  font-style: normal;
  font-weight: 800;
}
.fp-lead-head p {
  margin: 0;
  font-size: 13px;
  color: var(--mute);
}
.fp-lead-head b {
  display: block;
  color: var(--ink);
  font-size: 14px;
}
.fp-lead-body {
  padding: 16px;
}
.fp-attach {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 600;
}
.fp-attach:before {
  content: "PDF";
  font-size: 10px;
  font-weight: 800;
  color: var(--white);
  background: #D93F3F;
  border-radius: 4px;
  padding: 3px 5px;
}
.fp-band {
  background: var(--b);
  color: var(--white);
  padding-block: clamp(48px, 6vw, 72px);
  position: relative;
  overflow: hidden;
}
.fp-band:before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      60% 120% at 90% 0%,
      rgba(255, 255, 255, 0.16),
      transparent 60%);
  pointer-events: none;
}
.fp-band-grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}
.fp-band-grid > div {
  border-left: 1px solid rgba(255, 255, 255, 0.25);
  padding-left: 24px;
}
.fp-band-grid b {
  display: block;
  font-family: var(--disp);
  font-size: clamp(40px, 5vw, 64px);
  line-height: 1;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
}
.fp-band-grid span {
  display: block;
  margin-top: 10px;
  font-size: 15px;
  color: rgba(255, 255, 255, 0.85);
  max-width: 28ch;
}
.fp-band-grid small {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #BFD0FF;
}
.fp-flow {
  display: flex;
  align-items: center;
  gap: 0;
  flex-wrap: wrap;
  row-gap: 12px;
}
.fp-node {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 16px;
  font-size: 13px;
  line-height: 1.4;
  box-shadow: 0 8px 20px rgba(16, 22, 43, 0.06);
  min-width: 0;
}
.fp-node b {
  display: block;
  font-size: 14px;
}
.fp-node span {
  color: var(--mute);
}
.fp-node.is-core {
  background: var(--b);
  border-color: var(--b);
  color: var(--white);
}
.fp-node.is-core span {
  color: rgba(255, 255, 255, 0.8);
}
.fp-link {
  flex: 1 1 32px;
  min-width: 32px;
  height: 2px;
  background:
    repeating-linear-gradient(
      90deg,
      var(--b) 0 8px,
      transparent 8px 14px);
  background-size: 28px 2px;
  animation: fp-dash 1s linear infinite;
  opacity: 0.7;
}
@keyframes fp-dash {
  to {
    background-position: 28px 0;
  }
}
.fp-flow--col {
  flex-direction: column;
  align-items: stretch;
}
.fp-flow--col .fp-link {
  flex: none;
  width: 2px;
  height: 24px;
  min-width: 0;
  align-self: center;
  background:
    repeating-linear-gradient(
      180deg,
      var(--b) 0 6px,
      transparent 6px 11px);
  background-size: 2px 22px;
  animation-name: fp-dash-y;
}
@keyframes fp-dash-y {
  to {
    background-position: 0 22px;
  }
}
.fp-tiles {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.fp-tile {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 26px;
  background: var(--white);
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.fp-tile:hover {
  border-color: var(--b2);
  box-shadow: 0 18px 40px rgba(35, 85, 240, 0.08);
}
.fp-tile-ico {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: var(--t1);
  color: var(--b);
}
.fp-tile-ico svg {
  width: 22px;
  height: 22px;
}
.fp-tile h3 {
  font-family: var(--disp);
  font-size: 20px;
  line-height: 1.2;
  margin: 4px 0 0;
}
.fp-tile p {
  margin: 0;
  color: var(--mute);
  font-size: 15px;
}
.fp-tiles--dark .fp-tile {
  background: var(--dark);
  border-color: var(--darkline);
  color: var(--white);
}
.fp-tiles--dark .fp-tile p {
  color: rgba(255, 255, 255, 0.7);
}
.fp-tiles--dark .fp-tile-ico {
  background: rgba(255, 255, 255, 0.08);
  color: #9DB4FF;
}
.fp-paper {
  background: var(--paper);
}
@media (max-width: 1023px) {
  .fp-tiles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 719px) {
  .fp-tiles,
  .fp-band-grid {
    grid-template-columns: 1fr;
  }
  .fp-band-grid > div {
    border-left: 0;
    padding-left: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.25);
    padding-top: 16px;
  }
  .fp-flow {
    flex-direction: column;
    align-items: stretch;
  }
  .fp-flow .fp-link {
    flex: none;
    width: 2px;
    height: 20px;
    min-width: 0;
    align-self: center;
    background:
      repeating-linear-gradient(
        180deg,
        var(--b) 0 6px,
        transparent 6px 11px);
    background-size: 2px 22px;
    animation-name: fp-dash-y;
  }
}
@media (prefers-reduced-motion: reduce) {
  main.fp-page .fp-hero .fp-doc tr,
  main.fp-page .fp-hero .fp-stamp,
  .fp-link {
    animation: none;
  }
}
.fp-cycle {
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  background: var(--white);
  box-shadow: 0 30px 70px rgba(16, 22, 43, 0.16), 0 0 0 1px var(--line);
}
.fp-cycle-stage {
  position: relative;
  aspect-ratio: 4/3;
}
.fp-cycle-stage img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  animation: fp-cycle 12s infinite;
}
.fp-cycle-stage img:first-child {
  opacity: 1;
}
.fp-cycle-stage img:nth-child(2) {
  animation-delay: 4s;
}
.fp-cycle-stage img:nth-child(3) {
  animation-delay: 8s;
}
@keyframes fp-cycle {
  0% {
    opacity: 0;
    transform: scale(1.04);
  }
  6%, 30% {
    opacity: 1;
    transform: none;
  }
  36%, 100% {
    opacity: 0;
  }
}
.fp-cycle-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
  border-top: 1px solid var(--line);
  font-size: 13px;
}
.fp-cycle-chips {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.fp-cycle-chips span {
  border: 1.5px solid var(--line);
  border-radius: 6px;
  padding: 5px 10px;
  font-weight: 600;
}
.fp-cycle-chips span:nth-child(1) {
  animation: fp-chip 12s infinite;
}
.fp-cycle-chips span:nth-child(2) {
  animation: fp-chip 12s infinite 4s;
}
.fp-cycle-chips span:nth-child(3) {
  animation: fp-chip 12s infinite 8s;
}
@keyframes fp-chip {
  0%, 33% {
    border-color: var(--b);
    background: var(--t1);
    color: var(--b);
  }
  34%, 100% {
    border-color: var(--line);
    background: none;
    color: inherit;
  }
}
.fp-cycle-bar strong {
  font-family: var(--disp);
  font-size: 18px;
}
.fp-show-tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
.fp-show-tab {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 1.5px solid var(--line);
  background: var(--white);
  border-radius: 999px;
  padding: 8px 16px 8px 10px;
  font: 700 14px/1 var(--body);
  color: var(--ink);
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.fp-show-tab img {
  height: 22px;
  width: auto;
  max-width: 90px;
  object-fit: contain;
}
.fp-show-tab[aria-selected=true] {
  border-color: var(--b);
  background: var(--t1);
}
.fp-show-tab[aria-selected=true]:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 3px;
  background: var(--b);
  animation: fp-tab-timer 7s linear forwards;
}
[data-tabs]:hover .fp-show-tab:after {
  animation-play-state: paused;
}
@keyframes fp-tab-timer {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}
.fp-show-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
  gap: 0;
  border-radius: 14px;
  overflow: hidden;
  background: var(--white);
  box-shadow: 0 0 0 1px var(--line);
  animation: fp-in 0.45s ease;
}
.fp-show-panel > figure {
  margin: 0;
  position: relative;
  min-height: 380px;
  background: var(--paper);
}
.fp-show-panel > figure img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.fp-show-panel > figure figcaption {
  position: absolute;
  left: 16px;
  top: 16px;
  font-size: 12px;
  font-weight: 700;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 999px;
  padding: 5px 12px;
}
.fp-show-body {
  padding: clamp(24px, 3vw, 44px);
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.fp-show-body .hm-h {
  font-size: clamp(24px, 2.2vw, 32px);
  line-height: 1.12;
}
.fp-show-body p {
  margin: 0;
  color: #3A3D46;
}
.fp-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.fp-chips li {
  font-size: 12px;
  font-weight: 700;
  border-radius: 999px;
  padding: 5px 12px;
  background: var(--paper);
  color: var(--ink);
}
.fp-show-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: auto;
  padding-top: 8px;
}
.fp-try {
  background: var(--dark);
  color: var(--white);
  border-radius: 16px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  overflow: hidden;
}
.fp-try-body {
  padding: clamp(28px, 4vw, 56px);
  display: flex;
  flex-direction: column;
  gap: 16px;
  justify-content: center;
}
.fp-try-body .hm-h {
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.08;
  color: var(--white);
}
.fp-try-body p {
  margin: 0;
  color: rgba(255, 255, 255, 0.75);
  max-width: 44ch;
}
.fp-try figure {
  margin: 0;
  position: relative;
  min-height: 320px;
}
.fp-try figure img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1.2s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.fp-try:hover figure img {
  transform: scale(1.04);
}
main.fp-page .fp-try a.hm-btn--white {
  background: var(--white);
  color: var(--b);
  align-self: flex-start;
}
@media (max-width: 1023px) {
  .fp-show-panel,
  .fp-try {
    grid-template-columns: 1fr;
  }
  .fp-show-panel > figure {
    min-height: 260px;
  }
  .fp-try figure {
    min-height: 220px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .fp-cycle-stage img {
    animation: none;
  }
  .fp-cycle-stage img:first-child {
    opacity: 1;
  }
  .fp-cycle-chips span {
    animation: none;
  }
  .fp-show-tab:after {
    display: none;
  }
}
.fp-hub {
  position: relative;
  aspect-ratio: 1/1;
  max-width: 540px;
  margin-inline: auto;
  width: 100%;
}
.fp-hub svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}
.fp-hub-line {
  stroke: var(--b);
  stroke-width: 0.45;
  stroke-dasharray: 1.4 1.4;
  stroke-linecap: round;
  fill: none;
  opacity: 0.6;
  animation: fp-flowline 1.2s linear infinite;
}
.fp-hub-line.is-in {
  animation-direction: reverse;
}
@keyframes fp-flowline {
  to {
    stroke-dashoffset: -5.6;
  }
}
.fp-hub-dot {
  fill: var(--b);
}
.fp-hub-core {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 30%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--b);
  color: var(--white);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  text-align: center;
  font-family: var(--disp);
  font-size: clamp(16px, 2vw, 22px);
  box-shadow:
    0 0 0 12px rgba(35, 85, 240, 0.12),
    0 0 0 26px rgba(35, 85, 240, 0.06),
    0 24px 50px rgba(35, 85, 240, 0.35);
  animation: fp-core 3s ease-in-out infinite;
}
.fp-hub-core small {
  display: block;
  font: 600 11px/1.3 var(--body);
  opacity: 0.8;
}
@keyframes fp-core {
  50% {
    box-shadow:
      0 0 0 18px rgba(35, 85, 240, 0.1),
      0 0 0 36px rgba(35, 85, 240, 0.04),
      0 24px 50px rgba(35, 85, 240, 0.35);
  }
}
.fp-hub-node {
  position: absolute;
  transform: translate(-50%, -50%);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px 14px;
  font-size: 13px;
  line-height: 1.3;
  text-align: center;
  box-shadow: 0 12px 28px rgba(16, 22, 43, 0.1);
  white-space: nowrap;
}
.fp-hub-node b {
  display: block;
  font-size: 14px;
}
.fp-hub-node span {
  color: var(--mute);
  font-size: 12px;
}
.fp-data {
  display: grid;
  grid-template-columns: minmax(220px, 0.8fr) minmax(0, 2fr);
  gap: 24px;
  align-items: start;
}
.fp-data-tabs {
  display: grid;
  gap: 8px;
}
.fp-data-tab {
  display: flex;
  align-items: center;
  gap: 12px;
  text-align: left;
  border: 1.5px solid var(--line);
  background: var(--white);
  border-radius: 10px;
  padding: 14px 16px;
  font: 700 15px/1.2 var(--body);
  color: var(--ink);
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.fp-data-tab i {
  font-style: normal;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: var(--paper);
  flex: none;
}
.fp-data-tab[aria-selected=true] {
  border-color: var(--b);
  background: var(--t1);
  color: var(--b);
}
.fp-data-tab[aria-selected=true] i {
  background: var(--b);
  color: var(--white);
}
.fp-data-panel {
  background: var(--paper);
  border-radius: 14px;
  padding: clamp(20px, 3vw, 36px);
  display: grid;
  gap: 20px;
  animation: fp-in 0.4s ease;
}
.fp-data-panel h3 {
  font-family: var(--disp);
  font-size: clamp(22px, 2vw, 28px);
  margin: 0;
}
.fp-data-panel p {
  margin: 0;
  color: #3A3D46;
  max-width: 60ch;
}
.fp-pipe {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(80px, 1.2fr) minmax(0, 1fr);
  align-items: center;
  gap: 0;
}
.fp-pipe .fp-node {
  text-align: center;
}
.fp-pipe-track {
  position: relative;
  height: 36px;
  display: grid;
  align-items: center;
}
.fp-pipe-track:before {
  content: "";
  height: 2px;
  background: var(--line);
}
.fp-pipe-track span {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  margin-top: -6px;
  border-radius: 50%;
  background: var(--b);
  box-shadow: 0 0 0 5px rgba(35, 85, 240, 0.15);
  animation: fp-packet 2.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
}
.fp-pipe-track span:nth-child(2) {
  animation-delay: 0.73s;
}
.fp-pipe-track span:nth-child(3) {
  animation-delay: 1.46s;
}
.fp-pipe-track.is-left span {
  animation-name: fp-packet-left;
}
.fp-pipe-track.is-both span:nth-child(2) {
  animation-name: fp-packet-left;
}
@keyframes fp-packet {
  0% {
    left: 0;
    opacity: 0;
  }
  15% {
    opacity: 1;
  }
  85% {
    opacity: 1;
  }
  100% {
    left: calc(100% - 12px);
    opacity: 0;
  }
}
@keyframes fp-packet-left {
  0% {
    left: calc(100% - 12px);
    opacity: 0;
  }
  15% {
    opacity: 1;
  }
  85% {
    opacity: 1;
  }
  100% {
    left: 0;
    opacity: 0;
  }
}
.fp-pipe-label {
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--b);
  margin-top: 6px;
}
.fp-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.fp-sys {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: clamp(22px, 3vw, 36px);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.fp-sys-name {
  font-family: var(--disp);
  font-size: 24px;
  margin: 0;
}
.fp-sys p {
  margin: 0;
  color: #3A3D46;
}
@media (max-width: 1023px) {
  .fp-data,
  .fp-pair {
    grid-template-columns: 1fr;
  }
  .fp-data-tabs {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  }
}
@media (max-width: 719px) {
  .fp-hub-node {
    font-size: 11px;
    padding: 7px 9px;
  }
  .fp-hub-node b {
    font-size: 12px;
  }
  .fp-hub-node span {
    display: none;
  }
  .fp-pipe {
    grid-template-columns: 1fr;
    row-gap: 6px;
  }
  .fp-pipe-track {
    height: 28px;
    width: 2px;
    justify-self: center;
  }
  .fp-pipe-track:before {
    width: 2px;
    height: 28px;
  }
  .fp-pipe-track span {
    display: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .fp-hub-line,
  .fp-hub-core,
  .fp-pipe-track span {
    animation: none;
  }
}
.fp-jump {
  position: sticky;
  top: 68px;
  z-index: 5;
  background: rgba(255, 255, 255, 0.92);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
}
.fp-jump .hm-wrap {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: none;
  padding-block: 10px;
}
.fp-jump .hm-wrap::-webkit-scrollbar {
  display: none;
}
main.fp-page .fp-jump a {
  flex: none;
  font-size: 14px;
  font-weight: 700;
  color: var(--mute);
  border-radius: 999px;
  padding: 8px 14px;
  transition: background 0.15s ease, color 0.15s ease;
}
main.fp-page .fp-jump a:hover,
main.fp-page .fp-jump a.is-here {
  background: var(--t1);
  color: var(--b);
}
main.fp-page [id] {
  scroll-margin-top: 136px;
}
.fp-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(32px, 5vw, 80px);
  align-items: center;
}
.fp-split .hm-h2 {
  margin-bottom: 16px;
}
.fp-split > div > p {
  color: #3A3D46;
  margin: 0 0 12px;
  max-width: 54ch;
}
.fp-list {
  list-style: none;
  margin: 24px 0 0;
  padding: 0;
  display: grid;
  gap: 14px;
}
.fp-list li {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.fp-list i {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: var(--t1);
  color: var(--b);
  font-style: normal;
  font-weight: 800;
}
.fp-list b {
  display: block;
  font-size: 16px;
}
.fp-list span {
  color: var(--mute);
  font-size: 15px;
}
.fp-status {
  background: var(--dark);
  color: var(--white);
  border-radius: 16px;
  padding: clamp(24px, 3vw, 36px);
  display: grid;
  gap: 18px;
  box-shadow: 0 30px 70px rgba(16, 22, 43, 0.2);
}
.fp-status-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.7);
}
.fp-ring {
  --p:0;
  width: min(220px, 60%);
  aspect-ratio: 1;
  border-radius: 50%;
  margin-inline: auto;
  display: grid;
  place-items: center;
  background: conic-gradient(#2FD98A calc(var(--p) * 1%), rgba(255, 255, 255, 0.1) 0);
  position: relative;
  transition: --p 1.6s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.fp-ring:before {
  content: "";
  position: absolute;
  inset: 12px;
  border-radius: 50%;
  background: var(--dark);
}
.fp-ring div {
  position: relative;
  text-align: center;
}
.fp-ring b {
  display: block;
  font-family: var(--disp);
  font-size: clamp(30px, 3.4vw, 42px);
  letter-spacing: -0.02em;
}
.fp-ring span {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.65);
}
@property --p { syntax: "<number>"; inherits: false; initial-value: 0; }
.fp-status.is-in .fp-ring,
.fp-status:not(.rv) .fp-ring {
  --p:var(--to);
}
.fp-status-rows {
  display: grid;
  gap: 8px;
  font-size: 14px;
}
.fp-status-rows div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  background: var(--dark2);
  border: 1px solid var(--darkline);
  border-radius: 8px;
  padding: 10px 12px;
}
.fp-status-rows em {
  font-style: normal;
  color: #7CF0B5;
  font-weight: 700;
}
main.fp-page .fp-status a {
  color: #9DB4FF;
  font-weight: 700;
  font-size: 14px;
}
.fp-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.fp-pills span {
  border: 1.5px solid var(--line);
  border-radius: 999px;
  padding: 8px 14px;
  font-weight: 700;
  font-size: 14px;
  background: var(--white);
  animation: fp-pill 6s infinite;
  animation-delay: calc(var(--i) * 0.75s);
}
@keyframes fp-pill {
  0%, 12% {
    border-color: var(--b);
    background: var(--t1);
    color: var(--b);
  }
  20%, 100% {
    border-color: var(--line);
    background: var(--white);
    color: inherit;
  }
}
@media (max-width: 1023px) {
  .fp-split {
    grid-template-columns: 1fr;
  }
}
@media (prefers-reduced-motion: reduce) {
  .fp-pills span {
    animation: none;
  }
}
.fp-hero--photo {
  background: #0E1324;
  color: var(--white);
  padding-block: clamp(72px, 10vw, 140px);
  min-height: min(78vh, 720px);
  display: flex;
  align-items: flex-end;
}
.fp-hero--photo:before {
  display: none;
}
.fp-hero--photo > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  animation: fp-kenburns 18s ease-out both;
}
.fp-hero--photo:after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      90deg,
      rgba(10, 14, 30, 0.88) 0%,
      rgba(10, 14, 30, 0.55) 45%,
      rgba(10, 14, 30, 0.05) 100%),
    linear-gradient(
      0deg,
      rgba(10, 14, 30, 0.5),
      transparent 40%);
}
@keyframes fp-kenburns {
  from {
    transform: scale(1.08);
  }
  to {
    transform: none;
  }
}
.fp-hero--photo .hm-wrap {
  position: relative;
  z-index: 1;
  width: 100%;
}
.fp-hero--photo .fp-hero-copy {
  max-width: 640px;
}
.fp-hero--photo .fp-crumbs {
  color: rgba(255, 255, 255, 0.7);
}
.fp-hero--photo .fp-crumbs b {
  color: #BFD0FF;
}
.fp-hero--photo .hm-h {
  color: var(--white);
  max-width: 16ch;
}
.fp-hero--photo .fp-lede {
  color: rgba(255, 255, 255, 0.85);
}
main.fp-page .fp-hero--photo a.hm-btn--line {
  border-color: rgba(255, 255, 255, 0.6);
  color: var(--white);
}
main.fp-page .fp-hero--photo a.hm-btn--line:hover {
  background: var(--white);
  color: var(--ink);
}
.fp-hero-logos {
  display: flex;
  align-items: center;
  gap: 28px;
  margin-top: 36px;
  flex-wrap: wrap;
}
.fp-hero-logos img {
  height: 26px;
  width: auto;
  filter: brightness(0) invert(1);
  opacity: 0.8;
}
.fp-kinds {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
.fp-kind {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  aspect-ratio: 3/4;
  background: var(--paper);
  color: var(--white);
}
.fp-kind img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.fp-kind:hover img {
  transform: scale(1.05);
}
.fp-kind:after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      0deg,
      rgba(10, 14, 30, 0.8),
      transparent 55%);
}
.fp-kind div {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 16px;
  z-index: 1;
}
.fp-kind b {
  display: block;
  font-family: var(--disp);
  font-size: 20px;
}
.fp-kind span {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.85);
}
.fp-pains {
  display: grid;
  gap: 12px;
}
.fp-pain {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 48px minmax(0, 1.2fr);
  align-items: center;
  gap: 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 20px 24px;
  background: var(--white);
}
.fp-pain-q {
  font-family: var(--disp);
  font-size: clamp(18px, 1.6vw, 22px);
  line-height: 1.25;
  margin: 0;
}
.fp-pain-q small {
  display: block;
  font: 700 11px/1.4 var(--body);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
  margin-bottom: 4px;
}
.fp-pain-arrow {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--t1);
  color: var(--b);
  font-weight: 800;
}
.fp-pain-a {
  margin: 0;
  color: #3A3D46;
}
.fp-pain-a b {
  color: var(--ink);
}
.fp-stories {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
main.fp-page a.fp-storycard {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  color: var(--ink);
  background: var(--white);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
main.fp-page a.fp-storycard:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 44px rgba(16, 22, 43, 0.1);
}
.fp-storycard figure {
  margin: 0;
  aspect-ratio: 4/3;
  overflow: hidden;
  background: var(--paper);
}
.fp-storycard figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.fp-storycard:hover figure img {
  transform: scale(1.05);
}
.fp-storycard div {
  padding: 20px 22px 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}
.fp-storycard small {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--b);
}
.fp-storycard b {
  font-family: var(--disp);
  font-size: 21px;
  line-height: 1.2;
}
.fp-storycard span {
  color: var(--mute);
  font-size: 15px;
}
.fp-storycard em {
  margin-top: auto;
  padding-top: 6px;
  font-style: normal;
  font-weight: 700;
  color: var(--b);
}
@media (max-width: 1023px) {
  .fp-kinds {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .fp-stories {
    grid-template-columns: 1fr 1fr;
  }
  .fp-pain {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .fp-pain-arrow {
    width: 36px;
    height: 36px;
    transform: rotate(90deg);
  }
}
@media (max-width: 719px) {
  .fp-stories {
    grid-template-columns: 1fr;
  }
  .fp-hero--photo {
    min-height: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .fp-hero--photo > img {
    animation: none;
  }
}
.fp-channels {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.fp-channel {
  border-radius: 12px;
  overflow: hidden;
  background: var(--white);
  box-shadow: 0 0 0 1px var(--line);
}
.fp-channel figure {
  margin: 0;
  aspect-ratio: 16/10;
  overflow: hidden;
  background: var(--paper);
}
.fp-channel figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.fp-channel div {
  padding: 18px 20px 22px;
}
.fp-channel small {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--b);
}
.fp-channel b {
  display: block;
  font-family: var(--disp);
  font-size: 20px;
  margin: 4px 0 6px;
}
.fp-channel p {
  margin: 0;
  color: var(--mute);
  font-size: 15px;
}
.fp-merge {
  position: relative;
  height: 72px;
  margin-top: 4px;
}
.fp-merge svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.fp-merge path {
  fill: none;
  stroke: var(--b);
  stroke-width: 2;
  stroke-dasharray: 6 8;
  opacity: 0.6;
  animation: fp-merge 1.2s linear infinite;
  vector-effect: non-scaling-stroke;
}
@keyframes fp-merge {
  to {
    stroke-dashoffset: -28;
  }
}
.fp-merged {
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}
.fp-merged .fp-node {
  min-width: 220px;
  text-align: center;
}
.fp-timeline {
  position: relative;
  display: grid;
  gap: clamp(28px, 4vw, 48px);
  padding-left: 56px;
  max-width: 880px;
}
.fp-timeline:before,
.fp-timeline:after {
  content: "";
  position: absolute;
  left: 19px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  background: var(--line);
}
.fp-timeline:after {
  background: var(--b);
  transform-origin: top;
  transform: scaleY(0);
  transition: transform 1.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.fp-timeline.is-in:after,
.fp-timeline:not(.rv):after {
  transform: none;
}
.fp-step-item {
  position: relative;
}
.fp-step-item:before {
  content: attr(data-n);
  position: absolute;
  left: -56px;
  top: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--b);
  color: var(--white);
  font: 800 14px/1 var(--disp);
  box-shadow: 0 0 0 6px var(--white);
}
.fp-step-item small {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--b);
}
.fp-step-item h3 {
  font-family: var(--disp);
  font-size: clamp(22px, 2.2vw, 30px);
  line-height: 1.15;
  margin: 6px 0 10px;
}
.fp-step-item p {
  margin: 0 0 10px;
  color: #3A3D46;
  max-width: 62ch;
}
.fp-goal {
  font-family: var(--disp);
  font-size: clamp(26px, 3.2vw, 44px);
  line-height: 1.15;
  letter-spacing: -0.02em;
  margin: 0;
  max-width: 22ch;
}
.fp-goal em {
  font-style: normal;
  color: var(--b);
}
@media (max-width: 1023px) {
  .fp-channels {
    grid-template-columns: 1fr;
  }
  .fp-merge {
    display: none;
  }
  .fp-merged {
    margin-top: 16px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .fp-merge path {
    animation: none;
  }
  .fp-timeline:after {
    transform: none;
    transition: none;
  }
}
.fp-flow--col .fp-node + .fp-node {
  margin-top: 8px;
}
.fp-prices {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  align-items: stretch;
}
.fp-price {
  position: relative;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: clamp(24px, 2.6vw, 36px);
  background: var(--white);
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.fp-price:hover {
  transform: translateY(-4px);
  box-shadow: 0 24px 50px rgba(16, 22, 43, 0.1);
}
.fp-price.is-top {
  background: var(--dark);
  color: var(--white);
  border-color: var(--dark);
}
.fp-price.is-top p,
.fp-price.is-top li {
  color: rgba(255, 255, 255, 0.8);
}
.fp-price-tag {
  position: absolute;
  top: -12px;
  left: 24px;
  font-size: 12px;
  font-weight: 700;
  background: var(--b);
  color: var(--white);
  border-radius: 999px;
  padding: 5px 12px;
}
.fp-price h3 {
  font-family: var(--disp);
  font-size: 24px;
  margin: 0;
}
.fp-price > p {
  margin: 0;
  color: var(--mute);
  font-size: 15px;
  min-height: 3em;
}
.fp-price-amount {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin: 4px 0 0;
}
.fp-price-amount b {
  font-family: var(--disp);
  font-size: clamp(40px, 4vw, 54px);
  letter-spacing: -0.03em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.fp-price-amount span {
  font-size: 15px;
  color: var(--mute);
}
.fp-price.is-top .fp-price-amount span {
  color: rgba(255, 255, 255, 0.7);
}
.fp-price small {
  font-size: 13px;
  color: var(--mute);
}
.fp-price ul {
  list-style: none;
  margin: 6px 0 0;
  padding: 16px 0 0;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 9px;
  font-size: 14px;
}
.fp-price.is-top ul {
  border-color: var(--darkline);
}
.fp-price li {
  display: flex;
  gap: 10px;
}
.fp-price li:before {
  content: "\2713";
  color: var(--ok);
  font-weight: 800;
}
.fp-price.is-top li:before {
  color: #2FD98A;
}
.fp-price .hm-btn {
  margin-top: auto;
  width: 100%;
}
main.fp-page .fp-price.is-top a.hm-btn--blue {
  background: var(--white);
  color: var(--b);
}
.fp-build {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(300px, 1fr);
  gap: 16px;
  align-items: start;
}
.fp-build-opts {
  display: grid;
  gap: 20px;
}
.fp-build fieldset {
  border: 0;
  margin: 0;
  padding: 0;
  min-width: 0;
}
.fp-build legend {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
  margin-bottom: 10px;
  padding: 0;
}
.fp-build-plans {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.fp-build-plans input,
.fp-build-addons input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.fp-build-plans label {
  display: flex;
  flex-direction: column;
  gap: 2px;
  border: 1.5px solid var(--line);
  border-radius: 10px;
  padding: 14px;
  cursor: pointer;
  background: var(--white);
}
.fp-build-plans label b {
  font-size: 15px;
}
.fp-build-plans label span {
  font-size: 13px;
  color: var(--mute);
}
.fp-build-plans input:checked + label {
  border-color: var(--b);
  background: var(--t1);
}
.fp-build-plans input:focus-visible + label,
.fp-build-addons input:focus-visible + span {
  outline: 3px solid var(--b2);
  outline-offset: 2px;
}
.fp-build-addons {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.fp-build-addons label {
  display: flex;
  align-items: center;
  gap: 12px;
  border: 1.5px solid var(--line);
  border-radius: 10px;
  padding: 12px 14px;
  cursor: pointer;
  background: var(--white);
  font-size: 14px;
  font-weight: 600;
}
.fp-build-addons label span {
  flex: none;
  width: 38px;
  height: 22px;
  border-radius: 999px;
  background: var(--line);
  position: relative;
  transition: background 0.2s ease;
}
.fp-build-addons label span:after {
  content: "";
  position: absolute;
  left: 3px;
  top: 3px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--white);
  transition: transform 0.2s ease;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
.fp-build-addons input:checked + span {
  background: var(--b);
}
.fp-build-addons input:checked + span:after {
  transform: translateX(16px);
}
.fp-build-addons input:disabled + span {
  opacity: 0.4;
}
.fp-build-addons label:has(input:disabled) {
  cursor: not-allowed;
  color: var(--mute);
}
.fp-build-addons output {
  margin-left: auto;
  font-weight: 700;
  color: var(--b);
  white-space: nowrap;
}
.fp-build-sum {
  position: sticky;
  top: 90px;
  background: var(--dark);
  color: var(--white);
  border-radius: 16px;
  padding: 24px;
  display: grid;
  gap: 14px;
}
.fp-build-sum ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
  font-size: 14px;
}
.fp-build-sum li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: rgba(255, 255, 255, 0.8);
  animation: fp-in 0.3s ease;
}
.fp-build-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  border-top: 1px solid var(--darkline);
  padding-top: 14px;
}
.fp-build-total b {
  font-family: var(--disp);
  font-size: 38px;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.fp-build-sum small {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.55);
}
main.fp-page .fp-build-sum a.hm-btn {
  background: var(--white);
  color: var(--b);
  width: 100%;
}
.fp-compare {
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: clip;
}
.fp-compare-head,
.fp-compare-row {
  display: grid;
  grid-template-columns: minmax(0, 2fr) repeat(3, minmax(0, 1fr));
  align-items: center;
}
.fp-compare-head {
  position: sticky;
  top: 68px;
  z-index: 2;
  background: var(--white);
  border-bottom: 1px solid var(--line);
  font-weight: 800;
  font-size: 14px;
}
.fp-compare-head > *,
.fp-compare-row > * {
  padding: 12px 18px;
}
.fp-compare-head > *:not(:first-child),
.fp-compare-row > *:not(:first-child) {
  text-align: center;
}
.fp-compare details {
  border-top: 1px solid var(--line);
}
.fp-compare details:first-of-type {
  border-top: 0;
}
.fp-compare summary {
  cursor: pointer;
  list-style: none;
  padding: 14px 18px;
  font-weight: 800;
  background: var(--paper);
  display: flex;
  justify-content: space-between;
}
.fp-compare summary::-webkit-details-marker {
  display: none;
}
.fp-compare summary:after {
  content: "+";
  color: var(--b);
  font-size: 20px;
  line-height: 1;
  transition: transform 0.2s ease;
}
.fp-compare details[open] summary:after {
  transform: rotate(45deg);
}
.fp-compare-row {
  font-size: 14px;
  border-top: 1px solid var(--line);
}
.fp-compare-row .y {
  color: var(--ok);
  font-weight: 800;
}
.fp-compare-row .n {
  color: #B5BAC6;
}
.fp-compare-row .p {
  font-weight: 700;
  color: var(--b);
}
@media (max-width: 1023px) {
  .fp-prices,
  .fp-build {
    grid-template-columns: 1fr;
  }
  .fp-build-sum {
    position: static;
  }
  .fp-price > p {
    min-height: 0;
  }
}
@media (max-width: 719px) {
  .fp-build-plans,
  .fp-build-addons {
    grid-template-columns: 1fr;
  }
  .fp-compare-head > *,
  .fp-compare-row > * {
    padding: 10px 8px;
    font-size: 12px;
  }
  .fp-compare-head,
  .fp-compare-row {
    grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr));
  }
}
.fp-res {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
main.fp-page a.fp-res-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 24px;
  background: var(--white);
  color: var(--ink);
  min-height: 220px;
  position: relative;
  overflow: hidden;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    border-color 0.2s ease;
}
main.fp-page a.fp-res-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 44px rgba(16, 22, 43, 0.1);
  border-color: var(--b2);
}
.fp-res-card.is-big {
  grid-column: span 2;
  background: var(--b) !important;
  border-color: var(--b) !important;
  color: var(--white) !important;
}
.fp-res-card.is-big span {
  color: rgba(255, 255, 255, 0.85) !important;
}
.fp-res-card.is-big .fp-tile-ico {
  background: rgba(255, 255, 255, 0.15);
  color: var(--white);
}
.fp-res-card.is-dark {
  background: var(--dark) !important;
  border-color: var(--dark) !important;
  color: var(--white) !important;
}
.fp-res-card.is-dark span {
  color: rgba(255, 255, 255, 0.7) !important;
}
.fp-res-card.is-dark .fp-tile-ico {
  background: rgba(255, 255, 255, 0.08);
  color: #9DB4FF;
}
.fp-res-card b {
  font-family: var(--disp);
  font-size: 22px;
  line-height: 1.2;
}
.fp-res-card span {
  color: var(--mute);
  font-size: 15px;
}
.fp-res-card em {
  margin-top: auto;
  font-style: normal;
  font-weight: 700;
  font-size: 14px;
}
.fp-res-card:after {
  content: "\2192";
  position: absolute;
  right: 22px;
  top: 22px;
  font-weight: 800;
  opacity: 0.4;
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.fp-res-card:hover:after {
  transform: translateX(4px);
  opacity: 1;
}
.fp-posts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}
main.fp-page a.fp-post {
  display: flex;
  flex-direction: column;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--white);
  color: var(--ink);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
main.fp-page a.fp-post:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 44px rgba(16, 22, 43, 0.1);
}
.fp-cover {
  aspect-ratio: 16/9;
  position: relative;
  overflow: hidden;
  display: grid;
  place-items: center;
  color: var(--white);
  background:
    linear-gradient(
      135deg,
      var(--c1, #2355F0),
      var(--c2, #5B80FF));
}
.fp-cover:before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(255, 255, 255, 0.18) 1px, transparent 1px);
  background-size: 18px 18px;
  opacity: 0.6;
}
.fp-cover svg {
  width: 56px;
  height: 56px;
  position: relative;
  transition: transform 0.5s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.fp-post:hover .fp-cover svg {
  transform: scale(1.12) rotate(-4deg);
}
.fp-cover img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.fp-cover[data-cat=seo] {
  --c1:#10162B;
  --c2:#2355F0;
}
.fp-cover[data-cat=howto] {
  --c1:#1F9D63;
  --c2:#5BC98F;
}
.fp-cover[data-cat=commerce] {
  --c1:#C2410C;
  --c2:#F59E0B;
}
.fp-cover[data-cat=tech] {
  --c1:#4C1D95;
  --c2:#8B5CF6;
}
.fp-post-body {
  padding: 18px 20px 22px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}
.fp-post-meta {
  font-size: 12px;
  color: var(--mute);
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.fp-post-meta b {
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--b);
}
.fp-post-body h3 {
  font-family: var(--disp);
  font-size: 20px;
  line-height: 1.25;
  margin: 0;
}
.fp-post-body p {
  margin: 0;
  color: var(--mute);
  font-size: 15px;
}
.fp-filter {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}
.fp-filter button {
  border: 1.5px solid var(--line);
  background: var(--white);
  border-radius: 999px;
  padding: 8px 16px;
  font: 700 14px/1 var(--body);
  color: var(--ink);
  cursor: pointer;
}
.fp-filter button[aria-pressed=true] {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--white);
}
.fp-post[hidden] {
  display: none !important;
}
main.fp-page a.fp-feature {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
  border-radius: 16px;
  overflow: hidden;
  background: var(--white);
  box-shadow: 0 0 0 1px var(--line);
  color: var(--ink);
}
.fp-feature .fp-cover {
  aspect-ratio: auto;
  min-height: 340px;
}
.fp-feature-body {
  padding: clamp(24px, 3vw, 44px);
  display: flex;
  flex-direction: column;
  gap: 12px;
  justify-content: center;
}
.fp-feature-body h2 {
  font-family: var(--disp);
  font-size: clamp(26px, 2.6vw, 36px);
  line-height: 1.12;
  margin: 0;
}
.fp-feature-body p {
  margin: 0;
  color: #3A3D46;
}
.fp-feature-body em {
  font-style: normal;
  font-weight: 700;
  color: var(--b);
}
@media (max-width: 1023px) {
  .fp-res {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .fp-posts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  main.fp-page a.fp-feature {
    grid-template-columns: 1fr;
  }
  .fp-feature .fp-cover {
    min-height: 220px;
  }
}
@media (max-width: 719px) {
  .fp-res,
  .fp-posts {
    grid-template-columns: 1fr;
  }
  .fp-res-card.is-big {
    grid-column: auto;
  }
}
main.fp-page .hm-section {
  padding-block: clamp(44px, 5vw, 72px);
}
main.fp-page .hm-head {
  margin-bottom: clamp(24px, 2.6vw, 36px);
}
main.fp-page .hm-head .hm-sub {
  margin-top: 10px;
}
main.fp-page .fp-hero {
  padding-block: clamp(32px, 4.4vw, 64px);
}
main.fp-page .fp-hero--photo {
  padding-block: clamp(56px, 7vw, 96px);
  min-height: min(70vh, 620px);
}
main.fp-page .fp-band {
  padding-block: clamp(36px, 4vw, 52px);
}
main.fp-page .fp-rows {
  gap: clamp(36px, 4.4vw, 60px);
}
main.fp-page .fp-row,
main.fp-page .fp-split {
  gap: clamp(28px, 4vw, 56px);
}
main.fp-page .hm-final {
  padding-bottom: clamp(44px, 5vw, 72px);
}
main.fp-page .fp-jump + .hm-section {
  padding-top: clamp(36px, 4vw, 56px);
}
@media (min-width: 1024px) {
  main.fp-page .fp-flip > :first-child {
    order: 2;
  }
  main.fp-page .fp-hero-grid.fp-flip {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  }
  main.fp-page .fp-try.fp-flip {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  }
  main.fp-page .fp-show-panel.fp-flip {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr);
  }
  main.fp-page a.fp-feature.fp-flip {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr);
  }
}
.fp-hero-slides {
  position: absolute;
  inset: 0;
}
.fp-hero-slides figure {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  animation: fp-slide 18s infinite;
}
.fp-hero-slides figure:first-child {
  opacity: 1;
}
.fp-hero-slides figure:nth-child(2) {
  animation-delay: 6s;
}
.fp-hero-slides figure:nth-child(3) {
  animation-delay: 12s;
}
.fp-hero-slides img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  animation: fp-zoom 18s linear infinite;
  animation-delay: inherit;
}
@keyframes fp-slide {
  0% {
    opacity: 0;
  }
  4%, 33% {
    opacity: 1;
  }
  38%, 100% {
    opacity: 0;
  }
}
@keyframes fp-zoom {
  0% {
    transform: scale(1.12);
  }
  38% {
    transform: scale(1);
  }
  100% {
    transform: scale(1);
  }
}
.fp-hero--photo:after {
  z-index: 1;
}
.fp-hero--photo .hm-wrap {
  z-index: 2;
}
.fp-hero-logos--cycle img {
  animation: fp-logo 18s infinite;
  opacity: 0.35;
  transform-origin: left center;
}
.fp-hero-logos--cycle img:nth-child(2) {
  animation-delay: 6s;
}
.fp-hero-logos--cycle img:nth-child(3) {
  animation-delay: 12s;
}
@keyframes fp-logo {
  0%, 33% {
    opacity: 1;
    transform: scale(1.08);
  }
  38%, 100% {
    opacity: 0.35;
    transform: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .fp-hero-slides figure,
  .fp-hero-slides img,
  .fp-hero-logos--cycle img {
    animation: none;
  }
  .fp-hero-logos--cycle img {
    opacity: 0.8;
  }
}
.fp-read {
  background: var(--white);
}
.fp-read-wrap {
  max-width: 720px;
  margin: 0 auto;
  padding: clamp(28px, 4vw, 56px) 20px clamp(48px, 6vw, 80px);
}
.fp-read .fp-crumbs {
  margin-bottom: 28px;
}
main.fp-page.fp-read .fp-crumbs a {
  color: var(--mute);
}
main.fp-page.fp-read .fp-crumbs a:hover {
  color: var(--b);
}
.fp-read-cat {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--b);
  margin: 0 0 10px;
}
.fp-read h1 {
  font-family: var(--disp);
  font-weight: 800;
  font-size: clamp(32px, 4.2vw, 44px);
  line-height: 1.12;
  letter-spacing: -0.02em;
  margin: 0;
  color: var(--ink);
  text-wrap: balance;
}
.fp-read-meta {
  margin: 16px 0 0;
  font-size: 15px;
  color: var(--mute);
}
.fp-read-cover {
  margin: 32px 0 0;
}
.fp-read-cover img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 8px;
}
.fp-read-body {
  margin-top: 32px;
  font-size: 18px;
  line-height: 1.75;
  color: #2B2E37;
}
.fp-read-body p {
  margin: 0 0 20px;
}
.fp-read-body .fp-read-lede {
  font-size: 20px;
  line-height: 1.6;
  color: var(--ink);
}
.fp-read-body h2 {
  font-family: var(--disp);
  font-size: clamp(24px, 2.6vw, 28px);
  line-height: 1.25;
  color: var(--ink);
  margin: 44px 0 14px;
}
.fp-read-body ul,
.fp-read-body ol {
  margin: 0 0 20px;
  padding-left: 1.4em;
}
.fp-read-body ul {
  list-style: disc;
}
.fp-read-body ol {
  list-style: decimal;
}
.fp-read-body li {
  display: list-item;
  list-style: inherit;
  margin-bottom: 8px;
}
.fp-read-body a {
  color: var(--b);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.fp-read-body figure {
  margin: 28px 0;
}
.fp-read-body img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
  border: 1px solid var(--line);
  border-radius: 6px;
}
.fp-read-cta {
  margin: 44px 0 0;
  padding: 24px;
  border-radius: 8px;
  background: var(--t2);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.fp-read-cta p {
  margin: 0;
  font-size: 17px;
  font-weight: 600;
  color: var(--ink);
  max-width: 40ch;
}
.fp-read-more {
  margin-top: 48px;
  border-top: 1px solid var(--line);
  padding-top: 28px;
}
.fp-read-more h2 {
  font-family: var(--disp);
  font-size: 22px;
  margin: 0 0 12px;
}
.fp-read-more ul {
  list-style: none;
  margin: 0 0 16px;
  padding: 0;
}
.fp-read-more li {
  border-bottom: 1px solid var(--line);
}
main.fp-page .fp-read-more li a {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0;
  color: var(--ink);
  font-weight: 600;
}
main.fp-page .fp-read-more li a:hover {
  color: var(--b);
}
.fp-read-more li span {
  flex: none;
  font-weight: 400;
  font-size: 14px;
  color: var(--mute);
}
main.fp-page .fp-read-more > a {
  font-weight: 700;
  color: var(--b);
}
@media (max-width: 719px) {
  .fp-read-body {
    font-size: 17px;
  }
  .fp-read-body .fp-read-lede {
    font-size: 18px;
  }
  .fp-read-more li a {
    flex-direction: column;
    gap: 2px;
  }
}
@media (max-width: 719px) {
  main.fp-page .fp-visual {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-bottom: 0;
  }
  main.fp-page .fp-visual > .fp-float {
    position: static;
    animation: none;
    align-self: flex-start;
    max-width: 100%;
  }
}
main.fp-page {
}
main.fp-page .au-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font: 700 12px/1 var(--body);
  border-radius: 999px;
  padding: 6px 10px;
  background: var(--t1);
  color: var(--b);
  white-space: nowrap;
}
main.fp-page .au-note {
  margin: 10px 0 0;
  font-size: 12px;
  color: var(--ok);
  font-weight: 600;
}
main.fp-page .au-ex {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mute);
}
main.fp-page {
}
main.fp-page .au-order {
  background: var(--white);
  border-radius: 14px;
  box-shadow: 0 30px 70px rgba(16, 22, 43, 0.16), 0 0 0 1px var(--line);
  padding: clamp(20px, 2.4vw, 32px);
}
main.fp-page .au-order-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  border-bottom: 2px solid var(--ink);
  padding-bottom: 14px;
  margin-bottom: 14px;
}
main.fp-page .au-order-head p {
  margin: 0;
}
main.fp-page .au-order-head small {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
}
main.fp-page .au-order-head b {
  font-family: var(--disp);
  font-size: 20px;
}
main.fp-page .au-order-name {
  font-family: var(--disp);
  font-size: 20px;
  line-height: 1.2;
  margin: 0 0 12px;
}
main.fp-page .au-order .fp-meta {
  font-size: 14px;
  gap: 6px 16px;
}
main.fp-page .au-rail {
  list-style: none;
  margin: 24px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  position: relative;
  counter-reset: au-rail;
}
main.fp-page .au-rail:before,
main.fp-page .au-rail:after {
  content: "";
  position: absolute;
  top: 13px;
  left: 12.5%;
  right: 12.5%;
  height: 3px;
  border-radius: 3px;
  background: var(--line);
}
main.fp-page .au-rail:after {
  background: var(--b);
  transform-origin: left;
  animation: au-fill 7s cubic-bezier(0.5, 0, 0.3, 1) infinite;
}
main.fp-page .au-rail li {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  color: var(--mute);
  counter-increment: au-rail;
}
main.fp-page .au-rail li:before {
  content: counter(au-rail);
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--white);
  border: 2px solid var(--line);
  color: var(--mute);
  font-size: 12px;
}
main.fp-page .au-rail li:nth-child(1) {
  animation: au-txt-1 7s infinite;
}
main.fp-page .au-rail li:nth-child(1):before {
  animation: au-dot-1 7s infinite;
}
main.fp-page .au-rail li:nth-child(2) {
  animation: au-txt-2 7s infinite;
}
main.fp-page .au-rail li:nth-child(2):before {
  animation: au-dot-2 7s infinite;
}
main.fp-page .au-rail li:nth-child(3) {
  animation: au-txt-3 7s infinite;
}
main.fp-page .au-rail li:nth-child(3):before {
  animation: au-dot-3 7s infinite;
}
main.fp-page .au-rail li:nth-child(4) {
  animation: au-txt-4 7s infinite;
}
main.fp-page .au-rail li:nth-child(4):before {
  animation: au-dot-4 7s infinite;
}
main.fp-page .au-rail li:last-child:before {
  content: "\2713";
}
main.fp-page .au-journey {
  position: relative;
}
main.fp-page .au-journey-track {
  position: absolute;
  left: 0;
  right: 0;
  top: 19px;
  height: 2px;
  background:
    repeating-linear-gradient(
      90deg,
      var(--line) 0 8px,
      transparent 8px 14px);
}
main.fp-page .au-journey-track span {
  position: absolute;
  top: 50%;
  left: 0;
  width: 16px;
  height: 16px;
  margin-top: -8px;
  border-radius: 50%;
  background: var(--b);
  box-shadow: 0 0 0 6px rgba(35, 85, 240, 0.15);
  animation: au-run 6s cubic-bezier(0.6, 0, 0.4, 1) infinite;
}
main.fp-page .au-stops {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  counter-reset: au-stop;
}
main.fp-page .au-stops li {
  position: relative;
  counter-increment: au-stop;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
main.fp-page .au-stops li:before {
  content: counter(au-stop, decimal-leading-zero);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--b);
  color: var(--white);
  font: 800 14px/1 var(--disp);
  box-shadow: 0 0 0 8px var(--white);
  margin-bottom: 14px;
}
main.fp-page .au-stops small {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--b);
}
main.fp-page .au-stops b {
  font-family: var(--disp);
  font-size: 21px;
  line-height: 1.2;
}
main.fp-page .au-stops p {
  margin: 0;
  color: #3A3D46;
  font-size: 15px;
}
main.fp-page .au-was {
  opacity: 0.75;
}
main.fp-page .au-was li span:first-child {
  text-decoration: line-through;
  text-decoration-color: #D93F3F;
  text-decoration-thickness: 2px;
}
main.fp-page .au-was li span:last-child {
  color: var(--mute);
}
main.fp-page .au-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
main.fp-page .au-fields label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  font-weight: 700;
  color: var(--mute);
}
main.fp-page .au-fields em {
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
  color: var(--ink);
  border: 1.5px solid var(--line);
  border-radius: 6px;
  padding: 8px 10px;
}
main.fp-page .au-fields .is-auto em {
  background: #E3F6EC;
  border-color: #BFE8D2;
  animation: au-autofill 5s ease infinite;
}
main.fp-page .au-fields .is-auto + .is-auto em {
  animation-delay: 0.2s;
}
@keyframes au-fill {
  0% {
    transform: scaleX(0);
  }
  75%, 92% {
    transform: scaleX(1);
  }
  100% {
    transform: scaleX(1);
    opacity: 0;
  }
}
@keyframes au-dot-1 {
  0%, 0% {
    background: var(--white);
    border-color: var(--line);
    color: var(--mute);
  }
  3%, 92% {
    background: var(--b);
    border-color: var(--b);
    color: var(--white);
  }
  100% {
    background: var(--white);
    border-color: var(--line);
    color: var(--mute);
  }
}
@keyframes au-txt-1 {
  0%, 0% {
    color: var(--mute);
  }
  3%, 92% {
    color: var(--ink);
  }
  100% {
    color: var(--mute);
  }
}
@keyframes au-dot-2 {
  0%, 25% {
    background: var(--white);
    border-color: var(--line);
    color: var(--mute);
  }
  28%, 92% {
    background: var(--b);
    border-color: var(--b);
    color: var(--white);
  }
  100% {
    background: var(--white);
    border-color: var(--line);
    color: var(--mute);
  }
}
@keyframes au-txt-2 {
  0%, 25% {
    color: var(--mute);
  }
  28%, 92% {
    color: var(--ink);
  }
  100% {
    color: var(--mute);
  }
}
@keyframes au-dot-3 {
  0%, 50% {
    background: var(--white);
    border-color: var(--line);
    color: var(--mute);
  }
  53%, 92% {
    background: var(--b);
    border-color: var(--b);
    color: var(--white);
  }
  100% {
    background: var(--white);
    border-color: var(--line);
    color: var(--mute);
  }
}
@keyframes au-txt-3 {
  0%, 50% {
    color: var(--mute);
  }
  53%, 92% {
    color: var(--ink);
  }
  100% {
    color: var(--mute);
  }
}
@keyframes au-dot-4 {
  0%, 75% {
    background: var(--white);
    border-color: var(--line);
    color: var(--mute);
  }
  78%, 92% {
    background: var(--b);
    border-color: var(--b);
    color: var(--white);
  }
  100% {
    background: var(--white);
    border-color: var(--line);
    color: var(--mute);
  }
}
@keyframes au-txt-4 {
  0%, 75% {
    color: var(--mute);
  }
  78%, 92% {
    color: var(--ink);
  }
  100% {
    color: var(--mute);
  }
}
@keyframes au-run {
  0% {
    left: 0;
    opacity: 0;
  }
  8% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    left: calc(100% - 16px);
    opacity: 0;
  }
}
@keyframes au-autofill {
  0%, 20% {
    background: var(--white);
    color: transparent;
  }
  35%, 90% {
    background: #E3F6EC;
    color: var(--ink);
  }
  100% {
    background: var(--white);
    color: transparent;
  }
}
@media (max-width: 1023px) {
  main.fp-page .au-stops {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 32px;
  }
  main.fp-page .au-journey-track {
    display: none;
  }
}
@media (max-width: 719px) {
  main.fp-page .au-stops {
    grid-template-columns: 1fr;
    row-gap: 24px;
    padding-left: 56px;
    position: relative;
  }
  main.fp-page .au-stops:before {
    content: "";
    position: absolute;
    left: 19px;
    top: 8px;
    bottom: 8px;
    width: 2px;
    background: var(--line);
  }
  main.fp-page .au-stops li:before {
    position: absolute;
    left: -56px;
    top: 0;
    margin: 0;
  }
  main.fp-page .au-rail li {
    font-size: 11px;
  }
}
@media (prefers-reduced-motion: reduce) {
  main.fp-page .au-rail:after,
  main.fp-page .au-rail li,
  main.fp-page .au-rail li:before,
  main.fp-page .au-journey-track span,
  main.fp-page .au-fields .is-auto em {
    animation: none;
  }
}
main.fp-page {
}
main.fp-page .au-price {
  display: grid;
  gap: 0;
}
main.fp-page .au-price-srcs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
main.fp-page .au-price-srcs span {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 13px;
  font-weight: 700;
  box-shadow: 0 10px 24px rgba(16, 22, 43, 0.08);
  min-width: 0;
}
main.fp-page .au-price-srcs i {
  flex: none;
  width: 26px;
  height: 26px;
  border-radius: 7px;
  display: grid;
  place-items: center;
  font-style: normal;
  font-size: 12px;
  font-weight: 800;
  background: var(--t1);
  color: var(--b);
}
main.fp-page .au-price-srcs span:first-child i {
  background: #E3F6EC;
  color: var(--ok);
}
main.fp-page .au-price-srcs span:last-child i {
  background: var(--b);
  color: var(--white);
}
main.fp-page .au-price-pipes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  height: 34px;
}
main.fp-page .au-price-pipes i {
  justify-self: center;
  width: 2px;
  height: 100%;
  background:
    repeating-linear-gradient(
      180deg,
      var(--b) 0 6px,
      transparent 6px 11px);
  background-size: 2px 22px;
  animation: fp-dash-y 1s linear infinite;
  opacity: 0.7;
}
main.fp-page .au-price-card {
  background: var(--white);
  border-radius: 14px;
  box-shadow: 0 30px 70px rgba(16, 22, 43, 0.16), 0 0 0 1px var(--line);
  padding: clamp(20px, 2.4vw, 28px);
}
main.fp-page .au-price-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin: 0 0 14px;
  font-family: var(--disp);
  font-size: 19px;
}
main.fp-page .au-price-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
main.fp-page .au-price-steps li {
  display: flex;
  align-items: center;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 14px;
  font-weight: 600;
}
main.fp-page .au-price-steps li:before {
  content: "\2713";
  flex: none;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 11px;
  font-weight: 800;
  background: var(--paper);
  color: var(--mute);
}
main.fp-page .au-price-steps em {
  margin-left: auto;
  font-style: normal;
  font-weight: 400;
  font-size: 13px;
  color: var(--mute);
  text-align: right;
}
main.fp-page .au-price-steps li:nth-child(1) {
  animation: au-row-1 8s infinite;
}
main.fp-page .au-price-steps li:nth-child(1):before {
  animation: au-tick-1 8s infinite;
}
main.fp-page .au-price-steps li:nth-child(2) {
  animation: au-row-2 8s infinite;
}
main.fp-page .au-price-steps li:nth-child(2):before {
  animation: au-tick-2 8s infinite;
}
main.fp-page .au-price-steps li:nth-child(3) {
  animation: au-row-3 8s infinite;
}
main.fp-page .au-price-steps li:nth-child(3):before {
  animation: au-tick-3 8s infinite;
}
main.fp-page .au-price-steps li:nth-child(4) {
  animation: au-row-4 8s infinite;
}
main.fp-page .au-price-steps li:nth-child(4):before {
  animation: au-tick-4 8s infinite;
}
main.fp-page .au-price-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 14px 0 0;
  padding-top: 12px;
  border-top: 2px solid var(--ink);
  font-weight: 800;
}
main.fp-page .au-price-total b {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--ok);
  color: var(--white);
  font-size: 13px;
}
main.fp-page .au-way {
  background: var(--white);
}
main.fp-page .au-way-pic {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--paper);
  border-radius: 10px;
  padding: 16px;
  margin-bottom: 6px;
}
main.fp-page .au-way-pic span {
  flex: 1;
  text-align: center;
  font-size: 13px;
  font-weight: 700;
  border-radius: 8px;
  padding: 14px 8px;
  background: var(--t1);
  color: var(--b);
}
main.fp-page .au-way-pic b {
  font-family: var(--disp);
  font-size: 28px;
  color: var(--b);
}
main.fp-page .au-way-pic.is-own span:last-child {
  background: #FFF1DB;
  color: #8A5A00;
}
main.fp-page .au-cal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--disp);
  font-size: 19px;
}
main.fp-page .au-cal-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px 6px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 16px;
}
main.fp-page .au-cal-grid > span {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mute);
  text-align: center;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--line);
}
main.fp-page .au-bar {
  grid-column: var(--c)/span var(--w);
  font-style: normal;
  font-size: 12px;
  font-weight: 700;
  color: var(--white);
  background: var(--b);
  border-radius: 6px;
  padding: 8px 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  animation: au-bar 6s ease infinite;
  transform-origin: left;
}
main.fp-page .au-bar.is-b {
  background: var(--ok);
}
main.fp-page .au-bar.is-c {
  background: #C2410C;
}
main.fp-page .au-bar:nth-of-type(2) {
  animation-delay: 0.3s;
}
main.fp-page .au-bar:nth-of-type(3) {
  animation-delay: 0.6s;
}
main.fp-page .au-bar:nth-of-type(4) {
  animation-delay: 0.9s;
  background: transparent;
  color: var(--ok);
  box-shadow: inset 0 0 0 1.5px var(--ok);
}
main.fp-page .au-cal-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  font-size: 13px;
  color: var(--mute);
}
main.fp-page .au-cal-foot .fp-attach {
  margin: 0;
  background: var(--white);
}
main.fp-page .au-xls:before {
  content: "XLS";
  background: var(--ok);
}
main.fp-page .au-dark {
  background: var(--dark);
  color: var(--white);
}
main.fp-page .au-dark .hm-h {
  color: var(--white);
}
main.fp-page .au-dark .hm-eyebrow {
  color: #9DB4FF;
}
main.fp-page .au-dark .hm-sub {
  color: rgba(255, 255, 255, 0.72);
}
main.fp-page .au-rules {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
main.fp-page .au-rule {
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: var(--dark2);
  border: 1px solid var(--darkline);
  border-radius: 12px;
  padding: 20px 22px;
  transition: border-color 0.2s ease, transform 0.2s ease;
}
main.fp-page .au-rule:hover {
  border-color: #5B80FF;
  transform: translateY(-2px);
}
main.fp-page .au-rule p {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.35;
}
main.fp-page .au-rule small {
  display: block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #FFC86B;
  margin-bottom: 3px;
}
main.fp-page .au-rule p + i + p small {
  color: #7CF0B5;
}
main.fp-page .au-rule i {
  font-style: normal;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(91, 128, 255, 0.18);
  color: #9DB4FF;
  transform: rotate(90deg);
  animation: au-nudge 2.4s ease-in-out infinite;
}
main.fp-page .au-rule:nth-child(2n) i {
  animation-delay: 0.4s;
}
main.fp-page .au-rule:nth-child(3n) i {
  animation-delay: 0.8s;
}
main.fp-page .au-rule span {
  margin-top: auto;
  align-self: flex-start;
  font-size: 12px;
  font-weight: 700;
  border-radius: 999px;
  padding: 5px 10px;
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.8);
}
main.fp-page {
}
main.fp-page .au-deck {
  position: relative;
  height: 530px;
}
main.fp-page .au-sheet {
  position: absolute;
  left: 9%;
  right: 9%;
  top: 40px;
  background: var(--white);
  border-radius: 12px;
  box-shadow: 0 30px 60px rgba(16, 22, 43, 0.16), 0 0 0 1px var(--line);
  padding: 22px;
  font-size: 14px;
  animation: au-deck 9s cubic-bezier(0.6, 0, 0.3, 1) infinite;
}
main.fp-page .au-sheet--quote {
  z-index: 3;
}
main.fp-page .au-sheet--mail {
  z-index: 2;
  transform: translate(10%, -22px) rotate(4deg) scale(0.94);
  animation-delay: -6s;
}
main.fp-page .au-sheet--draw {
  z-index: 1;
  transform: translate(-10%, -34px) rotate(-5deg) scale(0.9);
  animation-delay: -3s;
}
main.fp-page .au-sheet .fp-doc-top {
  align-items: center;
}
main.fp-page .au-sheet .fp-attach {
  margin: 0;
}
main.fp-page .au-sheet img {
  display: block;
  width: 100%;
  aspect-ratio: 16/8;
  object-fit: cover;
  border-radius: 8px;
}
main.fp-page .au-sheet-lines {
  display: grid;
  gap: 8px;
  margin: 16px 0 0;
}
main.fp-page .au-sheet-lines i {
  display: block;
  height: 8px;
  border-radius: 4px;
  background: var(--line);
}
main.fp-page .au-sheet-lines i.is-short {
  width: 60%;
}
main.fp-page .au-sheet-total {
  display: flex;
  justify-content: space-between;
  margin: 14px 0 0;
  padding-top: 10px;
  border-top: 2px solid var(--ink);
  font-weight: 800;
}
main.fp-page .au-sheet-total b {
  color: var(--ok);
}
main.fp-page .au-sheet--mail .fp-attach {
  margin-top: 16px;
}
main.fp-page .au-sheet--draw {
  background: #F7F9FF;
  background-image:
    linear-gradient(rgba(35, 85, 240, 0.07) 1px, transparent 1px),
    linear-gradient(
      90deg,
      rgba(35, 85, 240, 0.07) 1px,
      transparent 1px);
  background-size: 16px 16px;
}
main.fp-page .au-sheet--draw svg {
  display: block;
  width: 100%;
  height: auto;
  margin-top: 10px;
  overflow: visible;
}
main.fp-page .au-sheet--draw rect,
main.fp-page .au-sheet--draw path {
  fill: none;
  stroke: var(--b);
  stroke-width: 1.5;
}
main.fp-page .au-sheet--draw text {
  font: 600 9px var(--body);
  fill: var(--b);
  text-anchor: middle;
}
main.fp-page .au-mail-from {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  font-size: 13px;
  color: var(--mute);
}
main.fp-page .au-mail-from b {
  display: block;
  color: var(--ink);
  font-size: 15px;
}
main.fp-page .au-mail-from i {
  flex: none;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--b);
  color: var(--white);
  font-style: normal;
  font-weight: 800;
}
main.fp-page .au-mail-subj {
  margin: 14px 0 0;
  font-weight: 700;
  font-size: 15px;
}
main.fp-page .au-mail .fp-attach {
  margin-top: 14px;
}
main.fp-page .au-outs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
main.fp-page .au-out {
  display: flex;
  flex-direction: column;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px 16px 22px;
  background: var(--white);
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.2s ease;
}
main.fp-page .au-out:hover {
  border-color: var(--b2);
  box-shadow: 0 18px 40px rgba(35, 85, 240, 0.08);
  transform: translateY(-3px);
}
main.fp-page .au-out b {
  font-family: var(--disp);
  font-size: 20px;
  line-height: 1.2;
  margin-top: 8px;
  padding-inline: 6px;
}
main.fp-page .au-out p {
  margin: 0;
  color: var(--mute);
  font-size: 15px;
  padding-inline: 6px;
}
main.fp-page .au-out small {
  margin-top: auto;
  padding: 6px 6px 0;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--b);
}
main.fp-page .au-out-pic {
  position: relative;
  height: 150px;
  border-radius: 10px;
  background: var(--paper);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  padding: 0 30%;
}
main.fp-page .au-out-pic:before {
  content: "";
  position: absolute;
  left: 24%;
  right: 24%;
  top: 18px;
  bottom: -12px;
  background: var(--white);
  border-radius: 6px;
  box-shadow: 0 10px 24px rgba(16, 22, 43, 0.08);
}
main.fp-page .au-out-pic > * {
  position: relative;
}
main.fp-page .au-out-pic > i {
  display: block;
  height: 7px;
  border-radius: 4px;
  background: var(--line);
}
main.fp-page .au-out-pic > i.is-short {
  width: 60%;
}
main.fp-page .au-out-pic > span {
  align-self: flex-start;
  font-size: 10px;
  font-weight: 800;
  color: var(--white);
  background: #D93F3F;
  border-radius: 4px;
  padding: 3px 6px;
}
main.fp-page .au-out-pic--mail > span,
main.fp-page .au-out-pic--lead > span {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  padding: 0;
  display: grid;
  place-items: center;
  font-size: 13px;
  background: var(--b);
}
main.fp-page .au-out-pic--img,
main.fp-page .au-out-pic--draw,
main.fp-page .au-out-pic--code {
  padding: 0;
  align-items: center;
}
main.fp-page .au-out-pic--img:before,
main.fp-page .au-out-pic--draw:before,
main.fp-page .au-out-pic--code:before {
  display: none;
}
main.fp-page .au-out-pic--img img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}
main.fp-page .au-out:hover .au-out-pic--img img {
  transform: scale(1.05);
}
main.fp-page .au-out-pic--draw {
  background: #F7F9FF;
  background-image:
    linear-gradient(rgba(35, 85, 240, 0.08) 1px, transparent 1px),
    linear-gradient(
      90deg,
      rgba(35, 85, 240, 0.08) 1px,
      transparent 1px);
  background-size: 14px 14px;
}
main.fp-page .au-out-pic--draw svg {
  width: 70%;
  height: auto;
}
main.fp-page .au-out-pic--draw rect,
main.fp-page .au-out-pic--draw path {
  fill: none;
  stroke: var(--b);
  stroke-width: 1.5;
}
main.fp-page .au-barcode {
  width: 150px;
  height: 64px;
  background:
    repeating-linear-gradient(
      90deg,
      var(--ink) 0 2px,
      transparent 2px 4px,
      var(--ink) 4px 7px,
      transparent 7px 9px,
      var(--ink) 9px 10px,
      transparent 10px 13px);
  border: 10px solid var(--white);
  box-sizing: content-box;
  box-shadow: 0 10px 24px rgba(16, 22, 43, 0.08);
}
main.fp-page .au-out-pic--code:after {
  content: "";
  position: absolute;
  left: 18%;
  right: 18%;
  height: 2px;
  background: #D93F3F;
  box-shadow: 0 0 8px #D93F3F;
  top: 50%;
  animation: au-scan 2.4s ease-in-out infinite;
}
main.fp-page {
}
main.fp-page .au-pipeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 40px;
}
main.fp-page .au-pipeline li {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
main.fp-page .au-pipeline li + li:before {
  content: "\2192";
  position: absolute;
  left: -34px;
  top: calc(min(30vw, 380px) * 0.36);
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--b);
  color: var(--white);
  font-weight: 800;
  z-index: 1;
  box-shadow: 0 0 0 6px var(--white);
}
main.fp-page .au-pipeline small {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--b);
  margin-top: 10px;
}
main.fp-page .au-pipeline b {
  font-family: var(--disp);
  font-size: 22px;
  line-height: 1.2;
}
main.fp-page .au-pipeline p {
  margin: 0;
  color: #3A3D46;
  font-size: 15px;
}
main.fp-page .au-pipeline-pic {
  aspect-ratio: 4/3;
  border-radius: 12px;
  overflow: hidden;
  background: var(--paper);
  display: grid;
  place-items: center;
  position: relative;
}
main.fp-page .au-pipeline-pic svg {
  width: 72%;
  height: auto;
}
main.fp-page .au-pipeline-pic--wire {
  background-color: #F7F9FF;
  background-image:
    linear-gradient(rgba(35, 85, 240, 0.08) 1px, transparent 1px),
    linear-gradient(
      90deg,
      rgba(35, 85, 240, 0.08) 1px,
      transparent 1px);
  background-size: 18px 18px;
}
main.fp-page .au-pipeline-pic--wire path {
  fill: none;
  stroke: var(--b);
  stroke-width: 1.6;
  stroke-linejoin: round;
  stroke-dasharray: 520;
  animation: au-draw 6s ease-in-out infinite;
}
main.fp-page .au-pipeline-pic--render {
  background:
    radial-gradient(
      80% 70% at 50% 35%,
      #FFFFFF,
      #E9EAEE);
}
main.fp-page .au-pipeline-pic--render:after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      100deg,
      transparent 30%,
      rgba(255, 255, 255, 0.7) 50%,
      transparent 70%);
  transform: translateX(-100%);
  animation: au-sheen 4s ease-in-out infinite;
}
main.fp-page .au-pipeline-pic--photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
main.fp-page .au-devices {
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  align-items: end;
}
main.fp-page .au-dev {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
main.fp-page .au-dev > div {
  display: grid;
  gap: 6px;
  background: var(--white);
  border: 2px solid #C9CDD8;
  border-radius: 10px;
  padding: 8px;
}
main.fp-page .au-dev img {
  display: block;
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: 4px;
}
main.fp-page .au-dev--desk {
  grid-column: 1/-1;
}
main.fp-page .au-dev--desk > div {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
main.fp-page .au-dev--tab > div {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-radius: 14px;
  padding: 10px;
}
main.fp-page .au-dev--phone > div {
  border-radius: 16px;
  padding: 10px 8px 22px;
  max-width: 120px;
}
main.fp-page {
}
main.fp-page .au-screen {
  position: relative;
  padding: 0 0 30px;
}
main.fp-page .au-screen-tv {
  position: relative;
  border: 10px solid #10162B;
  border-radius: 16px;
  overflow: hidden;
  aspect-ratio: 16/10;
  background: #10162B;
  box-shadow: 0 30px 70px rgba(16, 22, 43, 0.22);
}
main.fp-page .au-screen-tv img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
main.fp-page .au-screen-ui {
  position: absolute;
  left: 14px;
  bottom: 14px;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
main.fp-page .au-screen-ui span {
  font-size: 12px;
  font-weight: 700;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 6px;
  padding: 6px 10px;
  color: var(--ink);
  animation: au-ui 9s infinite;
}
main.fp-page .au-screen-ui span:nth-child(2) {
  animation-delay: 3s;
}
main.fp-page .au-screen-ui span:nth-child(3) {
  animation-delay: 6s;
}
main.fp-page .au-screen-live {
  position: absolute;
  right: 14px;
  top: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  background: rgba(16, 22, 43, 0.8);
  color: var(--white);
  border-radius: 999px;
  padding: 6px 12px 6px 6px;
}
main.fp-page .au-screen-stand {
  width: 26%;
  height: 30px;
  margin: 0 auto;
  background: linear-gradient(#1A2240, #10162B);
  clip-path: polygon(30% 0, 70% 0, 100% 100%, 0 100%);
}
main.fp-page .au-phone {
  position: absolute;
  right: -8px;
  bottom: 0;
  width: 124px;
  border: 6px solid #10162B;
  border-radius: 20px;
  background: var(--white);
  padding: 16px 12px 12px;
  text-align: center;
  box-shadow: 0 20px 44px rgba(16, 22, 43, 0.25);
  animation: hm-float 7s ease-in-out infinite;
  animation-delay: -2s;
}
main.fp-page .au-phone p {
  margin: 8px 0 0;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
}
main.fp-page .au-qr {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 3px;
  aspect-ratio: 1;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 6px;
  overflow: hidden;
}
main.fp-page .au-qr i {
  background: var(--ink);
  border-radius: 1px;
}
main.fp-page .au-qr i:nth-child(3n+2),
main.fp-page .au-qr i:nth-child(7),
main.fp-page .au-qr i:nth-child(10) {
  background: transparent;
}
main.fp-page .au-qr:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 2px;
  top: 0;
  background: var(--b);
  box-shadow: 0 0 8px var(--b);
  animation: au-qr 2.4s ease-in-out infinite;
}
@keyframes au-row-1 {
  0%, 0% {
    border-color: var(--line);
    background: var(--white);
  }
  4%, 90% {
    border-color: #BFE8D2;
    background: #F2FBF6;
  }
  100% {
    border-color: var(--line);
    background: var(--white);
  }
}
@keyframes au-tick-1 {
  0%, 0% {
    background: var(--paper);
    color: var(--mute);
  }
  4%, 90% {
    background: var(--ok);
    color: var(--white);
  }
  100% {
    background: var(--paper);
    color: var(--mute);
  }
}
@keyframes au-row-2 {
  0%, 20% {
    border-color: var(--line);
    background: var(--white);
  }
  24%, 90% {
    border-color: #BFE8D2;
    background: #F2FBF6;
  }
  100% {
    border-color: var(--line);
    background: var(--white);
  }
}
@keyframes au-tick-2 {
  0%, 20% {
    background: var(--paper);
    color: var(--mute);
  }
  24%, 90% {
    background: var(--ok);
    color: var(--white);
  }
  100% {
    background: var(--paper);
    color: var(--mute);
  }
}
@keyframes au-row-3 {
  0%, 40% {
    border-color: var(--line);
    background: var(--white);
  }
  44%, 90% {
    border-color: #BFE8D2;
    background: #F2FBF6;
  }
  100% {
    border-color: var(--line);
    background: var(--white);
  }
}
@keyframes au-tick-3 {
  0%, 40% {
    background: var(--paper);
    color: var(--mute);
  }
  44%, 90% {
    background: var(--ok);
    color: var(--white);
  }
  100% {
    background: var(--paper);
    color: var(--mute);
  }
}
@keyframes au-row-4 {
  0%, 60% {
    border-color: var(--line);
    background: var(--white);
  }
  64%, 90% {
    border-color: #BFE8D2;
    background: #F2FBF6;
  }
  100% {
    border-color: var(--line);
    background: var(--white);
  }
}
@keyframes au-tick-4 {
  0%, 60% {
    background: var(--paper);
    color: var(--mute);
  }
  64%, 90% {
    background: var(--ok);
    color: var(--white);
  }
  100% {
    background: var(--paper);
    color: var(--mute);
  }
}
@keyframes au-bar {
  0% {
    transform: scaleX(0);
    opacity: 0;
  }
  12%, 88% {
    transform: none;
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes au-nudge {
  0%, 100% {
    transform: rotate(90deg) translateX(0);
  }
  50% {
    transform: rotate(90deg) translateX(4px);
  }
}
@keyframes au-deck {
  0%, 30% {
    transform: none;
    z-index: 3;
  }
  36%, 63% {
    transform: translate(-10%, -34px) rotate(-5deg) scale(0.9);
    z-index: 1;
  }
  69%, 96% {
    transform: translate(10%, -22px) rotate(4deg) scale(0.94);
    z-index: 2;
  }
  100% {
    transform: none;
    z-index: 3;
  }
}
@keyframes au-scan {
  0%, 100% {
    top: 25%;
  }
  50% {
    top: 75%;
  }
}
@keyframes au-draw {
  0% {
    stroke-dashoffset: 520;
  }
  45%, 85% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: -520;
  }
}
@keyframes au-sheen {
  0%, 40% {
    transform: translateX(-100%);
  }
  80%, 100% {
    transform: translateX(100%);
  }
}
@keyframes au-ui {
  0%, 30% {
    background: var(--b);
    color: var(--white);
  }
  34%, 100% {
    background: rgba(255, 255, 255, 0.92);
    color: var(--ink);
  }
}
@keyframes au-qr {
  0%, 100% {
    top: 4%;
  }
  50% {
    top: 94%;
  }
}
@media (max-width: 1023px) {
  main.fp-page .au-rules,
  main.fp-page .au-outs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  main.fp-page .au-pipeline {
    grid-template-columns: 1fr;
    gap: 48px;
    max-width: 560px;
  }
  main.fp-page .au-pipeline li + li:before {
    left: 50%;
    top: -38px;
    margin-left: -14px;
    transform: rotate(90deg);
  }
}
@media (max-width: 719px) {
  main.fp-page .au-rules,
  main.fp-page .au-outs {
    grid-template-columns: 1fr;
  }
  main.fp-page .au-price-srcs span {
    flex-direction: column;
    text-align: center;
    font-size: 12px;
    padding: 8px 6px;
  }
  main.fp-page .au-price-steps em {
    display: none;
  }
  main.fp-page .au-cal-grid {
    padding: 10px;
    gap: 6px 3px;
  }
  main.fp-page .au-cal-grid > span {
    font-size: 9px;
    letter-spacing: 0;
  }
  main.fp-page .au-bar {
    font-size: 11px;
    padding: 6px;
    white-space: normal;
    line-height: 1.25;
  }
  main.fp-page .au-deck {
    height: 440px;
  }
  main.fp-page .au-sheet {
    left: 4%;
    right: 4%;
    padding: 16px;
  }
  main.fp-page .au-phone {
    width: 96px;
    right: -4px;
    padding: 12px 8px 8px;
  }
  main.fp-page .au-screen-ui {
    left: 8px;
    bottom: 8px;
  }
  main.fp-page .au-screen-ui span {
    font-size: 11px;
    padding: 4px 8px;
  }
  main.fp-page .au-screen-tv {
    border-width: 6px;
  }
  main.fp-page .au-devices {
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  }
}
@media (prefers-reduced-motion: reduce) {
  main.fp-page .au-price-pipes i,
  main.fp-page .au-price-steps li,
  main.fp-page .au-price-steps li:before,
  main.fp-page .au-bar,
  main.fp-page .au-rule i,
  main.fp-page .au-sheet,
  main.fp-page .au-out-pic--code:after,
  main.fp-page .au-pipeline-pic--wire path,
  main.fp-page .au-pipeline-pic--render:after,
  main.fp-page .au-screen-ui span,
  main.fp-page .au-phone,
  main.fp-page .au-qr:after {
    animation: none;
  }
}
main.fp-page .au-story > img {
  height: 0;
  min-height: 100%;
}
@media (max-width: 1023px) {
  main.fp-page .au-story > img {
    height: auto;
    min-height: 0;
    aspect-ratio: 16/10;
  }
}
main.fp-page .au-deck ~ .fp-float {
  z-index: 5;
}
main.fp-page {
  --cn-get:#1F9D63;
  --cn-post:#2355F0;
  --cn-put:#B7791F;
  --cn-patch:#7C3AED;
  --cn-del:#D93F3F;
}
main.fp-page .cn-rec {
  background: var(--white);
  border-radius: 14px;
  box-shadow: 0 30px 70px rgba(16, 22, 43, 0.16), 0 0 0 1px var(--line);
  overflow: hidden;
  font-size: 14px;
}
main.fp-page .cn-rec-top {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 20px;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
}
main.fp-page .cn-rec-av {
  flex: none;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--b);
  color: var(--white);
  font-weight: 800;
  font-size: 15px;
}
main.fp-page .cn-rec-top div {
  flex: 1;
  min-width: 0;
}
main.fp-page .cn-rec-top b {
  display: block;
  font-size: 15px;
  line-height: 1.3;
}
main.fp-page .cn-rec-top div span {
  font-size: 12px;
  color: var(--mute);
}
main.fp-page .cn-rec-stage {
  flex: none;
  font: 700 12px/1 var(--body);
  border-radius: 999px;
  padding: 6px 10px;
  background: var(--t1);
  color: var(--b);
}
main.fp-page .cn-rec-rows {
  margin: 0;
  padding: 6px 20px;
}
main.fp-page .cn-rec-rows > div {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 12px;
  padding: 11px 0;
  border-bottom: 1px solid var(--line);
  align-items: center;
  animation: cn-row 6s cubic-bezier(0.2, 0.7, 0.2, 1) infinite both;
  animation-delay: calc(var(--i, 0) * 0.35s);
}
main.fp-page .cn-rec-rows > div:last-child {
  border-bottom: 0;
}
main.fp-page .cn-rec-rows dt {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
}
main.fp-page .cn-rec-rows dd {
  margin: 0;
  font-weight: 600;
  min-width: 0;
}
main.fp-page .cn-rec-rows .fp-attach {
  margin: 0;
}
main.fp-page .cn-tag {
  display: inline-block;
  font: 700 11px/1 var(--body);
  border-radius: 4px;
  padding: 4px 7px;
  background: #FFF1D6;
  color: #8A5A00;
  margin-right: 6px;
}
main.fp-page .cn-rec-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 14px 20px;
  border-top: 1px solid var(--line);
  font-size: 12px;
  color: var(--mute);
}
main.fp-page .cn-rec-foot .fp-stamp {
  animation: cn-stamp 6s ease infinite both;
  animation-delay: 2s;
}
main.fp-page {
}
main.fp-page .cn-events {
  background: var(--dark);
  color: var(--white);
  border-radius: 16px;
  padding: clamp(20px, 3vw, 32px);
  box-shadow: 0 30px 70px rgba(16, 22, 43, 0.2);
}
main.fp-page .cn-events-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin: 0 0 16px;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.65);
}
main.fp-page .cn-events-top b {
  color: var(--white);
  font-size: 15px;
}
main.fp-page .cn-events ol {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
main.fp-page .cn-events li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  background: var(--dark2);
  border: 1px solid var(--darkline);
  border-radius: 8px;
  padding: 11px 14px;
  font-size: 14px;
  animation: cn-event 8.4s infinite;
  animation-delay: calc(var(--i) * 1.2s);
}
main.fp-page .cn-events li small {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #9DB4FF;
  margin-bottom: 2px;
}
main.fp-page .cn-events li em {
  font-style: normal;
  font-size: 12px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.45);
  white-space: nowrap;
}
main.fp-page .cn-events-out {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 16px 0 0;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.7);
}
main.fp-page .cn-events-out b {
  border: 1px solid var(--darkline);
  border-radius: 999px;
  padding: 5px 12px;
  color: var(--white);
  font-size: 13px;
}
main.fp-page {
}
main.fp-page .cn-code {
  background: #0B1022;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 30px 70px rgba(16, 22, 43, 0.25), 0 0 0 1px rgba(255, 255, 255, 0.06);
  color: #DDE5FF;
  font:
    13px/1.65 ui-monospace,
    SFMono-Regular,
    Consolas,
    monospace;
}
main.fp-page .cn-code-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: #141B33;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  font-family: var(--body);
  font-size: 12px;
  color: rgba(255, 255, 255, 0.55);
}
main.fp-page .cn-code-bar .fp-window-dots i {
  background: rgba(255, 255, 255, 0.2);
}
main.fp-page .cn-code-req {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 16px 18px;
  border-bottom: 1px dashed rgba(255, 255, 255, 0.12);
}
main.fp-page .cn-code-req code {
  font: inherit;
  color: var(--white);
  word-break: break-all;
}
main.fp-page .cn-code-req span {
  color: rgba(255, 255, 255, 0.45);
}
main.fp-page .cn-code pre {
  margin: 0;
  padding: 16px 18px 20px;
  font: inherit;
  white-space: pre-wrap;
  word-break: break-word;
}
main.fp-page .cn-code pre > span {
  display: block;
  animation: cn-line 7s cubic-bezier(0.2, 0.7, 0.2, 1) infinite both;
  animation-delay: calc(var(--i, 0) * 0.18s + 0.6s);
}
main.fp-page .cn-code .k {
  color: #9DB4FF;
}
main.fp-page .cn-code .s {
  color: #7CF0B5;
}
main.fp-page .cn-code .c {
  color: rgba(255, 255, 255, 0.4);
}
main.fp-page .cn-code-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font: 700 12px/1 var(--body);
  color: #7CF0B5;
  background: rgba(47, 217, 138, 0.12);
  border-radius: 999px;
  padding: 5px 10px;
  margin-left: auto;
}
main.fp-page .cn-code-status:before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #2FD98A;
}
main.fp-page .cn-m {
  display: inline-grid;
  place-items: center;
  min-width: 58px;
  font: 800 11px/1 var(--body);
  letter-spacing: 0.06em;
  border-radius: 5px;
  padding: 5px 7px;
  color: var(--white);
  background: var(--cn-get);
}
main.fp-page .cn-m--post {
  background: var(--cn-post);
}
main.fp-page .cn-m--put {
  background: var(--cn-put);
}
main.fp-page .cn-m--patch {
  background: var(--cn-patch);
}
main.fp-page .cn-m--del {
  background: var(--cn-del);
}
main.fp-page .cn-api {
  display: grid;
  grid-template-columns: minmax(220px, 0.75fr) minmax(0, 2fr);
  gap: 24px;
  align-items: start;
}
main.fp-page .cn-api-panel {
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
  background: var(--white);
  animation: fp-in 0.4s ease;
}
main.fp-page .cn-api-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  padding: 18px 22px;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
}
main.fp-page .cn-api-head h3 {
  font-family: var(--disp);
  font-size: clamp(20px, 1.8vw, 24px);
  margin: 0;
}
main.fp-page .cn-api-head p {
  margin: 0;
  font-size: 14px;
  color: var(--mute);
  max-width: 52ch;
}
main.fp-page .cn-ep {
  list-style: none;
  margin: 0;
  padding: 0;
}
main.fp-page .cn-ep li {
  display: grid;
  grid-template-columns: 196px minmax(0, 1fr);
  gap: 6px 16px;
  align-items: start;
  padding: 14px 22px;
  border-bottom: 1px solid var(--line);
}
main.fp-page .cn-ep li:last-child {
  border-bottom: 0;
}
main.fp-page .cn-ep-ms {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  max-width: 190px;
}
main.fp-page .cn-ep-ms .cn-m {
  min-width: 0;
  font-size: 10px;
  padding: 4px 6px;
}
main.fp-page .cn-ep code {
  font:
    600 14px/1.4 ui-monospace,
    SFMono-Regular,
    Consolas,
    monospace;
  color: var(--ink);
  word-break: break-all;
}
main.fp-page .cn-ep div > span {
  display: block;
  font-size: 14px;
  color: var(--mute);
  margin-top: 3px;
}
main.fp-page .cn-api-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 14px 22px;
  background: var(--paper);
  font-size: 13px;
  color: var(--mute);
}
main.fp-page .cn-api-foot a {
  color: var(--b);
  font-weight: 700;
}
main.fp-page .cn-ways {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
main.fp-page .cn-way {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: clamp(22px, 2.6vw, 32px);
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: var(--white);
  position: relative;
  overflow: hidden;
}
main.fp-page .cn-way:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 4px;
  background: var(--b);
}
main.fp-page .cn-way:nth-child(2):before {
  background: var(--ok);
}
main.fp-page .cn-way:nth-child(3):before {
  background: #7C3AED;
}
main.fp-page .cn-way h3 {
  font-family: var(--disp);
  font-size: 22px;
  margin: 0;
}
main.fp-page .cn-way p {
  margin: 0;
  color: #3A3D46;
  font-size: 15px;
}
main.fp-page .cn-way dl {
  margin: auto 0 0;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 8px;
  font-size: 14px;
}
main.fp-page .cn-way dt {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
}
main.fp-page .cn-way dd {
  margin: 0 0 4px;
  font-weight: 600;
}
main.fp-page .cn-way code {
  font:
    600 13px ui-monospace,
    SFMono-Regular,
    Consolas,
    monospace;
  background: var(--paper);
  border-radius: 4px;
  padding: 2px 6px;
}
main.fp-page {
}
main.fp-page .cn-shop {
  position: relative;
}
main.fp-page .cn-shop .fp-window-body {
  padding: 0;
  min-height: 0;
  position: relative;
}
main.fp-page .cn-shop-body {
  position: relative;
}
main.fp-page .cn-shop-body img {
  display: block;
  width: 100%;
  height: auto;
}
main.fp-page .cn-shop-zone {
  position: absolute;
  inset: 9.4% 9.5% 9.7% 9.5%;
  border: 2px dashed var(--b);
  border-radius: 10px;
  background: rgba(35, 85, 240, 0.04);
  animation: cn-zone 3s ease-in-out infinite;
}
main.fp-page .cn-shop-zone span {
  position: absolute;
  top: -13px;
  left: 12px;
  font: 700 11px/1 var(--body);
  letter-spacing: 0.06em;
  background: var(--b);
  color: var(--white);
  border-radius: 999px;
  padding: 6px 10px;
  white-space: nowrap;
}
main.fp-page .cn-shop-toast {
  position: absolute;
  right: 16px;
  bottom: 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--white);
  border-radius: 10px;
  padding: 12px 14px;
  box-shadow: 0 16px 40px rgba(16, 22, 43, 0.2);
  font-size: 13px;
  line-height: 1.35;
  animation: cn-toast 6s cubic-bezier(0.2, 0.7, 0.2, 1) infinite both;
}
main.fp-page .cn-shop-toast i {
  flex: none;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #E3F6EC;
  color: var(--ok);
  font-style: normal;
  font-weight: 800;
}
main.fp-page .cn-shop-toast b {
  display: block;
  font-size: 14px;
}
main.fp-page .cn-shop-toast span {
  color: var(--mute);
}
main.fp-page .cn-cart {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 18px;
  box-shadow: 0 12px 30px rgba(16, 22, 43, 0.06);
}
main.fp-page .cn-cart h4 {
  margin: 0 0 12px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
}
main.fp-page {
}
main.fp-page .cn-engine {
  position: relative;
  aspect-ratio: 1/1;
  max-width: 560px;
  width: 100%;
  margin-inline: auto;
}
main.fp-page .cn-engine-ring {
  position: absolute;
  inset: 9%;
  border-radius: 50%;
  border: 1.5px dashed rgba(35, 85, 240, 0.35);
  animation: cn-spin 60s linear infinite;
}
main.fp-page .cn-engine-ring--2 {
  inset: 27%;
  border-style: solid;
  border-color: var(--line);
  animation: none;
  background:
    radial-gradient(
      circle,
      rgba(35, 85, 240, 0.08),
      transparent 70%);
}
main.fp-page .cn-engine-ring:after {
  content: "";
  position: absolute;
  top: -5px;
  left: 50%;
  width: 10px;
  height: 10px;
  margin-left: -5px;
  border-radius: 50%;
  background: var(--b);
  box-shadow: 0 0 0 6px rgba(35, 85, 240, 0.15);
}
main.fp-page .cn-engine-ring--2:after {
  display: none;
}
main.fp-page .cn-engine-core {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 34%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--b);
  color: var(--white);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-family: var(--disp);
  font-size: clamp(18px, 2.3vw, 28px);
  gap: 4px;
  padding: 10px;
  box-shadow:
    0 0 0 14px rgba(35, 85, 240, 0.12),
    0 0 0 30px rgba(35, 85, 240, 0.05),
    0 24px 50px rgba(35, 85, 240, 0.35);
  animation: fp-core 3s ease-in-out infinite;
}
main.fp-page .cn-engine-core small {
  font: 600 11px/1.3 var(--body);
  opacity: 0.85;
  max-width: 14ch;
}
main.fp-page a.cn-engine-node {
  position: absolute;
  left: var(--x);
  top: var(--y);
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 10px 14px 10px 10px;
  box-shadow: 0 14px 34px rgba(16, 22, 43, 0.12);
  color: var(--ink);
  white-space: nowrap;
  transition: transform 0.2s ease, border-color 0.2s ease;
}
main.fp-page a.cn-engine-node:hover {
  border-color: var(--b);
  transform: translate(-50%, -50%) scale(1.04);
}
main.fp-page .cn-engine-node i {
  flex: none;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: var(--c, var(--b));
  color: var(--white);
}
main.fp-page .cn-engine-node i svg {
  width: 20px;
  height: 20px;
}
main.fp-page .cn-engine-node b {
  display: block;
  font-family: var(--disp);
  font-size: 17px;
  line-height: 1.1;
}
main.fp-page .cn-engine-node span {
  font-size: 12px;
  color: var(--mute);
}
main.fp-page .cn-engine-chip {
  position: absolute;
  left: var(--x);
  top: var(--y);
  transform: translate(-50%, -50%);
  font-size: 12px;
  font-weight: 700;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 5px 11px;
  white-space: nowrap;
  color: var(--mute);
  animation: cn-chip 8s ease-in-out infinite;
  animation-delay: calc(var(--i) * 1.3s);
}
main.fp-page .cn-groups {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
main.fp-page .cn-group {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 24px;
  background: var(--white);
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: relative;
  overflow: hidden;
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}
main.fp-page .cn-group:hover {
  border-color: var(--c);
  box-shadow: 0 22px 48px rgba(16, 22, 43, 0.09);
}
main.fp-page .cn-group:after {
  content: "";
  position: absolute;
  right: -60px;
  top: -60px;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: var(--c);
  opacity: 0.07;
  transition: transform 0.5s cubic-bezier(0.2, 0.7, 0.2, 1);
}
main.fp-page .cn-group:hover:after {
  transform: scale(1.5);
}
main.fp-page .cn-group-ico {
  width: 46px;
  height: 46px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: var(--c);
  color: var(--white);
}
main.fp-page .cn-group-ico svg {
  width: 22px;
  height: 22px;
}
main.fp-page .cn-group h3 {
  font-family: var(--disp);
  font-size: 24px;
  margin: 4px 0 0;
}
main.fp-page .cn-group > p {
  margin: 0;
  color: var(--mute);
  font-size: 15px;
  min-height: 4.5em;
}
main.fp-page .cn-group ul {
  list-style: none;
  margin: 4px 0 0;
  padding: 12px 0 0;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 2px;
}
main.fp-page .cn-group ul a {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 0;
  font-weight: 700;
  font-size: 15px;
  color: var(--ink);
  transition: color 0.15s ease, padding 0.15s ease;
}
main.fp-page .cn-group ul a:after {
  content: "\2192";
  color: var(--c);
  opacity: 0.5;
  transition: opacity 0.15s ease, transform 0.15s ease;
}
main.fp-page .cn-group ul a:hover {
  color: var(--c);
}
main.fp-page .cn-group ul a:hover:after {
  opacity: 1;
  transform: translateX(3px);
}
main.fp-page .cn-addons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 20px;
  font-size: 14px;
  color: var(--mute);
}
main.fp-page .cn-addons b {
  font-size: 13px;
  font-weight: 700;
  border: 1px dashed var(--b2);
  border-radius: 999px;
  padding: 6px 12px;
  color: var(--ink);
  background: var(--white);
}
main.fp-page .cn-layers {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  align-items: start;
  position: relative;
  padding-bottom: 72px;
}
main.fp-page .cn-layer {
  position: relative;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
main.fp-page .cn-layer:nth-child(1) {
  transform: translateY(72px);
}
main.fp-page .cn-layer:nth-child(2) {
  transform: translateY(36px);
}
main.fp-page .cn-layer figure {
  margin: 0;
  aspect-ratio: 16/10;
  overflow: hidden;
  background: var(--paper);
}
main.fp-page .cn-layer figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}
main.fp-page .cn-layer:hover figure img {
  transform: scale(1.05);
}
main.fp-page .cn-layer div {
  padding: 22px 24px 26px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
main.fp-page .cn-layer small {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--b);
}
main.fp-page .cn-layer small:before {
  content: attr(data-n);
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--b);
  color: var(--white);
  letter-spacing: 0;
}
main.fp-page .cn-layer h3 {
  font-family: var(--disp);
  font-size: 22px;
  line-height: 1.2;
  margin: 0;
}
main.fp-page .cn-layer p {
  margin: 0;
  color: #3A3D46;
  font-size: 15px;
}
main.fp-page .cn-layers-line {
  position: absolute;
  left: 16%;
  right: 16%;
  top: 40px;
  height: 2px;
  pointer-events: none;
}
main.fp-page .cn-layers-line svg {
  width: 100%;
  height: 110px;
  overflow: visible;
}
main.fp-page .cn-layers-line path {
  fill: none;
  stroke: var(--b);
  stroke-width: 2;
  stroke-dasharray: 6 8;
  opacity: 0.5;
  animation: fp-merge 1.2s linear infinite;
  vector-effect: non-scaling-stroke;
}
main.fp-page .fp-band-grid.cn-band4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
main.fp-page .cn-paths {
  display: grid;
  grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr));
  gap: 16px;
}
main.fp-page a.cn-path {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 26px;
  background: var(--white);
  color: var(--ink);
  overflow: hidden;
  min-height: 230px;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    border-color 0.2s ease;
}
main.fp-page a.cn-path:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 48px rgba(16, 22, 43, 0.1);
  border-color: var(--b2);
}
main.fp-page .cn-path .fp-tile-ico {
  margin-bottom: 6px;
}
main.fp-page .cn-path b {
  font-family: var(--disp);
  font-size: 23px;
  line-height: 1.15;
}
main.fp-page .cn-path span {
  color: var(--mute);
  font-size: 15px;
}
main.fp-page .cn-path em {
  margin-top: auto;
  padding-top: 8px;
  font-style: normal;
  font-weight: 700;
  font-size: 15px;
  color: var(--b);
}
main.fp-page a.cn-path.is-main {
  background: var(--b);
  border-color: var(--b);
  color: var(--white);
}
main.fp-page .cn-path.is-main span {
  color: rgba(255, 255, 255, 0.85);
}
main.fp-page .cn-path.is-main em {
  color: var(--white);
}
main.fp-page .cn-path.is-main .fp-tile-ico {
  background: rgba(255, 255, 255, 0.16);
  color: var(--white);
}
main.fp-page a.cn-path.is-dark {
  background: var(--dark);
  border-color: var(--dark);
  color: var(--white);
}
main.fp-page .cn-path.is-dark span {
  color: rgba(255, 255, 255, 0.7);
}
main.fp-page .cn-path.is-dark em {
  color: #9DB4FF;
}
main.fp-page .cn-path.is-dark .fp-tile-ico {
  background: rgba(255, 255, 255, 0.08);
  color: #9DB4FF;
}
main.fp-page .cn-path.is-photo {
  padding: 0;
}
main.fp-page .cn-path.is-photo figure {
  margin: 0;
  aspect-ratio: 16/8;
  overflow: hidden;
}
main.fp-page .cn-path.is-photo figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}
main.fp-page .cn-path.is-photo:hover figure img {
  transform: scale(1.05);
}
main.fp-page .cn-path.is-photo > div {
  padding: 20px 24px 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}
main.fp-page {
}
main.fp-page .cn-reach {
  background: var(--white);
  border-radius: 16px;
  box-shadow: 0 30px 70px rgba(16, 22, 43, 0.16), 0 0 0 1px var(--line);
  overflow: hidden;
}
main.fp-page a.cn-map {
  position: relative;
  display: block;
  height: 190px;
  background: #E9EEF8;
  overflow: hidden;
  color: var(--ink);
}
main.fp-page .cn-map:before {
  content: "";
  position: absolute;
  inset: -20px;
  background:
    linear-gradient(
      28deg,
      transparent 46%,
      #fff 46%,
      #fff 50%,
      transparent 50%),
    linear-gradient(
      -62deg,
      transparent 58%,
      #fff 58%,
      #fff 61%,
      transparent 61%),
    linear-gradient(
      90deg,
      transparent 30%,
      rgba(255, 255, 255, 0.8) 30%,
      rgba(255, 255, 255, 0.8) 31.5%,
      transparent 31.5%),
    linear-gradient(
      0deg,
      transparent 62%,
      rgba(255, 255, 255, 0.8) 62%,
      rgba(255, 255, 255, 0.8) 63.5%,
      transparent 63.5%),
    radial-gradient(
      circle at 78% 22%,
      #D6E9D6 0 52px,
      transparent 53px),
    radial-gradient(
      circle at 18% 80%,
      #D6E9D6 0 40px,
      transparent 41px);
  transition: transform 1.2s cubic-bezier(0.2, 0.7, 0.2, 1);
}
main.fp-page .cn-map:hover:before {
  transform: scale(1.06);
}
main.fp-page .cn-map-pin {
  position: absolute;
  left: 56%;
  top: 44%;
  width: 22px;
  height: 22px;
  margin: -22px 0 0 -11px;
  border-radius: 50% 50% 50% 0;
  background: var(--b);
  transform: rotate(-45deg);
  box-shadow: 0 6px 14px rgba(35, 85, 240, 0.4);
}
main.fp-page .cn-map-pin:after {
  content: "";
  position: absolute;
  inset: 7px;
  border-radius: 50%;
  background: var(--white);
}
main.fp-page .cn-map-pulse {
  position: absolute;
  left: 56%;
  top: 44%;
  width: 14px;
  height: 6px;
  margin: -1px 0 0 -7px;
  border-radius: 50%;
  background: rgba(35, 85, 240, 0.4);
  animation: cn-pulse 2s ease-out infinite;
}
main.fp-page .cn-map-label {
  position: absolute;
  left: 14px;
  bottom: 14px;
  right: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  background: rgba(255, 255, 255, 0.94);
  border-radius: 10px;
  padding: 10px 14px;
  font-size: 13px;
  box-shadow: 0 8px 20px rgba(16, 22, 43, 0.1);
}
main.fp-page .cn-map-label b {
  display: block;
  font-size: 14px;
}
main.fp-page .cn-map-label em {
  font-style: normal;
  font-weight: 700;
  color: var(--b);
  white-space: nowrap;
}
main.fp-page .cn-reach ul {
  list-style: none;
  margin: 0;
  padding: 8px;
}
main.fp-page .cn-reach li a {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 12px;
  border-radius: 10px;
  color: var(--ink);
  transition: background 0.15s ease;
}
main.fp-page .cn-reach li a:hover {
  background: var(--t2);
}
main.fp-page .cn-reach li i {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: var(--t1);
  color: var(--b);
  font-style: normal;
}
main.fp-page .cn-reach li i svg {
  width: 20px;
  height: 20px;
}
main.fp-page .cn-reach li.is-main i {
  background: var(--b);
  color: var(--white);
}
main.fp-page .cn-reach li small {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
}
main.fp-page .cn-reach li b {
  font-size: 17px;
}
main.fp-page .cn-reach li em {
  font-style: normal;
  color: var(--b);
  font-weight: 800;
}
main.fp-page .cn-msg {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}
main.fp-page .cn-formcard {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: clamp(22px, 3vw, 36px);
  box-shadow: 0 18px 40px rgba(16, 22, 43, 0.06);
}
main.fp-page .cn-formcard .hm-h {
  font-size: clamp(24px, 2.4vw, 32px);
  line-height: 1.12;
  margin: 0 0 8px;
}
main.fp-page .cn-formcard > p,
main.fp-page .cn-formbox > form > p {
  margin: 0 0 18px;
  color: var(--mute);
}
main.fp-page dialog.cn-formbox {
  position: static;
  inset: auto;
  display: block;
  width: auto;
  max-width: none;
  height: auto;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
}
main.fp-page dialog.cn-formbox:not([open]) {
  display: none;
}
main.fp-page .cn-thanks {
  display: none;
  text-align: left;
  padding: 8px 0;
}
main.fp-page dialog.cn-formbox:not([open]) + .cn-thanks {
  display: block;
  animation: fp-in 0.4s ease;
}
main.fp-page .cn-thanks i {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #E3F6EC;
  color: var(--ok);
  font-style: normal;
  font-weight: 800;
  font-size: 22px;
  margin-bottom: 14px;
}
main.fp-page .cn-thanks .hm-h {
  font-size: clamp(24px, 2.4vw, 32px);
  margin: 0 0 8px;
}
main.fp-page .cn-thanks p {
  margin: 0 0 18px;
  color: #3A3D46;
}
main.fp-page .cn-form {
  display: grid;
  gap: 14px;
}
main.fp-page .cn-form-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
main.fp-page .cn-form label {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px;
  font-size: 14px;
  font-weight: 700;
  color: var(--ink);
}
main.fp-page .cn-form label > input:not([type=checkbox]),
main.fp-page .cn-form label > textarea,
main.fp-page .cn-form label > select {
  flex-basis: 100%;
}
main.fp-page .cn-form label small {
  font-weight: 400;
  color: var(--mute);
}
main.fp-page .cn-form input:not([type=checkbox]),
main.fp-page .cn-form textarea,
main.fp-page .cn-form select {
  font: inherit;
  font-size: 15px;
  font-weight: 400;
  border: 1.5px solid var(--line);
  border-radius: 8px;
  padding: 11px 12px;
  background: var(--white);
  color: var(--ink);
  width: 100%;
  min-width: 0;
}
main.fp-page .cn-form textarea {
  resize: vertical;
  min-height: 110px;
}
main.fp-page .cn-form input:focus,
main.fp-page .cn-form textarea:focus,
main.fp-page .cn-form select:focus {
  outline: none;
  border-color: var(--b);
  box-shadow: 0 0 0 3px rgba(35, 85, 240, 0.12);
}
main.fp-page .cn-form label.cn-check {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-weight: 400;
  font-size: 13px;
  color: var(--mute);
}
main.fp-page .cn-form label.cn-check input {
  margin-top: 3px;
}
main.fp-page .cn-form .hm-btn {
  justify-self: start;
}
main.fp-page .cn-form-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
}
main.fp-page .cn-offices {
  display: grid;
  gap: 16px;
}
main.fp-page .cn-office {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 22px 24px;
  background: var(--white);
  display: grid;
  gap: 6px;
}
main.fp-page .cn-office small {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--b);
}
main.fp-page .cn-office b {
  font-family: var(--disp);
  font-size: 20px;
}
main.fp-page .cn-office address {
  font-style: normal;
  color: #3A3D46;
  line-height: 1.55;
}
main.fp-page .cn-office p {
  margin: 0;
  color: var(--mute);
  font-size: 14px;
}
main.fp-page .cn-office a {
  justify-self: start;
  margin-top: 6px;
  font-weight: 700;
  color: var(--b);
}
@keyframes cn-row {
  0% {
    opacity: 0;
    transform: translateX(-10px);
  }
  8%, 90% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
  }
}
@keyframes cn-stamp {
  0%, 10% {
    opacity: 0;
    transform: scale(0.6);
  }
  18%, 90% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
  }
}
@keyframes cn-event {
  0%, 14% {
    border-color: #5B80FF;
    background: rgba(35, 85, 240, 0.28);
    box-shadow: 0 0 0 3px rgba(91, 128, 255, 0.15);
  }
  20%, 100% {
    border-color: rgba(255, 255, 255, 0.12);
    background: #1A2240;
    box-shadow: none;
  }
}
@keyframes cn-line {
  0% {
    opacity: 0;
    transform: translateY(4px);
  }
  6%, 92% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
  }
}
@keyframes cn-zone {
  50% {
    background: rgba(35, 85, 240, 0.1);
  }
}
@keyframes cn-toast {
  0%, 20% {
    opacity: 0;
    transform: translateY(12px);
  }
  28%, 88% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
  }
}
@keyframes cn-spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes cn-chip {
  0%, 12% {
    border-color: var(--b);
    color: var(--b);
    background: var(--t1);
  }
  22%, 100% {
    border-color: var(--line);
    color: var(--mute);
    background: var(--paper);
  }
}
@keyframes cn-pulse {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(4);
    opacity: 0;
  }
}
@media (max-width: 1199px) {
  main.fp-page .cn-groups {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  main.fp-page .cn-group > p {
    min-height: 0;
  }
  main.fp-page .fp-band-grid.cn-band4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 1023px) {
  main.fp-page .cn-ways {
    grid-template-columns: 1fr;
  }
  main.fp-page .cn-layers {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  main.fp-page .cn-layer:nth-child(1),
  main.fp-page .cn-layer:nth-child(2) {
    transform: none;
  }
  main.fp-page .cn-layers {
    padding-bottom: 0;
  }
  main.fp-page .cn-layers-line {
    display: none;
  }
  main.fp-page .cn-paths {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 719px) {
  main.fp-page .cn-groups,
  main.fp-page .cn-paths,
  main.fp-page .cn-form-row {
    grid-template-columns: 1fr;
  }
  main.fp-page .fp-band-grid.cn-band4 {
    grid-template-columns: 1fr;
  }
  main.fp-page .cn-rec-rows > div {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  main.fp-page .cn-rec-top {
    flex-wrap: wrap;
  }
  main.fp-page .cn-ep li {
    grid-template-columns: 1fr;
    padding: 12px 16px;
  }
  main.fp-page .cn-api-head,
  main.fp-page .cn-api-foot {
    padding: 14px 16px;
  }
  main.fp-page a.cn-engine-node {
    padding: 6px 8px 6px 6px;
    gap: 6px;
    border-radius: 10px;
  }
  main.fp-page .cn-engine-node i {
    width: 26px;
    height: 26px;
    border-radius: 7px;
  }
  main.fp-page .cn-engine-node i svg {
    width: 15px;
    height: 15px;
  }
  main.fp-page .cn-engine-node b {
    font-size: 13px;
  }
  main.fp-page .cn-engine-node span span {
    display: none;
  }
  main.fp-page .cn-engine-chip {
    display: none;
  }
  main.fp-page .cn-engine-core small {
    display: none;
  }
  main.fp-page .cn-shop-zone span {
    font-size: 10px;
    padding: 5px 8px;
  }
  main.fp-page .cn-shop-toast {
    left: 10px;
    right: 10px;
    bottom: 10px;
    padding: 8px 10px;
  }
  main.fp-page .cn-reach li b {
    font-size: 15px;
    word-break: break-word;
  }
  main.fp-page a.cn-path {
    min-height: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  main.fp-page .cn-rec-rows > div,
  main.fp-page .cn-rec-foot .fp-stamp,
  main.fp-page .cn-events li,
  main.fp-page .cn-code pre > span,
  main.fp-page .cn-shop-zone,
  main.fp-page .cn-shop-toast,
  main.fp-page .cn-engine-ring,
  main.fp-page .cn-engine-core,
  main.fp-page .cn-engine-chip,
  main.fp-page .cn-layers-line path,
  main.fp-page .cn-map-pulse {
    animation: none;
  }
}
main.fp-page .fp-list i svg {
  width: 20px;
  height: 20px;
}
main.fp-page .fp-visual > .cn-rec {
  margin-top: 44px;
}
main.fp-page .fp-hero .cn-code {
  font-size: 14.5px;
}
main.fp-page .fp-hero .cn-code-req code {
  font-size: 15px;
}
@media (max-width: 719px) {
  main.fp-page .fp-hero .cn-code {
    font-size: 12px;
  }
  main.fp-page .fp-hero .cn-code-req code {
    font-size: 13px;
  }
  main.fp-page .cn-code pre {
    padding: 14px;
  }
}
main.fp-page .cn-shop-nav {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 12px 18px;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
  font-weight: 600;
  color: var(--mute);
}
main.fp-page .cn-shop-nav b {
  font-family: var(--disp);
  font-size: 17px;
  color: var(--ink);
  margin-right: auto;
  letter-spacing: -0.01em;
}
main.fp-page .cn-shop-nav b i {
  font-style: normal;
  color: var(--b);
}
main.fp-page .cn-shop-nav em {
  position: relative;
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  color: var(--ink);
}
main.fp-page .cn-shop-nav em svg {
  width: 20px;
  height: 20px;
}
main.fp-page .cn-shop-nav em small {
  position: absolute;
  top: -2px;
  right: -4px;
  min-width: 16px;
  height: 16px;
  border-radius: 999px;
  background: var(--b);
  color: var(--white);
  font: 800 10px/16px var(--body);
  text-align: center;
  font-style: normal;
  animation: cn-badge 6s ease infinite both;
}
main.fp-page .cn-shop-body {
  background: #F3F4FB;
}
main.fp-page .cn-shop-toast {
  margin: 0;
}
main.fp-page .cn-cart .fp-line {
  background: var(--white);
}
@keyframes cn-badge {
  0%, 26% {
    transform: scale(0);
  }
  32% {
    transform: scale(1.3);
  }
  38%, 100% {
    transform: none;
  }
}
@media (max-width: 719px) {
  main.fp-page .cn-shop-nav span {
    display: none;
  }
  main.fp-page .cn-shop-zone span {
    top: -11px;
    left: 8px;
  }
}
@media (prefers-reduced-motion: reduce) {
  main.fp-page .cn-shop-nav em small {
    animation: none;
  }
}
main.fp-page .cn-wire {
  padding: clamp(18px, 3vw, 32px);
}
main.fp-page .cn-wire-page {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 16px;
  display: grid;
  gap: 14px;
  box-shadow: 0 12px 30px rgba(16, 22, 43, 0.06);
}
main.fp-page .cn-wire-top {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
main.fp-page .cn-wire-top b {
  font-family: var(--disp);
  font-size: 15px;
  margin-right: auto;
}
main.fp-page .cn-wire-top b i {
  font-style: normal;
  color: var(--b);
}
main.fp-page .cn-wire span {
  display: block;
  height: 8px;
  border-radius: 4px;
  background: #E6E8EF;
}
main.fp-page .cn-wire-top span {
  width: 44px;
}
main.fp-page .cn-wire-head {
  display: grid;
  gap: 8px;
}
main.fp-page .cn-wire-head span:first-child {
  height: 7px;
}
main.fp-page .cn-wire-head span:last-child {
  height: 14px;
  background: #D5D9E3;
}
main.fp-page .cn-wire-cfg {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  gap: 12px;
  border: 2px dashed var(--b);
  border-radius: 10px;
  padding: 18px 12px 12px;
  background: rgba(35, 85, 240, 0.03);
  animation: cn-zone 3s ease-in-out infinite;
}
main.fp-page .cn-wire-cfg p {
  position: absolute;
  top: -12px;
  left: 12px;
  margin: 0;
  font: 700 11px/1 var(--body);
  letter-spacing: 0.06em;
  background: var(--b);
  color: var(--white);
  border-radius: 999px;
  padding: 6px 10px;
}
main.fp-page .cn-wire-cfg figure {
  margin: 0;
  border-radius: 6px;
  overflow: hidden;
  aspect-ratio: 4/3;
}
main.fp-page .cn-wire-cfg figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
main.fp-page .cn-wire-opts {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 6px;
}
main.fp-page .cn-wire-opts span {
  height: auto;
  background: none;
  border: 1.5px solid var(--line);
  border-radius: 6px;
  padding: 5px 8px;
  font-size: 12px;
  font-weight: 600;
}
main.fp-page .cn-wire-opts span.is-on {
  border-color: var(--b);
  color: var(--b);
  background: var(--t1);
}
main.fp-page .cn-wire-opts b {
  flex-basis: 100%;
  margin-top: auto;
  padding-top: 6px;
  font-family: var(--disp);
  font-size: 18px;
}
main.fp-page .cn-wire-text {
  display: grid;
  gap: 7px;
}
main.fp-page .cn-wire-foot {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}
main.fp-page .cn-wire-foot span {
  height: 6px;
}
@media (prefers-reduced-motion: reduce) {
  main.fp-page .cn-wire-cfg {
    animation: none;
  }
}
main.fp-page .cn-team {
  position: relative;
  margin: 0;
  padding: 0 0 18% 0;
}
main.fp-page .cn-team img {
  display: block;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  box-shadow: 0 24px 50px rgba(16, 22, 43, 0.14);
}
main.fp-page .cn-team img:first-child {
  width: 82%;
  aspect-ratio: 4/3;
}
main.fp-page .cn-team img:nth-child(2) {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 52%;
  aspect-ratio: 3/2;
  border: 6px solid var(--white);
}
main.fp-page .cn-team figcaption {
  position: absolute;
  left: 0;
  bottom: 4%;
  font-size: 13px;
  color: var(--mute);
}
main.fp-page .cn-formcard > form > .hm-h {
  margin-bottom: 6px;
}
main.fp-page .cn-form label.cn-check {
  flex-wrap: nowrap;
}
main.fp-page .ind-two .fp-hero-slides figure {
  animation-name: ind-slide2;
  animation-duration: 14s;
}
main.fp-page .ind-two .fp-hero-slides figure:nth-child(2) {
  animation-delay: 7s;
}
main.fp-page .ind-two .fp-hero-slides img {
  animation-name: ind-zoom2;
  animation-duration: 14s;
}
main.fp-page .ind-two .fp-hero-logos--cycle img {
  animation-name: ind-logo2;
  animation-duration: 14s;
}
main.fp-page .ind-two .fp-hero-logos--cycle img:nth-child(2) {
  animation-delay: 7s;
}
@keyframes ind-slide2 {
  0% {
    opacity: 0;
  }
  5%, 50% {
    opacity: 1;
  }
  56%, 100% {
    opacity: 0;
  }
}
@keyframes ind-zoom2 {
  0% {
    transform: scale(1.12);
  }
  56% {
    transform: scale(1);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes ind-logo2 {
  0%, 50% {
    opacity: 1;
    transform: scale(1.08);
  }
  56%, 100% {
    opacity: 0.35;
    transform: none;
  }
}
main.fp-page .ind-solo .fp-hero-slides figure {
  opacity: 1;
  animation: none;
}
main.fp-page .ind-solo .fp-hero-slides img {
  animation: ind-drift 24s ease-in-out infinite alternate;
}
@keyframes ind-drift {
  from {
    transform: scale(1.1);
  }
  to {
    transform: scale(1);
  }
}
main.fp-page .fp-hero-logos.ind-logos-one img {
  opacity: 1;
  height: 30px;
}
main.fp-page .fp-hero--photo .fp-ticks {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
  margin-top: 24px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.92);
}
main.fp-page .fp-hero--photo .fp-ticks li:before {
  background-color: rgba(255, 255, 255, 0.92);
}
main.fp-page .fp-hero--photo .fp-hero-logos {
  margin-top: 28px;
}
@media (prefers-reduced-motion: reduce) {
  main.fp-page .ind-two .fp-hero-slides figure,
  main.fp-page .ind-two .fp-hero-slides img,
  main.fp-page .ind-solo .fp-hero-slides img,
  main.fp-page .ind-two .fp-hero-logos--cycle img {
    animation: none;
  }
  main.fp-page .ind-two .fp-hero-logos--cycle img {
    opacity: 0.8;
  }
}
main.fp-page .ind-kinds-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
main.fp-page .ind-kinds-3 .fp-kind {
  aspect-ratio: 5/4;
}
main.fp-page .fp-kind img.ind-top {
  object-position: center 15%;
}
main.fp-page .ind-kind-draw {
  background:
    linear-gradient(
      160deg,
      #18214A 0%,
      var(--dark) 70%);
}
main.fp-page .ind-kind-draw svg {
  position: absolute;
  left: 50%;
  top: 42%;
  width: 58%;
  height: auto;
  transform: translate(-50%, -50%);
  color: #9DB4FF;
  transition: transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}
main.fp-page .ind-kind-draw:hover svg {
  transform: translate(-50%, -50%) scale(1.06);
}
main.fp-page .ind-kind-draw:after {
  background:
    linear-gradient(
      0deg,
      rgba(10, 14, 30, 0.7),
      transparent 45%);
}
main.fp-page .ind-stories-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
main.fp-page .ind-more {
  margin-top: clamp(28px, 3vw, 40px);
}
main.fp-page .ind-more > p {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
  margin: 0 0 14px;
}
main.fp-page .ind-stories-2 .fp-storycard {
  flex-direction: row;
}
main.fp-page .ind-stories-2 .fp-storycard figure {
  flex: 0 0 40%;
  aspect-ratio: auto;
  min-height: 200px;
}
main.fp-page .ind-note {
  font-size: 12px;
  color: var(--mute);
  margin: 12px 0 0;
}
main.fp-page .fp-try .ind-note {
  color: rgba(255, 255, 255, 0.55);
}
.ind-matrix {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: clamp(18px, 2.4vw, 28px);
  box-shadow: 0 30px 70px rgba(16, 22, 43, 0.12);
}
.ind-matrix-top {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
}
.ind-matrix-model {
  flex: none;
  width: 64px;
  height: 64px;
  border-radius: 10px;
  overflow: hidden;
  background: var(--paper);
}
.ind-matrix-model img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ind-matrix-top b {
  display: block;
  font-family: var(--disp);
  font-size: 17px;
}
.ind-matrix-top span {
  font-size: 13px;
  color: var(--mute);
}
.ind-grid {
  display: grid;
  grid-template-columns: 52px repeat(6, minmax(0, 1fr));
  gap: 6px;
  align-items: center;
  font-size: 11px;
  font-weight: 700;
  color: var(--mute);
}
.ind-grid i {
  display: block;
  height: 14px;
  border-radius: 4px;
  background: var(--c);
}
.ind-cell {
  position: relative;
  aspect-ratio: 1;
  border-radius: 6px;
  background: var(--paper);
  overflow: hidden;
}
.ind-cell:before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      150deg,
      var(--c) 0 55%,
      color-mix(in srgb, var(--c) 70%, #000) 55% 100%);
  opacity: 0;
  animation: ind-render 9s infinite;
  animation-delay: calc(var(--n) * 0.16s);
}
.ind-cell:after {
  content: "\2713";
  position: absolute;
  right: 3px;
  bottom: 2px;
  font-size: 9px;
  color: var(--white);
  opacity: 0;
  animation: ind-render 9s infinite;
  animation-delay: calc(var(--n) * 0.16s + 0.2s);
}
@keyframes ind-render {
  0% {
    opacity: 0;
    transform: scale(0.6);
  }
  6%, 86% {
    opacity: 1;
    transform: none;
  }
  96%, 100% {
    opacity: 0;
  }
}
.ind-matrix-foot {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  font-size: 13px;
}
.ind-matrix-foot b {
  font-family: var(--disp);
  font-size: 16px;
}
.ind-doors {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.ind-door {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--white);
  padding: 22px 22px 24px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ind-door-stage {
  height: 190px;
  border-radius: 8px;
  background:
    linear-gradient(
      180deg,
      #EEF2FF,
      #F7F8FC);
  display: grid;
  place-items: center;
  perspective: 600px;
  margin-bottom: 12px;
  position: relative;
  overflow: hidden;
}
.ind-door-frame {
  position: relative;
  width: 96px;
  height: 150px;
  border: 4px solid var(--ink);
  border-bottom-width: 0;
  border-radius: 2px;
}
.ind-door-leaf {
  position: absolute;
  inset: 4px;
  background:
    linear-gradient(
      115deg,
      rgba(157, 180, 255, 0.55),
      rgba(220, 230, 255, 0.35) 45%,
      rgba(157, 180, 255, 0.5));
  border: 2px solid #2C3550;
  border-radius: 1px;
  transform-origin: 0 50%;
  animation: ind-hinge 5s ease-in-out infinite;
}
.ind-door-leaf:after {
  content: "";
  position: absolute;
  right: 8px;
  top: 45%;
  width: 3px;
  height: 22px;
  border-radius: 2px;
  background: #2C3550;
}
.ind-door--pivot .ind-door-leaf {
  transform-origin: 28% 50%;
  animation-name: ind-pivot;
}
.ind-door--slide .ind-door-frame {
  overflow: visible;
}
.ind-door--slide .ind-door-leaf {
  animation-name: ind-slide;
}
.ind-door--slide .ind-door-stage:before {
  content: "";
  position: absolute;
  top: calc(50% - 82px);
  left: calc(50% - 60px);
  width: 170px;
  height: 4px;
  border-radius: 2px;
  background: #2C3550;
}
@keyframes ind-hinge {
  0%, 15% {
    transform: none;
  }
  45%, 70% {
    transform: rotateY(-62deg);
  }
  100% {
    transform: none;
  }
}
@keyframes ind-pivot {
  0%, 15% {
    transform: none;
  }
  45%, 70% {
    transform: rotateY(-75deg);
  }
  100% {
    transform: none;
  }
}
@keyframes ind-slide {
  0%, 15% {
    transform: none;
  }
  45%, 70% {
    transform: translateX(78px);
  }
  100% {
    transform: none;
  }
}
.ind-door b {
  font-family: var(--disp);
  font-size: 20px;
}
.ind-door span {
  color: var(--mute);
  font-size: 15px;
}
.ind-sheet {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 12px 30px rgba(16, 22, 43, 0.06);
  font-size: 12px;
}
.ind-sheet-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  background: #1E7145;
  color: var(--white);
  font-weight: 700;
}
.ind-sheet-bar:before {
  content: "X";
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 3px;
  background: var(--white);
  color: #1E7145;
  font-size: 11px;
  font-weight: 800;
}
.ind-sheet table {
  width: 100%;
  border-collapse: collapse;
}
.ind-sheet th,
.ind-sheet td {
  border: 1px solid #E3E6EE;
  padding: 7px 9px;
  text-align: left;
}
.ind-sheet th {
  background: #F3F4F8;
  font-weight: 700;
  color: var(--mute);
}
.ind-sheet td i {
  display: block;
  height: 8px;
  border-radius: 4px;
  background: #DCE0EA;
  width: var(--w, 70%);
}
.ind-sheet tr.is-hit td {
  animation: ind-hit 6s infinite;
}
@keyframes ind-hit {
  0%, 30% {
    background: none;
  }
  40%, 85% {
    background: #E7EEFF;
  }
  100% {
    background: none;
  }
}
.ind-compare {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
}
.ind-compare > div {
  border-radius: 14px;
  padding: clamp(22px, 2.6vw, 32px);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ind-compare-was {
  background: var(--white);
  border: 1px dashed #C9CDD8;
}
.ind-compare-now {
  background: var(--dark);
  color: var(--white);
}
.ind-compare small {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
}
.ind-compare-now small {
  color: #9DB4FF;
}
.ind-compare h3 {
  font-family: var(--disp);
  font-size: clamp(22px, 2vw, 28px);
  line-height: 1.15;
  margin: 0;
}
.ind-compare ol {
  list-style: none;
  margin: 6px 0 0;
  padding: 0;
  display: grid;
  gap: 10px;
  counter-reset: ind;
}
.ind-compare li {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  counter-increment: ind;
  font-size: 15px;
}
.ind-compare li:before {
  content: counter(ind);
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 13px;
  background: var(--paper);
  color: var(--mute);
}
.ind-compare-now li:before {
  background: var(--b);
  color: var(--white);
}
.ind-compare-was li.is-wait {
  color: #8A5A00;
}
.ind-compare-was li.is-wait:before {
  content: "\2026";
  background: #FFF3D6;
  color: #8A5A00;
}
.ind-compare-now li.is-done:before {
  content: "\2713";
  background: var(--ok);
}
.ind-bench {
  background:
    linear-gradient(
      180deg,
      #F3F5FB,
      #E7EBF5);
  border-radius: 14px;
  padding: clamp(20px, 3vw, 36px) clamp(16px, 2.6vw, 32px) 0;
  position: relative;
  overflow: hidden;
  box-shadow: 0 0 0 1px var(--line);
}
.ind-bench-wall {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  height: 220px;
}
.ind-mod {
  flex: 1 1 0;
  border-radius: 4px 4px 0 0;
  background: #2C3550;
  position: relative;
  animation: ind-mod 10s infinite backwards;
  animation-delay: calc(var(--n) * 0.7s);
}
.ind-mod:before {
  content: "";
  position: absolute;
  inset: 8px 6px auto;
  height: calc(100% - 16px);
  background:
    repeating-linear-gradient(
      180deg,
      #E8590C 0 calc(var(--d, 25%) - 3px),
      #2C3550 calc(var(--d, 25%) - 3px) var(--d, 25%));
  border-radius: 2px;
}
.ind-mod--bench {
  flex-grow: 2.2;
  height: 46%;
  background: #3B4566;
}
.ind-mod--bench:before {
  inset: auto 0 100% 0;
  height: 10px;
  background: #B7BDCB;
  border-radius: 2px 2px 0 0;
}
.ind-mod--tall {
  height: 100%;
}
.ind-mod--mid {
  height: 62%;
}
.ind-mod--wall {
  height: 100%;
  background: none;
}
.ind-mod--wall:before {
  inset: 0 4px 52% 4px;
  height: auto;
  background:
    radial-gradient(
      circle,
      #8A93AC 1.4px,
      transparent 1.6px) 0 0/10px 10px,
    #C9CEDB;
}
.ind-mod span {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 8px);
  transform: translateX(-50%);
  white-space: nowrap;
  font-size: 11px;
  font-weight: 700;
  color: var(--mute);
}
.ind-mod--wall span {
  bottom: calc(54% + 8px);
}
@keyframes ind-mod {
  0% {
    opacity: 0;
    transform: translateY(30px);
  }
  6%, 88% {
    opacity: 1;
    transform: none;
  }
  96%, 100% {
    opacity: 0;
    transform: none;
  }
}
.ind-bench-floor {
  height: 14px;
  background: #C3C8D5;
  margin-inline: calc(-1 * clamp(16px, 2.6vw, 32px));
}
.ind-bench-sum {
  display: inline-block;
  margin: 0 0 40px;
  background: var(--white);
  border-radius: 10px;
  padding: 10px 14px;
  font-size: 13px;
  box-shadow: 0 10px 26px rgba(16, 22, 43, 0.12);
}
.ind-bench-sum b {
  display: block;
  font-family: var(--disp);
  font-size: 16px;
}
.ind-bench-sum span {
  color: var(--mute);
}
.ind-langs {
  display: grid;
  gap: 10px;
}
.ind-lang {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  background: var(--white);
  border: 1.5px solid var(--line);
  border-radius: 10px;
  padding: 12px 16px;
  animation: ind-lang 10s infinite;
  animation-delay: calc(var(--i) * 2s);
}
.ind-lang b {
  font: 800 13px/1 var(--disp);
  letter-spacing: 0.06em;
  width: 44px;
  height: 32px;
  border-radius: 6px;
  display: grid;
  place-items: center;
  background: var(--paper);
}
.ind-lang span {
  font-size: 15px;
}
.ind-lang em {
  font-style: normal;
  color: var(--mute);
  font-size: 13px;
  display: block;
}
@keyframes ind-lang {
  0%, 18% {
    border-color: var(--b);
    background: var(--t1);
  }
  22%, 100% {
    border-color: var(--line);
    background: var(--white);
  }
}
.ind-portal {
  display: grid;
  gap: 12px;
}
.ind-portal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  color: var(--mute);
}
.ind-portal-head img {
  height: 22px;
  width: auto;
}
.ind-portal-user {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  color: var(--ink);
}
.ind-portal-user i {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--t1);
  color: var(--b);
  display: grid;
  place-items: center;
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
}
.ind-portal-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
.ind-portal-body figure {
  margin: 0;
  border-radius: 8px;
  overflow: hidden;
  aspect-ratio: 4/3;
  background: var(--paper);
}
.ind-portal-body figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ind-portal-opts {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 6px;
  font-size: 13px;
}
.ind-portal-opts li {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 6px;
}
.ind-portal-opts li span {
  color: var(--mute);
}
.ind-portal-opts li b {
  font-weight: 700;
  text-align: right;
}
.ind-portal-opts li.is-price {
  border: 0;
  padding-top: 4px;
  color: var(--b);
}
.ind-portal-opts li.is-price span {
  color: var(--b);
  font-weight: 700;
}
.ind-portal-btn {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  background: var(--b);
  color: var(--white);
  border-radius: 8px;
  padding: 10px 14px;
  font-weight: 700;
  font-size: 14px;
}
.ind-portal-btn span {
  font-size: 12px;
  opacity: 0.85;
  font-weight: 600;
}
.ind-crm {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 30px 70px rgba(16, 22, 43, 0.14);
}
.ind-crm-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
  font-weight: 700;
}
.ind-crm-bar i {
  display: flex;
  gap: 3px;
}
.ind-crm-bar i:before,
.ind-crm-bar i:after,
.ind-crm-bar i span {
  content: "";
  width: 8px;
  height: 14px;
  border-radius: 4px;
  background: #FF3D57;
}
.ind-crm-bar i:after {
  background: #00CA72;
}
.ind-crm-bar i span {
  background: #FFCC00;
}
.ind-crm table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.ind-crm th {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mute);
  text-align: left;
  padding: 10px 16px;
  background: var(--paper);
}
.ind-crm td {
  padding: 11px 16px;
  border-top: 1px solid var(--line);
  vertical-align: top;
}
.ind-crm td:first-child {
  color: var(--mute);
  width: 36%;
}
.ind-crm td b {
  font-weight: 700;
}
.ind-crm tr {
  animation: fp-line 6s cubic-bezier(0.2, 0.7, 0.2, 1) infinite both;
  animation-delay: calc(var(--n, 0) * 0.25s);
}
.ind-crm-tag {
  display: inline-block;
  border-radius: 4px;
  padding: 3px 8px;
  font-size: 12px;
  font-weight: 700;
  color: var(--white);
  background: #00A0C6;
}
.ind-crm-tag--new {
  background: #00CA72;
}
.ind-crm-foot {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  padding: 12px 16px;
  border-top: 1px solid var(--line);
  background: var(--paper);
  font-size: 12px;
  color: var(--mute);
}
.ind-quote {
  position: relative;
}
.ind-quote .fp-doc figure {
  margin: 0 0 12px;
  border-radius: 8px;
  overflow: hidden;
  aspect-ratio: 16/8;
  position: relative;
}
.ind-quote .fp-doc figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ind-quote .fp-doc figure figcaption {
  position: absolute;
  left: 10px;
  bottom: 10px;
  font-size: 11px;
  font-weight: 700;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 999px;
  padding: 4px 10px;
}
.ind-quote .fp-doc td:last-child {
  color: var(--mute);
  font-weight: 600;
}
@media (max-width: 1023px) {
  main.fp-page .ind-kinds-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .ind-doors {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media (max-width: 719px) {
  main.fp-page .ind-kinds-3 {
    grid-template-columns: 1fr 1fr;
  }
  main.fp-page .ind-stories-2 {
    grid-template-columns: 1fr;
  }
  main.fp-page .ind-stories-2 .fp-storycard {
    flex-direction: column;
  }
  main.fp-page .ind-stories-2 .fp-storycard figure {
    flex: none;
    aspect-ratio: 16/9;
    min-height: 0;
  }
  .ind-doors {
    grid-template-columns: 1fr;
  }
  .ind-door {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    column-gap: 16px;
    align-items: center;
    padding: 14px;
  }
  .ind-door-stage {
    grid-row: span 2;
    height: 150px;
    margin: 0;
  }
  .ind-door-frame {
    transform: scale(0.8);
  }
  .ind-door--slide .ind-door-stage:before {
    width: 120px;
    left: calc(50% - 50px);
    top: calc(50% - 66px);
  }
  .ind-compare {
    grid-template-columns: 1fr;
  }
  .ind-portal-body {
    grid-template-columns: 1fr;
  }
  .ind-grid {
    grid-template-columns: 40px repeat(6, minmax(0, 1fr));
    gap: 4px;
  }
  .ind-bench-wall {
    height: 170px;
  }
  .ind-mod span {
    display: none;
  }
  .ind-bench-sum {
    margin-bottom: 14px;
  }
  main.fp-page .fp-hero--photo .fp-ticks {
    flex-direction: column;
    gap: 8px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .ind-cell:before,
  .ind-cell:after {
    animation: none;
    opacity: 1;
  }
  .ind-door-leaf,
  .ind-sheet tr.is-hit td,
  .ind-lang,
  .ind-crm tr {
    animation: none;
  }
  .ind-mod {
    animation: none;
    opacity: 1;
    transform: none;
  }
}
main.fp-page .fp-try .hm-btns {
  margin: 0;
}
main.fp-page .fp-try a.hm-btn--line.ind-try-line {
  border-color: rgba(255, 255, 255, 0.5);
  color: var(--white);
}
main.fp-page .fp-try a.hm-btn--line.ind-try-line:hover {
  background: var(--white);
  color: var(--ink);
}
main.fp-page .ind-flow {
  margin-top: 22px;
}
main.fp-page .fp-window-body.ind-portal {
  min-height: 0;
  padding: 18px;
}
main.fp-page .fp-split .fp-window {
  box-shadow: 0 30px 70px rgba(16, 22, 43, 0.14);
}
main.fp-page .ind-crm-wrap {
  padding: clamp(18px, 3vw, 36px);
}
main.fp-page .fp-try figure.ind-try-draw {
  display: grid;
  place-items: center;
  background:
    radial-gradient(
      70% 80% at 50% 45%,
      #26336E 0%,
      #141B38 70%);
}
main.fp-page .ind-try-draw .ind-door-stage {
  background: none;
  height: 100%;
  min-height: 320px;
  width: 100%;
  margin: 0;
}
main.fp-page .ind-try-draw .ind-door-frame {
  width: 132px;
  height: 220px;
  border-color: #9DB4FF;
}
main.fp-page .ind-try-draw .ind-door-frame:after {
  content: "";
  position: absolute;
  left: -60px;
  right: -60px;
  bottom: -4px;
  height: 3px;
  background: rgba(157, 180, 255, 0.35);
}
main.fp-page .ind-try-draw .ind-door-leaf {
  border-color: #9DB4FF;
  background:
    linear-gradient(
      115deg,
      rgba(157, 180, 255, 0.45),
      rgba(220, 230, 255, 0.12) 45%,
      rgba(157, 180, 255, 0.4));
}
main.fp-page .ind-try-draw .ind-door-leaf:after {
  background: #9DB4FF;
}
@media (max-width: 1023px) {
  main.fp-page .ind-try-draw .ind-door-stage {
    min-height: 260px;
  }
}
main.fp-page .fp-hero-logos.ind-logo-chip img {
  filter: none;
  opacity: 1;
  height: 48px;
  background: var(--white);
  border-radius: 10px;
  padding: 6px 10px;
}
@media (min-width: 1024px) {
  main.fp-page .ind-story .fp-story-card > img {
    height: 0;
    min-height: 100%;
  }
  main.fp-page .ind-story .fp-story-body {
    min-height: 420px;
  }
}
@media (max-width: 1023px) {
  main.fp-page .ind-story .fp-story-card > img {
    height: auto;
    min-height: 0;
    aspect-ratio: 16/10;
  }
}
.ind-stores {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
}
.ind-store {
  border: 1.5px solid var(--line);
  border-radius: 12px;
  background: var(--white);
  padding: 18px 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  animation: ind-store 9s infinite;
  animation-delay: calc(var(--i) * 1.5s);
}
.ind-store i {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: var(--t1);
  color: var(--b);
  margin-bottom: 4px;
}
.ind-store i svg {
  width: 18px;
  height: 18px;
}
.ind-store b {
  font-family: var(--disp);
  font-size: 18px;
  line-height: 1.2;
}
.ind-store span {
  font-size: 13px;
  color: var(--mute);
}
@keyframes ind-store {
  0%, 14% {
    border-color: var(--b);
    box-shadow: 0 14px 30px rgba(35, 85, 240, 0.12);
  }
  18%, 100% {
    border-color: var(--line);
    box-shadow: none;
  }
}
@media (max-width: 1023px) {
  .ind-stores {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 719px) {
  .ind-stores {
    grid-template-columns: 1fr 1fr;
  }
}
@media (prefers-reduced-motion: reduce) {
  .ind-store {
    animation: none;
  }
}
@media (min-width: 720px) {
  main.fp-page .ind-flow {
    flex-wrap: nowrap;
  }
  main.fp-page .ind-flow .fp-node {
    flex: 1 1 0;
    min-width: 0;
  }
  main.fp-page .ind-flow .fp-link {
    flex: 0 0 28px;
    min-width: 28px;
  }
}
main.fp-page .ind-live .ind-live-tabs .fp-show-tabs {
  margin-bottom: 14px;
}
main.fp-page .ind-live .fp-show-tab {
  padding: 10px 18px;
}
main.fp-page .ind-live .fp-show-tab img {
  height: 24px;
  max-width: 120px;
}
main.fp-page .ind-live .fp-show-tab:after {
  display: none;
}
main.fp-page .ind-live-next {
  margin-top: 24px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px 32px;
  align-items: center;
  background: var(--dark);
  color: var(--white);
  border-radius: 14px;
  padding: 24px 28px;
}
main.fp-page .ind-live-next h3 {
  font-family: var(--disp);
  font-size: clamp(22px, 2vw, 28px);
  line-height: 1.15;
  margin: 0;
  color: var(--white);
}
main.fp-page .ind-live-next div > p {
  margin: 6px 0 0;
  color: rgba(255, 255, 255, 0.75);
  font-size: 15px;
}
main.fp-page .ind-live-also {
  grid-column: 1/-1;
  margin: 0;
  padding-top: 12px;
  border-top: 1px solid var(--darkline);
  font-size: 13px;
  color: rgba(255, 255, 255, 0.6);
}
main.fp-page .ind-live-also a {
  color: rgba(255, 255, 255, 0.85);
  text-decoration: underline;
  text-underline-offset: 3px;
}
main.fp-page .ind-live-also a:hover {
  color: var(--white);
}
@media (max-width: 719px) {
  main.fp-page .ind-live-next {
    grid-template-columns: 1fr;
    padding: 20px;
  }
}
main.fp-page .ind-live-next:target {
  animation: ind-next 1.6s ease;
}
main.fp-page #try-next {
  scroll-margin-top: 120px;
}
@keyframes ind-next {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(91, 128, 255, 0);
  }
  25%, 60% {
    box-shadow: 0 0 0 6px rgba(91, 128, 255, 0.55);
  }
}
@property --sol-p { syntax: "<number>"; inherits: true; initial-value: 100; }
main.fp-page {
}
main.fp-page .sol-ex {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mute);
}
main.fp-page .sol-stories--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
main.fp-page .sol-stories--2 .fp-storycard figure {
  aspect-ratio: 16/9;
}
main.fp-page .sol-stories--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
main.fp-page a.fp-kind {
  display: block;
  color: var(--white);
}
main.fp-page a.fp-kind:after {
  background:
    linear-gradient(
      0deg,
      rgba(10, 14, 30, 0.92),
      rgba(10, 14, 30, 0.35) 55%,
      transparent 80%);
}
main.fp-page .sol-screen + .fp-float--a {
  top: auto;
  bottom: 70px;
}
main.fp-page a.fp-kind em {
  display: block;
  margin-top: 8px;
  font-style: normal;
  font-weight: 700;
  font-size: 13px;
  color: #BFD0FF;
}
main.fp-page .fp-kind small {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.75);
  margin-bottom: 4px;
}
main.fp-page .sol-head-logo {
  height: 34px;
  width: auto;
}
main.fp-page {
}
main.fp-page .sol-spec {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  position: relative;
  counter-reset: sol-spec;
}
main.fp-page .sol-spec:before {
  content: "";
  position: absolute;
  left: 10%;
  right: 10%;
  top: 27px;
  height: 2px;
  background:
    repeating-linear-gradient(
      90deg,
      var(--b) 0 8px,
      transparent 8px 14px);
  opacity: 0.35;
}
main.fp-page .sol-spec-item {
  position: relative;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 56px 18px 20px;
  counter-increment: sol-spec;
  transition: border-color 0.2s ease, transform 0.2s ease;
}
main.fp-page .sol-spec-item:hover {
  border-color: var(--b2);
  transform: translateY(-3px);
}
main.fp-page .sol-spec-item:before {
  content: "0" counter(sol-spec);
  position: absolute;
  left: 18px;
  top: 12px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--b);
  color: var(--white);
  font: 800 12px/1 var(--disp);
  box-shadow: 0 0 0 5px var(--white);
}
main.fp-page .sol-spec-item b {
  display: block;
  font-family: var(--disp);
  font-size: 22px;
  line-height: 1.15;
}
main.fp-page .sol-spec-item p {
  margin: 6px 0 12px;
  font-size: 14px;
  color: var(--mute);
}
main.fp-page .sol-spec-item ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
main.fp-page .sol-spec-item li {
  font-size: 12px;
  font-weight: 700;
  border-radius: 999px;
  padding: 4px 10px;
  background: var(--paper);
}
main.fp-page .sol-spec-out {
  margin-top: 20px;
  background: var(--dark);
  border-radius: 14px;
  padding: clamp(18px, 2.4vw, 28px);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 20px;
  align-items: center;
  color: var(--white);
}
main.fp-page .sol-spec-out > p {
  margin: 0;
  font-family: var(--disp);
  font-size: 20px;
  line-height: 1.2;
  max-width: 14ch;
}
main.fp-page .sol-spec-out .fp-node {
  background: var(--dark2);
  border-color: var(--darkline);
  color: var(--white);
  box-shadow: none;
}
main.fp-page .sol-spec-out .fp-node span {
  color: rgba(255, 255, 255, 0.65);
}
main.fp-page .sol-spec-out .fp-node.is-core {
  background: var(--b);
  border-color: var(--b);
}
main.fp-page {
}
main.fp-page .sol-clock {
  background: var(--dark);
  color: var(--white);
  border-radius: 18px;
  padding: clamp(22px, 3vw, 36px);
  display: grid;
  gap: 22px;
  box-shadow: 0 30px 70px rgba(16, 22, 43, 0.22);
  position: relative;
  overflow: hidden;
}
main.fp-page .sol-clock:before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      60% 50% at 80% 0%,
      rgba(91, 128, 255, 0.28),
      transparent 70%);
  pointer-events: none;
}
main.fp-page .sol-clock-top {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.7);
}
main.fp-page .sol-clock-top img {
  height: 22px;
  width: auto;
  filter: brightness(0) invert(1);
  opacity: 0.9;
}
main.fp-page .sol-dial {
  position: relative;
  width: min(230px, 62%);
  aspect-ratio: 1;
  margin-inline: auto;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: conic-gradient(#2FD98A calc(var(--sol-p) * 1%), rgba(255, 255, 255, 0.1) 0);
  animation: sol-dial 7s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}
main.fp-page .sol-dial:before {
  content: "";
  position: absolute;
  inset: 12px;
  border-radius: 50%;
  background: var(--dark);
}
main.fp-page .sol-dial:after {
  content: "";
  position: absolute;
  left: 50%;
  top: -10px;
  width: 16px;
  height: 12px;
  margin-left: -8px;
  border-radius: 4px 4px 0 0;
  background: rgba(255, 255, 255, 0.25);
}
main.fp-page .sol-dial div {
  position: relative;
  text-align: center;
}
main.fp-page .sol-dial b {
  display: block;
  font-family: var(--disp);
  font-size: clamp(40px, 4.4vw, 56px);
  letter-spacing: -0.03em;
  line-height: 1;
}
main.fp-page .sol-dial span {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.7);
}
main.fp-page .sol-laps {
  position: relative;
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
main.fp-page .sol-laps li {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  background: var(--dark2);
  border: 1px solid var(--darkline);
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 14px;
  animation: sol-lap 7s ease infinite;
  animation-delay: calc(var(--i) * 1.4s);
}
main.fp-page .sol-laps i {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-style: normal;
  font-weight: 800;
  font-size: 13px;
  background: rgba(47, 217, 138, 0.16);
  color: #2FD98A;
}
main.fp-page .sol-laps b {
  display: block;
  font-size: 14px;
}
main.fp-page .sol-laps span {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.6);
}
main.fp-page {
}
main.fp-page .sol-vs {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1fr);
  gap: 0;
  align-items: stretch;
}
main.fp-page .sol-vs-col {
  border-radius: 14px;
  padding: clamp(20px, 2.6vw, 32px);
  display: flex;
  flex-direction: column;
  gap: 14px;
}
main.fp-page .sol-vs-col h3 {
  margin: 0;
  font-family: var(--disp);
  font-size: clamp(22px, 2vw, 28px);
  line-height: 1.15;
}
main.fp-page .sol-vs-col > small {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
main.fp-page .sol-vs-col ol {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}
main.fp-page .sol-vs-col li {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 15px;
  line-height: 1.45;
}
main.fp-page .sol-vs-col li i {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-style: normal;
  font-weight: 800;
  font-size: 14px;
}
main.fp-page .sol-vs-col li b {
  display: block;
}
main.fp-page .sol-vs-col li span {
  font-size: 13px;
}
main.fp-page .sol-vs-old {
  background: var(--paper);
  color: #3A3D46;
}
main.fp-page .sol-vs-old > small {
  color: #B4462E;
}
main.fp-page .sol-vs-old li {
  background: var(--white);
  border: 1px dashed #E2C9C2;
}
main.fp-page .sol-vs-old li i {
  background: #FBE9E4;
  color: #B4462E;
}
main.fp-page .sol-vs-old li span {
  color: var(--mute);
}
main.fp-page .sol-vs-new {
  background: var(--b);
  color: var(--white);
  box-shadow: 0 24px 50px rgba(35, 85, 240, 0.25);
}
main.fp-page .sol-vs-new > small {
  color: #BFD0FF;
}
main.fp-page .sol-vs-new li {
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.18);
}
main.fp-page .sol-vs-new li i {
  background: var(--white);
  color: var(--b);
}
main.fp-page .sol-vs-new li span {
  color: rgba(255, 255, 255, 0.78);
}
main.fp-page .sol-vs-arrow {
  display: grid;
  place-items: center;
}
main.fp-page .sol-vs-arrow span {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--white);
  border: 1px solid var(--line);
  color: var(--b);
  font-weight: 800;
  box-shadow: 0 10px 24px rgba(16, 22, 43, 0.1);
  animation: sol-nudge 2.4s ease-in-out infinite;
}
main.fp-page .sol-vs-foot {
  margin: auto 0 0;
  padding-top: 4px;
  font-weight: 700;
}
main.fp-page .sol-vs-old .sol-vs-foot {
  color: #B4462E;
}
main.fp-page {
}
main.fp-page .sol-screen {
  position: relative;
  padding-bottom: 44px;
}
main.fp-page .sol-screen-frame {
  position: relative;
  border-radius: 16px;
  background: #0B0F1E;
  padding: 12px;
  box-shadow: 0 34px 70px rgba(16, 22, 43, 0.28);
}
main.fp-page .sol-screen-view {
  position: relative;
  border-radius: 8px;
  overflow: hidden;
  aspect-ratio: 16/10;
}
main.fp-page .sol-screen-view > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  animation: sol-pan 16s ease-in-out infinite alternate;
}
main.fp-page .sol-screen-view:after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      90deg,
      transparent 45%,
      rgba(10, 14, 30, 0.55));
}
main.fp-page .sol-screen-tag {
  position: absolute;
  left: 14px;
  top: 14px;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255, 255, 255, 0.94);
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 12px;
  font-weight: 700;
}
main.fp-page .sol-screen-tag:before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2FD98A;
  box-shadow: 0 0 0 4px rgba(47, 217, 138, 0.2);
}
main.fp-page .sol-screen-ui {
  position: absolute;
  right: 14px;
  top: 14px;
  bottom: 14px;
  z-index: 1;
  width: min(210px, 42%);
  background: rgba(255, 255, 255, 0.96);
  border-radius: 10px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: 12px;
}
main.fp-page .sol-screen-ui > b {
  font-family: var(--disp);
  font-size: 15px;
  line-height: 1.2;
}
main.fp-page .sol-screen-opt small {
  display: block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
  margin-bottom: 4px;
}
main.fp-page .sol-screen-opt div {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
main.fp-page .sol-screen-opt span {
  border: 1.5px solid var(--line);
  border-radius: 6px;
  padding: 3px 7px;
  font-weight: 600;
}
main.fp-page .sol-screen-opt span.is-on {
  border-color: var(--b);
  background: var(--t1);
  color: var(--b);
}
main.fp-page .sol-screen-price {
  margin-top: auto;
  border-top: 1px solid var(--line);
  padding-top: 10px;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
}
main.fp-page .sol-screen-price b {
  color: var(--ok);
}
main.fp-page .sol-screen-stand {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 120px;
  height: 44px;
  margin-left: -60px;
  background: linear-gradient(#1A2240, #0B0F1E);
  clip-path: polygon(38% 0, 62% 0, 70% 78%, 100% 78%, 100% 100%, 0 100%, 0 78%, 30% 78%);
}
main.fp-page {
}
main.fp-page .sol-acct-body {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  min-height: 0;
}
main.fp-page .sol-acct-nav {
  background: var(--paper);
  border-right: 1px solid var(--line);
  padding: 16px 10px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 13px;
  font-weight: 600;
}
main.fp-page .sol-acct-nav b {
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
  padding: 0 10px 8px;
}
main.fp-page .sol-acct-nav span {
  border-radius: 7px;
  padding: 8px 10px;
  color: #3A3D46;
}
main.fp-page .sol-acct-nav span.is-on {
  background: var(--white);
  color: var(--b);
  box-shadow: 0 1px 0 var(--line), 0 0 0 1px var(--line);
}
main.fp-page .sol-acct-main {
  padding: 18px 20px;
  display: grid;
  gap: 12px;
  align-content: start;
}
main.fp-page .sol-acct-hi {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
main.fp-page .sol-acct-hi p {
  margin: 0;
  font-family: var(--disp);
  font-size: 19px;
}
main.fp-page .sol-acct-terms {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
main.fp-page .sol-acct-terms span {
  font-size: 11px;
  font-weight: 700;
  border-radius: 999px;
  padding: 4px 9px;
  background: var(--t1);
  color: var(--b);
}
main.fp-page .sol-acct-orders {
  list-style: none;
  margin: 0;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
}
main.fp-page .sol-acct-orders li {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  font-size: 13px;
  border-top: 1px solid var(--line);
}
main.fp-page .sol-acct-orders li:first-child {
  border-top: 0;
}
main.fp-page .sol-acct-orders img {
  width: 44px;
  height: 44px;
  border-radius: 6px;
  object-fit: cover;
}
main.fp-page .sol-acct-orders b {
  display: block;
  font-size: 13px;
}
main.fp-page .sol-acct-orders small {
  color: var(--mute);
}
main.fp-page .sol-st {
  font-size: 11px;
  font-weight: 700;
  border-radius: 999px;
  padding: 4px 9px;
  white-space: nowrap;
  background: var(--paper);
}
main.fp-page .sol-st--ok {
  background: #E3F6EC;
  color: var(--ok);
}
main.fp-page .sol-st--run {
  background: var(--t1);
  color: var(--b);
}
main.fp-page .sol-acct-new {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  border-radius: 10px;
  padding: 12px 14px;
  background: var(--b);
  color: var(--white);
  font-size: 13px;
  font-weight: 700;
}
main.fp-page .sol-acct-new span {
  opacity: 0.8;
  font-weight: 600;
}
main.fp-page .sol-mock {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 14px 16px;
  display: grid;
  gap: 8px;
  font-size: 14px;
}
main.fp-page .sol-mock-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}
main.fp-page .sol-mock-row span {
  color: var(--mute);
}
main.fp-page {
}
main.fp-page .sol-market .fp-window-body {
  padding: 0;
  min-height: 0;
}
main.fp-page .sol-market-img {
  position: relative;
  aspect-ratio: 16/9;
  overflow: hidden;
  background: var(--paper);
}
main.fp-page .sol-market-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
main.fp-page .sol-market-copy {
  padding: 18px 20px 20px;
  display: grid;
  gap: 14px;
}
main.fp-page .sol-swap {
  position: relative;
  display: grid;
}
main.fp-page .sol-swap > * {
  grid-area: 1/1;
  animation: sol-swap 12s infinite;
  animation-delay: calc(var(--i) * 3s);
  opacity: 0;
}
main.fp-page .sol-swap > :first-child {
  opacity: 1;
}
main.fp-page .sol-market-h {
  font-family: var(--disp);
  font-size: clamp(20px, 2vw, 26px);
  line-height: 1.15;
  margin: 0;
}
main.fp-page .sol-market-row {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mute);
}
main.fp-page .sol-market-row .fp-pills span {
  font-size: 13px;
  padding: 5px 11px;
  letter-spacing: 0;
  text-transform: none;
}
main.fp-page .sol-pack {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  border-radius: 18px;
  overflow: hidden;
  background: var(--dark);
  color: var(--white);
}
main.fp-page .sol-pack-price {
  padding: clamp(28px, 4vw, 48px);
  background: var(--b);
  display: flex;
  flex-direction: column;
  gap: 12px;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
main.fp-page .sol-pack-price:before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      70% 90% at 100% 0%,
      rgba(255, 255, 255, 0.18),
      transparent 60%);
}
main.fp-page .sol-pack-price > * {
  position: relative;
}
main.fp-page .sol-pack-price small {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #BFD0FF;
}
main.fp-page .sol-pack-price h3 {
  margin: 0;
  font-family: var(--disp);
  font-size: clamp(26px, 2.6vw, 34px);
  color: var(--white);
}
main.fp-page .sol-pack-price p {
  margin: 0;
  color: rgba(255, 255, 255, 0.85);
}
main.fp-page .sol-pack-amount {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
main.fp-page .sol-pack-amount b {
  font-family: var(--disp);
  font-size: clamp(44px, 5vw, 64px);
  letter-spacing: -0.03em;
  line-height: 1;
}
main.fp-page .sol-pack-amount span {
  color: rgba(255, 255, 255, 0.8);
}
main.fp-page .sol-pack-list {
  padding: clamp(28px, 4vw, 48px);
  display: grid;
  gap: 18px;
  align-content: center;
}
main.fp-page .sol-pack-list ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 20px;
  font-size: 15px;
}
main.fp-page .sol-pack-list li {
  display: flex;
  gap: 10px;
  color: rgba(255, 255, 255, 0.85);
}
main.fp-page .sol-pack-list li:before {
  content: "\2713";
  color: #2FD98A;
  font-weight: 800;
}
main.fp-page .sol-pack-list p {
  margin: 0;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.55);
}
main.fp-page .sol-pack a.hm-btn--white {
  justify-self: start;
  background: var(--white);
  color: var(--b);
}
main.fp-page {
}
main.fp-page .sol-code {
  background: #0B1020;
  color: #DDE5FF;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 30px 70px rgba(16, 22, 43, 0.28);
  font:
    13px/1.6 ui-monospace,
    SFMono-Regular,
    Consolas,
    monospace;
}
main.fp-page .sol-code-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  background: #141A33;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  font-family: var(--body);
  font-size: 12px;
  color: rgba(255, 255, 255, 0.55);
}
main.fp-page .sol-code-bar .fp-window-dots i {
  background: rgba(255, 255, 255, 0.18);
}
main.fp-page .sol-calls {
  list-style: none;
  margin: 0;
  padding: 14px 0;
}
main.fp-page .sol-calls li {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 7px 18px;
  animation: sol-call 8s ease infinite;
  animation-delay: calc(var(--i) * 1.1s);
}
main.fp-page .sol-calls li span {
  color: rgba(255, 255, 255, 0.4);
  font-size: 12px;
}
main.fp-page .sol-calls code {
  color: #DDE5FF;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
main.fp-page .sol-m {
  display: inline-block;
  text-align: center;
  border-radius: 5px;
  padding: 2px 0;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.04em;
}
main.fp-page .sol-m--get {
  background: rgba(47, 217, 138, 0.24);
  color: #8AF5C2;
}
main.fp-page .sol-m--post {
  background: rgba(91, 128, 255, 0.36);
  color: #D3DEFF;
}
main.fp-page .sol-m--patch {
  background: rgba(255, 200, 107, 0.26);
  color: #FFD995;
}
main.fp-page .sol-m--put {
  background: rgba(255, 140, 200, 0.14);
  color: #FF9FD0;
}
main.fp-page .sol-code-foot {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  font-family: var(--body);
  font-size: 12px;
  color: rgba(255, 255, 255, 0.55);
}
main.fp-page .sol-code-foot b {
  color: #5CE6A6;
}
main.fp-page .sol-ends {
  list-style: none;
  margin: 0;
  padding: 0;
  background: #0B1020;
  border-radius: 10px;
  padding: 10px 0;
  font:
    13px/1.5 ui-monospace,
    SFMono-Regular,
    Consolas,
    monospace;
}
main.fp-page .sol-ends li {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 6px 16px;
  color: #DDE5FF;
}
main.fp-page .sol-ends code {
  word-break: break-all;
}
main.fp-page .sol-stack {
  display: grid;
  gap: 10px;
}
main.fp-page .sol-tier {
  border-radius: 12px;
  padding: 16px 18px;
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
}
main.fp-page .sol-tier > b {
  font-family: var(--disp);
  font-size: 17px;
  line-height: 1.2;
}
main.fp-page .sol-tier > b small {
  display: block;
  font: 600 12px/1.4 var(--body);
  opacity: 0.7;
  margin-top: 2px;
}
main.fp-page .sol-tier ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
main.fp-page .sol-tier li {
  font-size: 13px;
  font-weight: 700;
  border-radius: 8px;
  padding: 6px 10px;
}
main.fp-page .sol-tier--front {
  background: var(--white);
  border: 1px solid var(--line);
}
main.fp-page .sol-tier--front li {
  background: var(--paper);
}
main.fp-page .sol-tier--api {
  background: var(--t1);
  border: 1px dashed var(--b2);
  color: var(--b);
}
main.fp-page .sol-tier--api li {
  background: var(--white);
}
main.fp-page .sol-tier--core {
  background: var(--b);
  color: var(--white);
  box-shadow: 0 20px 44px rgba(35, 85, 240, 0.25);
}
main.fp-page .sol-tier--core li {
  background: rgba(255, 255, 255, 0.14);
}
main.fp-page .sol-wire {
  height: 26px;
  display: flex;
  justify-content: center;
  gap: 28%;
}
main.fp-page .sol-wire i {
  width: 2px;
  height: 100%;
  background:
    repeating-linear-gradient(
      180deg,
      var(--b) 0 6px,
      transparent 6px 11px);
  background-size: 2px 22px;
  animation: fp-dash-y 1s linear infinite;
  opacity: 0.6;
}
main.fp-page .sol-wire i:nth-child(2) {
  animation-direction: reverse;
}
main.fp-page {
}
main.fp-page .sol-cpq {
  display: grid;
  gap: 12px;
  position: relative;
}
main.fp-page .sol-cpq-card {
  position: relative;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px 18px 16px 70px;
  box-shadow: 0 14px 34px rgba(16, 22, 43, 0.08);
  animation: sol-stage 9s ease infinite;
  animation-delay: calc(var(--i) * 3s);
}
main.fp-page .sol-cpq-card:before {
  content: attr(data-l);
  position: absolute;
  left: 16px;
  top: 16px;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: var(--b);
  color: var(--white);
  font: 800 18px/1 var(--disp);
}
main.fp-page .sol-cpq-card h4 {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
}
main.fp-page .sol-cpq-card .hm-seg {
  margin-bottom: 6px;
}
main.fp-page .sol-opts {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin: 0 0 6px;
}
main.fp-page .sol-opts span {
  border: 1.5px solid var(--line);
  border-radius: 6px;
  padding: 4px 9px;
  font-size: 13px;
  font-weight: 600;
}
main.fp-page .sol-opts span.is-on {
  border-color: var(--b);
  background: var(--t1);
  color: var(--b);
}
main.fp-page .sol-opts span.is-off {
  opacity: 0.4;
  text-decoration: line-through;
}
main.fp-page .sol-rule {
  margin: 6px 0 0;
  font-size: 12px;
  font-weight: 600;
  color: #8A5A00;
  display: flex;
  gap: 6px;
  align-items: flex-start;
}
main.fp-page .sol-rule:before {
  content: "\2691";
}
main.fp-page .sol-cpq-line {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 14px;
  padding: 3px 0;
}
main.fp-page .sol-cpq-line span:last-child {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
main.fp-page .sol-cpq-line.is-total {
  border-top: 1px solid var(--line);
  margin-top: 4px;
  padding-top: 7px;
}
main.fp-page .sol-cpq-quote {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
main.fp-page .sol-guide {
  display: grid;
  gap: 14px;
}
main.fp-page .sol-guide .sol-mock {
  max-width: 520px;
}
@media (max-width: 1199px) {
  main.fp-page .sol-stories--4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 1023px) {
  main.fp-page .sol-spec {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  main.fp-page .sol-spec:before {
    display: none;
  }
  main.fp-page .sol-vs {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  main.fp-page .sol-vs-arrow span {
    transform: rotate(90deg);
    animation: none;
  }
  main.fp-page .sol-pack {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 719px) {
  main.fp-page .sol-stories--2,
  main.fp-page .sol-stories--4 {
    grid-template-columns: 1fr;
  }
  main.fp-page .sol-spec {
    grid-template-columns: 1fr 1fr;
  }
  main.fp-page .sol-spec-item {
    padding: 50px 14px 16px;
  }
  main.fp-page .sol-spec-item b {
    font-size: 19px;
  }
  main.fp-page .sol-spec-item:last-child {
    grid-column: 1/-1;
  }
  main.fp-page .sol-spec-out {
    grid-template-columns: 1fr;
  }
  main.fp-page .sol-spec-out > p {
    max-width: none;
  }
  main.fp-page .sol-acct-body {
    grid-template-columns: 1fr;
  }
  main.fp-page .sol-acct-nav {
    flex-direction: row;
    overflow-x: auto;
    border-right: 0;
    border-bottom: 1px solid var(--line);
    padding: 8px;
    scrollbar-width: none;
  }
  main.fp-page .sol-acct-nav b {
    display: none;
  }
  main.fp-page .sol-acct-nav span {
    flex: none;
  }
  main.fp-page .sol-acct-main {
    padding: 14px;
  }
  main.fp-page .sol-acct-orders li {
    grid-template-columns: 40px minmax(0, 1fr);
  }
  main.fp-page .sol-acct-orders li .sol-st {
    grid-column: 2;
    justify-self: start;
  }
  main.fp-page .sol-screen {
    padding-bottom: 0;
  }
  main.fp-page .sol-screen-stand {
    display: none;
  }
  main.fp-page .sol-screen + .fp-float--a {
    bottom: 0;
  }
  main.fp-page .sol-screen-view {
    aspect-ratio: auto;
    display: flex;
    flex-direction: column;
  }
  main.fp-page .sol-screen-view > img {
    position: relative;
    height: 200px;
  }
  main.fp-page .sol-screen-ui {
    position: relative;
    right: auto;
    top: auto;
    bottom: auto;
    width: auto;
    border-radius: 0;
    padding-bottom: 52px;
  }
  main.fp-page .sol-screen-view:after {
    display: none;
  }
  main.fp-page .sol-pack-list ul {
    grid-template-columns: 1fr;
  }
  main.fp-page .sol-tier {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  main.fp-page .sol-calls li {
    grid-template-columns: 54px minmax(0, 1fr);
    padding: 7px 14px;
  }
  main.fp-page .sol-calls li > span:last-child {
    display: none;
  }
  main.fp-page .sol-cpq-card {
    padding: 14px 14px 14px 62px;
  }
  main.fp-page .sol-cpq-card:before {
    left: 12px;
    top: 14px;
    width: 36px;
    height: 36px;
  }
}
@media (prefers-reduced-motion: reduce) {
  main.fp-page .sol-dial,
  main.fp-page .sol-laps li,
  main.fp-page .sol-vs-arrow span,
  main.fp-page .sol-screen-view > img,
  main.fp-page .sol-swap > *,
  main.fp-page .sol-calls li,
  main.fp-page .sol-cpq-card,
  main.fp-page .sol-wire i {
    animation: none;
  }
  main.fp-page .sol-swap > :not(:first-child) {
    opacity: 0;
  }
}
@keyframes sol-dial {
  0% {
    --sol-p:0;
  }
  55%, 92% {
    --sol-p:100;
  }
  100% {
    --sol-p:100;
  }
}
@keyframes sol-lap {
  0%, 8% {
    opacity: 0.35;
    transform: translateX(-6px);
  }
  14%, 92% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0.35;
  }
}
@keyframes sol-nudge {
  50% {
    transform: translateX(5px);
  }
}
@keyframes sol-pan {
  from {
    transform: scale(1.04) translateX(0);
  }
  to {
    transform: scale(1.1) translateX(-3%);
  }
}
@keyframes sol-swap {
  0% {
    opacity: 0;
    transform: translateY(8px);
  }
  4%, 23% {
    opacity: 1;
    transform: none;
  }
  27%, 100% {
    opacity: 0;
    transform: translateY(-8px);
  }
}
@keyframes sol-call {
  0%, 6% {
    opacity: 0.35;
  }
  10%, 90% {
    opacity: 1;
  }
  100% {
    opacity: 0.35;
  }
}
@keyframes sol-stage {
  0%, 30% {
    border-color: var(--b);
    box-shadow: 0 0 0 3px rgba(35, 85, 240, 0.18), 0 18px 40px rgba(35, 85, 240, 0.16);
  }
  36%, 100% {
    border-color: var(--line);
    box-shadow: 0 14px 34px rgba(16, 22, 43, 0.08);
  }
}
main.fp-page .sol-pdp .fp-window-body {
  padding: 0;
  min-height: 0;
}
main.fp-page .sol-pdp-img {
  margin: 0;
  aspect-ratio: 16/8;
  overflow: hidden;
}
main.fp-page .sol-pdp-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
main.fp-page .sol-pdp-body {
  padding: 18px 22px 20px;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: 8px 24px;
  align-items: end;
}
main.fp-page .sol-pdp-body .fp-product-name {
  grid-column: 1/-1;
  margin: 0;
}
main.fp-page .sol-pdp-body .fp-buy {
  margin: 0;
  border: 0;
  padding: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}
@media (max-width: 719px) {
  main.fp-page .sol-pdp-body {
    grid-template-columns: 1fr;
  }
}
main.fp-page.cs-story {
  --line:#E5E5E5;
  --mute:#666666;
}
main.fp-page .cs-section a:not(.cs-btn):not(.hm-btn) {
  color: var(--b);
}
main.fp-page .cs-section a:not(.cs-btn):not(.hm-btn):hover {
  color: var(--bh);
}
main.fp-page .cs-hero {
  position: relative;
  overflow: hidden;
}
main.fp-page .cs-hero-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  display: block;
}
main.fp-page .cs-hero-photos {
  overflow: hidden;
}
main.fp-page .cs-hero-photos img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform-origin: 70% 50%;
  animation: cs-hero-zoom 18s ease-in-out infinite alternate;
}
main.fp-page .cs-hero-photos img + img {
  opacity: 0;
  animation: cs-hero-zoom 18s ease-in-out infinite alternate-reverse, cs-hero-fade 18s ease-in-out infinite;
}
@keyframes cs-hero-zoom {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(1.12);
  }
}
@keyframes cs-hero-fade {
  0%, 40% {
    opacity: 0;
  }
  50%, 90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  main.fp-page .cs-hero-photos img {
    animation: none;
  }
}
main.fp-page .cs-hero:before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(
      90deg,
      rgba(244, 246, 254, 0.97) 0%,
      rgba(244, 246, 254, 0.92) 42%,
      rgba(244, 246, 254, 0.45) 72%,
      rgba(244, 246, 254, 0.2) 100%);
}
main.fp-page .cs-hero > .cs-wrap {
  position: relative;
  z-index: 2;
}
main.fp-page .cs-hero .fp-crumbs {
  margin-bottom: 32px;
  font-weight: 400;
}
main.fp-page .cs-hero .fp-crumbs a {
  color: var(--b);
}
main.fp-page .cs-hero .fp-crumbs a:hover {
  color: var(--bh);
}
main.fp-page .cs-hero .fp-crumbs b {
  color: var(--mute);
  font-weight: 400;
}
main.fp-page .cs-hero .cs-lede--first {
  margin-bottom: 14px;
}
main.fp-page .cs-logo-card {
  box-shadow: 0 12px 32px rgba(20, 30, 60, 0.12);
}
main.fp-page .cs-logo-card img {
  width: min(100%, 340px);
  height: auto;
  max-height: 150px;
  object-fit: contain;
}
main.fp-page .cs-logo-card p {
  line-height: 1.55;
}
main.fp-page .cs-logo-card .cs-btn {
  margin-top: 4px;
}
main.fp-page .cs-tags li:has(a) {
  padding: 0;
}
main.fp-page .cs-tags a {
  display: block;
  padding: 6px 14px;
  color: var(--b);
  border-radius: 999px;
}
main.fp-page .cs-tags li:has(a):hover {
  border-color: var(--b);
}
@media (max-width: 743px) {
  main.fp-page .cs-hero-video {
    display: none;
  }
}
main.fp-page a.cs-btn {
  transition: background 0.15s ease, border-color 0.15s ease;
}
main.fp-page a.cs-btn--p {
  background: var(--b);
  color: var(--white);
}
main.fp-page a.cs-btn--p:hover {
  background: var(--bh);
  color: var(--white);
}
main.fp-page a.cs-btn--s {
  border: 1px solid #555;
  color: var(--white);
}
main.fp-page a.cs-btn--s:hover {
  border-color: var(--white);
  color: var(--white);
}
main.fp-page .cs-store-photo {
  margin: 24px 0 0;
}
main.fp-page .cs-store-photo img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 8px;
}
main.fp-page .cs-store-photo figcaption {
  margin-top: 8px;
  font-size: 13px;
  color: var(--mute);
}
main.fp-page .cs-try {
  padding-bottom: 0;
}
main.fp-page .cs-try .fp-try {
  min-height: 360px;
}
main.fp-page .cs-eyebrow--light {
  color: #9DB4FF;
  margin: 0;
}
main.fp-page .cs-sol a {
  color: var(--ink);
}
main.fp-page .cs-sol a:hover {
  border-color: var(--b);
  box-shadow: 0 4px 12px rgba(25, 25, 25, 0.08);
  color: var(--ink);
}
main.fp-page .cs-sol .go {
  color: var(--b);
}
main.fp-page .cs-more-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}
main.fp-page .cs-more-head h2 {
  margin: 0;
}
main.fp-page .cs-more .cs-more-head a {
  display: inline;
  border: 0;
  padding: 0;
  font-weight: 700;
  font-size: 15px;
  color: var(--b);
}
main.fp-page .cs-more-head a:hover {
  color: var(--bh);
}
main.fp-page .cs-more-grid a {
  transition: border-color 0.15s ease, transform 0.15s ease;
}
main.fp-page .cs-more-grid a:hover {
  transform: translateY(-2px);
}
main.fp-page .cs-more .t {
  color: var(--ink);
}
@media (max-width: 719px) {
  main.fp-page .cs-try .fp-try {
    min-height: 0;
  }
}
main.fp-page .st-mosaic {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
main.fp-page .st-mosaic a {
  position: relative;
  display: block;
  border-radius: 12px;
  overflow: hidden;
  aspect-ratio: 4/3;
  background: var(--paper);
  box-shadow: 0 18px 44px rgba(16, 22, 43, 0.12);
}
main.fp-page .st-mosaic a:nth-child(2),
main.fp-page .st-mosaic a:nth-child(4) {
  transform: translateY(28px);
}
main.fp-page .st-mosaic a > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}
main.fp-page .st-mosaic a:hover > img {
  transform: scale(1.05);
}
main.fp-page .st-logo {
  position: absolute;
  left: 12px;
  bottom: 12px;
  display: flex;
  align-items: center;
  height: 36px;
  padding: 7px 12px;
  background: rgba(255, 255, 255, 0.94);
  border-radius: 8px;
  box-shadow: 0 6px 16px rgba(16, 22, 43, 0.12);
}
main.fp-page .st-logo img {
  position: static;
  display: block;
  height: 100%;
  width: auto;
  max-width: 120px;
  object-fit: contain;
  transform: none !important;
}
main.fp-page.st-page .fp-visual {
  padding-bottom: 64px;
}
main.fp-page.st-page .fp-float--a {
  top: -6px;
  left: -20px;
}
main.fp-page.st-page .fp-float--b {
  bottom: 8px;
}
main.fp-page.st-page .fp-float i {
  width: auto;
  min-width: 34px;
  padding: 0 6px;
  font-size: 13px;
}
main.fp-page .st-cards {
  gap: 20px;
}
main.fp-page a.st-card figure {
  position: relative;
  aspect-ratio: 16/10;
}
main.fp-page .st-card .st-logo {
  height: 38px;
}
main.fp-page .fp-storycard .st-logo {
  padding: 7px 12px;
}
main.fp-page .st-card > div > span {
  font-size: 15px;
}
main.fp-page .st-note {
  margin: 0;
  font-size: 13px;
  color: var(--mute);
}
@media (max-width: 719px) {
  main.fp-page.st-page .fp-float--a {
    left: 0;
  }
  main.fp-page .st-mosaic {
    gap: 8px;
  }
  main.fp-page .st-mosaic a:nth-child(2),
  main.fp-page .st-mosaic a:nth-child(4) {
    transform: translateY(16px);
  }
  main.fp-page .st-mosaic .st-logo {
    height: 28px;
    padding: 5px 8px;
    left: 8px;
    bottom: 8px;
  }
}
main.fp-page .st-card .st-logo--tall {
  height: 58px;
  padding: 6px 10px;
}
main.fp-page .cs-try img[src*="home/different-doors"] {
  object-position: center 15%;
}
main.fp-page .ft-shot {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 10px;
  background: var(--white);
  box-shadow: 0 0 0 1px var(--line);
}
main.fp-page .co-shot img {
  aspect-ratio: 4/3;
  object-fit: cover;
}
main.fp-page .co-portrait {
  max-width: 420px;
  margin-inline: auto;
}
main.fp-page .co-portrait img {
  aspect-ratio: 4/5;
  object-fit: cover;
  object-position: 50% 20%;
}
main.fp-page .co-apply-h {
  font-size: clamp(24px, 2.4vw, 32px);
  margin: 8px 0 24px;
}
main.fp-page .co-photos {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: clamp(140px, 16vw, 220px);
  gap: 12px;
}
main.fp-page .co-photos figure {
  margin: 0;
  border-radius: 10px;
  overflow: hidden;
  background: var(--paper);
}
main.fp-page .co-photos figure:nth-child(1),
main.fp-page .co-photos figure:nth-child(6) {
  grid-column: span 2;
  grid-row: span 2;
}
main.fp-page .co-photos img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}
main.fp-page .co-photos figure:hover img {
  transform: scale(1.04);
}
main.fp-page .co-quote {
  flex-direction: row;
  align-items: flex-start;
  gap: 20px;
}
main.fp-page .co-quote img {
  flex: none;
  width: 88px;
  height: 88px;
  border-radius: 50%;
  object-fit: cover;
  object-position: 50% 20%;
  background: var(--paper);
}
main.fp-page .co-quote blockquote {
  margin: 0;
  display: grid;
  gap: 12px;
}
main.fp-page .co-quote blockquote p {
  margin: 0;
  color: #3A3D46;
}
main.fp-page .co-quote cite {
  font-style: normal;
  font-weight: 700;
  font-size: 14px;
  color: var(--b);
}
main.fp-page .co-people {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
main.fp-page .co-person {
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  background: var(--white);
  display: flex;
  flex-direction: column;
}
main.fp-page .co-person figure {
  margin: 0;
  aspect-ratio: 1;
  background: var(--paper);
  display: grid;
  place-items: center;
}
main.fp-page .co-person figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 20%;
  display: block;
}
main.fp-page .co-person figure span {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--b);
  color: var(--white);
  font: 800 30px/1 var(--disp);
}
main.fp-page .co-person > div {
  padding: 16px 18px 18px;
  display: grid;
  gap: 8px;
}
main.fp-page .co-person b {
  font-family: var(--disp);
  font-size: 18px;
  line-height: 1.25;
}
main.fp-page .co-person b a {
  color: var(--ink);
}
main.fp-page .co-person b a:hover {
  color: var(--b);
}
main.fp-page .co-person ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
main.fp-page .co-person li a {
  display: inline-block;
  font-size: 13px;
  font-weight: 700;
  border-radius: 999px;
  padding: 5px 11px;
  background: var(--paper);
  color: var(--ink);
  transition: background 0.15s ease, color 0.15s ease;
}
main.fp-page .co-person li a:hover {
  background: var(--t1);
  color: var(--b);
}
main.fp-page .co-az {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
}
main.fp-page .co-az a {
  display: grid;
  place-items: center;
  min-width: 36px;
  height: 36px;
  border-radius: 8px;
  border: 1px solid var(--line);
  font-weight: 700;
  font-size: 14px;
  color: var(--ink);
  text-decoration: none;
}
main.fp-page .co-az a:hover {
  border-color: var(--b);
  color: var(--b);
}
main.fp-page .co-terms {
  margin: 0 0 8px;
}
main.fp-page .co-terms dt {
  font-family: var(--disp);
  font-size: 20px;
  line-height: 1.3;
  color: var(--ink);
  margin: 26px 0 6px;
}
main.fp-page .co-terms dd {
  margin: 0;
}
main.fp-page .co-terms dd p {
  margin: 0 0 10px;
}
main.fp-page .co-terms dd figure {
  margin: 12px 0 4px;
}
@media (max-width: 1023px) {
  main.fp-page .co-photos {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  main.fp-page .co-photos figure:nth-child(6) {
    grid-column: auto;
    grid-row: auto;
  }
  main.fp-page .co-photos figure:last-child {
    grid-column: span 2;
  }
  main.fp-page .co-people {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 719px) {
  main.fp-page .co-quote {
    flex-direction: column;
  }
  main.fp-page .co-quote img {
    width: 72px;
    height: 72px;
  }
}
@media (max-width: 479px) {
  main.fp-page .co-people {
    grid-template-columns: 1fr;
  }
}
main.fp-page .co-cards .fp-storycard figure {
  aspect-ratio: 16/9;
}
main.fp-page .co-cards--art .fp-storycard figure img {
  object-fit: contain;
  padding: 12px 0 0;
}
@media (max-width: 719px) {
  main.fp-page .fp-pair.co-cards {
    grid-template-columns: 1fr;
  }
}
main.fp-page .docs-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
main.fp-page .docs-grid a.fp-res-card {
  min-height: 0;
  padding: 22px 44px 22px 22px;
}
main.fp-page .docs-grid .fp-res-card b {
  font-size: 19px;
}
main.fp-page .docs-ico {
  background: var(--t2);
}
main.fp-page .docs-ico img {
  width: 28px;
  height: 28px;
  object-fit: contain;
}
main.fp-page .docs-groups.fp-posts {
  display: block;
}
main.fp-page .docs-groups > [hidden] {
  display: none;
}
main.fp-page .docs-group + .docs-group {
  margin-top: 40px;
}
main.fp-page .docs-group h3 {
  font-family: var(--disp);
  font-size: 22px;
  margin: 0 0 16px;
}
@media (max-width: 1023px) {
  main.fp-page .docs-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 719px) {
  main.fp-page .docs-grid {
    grid-template-columns: 1fr;
  }
}
main.fp-page .docs-toc {
  margin: 28px 0 0;
  padding: 18px 22px;
  border: 1px solid var(--line);
  border-radius: 8px;
}
main.fp-page .docs-toc p {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mute);
}
main.fp-page .docs-toc ol {
  margin: 0;
  padding-left: 1.3em;
  list-style: decimal;
}
main.fp-page .docs-toc li {
  display: list-item;
  margin: 4px 0;
}
main.fp-page .docs-toc a {
  color: var(--b);
}
main.fp-page .docs-body h2 {
  scroll-margin-top: 96px;
}
main.fp-page .docs-body h3 {
  font-family: var(--disp);
  font-size: 20px;
  line-height: 1.3;
  color: var(--ink);
  margin: 32px 0 10px;
}
main.fp-page .docs-body .docs-in1 {
  margin-left: 1.25em;
}
main.fp-page .docs-body .docs-in2 {
  margin-left: 2.5em;
}
main.fp-page .docs-body code {
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    Consolas,
    monospace;
  font-size: 0.85em;
  background: var(--t2);
  padding: 0.1em 0.35em;
  border-radius: 4px;
  overflow-wrap: anywhere;
}
main.fp-page .docs-body pre {
  background: var(--dark);
  color: #E6E9F2;
  padding: 16px 18px;
  border-radius: 8px;
  overflow-x: auto;
  font-size: 14px;
  line-height: 1.6;
  margin: 0 0 20px;
}
main.fp-page .docs-body pre code {
  background: none;
  padding: 0;
  color: inherit;
}
main.fp-page .docs-body .docs-table {
  overflow-x: auto;
  margin: 0 0 20px;
}
main.fp-page .docs-body table {
  border-collapse: collapse;
  min-width: 100%;
  font-size: 15px;
  line-height: 1.5;
}
main.fp-page .docs-body th,
main.fp-page .docs-body td {
  border: 1px solid var(--line);
  padding: 8px 10px;
  text-align: left;
  vertical-align: top;
}
main.fp-page .docs-body .docs-video {
  aspect-ratio: 16/9;
  margin: 28px 0;
}
main.fp-page .docs-body .docs-video iframe {
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 8px;
  background: var(--dark);
}
main.fp-page .docs-body li {
  overflow-wrap: anywhere;
}
main.fp-page.fp-read .fp-read-cta .hm-btns {
  margin: 0;
  gap: 10px;
}
main.fp-page .rm-st {
  flex: none;
  white-space: nowrap;
  font-size: 11px;
  padding: 4px 9px;
}
main.fp-page .rm-st--done {
  background: #E3F6EC;
  color: var(--ok);
}
main.fp-page .rm-st--dev {
  background: var(--t1);
  color: var(--b);
}
main.fp-page .rm-st--plan {
  background: #FFF1D6;
  color: #8A5A00;
}
main.fp-page .rm-narrow {
  max-width: 880px;
}
main.fp-page .hm-wrap.rm-narrow {
  max-width: 1280px;
}
main.fp-page .hm-wrap.rm-narrow > * {
  max-width: 880px;
}
main.fp-page .rm-note {
  margin: 10px 0 0;
  font-size: 14px;
  color: var(--mute);
}
main.fp-page .rm-hero .hm-head {
  max-width: 780px;
  margin-bottom: 0;
}
main.fp-page .rm-hero .fp-lede {
  margin-bottom: 0;
}
main.fp-page .rm-hero .hm-btns {
  margin-top: 24px;
}
main.fp-page .rm-group + .rm-group {
  margin-top: 28px;
}
main.fp-page .rm-group-h {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  font: 700 12px/1.4 var(--body);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
}
main.fp-page .rm-group-h span {
  font-size: 11px;
  letter-spacing: 0;
  background: var(--paper);
  color: var(--ink);
  border-radius: 999px;
  padding: 2px 8px;
}
main.fp-page .rm-list {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--white);
  overflow: hidden;
}
main.fp-page .rm-item + .rm-item {
  border-top: 1px solid var(--line);
}
main.fp-page .rm-sum {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 18px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--ink);
  list-style: none;
}
main.fp-page .rm-sum::-webkit-details-marker {
  display: none;
}
main.fp-page summary.rm-sum {
  cursor: pointer;
}
main.fp-page summary.rm-sum:hover {
  background: var(--paper);
}
main.fp-page summary.rm-sum:after {
  content: "+";
  flex: none;
  width: 20px;
  text-align: center;
  color: var(--b);
  font-size: 20px;
  line-height: 1;
  transition: transform 0.2s ease;
}
main.fp-page .rm-item[open] > summary.rm-sum:after {
  transform: rotate(45deg);
}
main.fp-page .rm-item--plain .rm-sum:after {
  content: "";
  flex: none;
  width: 20px;
}
main.fp-page .rm-item-t {
  flex: 1;
  min-width: 0;
  overflow-wrap: anywhere;
}
main.fp-page .rm-item-t small {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: var(--b);
}
main.fp-page .rm-body {
  padding: 2px 18px 18px;
  font-size: 15px;
  line-height: 1.65;
  color: #3A3D46;
  overflow-wrap: anywhere;
}
main.fp-page .rm-body p {
  margin: 0 0 10px;
}
main.fp-page .rm-body ul,
main.fp-page .rm-body ol {
  margin: 0 0 10px;
  padding-left: 1.3em;
}
main.fp-page .rm-body ul {
  list-style: disc;
}
main.fp-page .rm-body ol {
  list-style: decimal;
}
main.fp-page .rm-body li {
  display: list-item;
  list-style: inherit;
  margin-bottom: 4px;
}
main.fp-page .rm-body a {
  color: var(--b);
  text-decoration: underline;
  text-underline-offset: 3px;
}
main.fp-page .rm-body code {
  font:
    13px/1.5 ui-monospace,
    SFMono-Regular,
    Consolas,
    monospace;
  background: var(--paper);
  border-radius: 4px;
  padding: 1px 4px;
}
main.fp-page .rm-media {
  margin: 14px 0 4px;
}
main.fp-page .rm-media img {
  display: block;
  max-width: 100%;
  height: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
}
main.fp-page .rm-month-items {
  margin-top: 32px;
}
main.fp-page .rm-later {
  margin-top: 32px;
}
main.fp-page .rm-months {
  display: grid;
  gap: 10px;
}
main.fp-page .rm-month {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--white);
}
main.fp-page .rm-month > summary {
  display: flex;
  align-items: baseline;
  gap: 6px 14px;
  flex-wrap: wrap;
  padding: 16px 20px;
  cursor: pointer;
  list-style: none;
  position: relative;
  padding-right: 52px;
}
main.fp-page .rm-month > summary::-webkit-details-marker {
  display: none;
}
main.fp-page .rm-month > summary b {
  font-family: var(--disp);
  font-size: 20px;
}
main.fp-page .rm-month > summary span {
  font-size: 14px;
  color: var(--mute);
}
main.fp-page .rm-month > summary:after {
  content: "+";
  position: absolute;
  right: 20px;
  top: 14px;
  color: var(--b);
  font-size: 24px;
  line-height: 1;
  transition: transform 0.2s ease;
}
main.fp-page .rm-month[open] > summary:after {
  transform: rotate(45deg);
}
main.fp-page .rm-month-in {
  padding: 4px 20px 20px;
}
main.fp-page .rm-empty {
  margin: 0 0 12px;
  color: var(--mute);
}
main.fp-page a.rm-more {
  display: inline-block;
  margin-top: 16px;
  font-weight: 700;
  color: var(--b);
}
main.fp-page a.fp-rel.rm-q {
  background: var(--b);
  border-color: var(--b);
  color: var(--white);
}
main.fp-page a.fp-rel.rm-q small,
main.fp-page a.fp-rel.rm-q span,
main.fp-page a.fp-rel.rm-q em {
  color: var(--white);
}
main.fp-page a.fp-rel.rm-q span {
  opacity: 0.85;
}
main.fp-page .rm-cal {
  row-gap: 16px;
}
main.fp-page .rm-year + .rm-year {
  margin-top: clamp(32px, 4vw, 48px);
}
main.fp-page .rm-year .hm-head {
  margin-bottom: 16px;
  align-items: flex-end;
}
main.fp-page .rm-year-h {
  font-size: clamp(28px, 3vw, 40px);
  margin: 0;
}
main.fp-page .rm-end .fp-read-more {
  margin-top: 0;
  border-top: 0;
  padding-top: 0;
}
@media (max-width: 719px) {
  main.fp-page .rm-sum {
    padding: 12px 14px;
    gap: 10px;
    font-size: 14px;
  }
  main.fp-page .rm-body {
    padding: 2px 14px 16px;
  }
  main.fp-page .rm-month > summary {
    padding: 14px 44px 14px 16px;
  }
  main.fp-page .rm-month > summary:after {
    right: 16px;
  }
  main.fp-page .rm-month-in {
    padding: 4px 12px 16px;
  }
}
main.fp-page .lg-toc {
  margin: 28px 0 0;
  padding: 20px 24px;
  border-radius: 8px;
  background: var(--paper);
}
main.fp-page .lg-toc h2 {
  margin: 0 0 10px;
  font: 700 12px/1.4 var(--body);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
}
main.fp-page .lg-toc ol {
  margin: 0;
  padding-left: 0;
  list-style: none;
  display: grid;
  gap: 6px;
  font-size: 15px;
}
main.fp-page .lg-toc li {
  display: list-item;
  list-style: inherit;
}
main.fp-page .lg-toc ol ol {
  margin-top: 6px;
  padding-left: 14px;
  gap: 4px;
  font-size: 14px;
}
main.fp-page .lg-toc a {
  color: var(--ink);
  font-weight: 600;
}
main.fp-page .lg-toc ol ol a {
  font-weight: 400;
  color: #3A3D46;
}
main.fp-page .lg-toc a:hover {
  color: var(--b);
}
main.fp-page .fp-read-body h3 {
  font-family: var(--disp);
  font-size: 20px;
  line-height: 1.3;
  color: var(--ink);
  margin: 32px 0 10px;
}
main.fp-page .lg-clause {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 10px;
  margin: 0 0 14px;
}
main.fp-page .lg-clause b {
  font-variant-numeric: tabular-nums;
  color: var(--mute);
  font-weight: 600;
  font-size: 15px;
  padding-top: 2px;
}
@media (max-width: 719px) {
  main.fp-page .lg-clause {
    grid-template-columns: 1fr;
    gap: 0;
  }
}
@media (max-width: 719px) {
  main.fp-page .rm-cal {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  main.fp-page .rm-cal a.fp-rel {
    padding: 16px;
    gap: 6px;
  }
  main.fp-page .rm-cal .fp-rel b {
    font-size: 18px;
  }
  main.fp-page .rm-cal .fp-rel span {
    font-size: 13px;
  }
  main.fp-page .rm-cal .fp-rel em {
    display: none;
  }
}
main.fp-page .abm-pair {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(14px, 2.4vw, 28px);
  padding: clamp(24px, 3vw, 36px) 20px;
}
main.fp-page .abm-pair img,
main.fp-page .abm-pair svg {
  display: block;
  height: auto;
  max-height: 40px;
  width: auto;
  max-width: 42%;
}
main.fp-page .abm-pair > span {
  font-size: 22px;
  color: var(--mute);
  line-height: 1;
}
main.fp-page .abm-gap {
  margin-top: 16px;
}
main.fp-page .abm-try figure {
  background: var(--white);
}
main.fp-page .abm-try figure a {
  display: block;
  position: absolute;
  inset: 0;
}
main.fp-page .abm-try figure img {
  object-position: top center;
}
main.fp-page .abm-try--contain figure img {
  object-fit: contain;
  object-position: center;
}
main.fp-page .abm-person {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 24px;
}
main.fp-page .abm-person img {
  flex: none;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  object-fit: cover;
  object-position: 50% 15%;
  border: 3px solid rgba(255, 255, 255, 0.9);
  background: var(--white);
}
main.fp-page .hm-final-box .abm-person p {
  margin: 0;
  display: flex;
  flex-direction: column;
  font-size: 15px;
}
main.fp-page .abm-person b {
  color: var(--white);
  font-size: 17px;
}
main.fp-page .hm-final-box .abm-mail {
  margin: 12px 0 0;
  font-size: 15px;
}
main.fp-page .abm-mail a {
  color: var(--white);
  text-decoration: underline;
}
.fr-dialog {
  width: calc(100vw - 32px);
  height: calc(100dvh - 32px);
  max-width: none;
  max-height: none;
  padding: 0;
  border: 0;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(16, 22, 43, 0.35);
}
.fr-dialog[open] {
  display: flex;
  flex-direction: column;
}
.fr-dialog::backdrop {
  background: rgba(16, 22, 43, 0.6);
}
.fr-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 16px;
  background: #0F1A3A;
  color: #fff;
  font:
    600 14px/1.3 "Open Sans",
    system-ui,
    sans-serif;
}
.fr-close {
  border: 0;
  border-radius: 6px;
  padding: 8px 14px;
  background: #fff;
  color: #191919;
  font:
    600 14px "Open Sans",
    system-ui,
    sans-serif;
  cursor: pointer;
}
.fr-frame {
  flex: 1;
  width: 100%;
  border: 0;
  background: #fff;
}
@media (max-width: 743px) {
  .fr-dialog {
    width: 100vw;
    height: 100dvh;
    border-radius: 0;
  }
}
a.abm-person {
  color: inherit;
  text-decoration: none;
  width: fit-content;
}
a.abm-person:hover b {
  text-decoration: underline;
}
a.abm-contact {
  color: var(--white);
  text-decoration: none;
}
a.abm-contact span {
  color: inherit;
}
a.abm-contact:hover span {
  text-decoration: underline;
}
/*# sourceMappingURL=prototype.css.map */