* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
html, body { margin: 0; padding: 0; font-family: "PingFang SC", "Microsoft YaHei", sans-serif; color: var(--neutral-700); background: radial-gradient(circle at top right, rgba(125, 211, 252, 0.16), transparent 35%), radial-gradient(circle at top left, rgba(56, 189, 248, 0.12), transparent 34%), var(--white); text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; transition: color 0.25s ease; }
h1, h2, h3, h4, p { margin: 0 0 12px; }
img { max-width: 100%; display: block; }
main { min-height: 60vh; }
.container { width: min(var(--container-max), calc(100% - 48px)); margin: 0 auto; }
.section { padding: 84px 0; }
.section.alt { background: var(--neutral-50); }
.section-title { font-size: 36px; text-align: center; color: var(--neutral-900); margin-bottom: 36px; letter-spacing: 0.2px; }
.grid-3 { display: grid; gap: 20px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.two-col { display: grid; gap: 20px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.center { text-align: center; }
.page-hero { background: var(--gradient-hero); color: var(--neutral-700); padding: 140px 0 70px; border-bottom: 1px solid rgba(14, 165, 233, 0.12); }
.page-hero h1 { font-size: 42px; color: var(--neutral-900); }
*:focus-visible { outline: 2px solid rgba(26, 111, 255, 0.65); outline-offset: 2px; border-radius: 8px; }
.reveal { opacity: 0; transform: translateY(22px); transition: opacity 0.55s ease, transform 0.55s ease; }
.reveal.in-view { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .reveal { opacity: 1; transform: none; }
}
@media (max-width: 900px) {
  .grid-3, .two-col { grid-template-columns: 1fr 1fr; }
  .section { padding: 70px 0; }
}
@media (max-width: 640px) {
  .container { width: calc(100% - 32px); }
  .grid-3, .two-col { grid-template-columns: 1fr; }
  .section-title { font-size: 28px; }
  .section { padding: 58px 0; }
  h1, h2, h3 { word-break: break-word; }
  p { line-height: 1.72; }
}
@media (max-width: 420px) {
  .container { width: calc(100% - 24px); }
  .section { padding: 50px 0; }
  .section-title { font-size: 25px; margin-bottom: 26px; }
}
@media (max-width: 390px) {
  .container { width: calc(100% - 20px); }
  .section { padding: 46px 0; }
  .section-title { font-size: 23px; margin-bottom: 22px; }
  p { line-height: 1.68; }
}