/* ==========================================================================
   Base: @font-face / reset / 排版层级 / 栅格原语 / 工具类
   ========================================================================== */

@font-face {
  font-family: "Inter Tight";
  src: url(../fonts/inter-tight-latin.woff2) format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter Tight";
  src: url(../fonts/inter-tight-latin-ext.woff2) format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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: "Inter";
  src: url(../fonts/inter-latin.woff2) format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  src: url(../fonts/inter-latin-ext.woff2) format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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: "JetBrains Mono";
  src: url(../fonts/jetbrains-mono-latin.woff2) format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "JetBrains Mono";
  src: url(../fonts/jetbrains-mono-latin-ext.woff2) format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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;
}

/* 兜底字体做度量覆盖：消除 swap 时的高度跳动（lh=1.0 大标题对此极敏感）。
   数值取自 Inter Tight 实测：upm 2048 / hhea asc 1984 / desc -494。
   Arial 的 x-height 比 Inter 小一档，用 size-adjust 补回来。 */
@font-face {
  font-family: "IT Fallback";
  src: local("Helvetica Neue"), local("Arial");
  ascent-override: 96.9%;
  descent-override: 24.1%;
  line-gap-override: 0%;
  size-adjust: 104%;
}

/* ---------- reset ---------- */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: auto;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  font-weight: var(--fw-book);
  line-height: var(--lh-body);
  letter-spacing: var(--ls-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

/* 机制参数在滚动中不能跳宽 */
.num,
.mono {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

h1,
h2,
h3,
h4,
h5,
p,
figure,
ul,
ol {
  margin: 0;
}

ul,
ol {
  padding: 0;
  list-style: none;
}

img,
svg,
video,
canvas {
  display: block;
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
}

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

/* ---------- 排版层级 ---------- */
/* line-height:1 时字面框仍带半行距，大写字母不会贴合盒顶。
   text-box 裁掉上下多余空间；不支持的浏览器用负 margin 近似。 */
.title-1,
.title-2,
.title-3,
.title-4,
.title-5 {
  font-family: var(--font-display);
  font-weight: var(--fw-display);
  line-height: var(--lh-title);
  letter-spacing: var(--ls-title);
  text-box: trim-both cap alphabetic;
}

@supports not (text-box: trim-both cap alphabetic) {
  .title-1::before,
  .title-2::before,
  .title-3::before,
  .title-4::before,
  .title-5::before {
    content: "";
    display: block;
    width: 0;
    margin-bottom: -0.11em;
  }
  .title-1::after,
  .title-2::after,
  .title-3::after,
  .title-4::after,
  .title-5::after {
    content: "";
    display: block;
    width: 0;
    margin-top: -0.07em;
  }
}

.title-1 { font-size: var(--fs-title-1); }
.title-2 { font-size: var(--fs-title-2); }
.title-3 { font-size: var(--fs-title-3); }
.title-4 { font-size: var(--fs-title-4); }
.title-5 { font-size: var(--fs-title-5); }

.subhead-1 {
  font-size: var(--fs-subhead-1);
  font-weight: var(--fw-medium);
  line-height: var(--lh-subhead);
}

.subhead-2 {
  font-size: var(--fs-subhead-2);
  font-weight: var(--fw-medium);
  line-height: var(--lh-subhead);
}

.body {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  letter-spacing: var(--ls-body);
}

.small,
.link {
  font-size: var(--fs-small);
  font-weight: var(--fw-book);
  letter-spacing: var(--ls-small);
  line-height: 1.4;
}

/* ---------- 栅格原语 ---------- */
/* A. 真栅格容器 */
.grid {
  display: grid;
  grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
  column-gap: var(--grid-gap);
  padding-inline: var(--grid-margin);
}

/* B. 定宽容器（不参与 grid 流的块） */
.container {
  width: var(--grid-width);
  margin-inline: auto;
}

.section {
  position: relative;
  width: 100%;
}

/* ---------- 工具类 ---------- */
.u-w-cols-1  { width: var(--cols-1); }
.u-w-cols-2  { width: var(--cols-2); }
.u-w-cols-3  { width: var(--cols-3); }
.u-w-cols-4  { width: var(--cols-4); }
.u-w-cols-5  { width: var(--cols-5); }
.u-w-cols-6  { width: var(--cols-6); }
.u-w-cols-7  { width: var(--cols-7); }
.u-w-cols-8  { width: var(--cols-8); }
.u-w-cols-9  { width: var(--cols-9); }
.u-w-cols-10 { width: var(--cols-10); }
.u-w-cols-11 { width: var(--cols-11); }
.u-w-cols-12 { width: var(--cols-12); }
.u-w-cols-13 { width: var(--cols-13); }
.u-w-cols-14 { width: var(--cols-14); }
.u-w-cols-15 { width: var(--cols-15); }
.u-w-cols-16 { width: var(--cols-16); }

.u-center { display: flex; align-items: center; justify-content: center; }
.u-text-center { text-align: center; }
.u-relative { position: relative; }
.u-abs-fill { position: absolute; inset: 0; }
.u-overflow-hidden { overflow: hidden; }
.u-no-select { user-select: none; -webkit-user-select: none; }

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

/* ---------- 动效降级 ---------- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ---------- 自定义光标 ---------- */
.has-custom-cursor,
.has-custom-cursor a,
.has-custom-cursor button {
  cursor: none;
}

.cursor-dot {
  position: fixed;
  left: 0;
  top: 0;
  z-index: var(--z-cursor);
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--c-primary);
  pointer-events: none;
  mix-blend-mode: difference;
  transition: width var(--dur-fast) var(--ease-std),
    height var(--dur-fast) var(--ease-std),
    opacity var(--dur-fast) var(--ease-std);
}

.cursor-dot.is-active {
  width: 40px;
  height: 40px;
  opacity: 0.75;
}

.cursor-dot.is-hidden {
  opacity: 0;
}

/* ---------- 页面转场遮罩 ---------- */
.page-veil {
  position: fixed;
  inset: 0;
  z-index: var(--z-transition);
  background: var(--c-primary);
  pointer-events: none;
  transform-origin: 50% 100%;
  transition: transform 0.8s var(--ease-out), opacity 0.8s var(--ease-out);
}

.page-veil.is-open {
  transform: scaleY(0);
  opacity: 0;
}

/* ---------- NEXON 补充件 ---------- */

/* 语义锁的行内着色 */
.t-xo { color: var(--c-primary-light); font-weight: 500; }
.t-exon { color: var(--c-accent); font-weight: 500; }

/* 分区眉标 */
.app-hero__eyebrow,
.section-eyebrow {
  display: block;
  font-family: var(--font-mono);
  font-size: clamp(11px, 0.9vw, 14px);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  color: var(--c-mint);
}

/* PayFi 六步 */
.payfi-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: payfi;
}
.payfi-steps li {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 6px 13px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(11, 13, 12, 0.5);
  font-size: clamp(11px, 0.95vw, 15px);
  letter-spacing: var(--ls-small);
}
.payfi-steps li::before {
  counter-increment: payfi;
  content: counter(payfi, decimal-leading-zero);
  color: var(--c-primary-light);
  opacity: 0.85;
}

/* 幽灵胶囊标签 */
.pill-tag--ghost {
  border-color: var(--line);
  color: var(--fg-muted);
}