/* [next]/internal/font/google/work_sans_57825463.module.css [app-client] (css) */
@font-face {
  font-family: Work Sans;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../media/8e3fbf4aa84d044b-s.15r3fd4k35w-q.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: Work Sans;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../media/57dc28f7118abe14-s.0~q417~7alp5b.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Work Sans;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../media/7ddd198311ba7843-s.p.11f_0f-25f9yg.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Work Sans;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../media/8e3fbf4aa84d044b-s.15r3fd4k35w-q.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: Work Sans;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../media/57dc28f7118abe14-s.0~q417~7alp5b.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Work Sans;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../media/7ddd198311ba7843-s.p.11f_0f-25f9yg.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Work Sans;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../media/8e3fbf4aa84d044b-s.15r3fd4k35w-q.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: Work Sans;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../media/57dc28f7118abe14-s.0~q417~7alp5b.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Work Sans;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../media/7ddd198311ba7843-s.p.11f_0f-25f9yg.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Work Sans;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../media/8e3fbf4aa84d044b-s.15r3fd4k35w-q.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: Work Sans;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../media/57dc28f7118abe14-s.0~q417~7alp5b.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Work Sans;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../media/7ddd198311ba7843-s.p.11f_0f-25f9yg.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Work Sans Fallback;
  src: local(Arial);
  ascent-override: 83.09%;
  descent-override: 21.71%;
  line-gap-override: 0.0%;
  size-adjust: 111.93%;
}

.work_sans_57825463-module__HSEDVa__className {
  font-family: Work Sans, Work Sans Fallback;
  font-style: normal;
}

.work_sans_57825463-module__HSEDVa__variable {
  --font-display: "Work Sans", "Work Sans Fallback";
}

/* [next]/internal/font/google/source_sans_3_4ae16b7d.module.css [app-client] (css) */
@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../media/da8a9dd0d68e512b-s.075ksw~sx6hmf.woff2") format("woff2");
  unicode-range: U+460-52F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../media/94b4a5dc1fe84361-s.152ftqe40mrji.woff2") format("woff2");
  unicode-range: U+301, U+400-45F, U+490-491, U+4B0-4B1, U+2116;
}

@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../media/ff5be760267bb4bc-s.0.82snbe0x2a8.woff2") format("woff2");
  unicode-range: U+1F??;
}

@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../media/99596c30eb072d3c-s.0s6~0_kovb3c2.woff2") format("woff2");
  unicode-range: U+370-377, U+37A-37F, U+384-38A, U+38C, U+38E-3A1, U+3A3-3FF;
}

@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../media/e5864b32625b6bc3-s.06wztka3punf6.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../media/e285ad1a914469f0-s.0d9dgiv-6zu4j.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../media/47df9ba1c7236d3b-s.p.0cqfp9mgbqxvb.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../media/da8a9dd0d68e512b-s.075ksw~sx6hmf.woff2") format("woff2");
  unicode-range: U+460-52F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../media/94b4a5dc1fe84361-s.152ftqe40mrji.woff2") format("woff2");
  unicode-range: U+301, U+400-45F, U+490-491, U+4B0-4B1, U+2116;
}

@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../media/ff5be760267bb4bc-s.0.82snbe0x2a8.woff2") format("woff2");
  unicode-range: U+1F??;
}

@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../media/99596c30eb072d3c-s.0s6~0_kovb3c2.woff2") format("woff2");
  unicode-range: U+370-377, U+37A-37F, U+384-38A, U+38C, U+38E-3A1, U+3A3-3FF;
}

@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../media/e5864b32625b6bc3-s.06wztka3punf6.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../media/e285ad1a914469f0-s.0d9dgiv-6zu4j.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../media/47df9ba1c7236d3b-s.p.0cqfp9mgbqxvb.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Source Sans 3 Fallback";
  src: local(Arial);
  ascent-override: 109.21%;
  descent-override: 42.66%;
  line-gap-override: 0.0%;
  size-adjust: 93.76%;
}

.source_sans_3_4ae16b7d-module__cUirsG__className {
  font-family: "Source Sans 3", "Source Sans 3 Fallback";
  font-style: normal;
}

.source_sans_3_4ae16b7d-module__cUirsG__variable {
  --font-body: "Source Sans 3", "Source Sans 3 Fallback";
}

/* [project]/src/app/(frontend)/globals.css [app-client] (css) */
:root {
  --pierre-900: #0e222b;
  --pierre-800: #073b4c;
  --pierre-700: #094d63;
  --accent: #066481;
  --accent-bright: #228b96;
  --pierre-50: #dceaf3;
  --light-blue: #a7ccdf;
  --ink: #08151b;
  --glass: #ffffff0b;
  --glass-strong: #ffffff13;
  --hairline: #ffffff1a;
  --hairline-bright: #a7ccdf59;
  --txt: #ffffffeb;
  --txt-dim: #ffffff94;
  --sidebar-w: 264px;
}

* {
  box-sizing: border-box;
}

html, body {
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--font-body), "Source Sans 3", system-ui, sans-serif;
  color: var(--txt);
  background-color: var(--ink);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizelegibility;
  min-height: 100dvh;
}

body:before {
  content: "";
  z-index: -1;
  background: radial-gradient(900px 600px at 12% -5%, #228b9642, transparent 60%),
    radial-gradient(800px 700px at 100% 8%, #0664814d, transparent 55%),
    radial-gradient(1100px 800px at 60% 115%, #094d6361, transparent 55%),
    linear-gradient(160deg, #0b1d25, var(--ink) 70%);
  position: fixed;
  inset: 0;
}

h1, h2, h3, h4 {
  font-family: var(--font-display), "Work Sans", system-ui, sans-serif;
  letter-spacing: -.02em;
  color: #fff;
  margin: 0;
}

a {
  color: var(--light-blue);
  text-decoration: none;
}

.yp-eyebrow {
  text-transform: uppercase;
  letter-spacing: .16em;
  color: var(--accent-bright);
  font-size: 11px;
  font-weight: 700;
}

.portal {
  min-height: 100dvh;
}

.menu-toggle {
  z-index: 60;
  border: 1px solid var(--hairline);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  color: #fff;
  height: 46px;
  font-family: var(--font-display), sans-serif;
  letter-spacing: .05em;
  cursor: pointer;
  background: #08151bb8;
  border-radius: 14px;
  align-items: center;
  gap: 11px;
  padding: 0 17px 0 15px;
  font-size: 13px;
  font-weight: 700;
  transition: border-color .2s;
  display: inline-flex;
  position: fixed;
  top: 18px;
  left: 18px;
}

.menu-toggle:hover {
  border-color: var(--hairline-bright);
}

.menu-toggle__bars {
  flex-direction: column;
  gap: 3.5px;
  display: inline-flex;
}

.menu-toggle__bars i {
  background: #fff;
  border-radius: 2px;
  width: 18px;
  height: 2px;
}

.scrim {
  z-index: 50;
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  opacity: 0;
  visibility: hidden;
  background: #040c108c;
  transition: opacity .3s;
  position: fixed;
  inset: 0;
}

.scrim.show {
  opacity: 1;
  visibility: visible;
}

.sidebar {
  z-index: 55;
  border-right: 1px solid var(--hairline-bright);
  -webkit-backdrop-filter: blur(22px);
  backdrop-filter: blur(22px);
  background: #071218f0;
  flex-direction: column;
  gap: 6px;
  width: 282px;
  height: 100dvh;
  padding: 20px 16px;
  transition: transform .32s cubic-bezier(.2, .7, .2, 1);
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
  transform: translateX(-100%);
}

.sidebar.open {
  transform: none;
  box-shadow: 40px 0 90px -40px #000000d9;
}

.sidebar__close {
  color: var(--txt-dim);
  cursor: pointer;
  background: none;
  border: none;
  margin-left: auto;
  padding: 4px 6px;
  font-size: 18px;
}

.sidebar__close:hover {
  color: #fff;
}

.sidebar__head {
  align-items: center;
  padding: 6px 6px 18px 12px;
  display: flex;
}

.brandmark {
  font-family: var(--font-display), "Work Sans", sans-serif;
  letter-spacing: .05em;
  color: #fff;
  cursor: pointer;
  background: none;
  border: none;
  align-items: center;
  gap: 10px;
  padding: 0;
  font-weight: 700;
  display: flex;
}

.brandmark__dot {
  background: var(--accent-bright);
  border-radius: 50%;
  width: 11px;
  height: 11px;
  box-shadow: 0 0 14px 2px #228b96e6;
}

.nav {
  flex-direction: column;
  gap: 4px;
  display: flex;
}

.navitem {
  text-align: left;
  width: 100%;
  color: var(--txt-dim);
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  border-radius: 13px;
  align-items: center;
  gap: 12px;
  padding: 11px 13px;
  font-size: 15px;
  font-weight: 600;
  transition: background .2s, color .2s, border-color .2s;
  display: flex;
}

.navitem .anticon {
  font-size: 18px;
}

.navitem:hover {
  color: #fff;
  background: var(--glass);
}

.navitem.active {
  color: #fff;
  background: var(--glass-strong);
  border-color: var(--hairline-bright);
  box-shadow: inset 0 0 22px #228b961f;
}

.navitem .dot {
  background: var(--accent-bright);
  width: 7px;
  height: 7px;
  box-shadow: 0 0 8px var(--accent-bright);
  border-radius: 50%;
  margin-left: auto;
}

.sidebar__foot {
  border-top: 1px solid var(--hairline);
  color: var(--txt-dim);
  margin-top: auto;
  padding: 14px 12px 4px;
  font-size: 13px;
}

.main {
  min-width: 0;
}

.canvas {
  max-width: 1140px;
  margin: 0 auto;
  padding: 88px 48px 96px;
}

@media (max-width: 560px) {
  .canvas {
    padding: 86px 20px 80px;
  }
}

.gate {
  flex-direction: column;
  justify-content: center;
  min-height: calc(100dvh - 112px);
  display: flex;
}

.page-logo {
  cursor: pointer;
  color: #fff;
  opacity: .78;
  background: none;
  border: none;
  margin: 0 0 30px;
  padding: 0;
  transition: opacity .2s;
  display: block;
}

.page-logo:hover {
  opacity: 1;
}

@media (max-width: 560px) {
  .page-logo {
    margin-bottom: 24px;
  }
}

.gate__grid {
  grid-template-columns: minmax(0, 1fr);
  gap: 28px;
  display: grid;
}

.gate__logo {
  color: #fff;
  opacity: .95;
  margin-bottom: 18px;
}

@media (min-width: 900px) {
  .gate__grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 460px);
    align-items: start;
    gap: 26px 64px;
  }

  .gate__head, .gate__body {
    grid-column: 1;
  }

  .gate__grid > .introvid {
    grid-area: 1 / 2 / span 2;
    align-self: center;
  }

  .gate__logo {
    margin-bottom: 26px;
  }
}

.intro-film {
  max-width: 880px;
  margin: 4px 0 0;
}

.intro-film__actions {
  flex-wrap: wrap;
  gap: 12px;
  margin: 26px 0 0;
  display: flex;
}

.intro-more {
  border-top: 1px solid var(--hairline);
  margin-top: 46px;
  padding-top: 38px;
}

.introvid {
  aspect-ratio: 16 / 9;
  background: linear-gradient(150deg, #228b9638, #08151be6);
  border: 1px solid #ffffff1a;
  border-radius: 18px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 28px 70px #00000080;
}

.introvid video {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.introvid__placeholder {
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 20px;
  display: flex;
  position: absolute;
  inset: 0;
}

.introvid__placeholder strong {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  margin-top: 14px;
  font-size: 19px;
  font-weight: 600;
}

.introvid__note {
  color: var(--txt-dim);
  font-size: 14px;
}

.introvid__play {
  background: var(--accent-bright);
  color: #fff;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 64px;
  height: 64px;
  padding-left: 4px;
  font-size: 26px;
  display: inline-flex;
  box-shadow: 0 10px 30px #228b9673;
}

.gate__confetti {
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--accent-bright);
  font-size: 13px;
  font-weight: 700;
}

.gate__photo {
  border: 1px solid #ffffff17;
  border-radius: 18px;
  max-width: 660px;
  margin: 22px 0 6px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 24px 60px #00000080;
}

.gate__photo img {
  width: 100%;
  height: auto;
  display: block;
}

.gate__photo-cap {
  color: #fff;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  background: #0f0f149e;
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 600;
  position: absolute;
  bottom: 14px;
  left: 16px;
}

.gate h1 {
  margin: 18px 0;
  font-size: clamp(38px, 6vw, 68px);
  font-weight: 500;
  line-height: 1.02;
}

.gate p {
  color: var(--txt-dim);
  max-width: 560px;
  font-size: 20px;
  line-height: 1.5;
}

.gate__q {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  margin-top: 30px;
  font-size: 22px;
  font-weight: 500;
}

.choices {
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 18px;
  display: flex;
}

.sec-head {
  margin-bottom: 28px;
}

.sec-head h2 {
  margin-top: 10px;
  font-size: clamp(28px, 4vw, 40px);
  font-weight: 500;
}

.sec-head p {
  color: var(--txt-dim);
  max-width: 880px;
  margin: 10px 0 0;
  font-size: 17px;
}

.steps {
  flex-direction: column;
  gap: 14px;
  display: flex;
}

.stepbox {
  border: 1px solid var(--hairline);
  background: var(--glass);
  border-radius: 18px;
  transition: border-color .25s, background .25s;
  overflow: hidden;
}

.stepbox.open {
  border-color: var(--hairline-bright);
  background: var(--glass-strong);
}

.stepbox.done {
  border-color: #228b9666;
}

.stepbox__head {
  cursor: pointer;
  align-items: center;
  gap: 16px;
  padding: 18px 20px;
  display: flex;
}

.stepnum {
  width: 38px;
  height: 38px;
  font-family: var(--font-display), sans-serif;
  color: var(--accent-bright);
  background: #228b961f;
  border: 1px solid #228b9659;
  border-radius: 50%;
  flex: none;
  place-items: center;
  font-weight: 700;
  display: grid;
}

.stepbox.done .stepnum {
  color: #07242b;
  background: var(--accent-bright);
  border-color: var(--accent-bright);
}

.stepbox__title {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  font-size: 18px;
  font-weight: 600;
}

.stepbox__hint {
  color: var(--txt-dim);
  margin-top: 2px;
  font-size: 14px;
}

.stepbox__body {
  color: var(--txt);
  padding: 0 20px 22px 74px;
  font-size: 16px;
  line-height: 1.65;
}

.stepbox__body :where(p, ul, ol) {
  margin: 0 0 12px;
}

.intro-grid {
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  display: grid;
}

@media (max-width: 720px) {
  .intro-grid {
    grid-template-columns: 1fr;
  }
}

.intro-grid--caps {
  grid-template-columns: 1fr;
}

@media (min-width: 600px) {
  .intro-grid--caps {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 960px) {
  .intro-grid--caps {
    grid-template-columns: repeat(3, 1fr);
  }

  .intro-grid--caps:has( > :last-child:nth-child(4)) {
    grid-template-columns: repeat(2, 1fr);
  }

  .intro-grid--caps:has( > :last-child:nth-child(2)) {
    grid-template-columns: repeat(2, 1fr);
  }

  .intro-grid--caps:has( > :last-child:first-child) {
    grid-template-columns: minmax(280px, 460px);
  }
}

.intro-card {
  border: 1px solid var(--hairline);
  background: var(--glass);
  border-radius: 18px;
  padding: 22px;
}

.intro-card .anticon {
  color: var(--accent-bright);
  font-size: 24px;
}

.intro-card h3 {
  margin: 14px 0 8px;
  font-size: 19px;
}

.intro-card p {
  color: var(--txt-dim);
  margin: 0;
  font-size: 15px;
  line-height: 1.5;
}

.support-steps {
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  display: grid;
}

@media (max-width: 900px) {
  .support-steps {
    grid-template-columns: 1fr;
  }
}

.support-step {
  border: 1px solid var(--hairline);
  background: var(--glass);
  border-radius: 18px;
  gap: 18px;
  padding: 22px;
  display: flex;
}

.support-step__num {
  width: 34px;
  height: 34px;
  color: var(--accent-bright);
  border: 1px solid var(--hairline-bright);
  background: var(--glass-strong);
  border-radius: 50%;
  flex: none;
  place-items: center;
  font-size: 16px;
  font-weight: 700;
  display: grid;
}

.support-step__body {
  flex-direction: column;
  flex: auto;
  min-width: 0;
  display: flex;
}

.support-step__head {
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
  display: flex;
}

.support-step__head .anticon {
  color: var(--accent-bright);
  font-size: 20px;
}

.support-step__head h3 {
  margin: 0;
  font-size: 19px;
}

.support-step__body > p {
  color: var(--txt-dim);
  margin: 0 0 16px;
  font-size: 15px;
  line-height: 1.5;
}

.support-list {
  flex-direction: column;
  gap: 10px;
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
  display: flex;
}

.support-list li {
  color: var(--txt);
  align-items: center;
  gap: 10px;
  font-size: 15px;
  display: flex;
}

.support-list .anticon {
  color: var(--accent-bright);
  font-size: 16px;
}

.support-step__cta {
  flex-wrap: wrap;
  gap: 12px;
  margin-top: auto;
  display: flex;
}

.support-card {
  border: 1px solid var(--hairline);
  background: var(--glass-strong);
  border-radius: 14px;
  flex-direction: column;
  gap: 20px;
  margin-top: auto;
  padding: 26px;
  display: flex;
}

.support-card__top {
  align-items: center;
  gap: 14px;
  display: flex;
}

.support-card__avatar {
  color: #fff;
  background: linear-gradient(135deg, var(--accent-bright), var(--accent));
  border-radius: 50%;
  flex: none;
  place-items: center;
  width: 48px;
  height: 48px;
  font-size: 17px;
  font-weight: 700;
  display: grid;
}

.support-card__info {
  flex: auto;
  min-width: 0;
}

.support-card__name {
  font-size: 17px;
  font-weight: 600;
}

.support-card__role {
  color: var(--txt-dim);
  font-size: 14px;
}

.support-card__meta {
  border-top: 1px solid var(--hairline);
  flex-direction: column;
  gap: 12px;
  padding-top: 20px;
  display: flex;
}

.support-card__avail, .support-card__line {
  color: var(--txt-dim);
  align-items: center;
  gap: 8px;
  font-size: 14px;
  display: flex;
}

.support-card__avail .anticon, .support-card__line .anticon {
  color: var(--accent-bright);
  font-size: 15px;
}

.support-card__actions {
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 4px;
  display: grid;
}

.support-faq {
  margin-top: 40px;
}

.support-faq__head {
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  display: flex;
}

.support-faq__head .anticon {
  color: var(--accent-bright);
  font-size: 20px;
}

.support-faq__head h3 {
  margin: 0;
  font-size: 22px;
}

.support-faq__list.ant-collapse {
  background: none;
  border: none;
}

.support-faq__list .ant-collapse-item {
  border: 1px solid var(--hairline);
  background: var(--glass);
  margin-bottom: 10px;
  border-radius: 14px !important;
}

.support-faq__list .ant-collapse-header {
  font-size: 16px;
  font-weight: 500;
  color: var(--txt) !important;
  align-items: center !important;
  padding: 16px 18px !important;
}

.support-faq__list .ant-collapse-expand-icon .anticon {
  color: var(--accent-bright);
}

.support-faq__list .ant-collapse-content {
  border-top: 1px solid var(--hairline);
  background: none;
}

.support-faq__list .ant-collapse-content-box {
  color: var(--txt-dim);
  font-size: 15px;
  line-height: 1.55;
  padding: 0 18px 16px !important;
}

.support-faq__more {
  color: var(--accent-bright);
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  font-weight: 500;
  display: inline-flex;
}

.support-faq__more:hover {
  color: var(--txt);
}

.kb-subhead {
  color: var(--txt-dim);
  text-transform: uppercase;
  letter-spacing: .08em;
  margin: 0 0 14px;
  font-size: 15px;
  font-weight: 600;
}

.kb-card {
  border: 1px solid var(--hairline);
  background: var(--glass);
  border-radius: 18px;
  flex-direction: column;
  transition: border-color .2s, transform .2s, background .2s;
  display: flex;
  overflow: hidden;
}

.kb-card:hover {
  border-color: var(--hairline-bright);
  background: var(--glass-strong);
  transform: translateY(-2px);
}

.kb-card__img {
  aspect-ratio: 16 / 10;
  background: var(--glass-strong);
  position: relative;
  overflow: hidden;
}

.kb-card__img img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  transition: transform .3s;
  display: block;
}

.kb-card:hover .kb-card__img img {
  transform: scale(1.04);
}

.kb-card__badge {
  border: 1px solid var(--hairline-bright);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  background: #08141ab8;
  border-radius: 12px;
  place-items: center;
  width: 38px;
  height: 38px;
  display: grid;
  position: absolute;
  bottom: 12px;
  left: 12px;
}

.kb-card__badge .anticon {
  color: var(--accent-bright);
  font-size: 18px;
}

.kb-card__body {
  padding: 18px 20px 20px;
}

.kb-card__body h3 {
  margin: 0 0 8px;
  font-size: 18px;
}

.kb-card__body p {
  color: var(--txt-dim);
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
}

.kb-card__more {
  color: var(--accent-bright);
  align-items: center;
  gap: 6px;
  margin-top: 14px;
  font-size: 14px;
  font-weight: 500;
  display: inline-flex;
}

.stats {
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 36px;
  display: flex;
}

.stat {
  border: 1px solid var(--hairline);
  background: var(--glass);
  border-radius: 16px;
  flex: 150px;
  padding: 18px 20px;
}

.stat__num {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
}

.stat__label {
  color: var(--txt-dim);
  margin-top: 6px;
  font-size: 14px;
}

.intro-subhead {
  margin: 36px 0 18px;
  font-size: 22px;
  font-weight: 600;
}

.intro-hero {
  border: 1px solid var(--hairline);
  border-radius: 22px;
  align-items: flex-end;
  min-height: 380px;
  margin-bottom: 34px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.intro-hero img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.intro-hero:after {
  content: "";
  background: linear-gradient(#08151b00 0% 42%, #08151b80 72%, #08151bf0 100%);
  position: absolute;
  inset: 0;
}

.intro-hero__cap {
  z-index: 2;
  text-shadow: 0 2px 14px #0009;
  padding: 30px 32px;
  position: relative;
}

.intro-hero__cap h3 {
  font-size: 30px;
  font-weight: 600;
}

.intro-hero__cap p {
  color: #ffffffeb;
  max-width: 480px;
  margin: 8px 0 0;
  font-size: 17px;
}

.apppanel {
  border: 1px solid var(--hairline-bright);
  background: linear-gradient(160deg, #228b961a, var(--glass));
  border-radius: 20px;
  grid-template-columns: 1fr 1fr;
  gap: 20px 28px;
  padding: 28px;
  display: grid;
}

@media (max-width: 640px) {
  .apppanel {
    grid-template-columns: 1fr;
  }
}

.appitem {
  gap: 14px;
  display: flex;
}

.appitem .anticon {
  color: var(--accent-bright);
  margin-top: 2px;
  font-size: 22px;
}

.appitem h4 {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.appitem p {
  color: var(--txt-dim);
  margin: 4px 0 0;
  font-size: 14px;
  line-height: 1.45;
}

.appshow {
  border: 1px solid var(--hairline-bright);
  background: radial-gradient(120% 130% at 100% -10%, #228b9633, #0000 55%), linear-gradient(165deg, #094d636b, #08151b8c);
  border-radius: 26px;
  grid-template-columns: .92fr 1.08fr;
  align-items: start;
  gap: 44px;
  margin: 48px 0 44px;
  padding: 44px;
  display: grid;
  position: relative;
  overflow: hidden;
}

.appshow__glow {
  filter: blur(26px);
  pointer-events: none;
  background: radial-gradient(circle, #228b9666, #0000 62%);
  border-radius: 50%;
  width: 380px;
  height: 380px;
  position: absolute;
  top: -140px;
  right: -90px;
}

@media (max-width: 900px) {
  .appshow {
    grid-template-columns: 1fr;
    gap: 30px;
    padding: 30px;
  }
}

.appshow__intro {
  z-index: 1;
  position: relative;
}

.appshow__title {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  margin: 12px 0 16px;
  font-size: clamp(27px, 3.2vw, 37px);
  font-weight: 600;
  line-height: 1.1;
}

.appshow__lead {
  color: var(--txt);
  max-width: 470px;
  margin: 0 0 14px;
  font-size: 16px;
  line-height: 1.62;
}

.appshow__lead--dim {
  color: var(--txt-dim);
  font-size: 15px;
}

.appshow__platforms {
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 22px;
  display: flex;
}

.appshow__pill {
  color: var(--light-blue);
  border: 1px solid var(--hairline-bright);
  background: #ffffff0a;
  border-radius: 999px;
  padding: 6px 13px;
  font-size: 12.5px;
  font-weight: 600;
}

.appshow__grid {
  z-index: 1;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  display: grid;
  position: relative;
}

@media (max-width: 560px) {
  .appshow__grid {
    grid-template-columns: 1fr;
  }
}

.appfeature {
  border: 1px solid var(--hairline);
  background: #ffffff08;
  border-radius: 16px;
  gap: 14px;
  padding: 18px;
  transition: transform .18s, border-color .18s, background .18s;
  display: flex;
}

.appfeature:hover {
  border-color: var(--hairline-bright);
  background: #ffffff0f;
  transform: translateY(-3px);
}

.appfeature__ico {
  width: 44px;
  height: 44px;
  color: var(--accent-bright);
  background: #228b9626;
  border: 1px solid #228b9652;
  border-radius: 13px;
  flex: none;
  place-items: center;
  transition: box-shadow .18s;
  display: grid;
}

.appfeature:hover .appfeature__ico {
  box-shadow: 0 8px 20px #228b9661;
}

.appfeature__ico .anticon {
  font-size: 21px;
}

.appfeature__body h4 {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  margin: 1px 0 6px;
  font-size: 15.5px;
  font-weight: 600;
}

.appfeature__body p {
  color: var(--txt-dim);
  margin: 0;
  font-size: 13.5px;
  line-height: 1.5;
}

.upsell-teaser {
  border: 1px solid var(--hairline-bright);
  background: radial-gradient(600px 200px at 100% 0%, #228b9633, transparent),
    var(--glass);
  border-radius: 20px;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  margin-top: 40px;
  padding: 26px 28px;
  display: flex;
}

.upsell-teaser h3 {
  font-size: 21px;
  font-weight: 600;
}

.upsell-teaser p {
  color: var(--txt-dim);
  max-width: 480px;
  margin: 8px 0 0;
  line-height: 1.5;
}

.guide {
  flex-direction: column;
  gap: 14px;
  display: flex;
}

.gsection {
  border: 1px solid var(--hairline);
  background: var(--glass);
  border-radius: 18px;
  transition: border-color .25s, background .25s;
  overflow: hidden;
}

.gsection.open {
  border-color: var(--hairline-bright);
  background: var(--glass-strong);
}

.gsection__head {
  cursor: pointer;
  align-items: center;
  gap: 16px;
  padding: 20px 22px;
  display: flex;
}

.gsection__num {
  width: 34px;
  height: 34px;
  font-family: var(--font-display), sans-serif;
  color: var(--accent-bright);
  background: #228b961f;
  border: 1px solid #228b9666;
  border-radius: 50%;
  flex: none;
  place-items: center;
  font-size: 14px;
  font-weight: 700;
  display: grid;
}

.gsection__ico {
  border-radius: 12px;
}

.gsection__ico .anticon {
  font-size: 18px;
}

.gsection__title {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  flex: 1;
  font-size: 19px;
  font-weight: 600;
}

.gchev {
  color: var(--txt-dim);
  transition: transform .25s, color .25s;
}

.gchev.open {
  color: var(--accent-bright);
  transform: rotate(90deg);
}

.gsection__body {
  padding: 2px 24px 14px;
}

.gsection__intro {
  color: var(--light-blue);
  margin: 0 0 16px;
  font-size: 16px;
}

.topiccards {
  flex-direction: column;
  gap: 12px;
  display: flex;
}

.topiccard {
  text-align: left;
  border: 1px solid var(--hairline);
  background: var(--glass);
  cursor: pointer;
  width: 100%;
  color: var(--txt);
  border-radius: 14px;
  align-items: center;
  gap: 16px;
  padding: 16px 18px;
  transition: transform .2s, border-color .2s, background .2s;
  display: flex;
}

.topiccard:hover {
  border-color: var(--hairline-bright);
  background: var(--glass-strong);
  transform: translateY(-2px);
}

.topiccard__num {
  width: 30px;
  height: 30px;
  font-family: var(--font-display), sans-serif;
  color: var(--accent-bright);
  background: #228b961f;
  border: 1px solid #228b9659;
  border-radius: 8px;
  flex: none;
  place-items: center;
  font-size: 13px;
  font-weight: 700;
  display: grid;
}

.topiccard__main {
  flex: 1;
  min-width: 0;
}

.topiccard__title {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
}

.topiccard__meta {
  color: var(--txt-dim);
  margin-top: 2px;
  font-size: 13px;
}

.topiccard__chev {
  color: var(--txt-dim);
  font-size: 13px;
}

.guide-upsell {
  border: 1px solid var(--hairline);
  border-left: 3px solid var(--accent-bright);
  background: linear-gradient(90deg, #228b961a, #0000 70%);
  border-radius: 12px;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-top: 16px;
  padding: 14px 18px;
  display: flex;
}

.guide-upsell__text {
  color: var(--txt-dim);
  font-size: 14px;
  line-height: 1.45;
}

.guide-upsell__eyebrow {
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--accent-bright);
  margin-right: 8px;
  font-size: 11px;
  font-weight: 700;
  display: inline-block;
}

.guide-upsell__link {
  color: var(--accent-bright);
  white-space: nowrap;
  flex: none;
  font-size: 14px;
  font-weight: 600;
}

.guide-upsell__link:hover {
  text-decoration: underline;
}

.guide-upsell__btn {
  cursor: pointer;
  background: none;
  border: none;
  align-items: center;
  gap: 6px;
  padding: 0;
  font-family: inherit;
  display: inline-flex;
}

.upgrid {
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
  margin-bottom: 8px;
  display: grid;
}

@media (max-width: 680px) {
  .upgrid {
    grid-template-columns: 1fr;
  }
}

.idea__back {
  cursor: pointer;
  color: var(--txt-dim);
  background: none;
  border: none;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
  padding: 0;
  font-size: 14px;
  font-weight: 500;
  transition: color .2s;
  display: inline-flex;
}

.idea__back:hover {
  color: var(--accent-bright);
}

.idea__hero {
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 32px;
  margin-bottom: 40px;
  display: grid;
}

.idea__hero-text h2 {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  margin: 14px 0 12px;
  font-size: clamp(26px, 5vw, 34px);
  line-height: 1.15;
}

.idea__hero-text p {
  color: var(--txt-dim);
  max-width: 46ch;
  margin: 0 0 24px;
  font-size: 17px;
  line-height: 1.6;
}

.idea__hero-media {
  border: 1px solid var(--hairline);
  aspect-ratio: 4 / 3;
  border-radius: 20px;
  overflow: hidden;
}

.idea__hero-media img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.idea__benefits {
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-bottom: 40px;
  display: grid;
}

.idea__benefit {
  border: 1px solid var(--hairline);
  background: var(--glass);
  border-radius: 16px;
  gap: 12px;
  padding: 22px;
  display: flex;
}

.idea__benefit .anticon {
  color: var(--accent-bright);
  margin-top: 2px;
  font-size: 18px;
}

.idea__benefit-t {
  color: #fff;
  margin-bottom: 4px;
  font-size: 16px;
  font-weight: 600;
}

.idea__benefit-d {
  color: var(--txt-dim);
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
}

.idea__how {
  max-width: 70ch;
  margin-bottom: 32px;
}

.idea__how h3 {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  margin: 0 0 8px;
  font-size: 22px;
  font-weight: 600;
}

.idea__how p {
  color: var(--txt-dim);
  margin: 0;
  font-size: 16px;
  line-height: 1.6;
}

@media (max-width: 820px) {
  .idea__hero {
    grid-template-columns: 1fr;
  }

  .idea__hero-media {
    order: -1;
  }

  .idea__benefits {
    grid-template-columns: 1fr;
  }
}

.up-cta {
  border: 1px solid var(--hairline-bright);
  background: linear-gradient(135deg, #228b9624, #0664810f);
  border-radius: 20px;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  margin-top: 8px;
  padding: 28px 30px;
  display: flex;
}

.up-cta__text {
  flex: 320px;
}

.up-cta__text h3 {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  margin: 0 0 6px;
  font-size: 22px;
  font-weight: 600;
}

.up-cta__text p {
  color: var(--txt-dim);
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
}

.guide-next {
  border: 1px solid var(--hairline-bright);
  background: linear-gradient(135deg, #228b9624, #0664810f);
  border-radius: 20px;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  margin-top: 44px;
  padding: 28px 30px;
  display: flex;
}

.guide-next__text {
  flex: 320px;
}

.guide-next__text h3 {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  margin: 0 0 6px;
  font-size: 22px;
  font-weight: 600;
}

.guide-next__text p {
  color: var(--txt-dim);
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
}

.guide-next__actions {
  flex-wrap: wrap;
  gap: 12px;
  display: flex;
}

.firststep {
  background: linear-gradient(150deg, #228b9629, #08151bb3);
  border: 1px solid #228b966b;
  border-radius: 22px;
  margin: 0 0 30px;
  padding: 28px 30px 26px;
  box-shadow: 0 26px 60px -30px #000c;
}

.firststep.done {
  border-color: var(--hairline-bright);
  background: linear-gradient(150deg, #228b9614, #08151b99);
}

.firststep__head {
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  display: flex;
}

.firststep__badge {
  background: var(--accent-bright);
  color: #fff;
  letter-spacing: .08em;
  text-transform: uppercase;
  border-radius: 999px;
  align-items: center;
  height: 26px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 700;
  display: inline-flex;
}

.firststep__title {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  margin: 0 0 10px;
  font-size: clamp(24px, 3.4vw, 32px);
  font-weight: 500;
}

.firststep__why {
  color: var(--txt-dim);
  max-width: 620px;
  margin: 0 0 24px;
  font-size: 17px;
  line-height: 1.55;
}

.firststep__media {
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: 22px;
  display: grid;
}

@media (min-width: 860px) {
  .firststep__media {
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
    gap: 30px;
  }
}

.firststep__qr {
  align-items: center;
  gap: 18px;
  display: flex;
}

.firststep__qr-frame {
  background: #fff;
  border-radius: 16px;
  flex: none;
  width: 132px;
  height: 132px;
  padding: 9px;
}

.firststep__qr-frame img {
  width: 100%;
  height: 100%;
  display: block;
}

.firststep__qr-wait {
  background: #08151b14;
  border-radius: 8px;
  width: 100%;
  height: 100%;
}

.firststep__qr-text {
  min-width: 0;
}

.firststep__qr-text strong {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  margin-bottom: 5px;
  font-size: 17px;
  font-weight: 600;
  display: block;
}

.firststep__qr-text span {
  color: var(--txt-dim);
  font-size: 14px;
  line-height: 1.5;
}

.firststep__actions {
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 26px;
  display: flex;
}

@media (max-width: 560px) {
  .firststep {
    padding: 24px 20px 22px;
  }

  .firststep__qr {
    gap: 14px;
  }

  .firststep__qr-frame {
    width: 112px;
    height: 112px;
  }
}

.done-banner {
  border: 1px solid var(--hairline-bright);
  background: linear-gradient(135deg, #228b9629, #0664810f);
  border-radius: 18px;
  align-items: flex-start;
  gap: 18px;
  margin-bottom: 24px;
  padding: 24px 26px;
  display: flex;
}

.done-banner__icon .anticon {
  color: var(--accent-bright);
  font-size: 30px;
}

.done-banner__body h3 {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  margin: 0 0 6px;
  font-size: 22px;
  font-weight: 600;
}

.done-banner__body p {
  color: var(--txt-dim);
  max-width: 60ch;
  margin: 0 0 16px;
  font-size: 15px;
  line-height: 1.55;
}

.done-banner__actions {
  flex-wrap: wrap;
  gap: 12px;
  display: flex;
}

.upgroup {
  margin-bottom: 40px;
}

.upgroup__head {
  margin-bottom: 16px;
}

.upgroup__title {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  margin: 0;
  font-size: 24px;
  font-weight: 600;
}

.upgroup__blurb {
  color: var(--txt-dim);
  margin: 4px 0 0;
  font-size: 15px;
}

.uplist {
  flex-direction: column;
  gap: 16px;
  display: flex;
}

.upcard {
  border: 1px solid var(--hairline);
  background: var(--glass);
  text-align: left;
  font: inherit;
  color: inherit;
  cursor: pointer;
  border-radius: 18px;
  grid-template-columns: 240px 1fr;
  width: 100%;
  padding: 0;
  transition: border-color .2s, background .2s, transform .2s;
  display: grid;
  overflow: hidden;
}

.upcard:hover {
  border-color: var(--hairline-bright);
  background: var(--glass-strong);
  transform: translateY(-2px);
}

.upcard__media {
  background: var(--glass-strong);
  min-height: 190px;
  position: relative;
  overflow: hidden;
}

.upcard__media img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  transition: transform .35s;
  position: absolute;
  inset: 0;
}

.upcard:hover .upcard__media img {
  transform: scale(1.05);
}

.upcard__content {
  flex-direction: column;
  gap: 10px;
  padding: 24px 26px;
  display: flex;
}

.upcard__tag {
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--accent-bright);
  align-self: flex-start;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
}

.upcard__ico .anticon {
  font-size: 15px;
}

.upcard__hook {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.3;
}

.upcard__body {
  color: var(--txt-dim);
  flex: 1;
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
}

.upcard__link {
  color: var(--txt-dim);
  align-self: flex-start;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
  font-size: 14px;
  font-weight: 500;
  transition: color .2s;
  display: inline-flex;
}

.upcard:hover .upcard__link {
  color: var(--accent-bright);
}

@media (max-width: 720px) {
  .upcard {
    grid-template-columns: 1fr;
  }

  .upcard__media {
    min-height: 170px;
  }
}

.gtopic {
  border-top: 1px solid var(--hairline);
}

.gtopic:first-child {
  border-top: none;
}

.gtopic__head {
  cursor: pointer;
  align-items: center;
  gap: 14px;
  padding: 16px 0;
  display: flex;
}

.gtopic__num {
  width: 28px;
  height: 28px;
  font-family: var(--font-display), sans-serif;
  color: var(--accent-bright);
  background: #228b961f;
  border: 1px solid #228b9659;
  border-radius: 8px;
  flex: none;
  place-items: center;
  font-size: 13px;
  font-weight: 700;
  display: grid;
}

.gtopic__title {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  flex: 1;
  font-size: 17px;
  font-weight: 600;
}

.gtchev {
  color: var(--txt-dim);
  font-size: 12px;
  transition: transform .25s, color .25s;
}

.gtchev.open {
  color: var(--accent-bright);
  transform: rotate(90deg);
}

.gtopic__body {
  padding: 2px 0 18px 42px;
}

.gtopic__lead {
  color: var(--txt-dim);
  margin: 0 0 10px;
  font-size: 15px;
}

.gtopic__bullets {
  flex-direction: column;
  gap: 8px;
  margin: 0 0 18px;
  padding: 0;
  list-style: none;
  display: flex;
}

.gtopic__bullets li {
  color: var(--txt-dim);
  font-size: 15px;
}

.kbd {
  text-align: center;
  border: 1px solid var(--hairline-bright);
  background: var(--glass-strong);
  color: #fff;
  min-width: 44px;
  font-family: var(--font-display), sans-serif;
  border-radius: 7px;
  margin-right: 10px;
  padding: 3px 9px;
  font-size: 12px;
  font-weight: 600;
  display: inline-block;
}

.gtopic__items {
  flex-direction: column;
  gap: 26px;
  margin-top: 22px;
  display: flex;
}

.gitem__head {
  align-items: baseline;
  gap: 10px;
  display: flex;
}

.gitem__num {
  color: var(--accent-bright);
  font-family: var(--font-display), sans-serif;
  flex: none;
  font-size: 13px;
  font-weight: 700;
}

.gitem__title {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
}

.gitem__d {
  color: var(--txt-dim);
  margin: 9px 0 0 30px;
  font-size: 15px;
  line-height: 1.6;
}

.gitem__d strong {
  color: #fff;
  font-weight: 600;
}

.gitem__list {
  margin: 4px 0 0;
  padding-left: 18px;
}

.gitem__list li {
  margin-bottom: 3px;
}

.gitem__shot {
  border: 1px solid var(--hairline);
  background: #0c1b22;
  border-radius: 22px;
  width: 100%;
  max-width: 260px;
  margin: 14px 0 0 30px;
  overflow: hidden;
}

.gitem__shot img {
  width: 100%;
  display: block;
}

@media (max-width: 560px) {
  .gsection__body {
    padding: 2px 18px 12px;
  }

  .gtopic__body {
    padding-left: 26px;
  }

  .sheet-overlay {
    padding: 12px;
  }

  .sheet {
    border-radius: 20px;
    padding: 26px 20px 22px;
  }

  .gitem__shot, .gitem__d {
    margin-left: 0;
  }
}

.hwcard {
  border: 1px solid var(--hairline);
  background: var(--glass);
  border-radius: 18px;
  transition: transform .2s, border-color .2s;
  overflow: hidden;
}

.hwcard:hover {
  border-color: var(--hairline-bright);
  transform: translateY(-3px);
}

.hwcard__img {
  aspect-ratio: 4 / 3;
  background: #f4f6f8;
  display: block;
}

.hwcard__img img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.hwcard__body {
  padding: 16px 18px;
}

.hwcard__body h4 {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.hwcard__body p {
  color: var(--txt-dim);
  margin: 6px 0 0;
  font-size: 14px;
  line-height: 1.45;
}

.fblocks {
  flex-direction: column;
  gap: 26px;
  display: flex;
}

.fblock {
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 36px;
  padding: 14px 0;
  display: grid;
}

.fblock__media {
  border: 1px solid var(--hairline);
  aspect-ratio: 4 / 3;
  background: #0c1b22;
  border-radius: 20px;
  order: 0;
  overflow: hidden;
}

.fblock:nth-child(2n) .fblock__media {
  order: 2;
}

.fblock__media img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.fblock__media--icon {
  border-color: var(--hairline-bright);
  background: radial-gradient(420px 240px at 50% 30%, #228b9647, transparent 70%),
    var(--glass);
  place-items: center;
  display: grid;
}

.fblock__media--icon .anticon {
  color: var(--accent-bright);
  filter: drop-shadow(0 0 24px #228b968c);
  font-size: 72px;
}

.fblock__body h3 {
  font-size: 25px;
  font-weight: 600;
}

.fblock__body p {
  color: var(--txt-dim);
  margin: 12px 0 0;
  font-size: 16px;
  line-height: 1.6;
}

@media (max-width: 760px) {
  .fblock {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .fblock:nth-child(2n) .fblock__media {
    order: 0;
  }
}

.frow {
  border-bottom: 1px solid var(--hairline);
  align-items: center;
  gap: 16px;
  padding: 16px 4px;
  display: flex;
}

.frow__icon {
  width: 44px;
  height: 44px;
  color: var(--accent-bright);
  background: #228b961f;
  border: 1px solid #228b964d;
  border-radius: 12px;
  place-items: center;
  font-size: 20px;
  display: grid;
}

.pill {
  border: 1px solid var(--hairline);
  background: var(--glass-strong);
  color: var(--txt);
  border-radius: 999px;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  font-size: 13px;
  font-weight: 600;
  display: inline-flex;
}

.pill--accent {
  color: var(--accent-bright);
  border-color: #228b9673;
}

@keyframes yp-reveal {
  from {
    opacity: 0;
    transform: translateY(16px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.reveal {
  animation: .55s cubic-bezier(.2, .7, .2, 1) both yp-reveal;
}

@media (prefers-reduced-motion: reduce) {
  .reveal {
    animation: none;
  }
}

.drawer-rich :where(p, ul, ol) {
  margin: 0 0 12px;
}

.progress-line {
  margin-bottom: 22px;
}

.progress-line__meta {
  color: var(--txt-dim);
  justify-content: space-between;
  margin-bottom: 8px;
  font-size: 13px;
  font-weight: 600;
  display: flex;
}

.progress-track {
  background: #ffffff14;
  border-radius: 999px;
  height: 8px;
  overflow: hidden;
}

.progress-fill {
  background: linear-gradient(90deg, var(--accent), var(--accent-bright));
  border-radius: 999px;
  height: 100%;
  transition: width .5s cubic-bezier(.2, .7, .2, 1);
  box-shadow: 0 0 16px #228b9699;
}

.taskcard {
  border: 1px solid var(--hairline);
  background: var(--glass);
  cursor: pointer;
  border-radius: 18px;
  align-items: center;
  gap: 16px;
  padding: 16px 18px;
  transition: transform .2s, border-color .2s, background .2s;
  display: flex;
}

.taskcard:hover {
  border-color: var(--hairline-bright);
  background: var(--glass-strong);
  transform: translateY(-2px);
}

.taskcard.done {
  border-color: #228b9652;
}

.taskcheck {
  cursor: pointer;
  width: 36px;
  height: 36px;
  font-family: var(--font-display), sans-serif;
  color: var(--accent-bright);
  background: #228b961a;
  border: 1px solid #228b9666;
  border-radius: 50%;
  flex: none;
  place-items: center;
  font-size: 15px;
  font-weight: 700;
  transition: background .2s, color .2s, transform .15s;
  display: grid;
}

.taskcheck:hover {
  transform: scale(1.08);
}

.taskcheck.on {
  background: var(--accent-bright);
  border-color: var(--accent-bright);
  color: #07242b;
}

.taskcard__title {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  font-size: 17px;
  font-weight: 600;
}

.taskcard.done .taskcard__title {
  color: var(--txt-dim);
}

.taskcard__why {
  color: var(--txt-dim);
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 2px;
  font-size: 14px;
  overflow: hidden;
}

.taskcard__chev {
  color: var(--txt-dim);
  font-size: 13px;
}

.sheet-overlay {
  z-index: 70;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  background: #040c10a8;
  place-items: center;
  padding: 24px;
  animation: .25s yp-fade;
  display: grid;
  position: fixed;
  inset: 0;
}

.sheet {
  border: 1px solid var(--hairline-bright);
  background: linear-gradient(#0d2230, #0a1820);
  border-radius: 26px;
  width: min(840px, 100%);
  max-height: 90dvh;
  padding: 40px;
  animation: .3s cubic-bezier(.2, .7, .2, 1) yp-rise;
  position: relative;
  overflow-y: auto;
  box-shadow: 0 40px 100px -30px #000000d9;
}

.sheet--note {
  text-align: left;
  width: min(520px, 100%);
  padding: 40px 36px 34px;
}

.sheet--note h2 {
  margin: 0 0 14px;
  font-size: 30px;
  font-weight: 500;
}

.sheet--note p {
  color: var(--txt-dim);
  margin: 0 0 12px;
  font-size: 17px;
  line-height: 1.55;
}

.sheet__note-dim {
  opacity: .8;
  font-size: 15px !important;
}

.notemark {
  width: 52px;
  height: 52px;
  color: var(--accent-bright);
  background: #228b9629;
  border: 1px solid #228b9666;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  margin-bottom: 22px;
  font-size: 24px;
  display: inline-flex;
}

.sheet__note-actions {
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 26px;
  display: flex;
}

.sheet__close {
  color: var(--txt-dim);
  cursor: pointer;
  background: none;
  border: none;
  padding: 6px;
  font-size: 18px;
  position: absolute;
  top: 18px;
  right: 18px;
}

.sheet__close:hover {
  color: #fff;
}

.sheet__head {
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  margin: 10px 0 0;
  display: flex;
}

.sheet__head h2 {
  font-size: 26px;
  font-weight: 500;
}

.sheet__why {
  color: var(--light-blue);
  margin: 12px 0 20px;
  font-size: 16px;
  line-height: 1.5;
}

.sheet__shot {
  border: 1px solid var(--hairline);
  border-radius: 16px;
  margin-bottom: 22px;
  overflow: hidden;
}

.sheet__shot img {
  width: 100%;
  display: block;
}

.sheet__shot-ph {
  aspect-ratio: 16 / 9;
  color: var(--txt-dim);
  background: repeating-linear-gradient(-45deg,
      #ffffff05 0 10px,
      transparent 10px 20px),
    var(--surface-alt, #0f2129);
  align-content: center;
  place-items: center;
  gap: 8px;
  font-size: 13px;
  display: grid;
}

.sheet__shot-ph .anticon {
  opacity: .7;
  font-size: 28px;
}

.sheet__steps {
  counter-reset: substep;
  margin-bottom: 24px;
}

.sheet__steps p {
  min-height: 28px;
  color: var(--txt);
  margin: 0 0 16px;
  padding-left: 42px;
  font-size: 16px;
  line-height: 1.5;
  position: relative;
}

.sheet__steps p:before {
  counter-increment: substep;
  content: counter(substep);
  width: 28px;
  height: 28px;
  font-family: var(--font-display), sans-serif;
  color: var(--accent-bright);
  background: #228b9624;
  border: 1px solid #228b9666;
  border-radius: 50%;
  place-items: center;
  font-size: 13px;
  font-weight: 700;
  display: grid;
  position: absolute;
  top: -2px;
  left: 0;
}

.isteps {
  margin-bottom: 28px;
}

.istep {
  gap: 16px;
  margin-bottom: 24px;
  display: flex;
}

.istep:last-child {
  margin-bottom: 0;
}

.istep__num {
  width: 30px;
  height: 30px;
  font-family: var(--font-display), sans-serif;
  color: var(--accent-bright);
  background: #228b9624;
  border: 1px solid #228b9666;
  border-radius: 50%;
  flex: none;
  place-items: center;
  font-size: 14px;
  font-weight: 700;
  display: grid;
}

.istep__body {
  flex: 1;
  min-width: 0;
}

.istep__text {
  color: var(--txt);
  margin: 3px 0 0;
  font-size: 17px;
  line-height: 1.5;
}

.istep__shot {
  border: 1px solid var(--hairline);
  background: var(--surface-alt);
  border-radius: 22px;
  max-width: 260px;
  margin-top: 14px;
  overflow: hidden;
}

.istep__shot img {
  width: 100%;
  display: block;
}

.sheet__actions {
  flex-wrap: wrap;
  gap: 12px;
  display: flex;
}

.sheet__help {
  color: var(--txt-dim);
  cursor: pointer;
  background: none;
  border: none;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  padding: 0;
  font-size: 14px;
  transition: color .2s;
  display: inline-flex;
}

.sheet__help:hover {
  color: var(--accent-bright);
}

@keyframes yp-fade {
  from {
    opacity: 0;
  }
}

@keyframes yp-rise {
  from {
    opacity: 0;
    transform: translateY(16px)scale(.98);
  }
}

.chat-fab {
  z-index: 45;
  border: 1px solid var(--hairline-bright);
  background: linear-gradient(160deg, var(--accent), var(--accent-bright));
  color: #fff;
  height: 52px;
  font-family: var(--font-display), sans-serif;
  cursor: pointer;
  border-radius: 26px;
  align-items: center;
  gap: 10px;
  padding: 0 20px;
  font-size: 15px;
  font-weight: 600;
  transition: transform .2s;
  display: inline-flex;
  position: fixed;
  bottom: 22px;
  right: 22px;
  box-shadow: 0 14px 40px -10px #228b9699;
}

.chat-fab:hover {
  transform: translateY(-2px);
}

.chat-fab .anticon {
  font-size: 19px;
}

.chat-panel {
  z-index: 66;
  border: 1px solid var(--hairline-bright);
  background: linear-gradient(#0d2230, #0a1820);
  border-radius: 20px;
  flex-direction: column;
  width: min(380px, 100vw - 32px);
  height: min(540px, 100dvh - 44px);
  animation: .28s cubic-bezier(.2, .7, .2, 1) yp-rise;
  display: flex;
  position: fixed;
  bottom: 22px;
  right: 22px;
  overflow: hidden;
  box-shadow: 0 30px 80px -20px #000000d9;
}

.chat-panel__head {
  border-bottom: 1px solid var(--hairline);
  background: #228b961a;
  justify-content: space-between;
  align-items: center;
  padding: 16px 18px;
  display: flex;
}

.chat-panel__title {
  font-family: var(--font-display), sans-serif;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
}

.chat-panel__sub {
  color: var(--txt-dim);
  margin-top: 1px;
  font-size: 13px;
}

.chat-panel__close {
  color: var(--txt-dim);
  cursor: pointer;
  background: none;
  border: none;
  padding: 6px;
  font-size: 16px;
}

.chat-panel__close:hover {
  color: #fff;
}

.chat-panel__body {
  flex-direction: column;
  flex: 1;
  gap: 10px;
  padding: 16px;
  display: flex;
  overflow-y: auto;
}

.chat-msg {
  border-radius: 14px;
  max-width: 84%;
  padding: 10px 14px;
  font-size: 14.5px;
  line-height: 1.45;
}

.chat-msg--bot {
  background: var(--glass-strong);
  border: 1px solid var(--hairline);
  color: var(--txt);
  border-bottom-left-radius: 4px;
  align-self: flex-start;
}

.chat-msg--user {
  background: var(--accent);
  color: #fff;
  border-bottom-right-radius: 4px;
  align-self: flex-end;
}

.chat-panel__input {
  border-top: 1px solid var(--hairline);
  gap: 8px;
  padding: 12px;
  display: flex;
}

@media (max-width: 560px) {
  .chat-fab span {
    display: none;
  }

  .chat-fab {
    justify-content: center;
    width: 52px;
    padding: 0;
  }
}

/*# sourceMappingURL=%5Broot-of-the-server%5D__0ltc91p._.css.map*/