:root {
  --design-min: 1200px;
  --container: 1400px;
  --blue: #0078e8;
  --deep-blue: #003b7f;
  --footer-blue: #00377b;
  --yellow: #ffe100;
  --black: #111111;
  --text: #333333;
  --muted: #707986;
  --line: #e6edf5;
  --light: #f4f8fd;
  --white: #ffffff;
  --shadow: 0 18px 44px rgba(0, 78, 164, 0.12);
  --font: "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
}

:root {
  --motion-ease: cubic-bezier(0.2, 0.85, 0.25, 1);
  --cursor-x: 50vw;
  --cursor-y: 50vh;
}

body.site-page::before,
body.site-page::after {
  position: fixed;
  inset: 0;
  pointer-events: none;
  content: "";
}

body.site-page::before {
  z-index: 900;
  opacity: 0;
  background: radial-gradient(
    180px circle at var(--cursor-x) var(--cursor-y),
    rgba(255, 225, 0, 0.08),
    rgba(0, 120, 232, 0.05) 30%,
    transparent 66%
  );
  transition: opacity 0.35s ease;
}

body.site-page.is-pointer-active::before {
  opacity: 0.72;
}

body.site-page::after {
  z-index: 1200;
  background:
    linear-gradient(90deg, transparent, rgba(255, 225, 0, 0.2), transparent),
    linear-gradient(180deg, #003b7f, #0078e8 48%, #ffffff);
  transform: translateX(105%);
  animation: ysj-page-wipe 0.95s var(--motion-ease) both;
}

.site-header {
  backdrop-filter: blur(2px);
}

.site-header.is-scrolled {
  transform: translateY(0);
  animation: ysj-header-drop 0.5s var(--motion-ease) both;
}

.logo img,
.site-header .phone-link img,
.theory-center img,
.device-large {
  will-change: transform;
}

.logo img {
  transition:
    filter 0.3s ease,
    transform 0.3s var(--motion-ease);
}

.logo:hover img {
  filter: drop-shadow(0 10px 22px rgba(255, 225, 0, 0.28));
  transform: translateY(-2px) scale(1.03);
}

.site-header .phone-link {
  transition:
    color 0.25s ease,
    transform 0.25s var(--motion-ease);
}

.site-header .phone-link:hover {
  transform: translateY(-2px);
}

.site-header .phone-link img {
  animation: ysj-phone-ring 2.8s ease-in-out infinite;
}

.nav-link,
.subnav__item,
.footer-nav a,
.ysj-btn,
.tab-btn,
.hero-dots button,
.tab-arrows button,
.apply-form button,
.footer-hotline,
.history-prev,
.history-next,
.pagination a {
  position: relative;
}

.ysj-btn,
.tab-btn,
.apply-form button,
.footer-hotline,
.pagination a,
.pagination input {
  overflow: hidden;
}

.ysj-btn::before,
.tab-btn::before,
.apply-form button::before,
.footer-hotline::before,
.pagination a::before {
  position: absolute;
  inset: -45% auto -45% -65%;
  width: 52%;
  content: "";
  background: linear-gradient(
    115deg,
    transparent,
    rgba(255, 255, 255, 0.42),
    transparent
  );
  transform: skewX(-18deg);
  animation: ysj-button-sheen 3.8s ease-in-out infinite;
  transition: left 0.55s var(--motion-ease);
}

.ysj-btn:hover::before,
.tab-btn:hover::before,
.apply-form button:hover::before,
.footer-hotline:hover::before,
.pagination a:hover::before {
  left: 118%;
}

.ysj-btn,
.apply-form button {
  isolation: isolate;
  box-shadow:
    0 10px 22px rgba(0, 120, 232, 0.16),
    inset 0 0 0 1px rgba(255, 255, 255, 0.12);
  animation: ysj-button-breathe 2.8s ease-in-out infinite;
}

.ysj-btn:hover,
.apply-form button:hover {
  box-shadow:
    0 14px 30px rgba(0, 120, 232, 0.22),
    0 0 0 4px rgba(0, 120, 232, 0.06);
}

.home-hero,
.inner-hero,
.product-detail-hero {
  position: relative;
  isolation: isolate;
}

.home-hero::before,
.inner-hero::before,
.product-detail-hero::before {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  content: "";
  background:
    radial-gradient(circle at 18% 28%, rgba(255, 225, 0, 0.2), transparent 24%),
    radial-gradient(circle at 76% 18%, rgba(0, 120, 232, 0.22), transparent 28%);
  mix-blend-mode: screen;
  opacity: 0.78;
  animation: ysj-hero-aurora 8s ease-in-out infinite alternate;
}

.home-slide,
.inner-hero__copy,
.product-detail-hero__grid {
  position: relative;
  z-index: 2;
}

.home-slide::before {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  content: "";
  background:
    radial-gradient(circle at 18% 28%, rgba(255, 225, 0, 0.2), transparent 24%),
    radial-gradient(circle at 76% 18%, rgba(0, 120, 232, 0.22), transparent 28%);
  mix-blend-mode: screen;
  opacity: 0.72;
  animation: ysj-hero-aurora 8s ease-in-out infinite alternate;
}

.swiper-slide-active .home-slide__copy {
  animation: ysj-copy-rise 0.82s var(--motion-ease) both 0.12s;
}

.home-slide__copy {
  position: relative;
  z-index: 2;
}

.home-slide__copy h1,
.inner-hero__copy h1,
.product-detail-hero h1 {
  text-shadow: 0 18px 38px rgba(0, 42, 92, 0.22);
}

.home-map__world {
  animation: ysj-float-soft 6.4s ease-in-out infinite;
}

.home-map__china {
  animation: ysj-float-soft 5.8s ease-in-out infinite alternate;
}

.home-map__china {
  filter: drop-shadow(0 22px 38px rgba(0, 80, 170, 0.2));
}

.stats,
.certificate-grid,
.theory-card-grid,
.expert-grid,
.school-card-grid,
.advantage-grid,
.condition-grid,
.news-card-grid,
.culture-grid,
.contact-grid,
.mosaic-grid,
.feature-icons,
.process-diagram,
.education-list,
.school-photo-grid {
  perspective: 1200px;
}

.stat,
.news-card,
.news-row,
.featured-news,
.school-card,
.expert-card,
.certificate-card,
.advantage-card,
.condition-card,
.theory-card,
.product-tab-card,
.culture-main,
.culture-side__item,
.culture-oath,
.contact-grid div,
.feature-icons div,
.process-step__body,
.side-news,
.mosaic-grid img,
.school-photo-grid img,
.product-intro__img-wrap,
.founder-img,
.round-img,
.article-cover {
  position: relative;
  overflow: hidden;
  transform: perspective(1000px) rotateX(var(--tilt-x, 0deg))
    rotateY(var(--tilt-y, 0deg)) translate3d(0, 0, 0);
  transform-style: preserve-3d;
  transition:
    transform 0.32s var(--motion-ease),
    box-shadow 0.32s ease,
    border-color 0.32s ease,
    filter 0.32s ease;
  will-change: transform;
}

.stat:hover,
.news-card:hover,
.news-row:hover,
.featured-news:hover,
.school-card:hover,
.expert-card:hover,
.certificate-card:hover,
.advantage-card:hover,
.condition-card:hover,
.theory-card:hover,
.product-tab-card:hover,
.culture-main:hover,
.culture-side__item:hover,
.culture-oath:hover,
.contact-grid div:hover,
.feature-icons div:hover,
.process-step__body:hover,
.side-news:hover,
.mosaic-grid img:hover,
.school-photo-grid img:hover,
.product-intro__img-wrap:hover,
.founder-img:hover,
.round-img:hover,
.article-cover:hover {
  box-shadow:
    0 28px 68px rgba(0, 78, 164, 0.18),
    0 0 0 1px rgba(0, 120, 232, 0.08);
  filter: saturate(1.06);
}

.ysj-hover-glow {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: radial-gradient(
    120px circle at var(--glow-x, 50%) var(--glow-y, 50%),
    rgba(255, 225, 0, 0.1),
    rgba(0, 120, 232, 0.06) 34%,
    transparent 70%
  );
  opacity: 0;
  transition: opacity 0.26s ease;
}

.is-glowing > .ysj-hover-glow {
  opacity: 0.72;
}

.news-card > :not(.ysj-hover-glow),
.news-row > :not(.ysj-hover-glow),
.featured-news > :not(.ysj-hover-glow),
.school-card > :not(.ysj-hover-glow),
.expert-card > :not(.ysj-hover-glow),
.certificate-card > :not(.ysj-hover-glow),
.advantage-card > :not(.ysj-hover-glow),
.condition-card > :not(.ysj-hover-glow),
.theory-card > :not(.ysj-hover-glow),
.product-tab-card > :not(.ysj-hover-glow),
.culture-main > :not(.ysj-hover-glow),
.culture-side__item > :not(.ysj-hover-glow),
.culture-oath > :not(.ysj-hover-glow),
.contact-grid div > :not(.ysj-hover-glow),
.feature-icons div > :not(.ysj-hover-glow),
.process-step__body > :not(.ysj-hover-glow),
.education-list a > :not(.ysj-hover-glow),
.side-news > :not(.ysj-hover-glow),
.product-intro__img-wrap > :not(.ysj-hover-glow),
.stat > :not(.ysj-hover-glow) {
  position: relative;
  z-index: 2;
}

.news-card img,
.featured-news img,
.school-card img,
.expert-card img,
.certificate-card img,
.mosaic-grid img,
.school-photo-grid img,
.side-news img,
.article-cover,
.founder-img,
.round-img {
  transition:
    transform 0.55s var(--motion-ease),
    filter 0.4s ease;
}

.news-card:hover img,
.featured-news:hover img,
.school-card:hover img,
.expert-card:hover img,
.certificate-card:hover img,
.side-news:hover img,
.mosaic-grid img:hover,
.school-photo-grid img:hover,
.article-cover:hover,
.founder-img:hover,
.round-img:hover {
  transform: scale(1.055);
}

.theory-orbit::before {
  animation: ysj-orbit-spin 20s linear infinite;
}

.theory-node i,
.theory-card i,
.feature-icons svg,
.process-step i,
.about-title-panel__icon,
.culture-main__icon,
.culture-side__icon,
.culture-oath__icon {
  transition:
    transform 0.32s var(--motion-ease),
    box-shadow 0.32s ease,
    background 0.32s ease;
}

.theory-node:hover i,
.theory-card:hover i,
.feature-icons div:hover svg,
.process-step__body:hover i,
.about-title-panel:hover .about-title-panel__icon,
.culture-main:hover .culture-main__icon,
.culture-side__item:hover .culture-side__icon,
.culture-oath:hover .culture-oath__icon {
  transform: translateY(-4px) rotate(-4deg) scale(1.06);
  box-shadow: 0 16px 34px rgba(0, 120, 232, 0.22);
}

.theory-center {
  animation: ysj-pulse-core 3.2s ease-in-out infinite;
}

.history-item__dot,
.process-step__dot,
.featured-news-pagination .swiper-pagination-bullet,
.hero-dots .swiper-pagination-bullet {
  box-shadow: 0 0 0 0 rgba(255, 225, 0, 0.28);
}

.history-item:hover .history-item__dot,
.swiper-slide-active .history-item__dot,
.featured-news-pagination .swiper-pagination-bullet-active,
.hero-dots .swiper-pagination-bullet-active {
  animation: ysj-dot-pulse 1.8s ease-out infinite;
}

.tab-panel.is-active {
  animation: ysj-panel-in 0.52s var(--motion-ease) both;
}

.faq-answer {
  transition:
    max-height 0.34s var(--motion-ease),
    opacity 0.24s ease,
    transform 0.28s var(--motion-ease);
  transform: translateY(-6px);
}

.faq-item.is-open .faq-answer {
  transform: translateY(0);
}

.subnav {
  backdrop-filter: blur(12px);
}

/* .subnav__item::after,
.nav-link::after {
  position: absolute;
  inset-inline: 50%;
  bottom: 24px;
  height: 1px;
  content: "";
  background: currentColor;
  opacity: 0;
  transition:
    inset-inline 0.24s var(--motion-ease),
    opacity 0.24s ease;
} */

.subnav__item::after {
  bottom: 17px;
}

.subnav__item:hover::after,
.subnav__item.is-active::after,
.nav-link:hover::after,
.nav-link.is-active::after {
  inset-inline: 18%;
  opacity: 0.48;
}

.home-about,
.home-product,
.home-theory,
.home-welfare,
.home-news,
.brand-origin,
.brand-honor,
.history,
.education-section,
.theory-list,
.expert-section,
.product-mosaic,
.product-intro,
.product-copy,
.school-intro,
.school-vision,
.school-cooperation,
.join-advantages,
.join-process,
.join-conditions,
.join-faq,
.apply-section,
.news-page,
.news-list-page,
.about-profile,
.about-culture,
.about-contact,
.welfare-article,
.article-page {
  content-visibility: auto;
  contain-intrinsic-size: 1px 680px;
}

.ysj-reveal {
  opacity: 0;
  transform: translateY(34px) scale(0.985);
  transition:
    opacity 0.68s ease,
    transform 0.68s var(--motion-ease);
  transition-delay: var(--reveal-delay, 0ms);
}

.ysj-reveal.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.ysj-reveal-group > * {
  transition-delay: calc(var(--reveal-index, 0) * 70ms);
}

@keyframes ysj-page-wipe {
  0% {
    transform: translateX(-105%);
  }

  42% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(105%);
  }
}

@keyframes ysj-header-drop {
  from {
    transform: translateY(-18px);
  }

  to {
    transform: translateY(0);
  }
}

@keyframes ysj-phone-ring {
  0%,
  78%,
  100% {
    transform: rotate(0deg) scale(1);
  }

  82% {
    transform: rotate(-14deg) scale(1.08);
  }

  86% {
    transform: rotate(12deg) scale(1.08);
  }

  90% {
    transform: rotate(-9deg) scale(1.06);
  }

  94% {
    transform: rotate(6deg) scale(1.03);
  }
}

@keyframes ysj-hero-aurora {
  from {
    transform: translate3d(-1.5%, -1%, 0) scale(1);
    opacity: 0.52;
  }

  to {
    transform: translate3d(1.5%, 1%, 0) scale(1.04);
    opacity: 0.82;
  }
}

@keyframes ysj-copy-rise {
  from {
    opacity: 0;
    transform: translateY(34px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes ysj-float-soft {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-7px);
  }
}

@keyframes ysj-button-breathe {
  0%,
  100% {
    box-shadow:
      0 10px 22px rgba(0, 120, 232, 0.16),
      inset 0 0 0 1px rgba(255, 255, 255, 0.12);
  }

  50% {
    box-shadow:
      0 14px 28px rgba(0, 120, 232, 0.22),
      0 0 0 4px rgba(255, 225, 0, 0.08),
      inset 0 0 0 1px rgba(255, 255, 255, 0.2);
  }
}

@keyframes ysj-button-sheen {
  0%,
  62% {
    left: -65%;
  }

  100% {
    left: 118%;
  }
}

@keyframes ysj-orbit-spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

@keyframes ysj-pulse-core {
  0%,
  100% {
    box-shadow: 0 18px 48px rgba(0, 120, 232, 0.16);
  }

  50% {
    box-shadow:
      0 22px 68px rgba(0, 120, 232, 0.25),
      0 0 0 14px rgba(0, 120, 232, 0.06);
  }
}

@keyframes ysj-dot-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 225, 0, 0.34);
  }

  100% {
    box-shadow: 0 0 0 14px rgba(255, 225, 0, 0);
  }
}

@keyframes ysj-panel-in {
  from {
    opacity: 0;
    transform: translateY(18px) scale(0.98);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

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

  .ysj-reveal {
    opacity: 1;
    transform: none;
  }
}

* {
  box-sizing: border-box;
}

html {
  min-width: var(--design-min);
  scroll-behavior: smooth;
}

body.site-page {
  min-width: var(--design-min);
  margin: 0;
  color: var(--text);
  font-family: var(--font);
  background: var(--white);
  overflow-x: hidden;
}

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

img {
  display: block;
  max-width: 100%;
}

button,
input,
textarea {
  font-family: var(--font);
}

.ysj-container {
  width: min(var(--container), 100%);
  margin-inline: auto;
}

.site-header .ysj-container {
  width: min(1560px, 100%);
}

.site-header {
  position: fixed;
  inset-block-start: 0;
  inset-inline: 0;
  z-index: 1000;
  height: 97px;
  color: var(--white);
  background: rgba(0, 0, 0, 0.12);
  border-bottom: 1px solid rgba(255, 255, 255, 0.22);
  transition:
    background 0.25s ease,
    box-shadow 0.25s ease;
}

.light-header-page .site-header {
  color: var(--black);
  background: rgba(255, 255, 255, 0.96);
  border-bottom-color: #e7e7e7;
}

.site-header.is-scrolled {
  background: rgba(0, 93, 185, 0.95);
  box-shadow: 0 8px 28px rgba(0, 55, 123, 0.18);
}

.light-header-page .site-header.is-scrolled {
  color: var(--black);
  background: rgba(255, 255, 255, 0.98);
}

.header-inner {
  display: grid;
  grid-template-columns: 193px 1fr 270px;
  align-items: center;
  height: 97px;
  gap: 34px;
}

.section-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

.footer-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

.home-product > .ysj-container,
.home-welfare > *:not(.section-bg),
.join-call > *:not(.section-bg),
.brand-origin > *:not(.section-bg),
.education-section > *:not(.section-bg),
.join-conditions > *:not(.section-bg) {
  position: relative;
  z-index: 1;
}

.footer-inner,
.footer-copy {
  position: relative;
  z-index: 1;
}

.logo img {
  width: 193px;
  height: 94px;
  object-fit: contain;
}

.nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 37px;
}

.site-header .nav-link {
  display: inline-flex;
  align-items: center;
  height: 97px;
  color: var(--white);
  font-size: 16px;
  line-height: 22px;
  white-space: nowrap;
  background-image: linear-gradient(90deg, var(--yellow), var(--yellow));
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 0 4px;
  transition:
    color 0.24s ease,
    transform 0.24s ease,
    background-size 0.24s ease;
}

.light-header-page .site-header .nav-link {
  color: var(--black);
}

.site-header .nav-link:hover,
.site-header .nav-link.is-active {
  color: var(--yellow);
  transform: scale(1.05);
  background-size: 64px 4px;
}

.light-header-page .site-header .nav-link:hover,
.light-header-page .site-header .nav-link.is-active {
  color: #111;
}

.site-header .phone-link {
  display: inline-flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  color: var(--white);
  font-size: 16px;
  white-space: nowrap;
}

.light-header-page .site-header .phone-link {
  color: var(--black);
}

.site-header .phone-link img {
  width: 18px;
  height: 18px;
}

.site-header .phone-link strong {
  color: var(--yellow);
  font-size: 26px;
  font-weight: 700;
}

.home-hero,
.inner-hero {
  margin-block-start: 0;
}

.home-hero {
  height: 960px;
  overflow: hidden;
  background: #000;
}

.home-slide {
  height: 960px;
  padding-block-start: 97px;
  color: var(--white);
  position: relative;
  overflow: hidden;
}

.slide-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

.home-slide--lobby::after,
.home-slide--product::after,
.home-slide--building::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.home-slide--lobby::after {
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.04));
}

.home-slide--product::after {
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.55), rgba(0, 0, 0, 0.08));
}

.home-slide--building::after {
  background: linear-gradient(
    90deg,
    rgba(0, 52, 116, 0.58),
    rgba(0, 52, 116, 0.12)
  );
}

.home-slide__copy {
  padding-block-start: 270px;
}

.home-slide__copy h1 {
  margin: 0 0 14px;
  color: var(--white);
  font-size: 48px;
  font-weight: 600;
  line-height: 64px;
}

.home-slide__copy div {
  margin-block-end: 55px;
  color: rgba(255, 255, 255, 0.92);
  font-size: 20px;
  line-height: 26px;
}

.hero-dots {
  position: relative;
  display: flex;
  justify-content: center;
  gap: 14px;
  margin-block-start: -72px;
  z-index: 2;
}

.hero-dots .swiper-pagination-bullet {
  width: 42px;
  height: 5px;
  padding: 0;
  cursor: pointer;
  background: rgba(255, 255, 255, 0.65);
  border: 0;
  border-radius: 20px;
  opacity: 1;
  transition:
    width 0.22s ease,
    background 0.22s ease;
}

.hero-dots .swiper-pagination-bullet-active,
.hero-dots .swiper-pagination-bullet:hover {
  width: 66px;
  background: var(--yellow);
}

.ysj-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 132px;
  height: 54px;
  padding-inline: 28px;
  color: var(--white);
  font-size: 20px;
  line-height: 1;
  white-space: nowrap;
  background: var(--blue);
  border-radius: 999px;
  box-shadow: 0 12px 28px rgba(0, 120, 232, 0.22);
  transition:
    transform 0.24s ease,
    box-shadow 0.24s ease,
    background 0.24s ease;
}

.ysj-btn:hover {
  transform: translateY(-4px);
  background: #026bd0;
  box-shadow: 0 18px 38px rgba(0, 120, 232, 0.3);
}

.eyebrow {
  color: #006ad8;
  font-size: 20px;
  line-height: 24px;
  font-weight: 500;
}

.body-copy {
  color: #5a6470;
  font-size: 17px;
  line-height: 33px;
  font-weight: 400;
}

.home-about {
  min-height: 862px;
  padding-block: 110px 90px;
  background: var(--white);
}

.home-about__grid {
  display: grid;
  grid-template-columns: 760px 1fr;
  grid-template-rows: auto auto;
  align-items: center;
  gap: 28px 60px;
}

.home-about__copy h2 {
  margin: 38px 0 48px;
  color: var(--black);
  font-size: 48px;
  font-weight: 600;
  line-height: 67px;
}

.home-about__copy .body-copy {
  width: 884px;
  max-width: 100%;
  margin-block-end: 70px;
}

.home-map {
  display: grid;
  place-items: center;
  min-height: 420px;
}

.home-map__world {
  width: 680px;
  opacity: 0.92;
}

.home-map__china {
  width: 250px;
  margin-block-start: -310px;
  margin-inline-start: 265px;
  filter: drop-shadow(0 12px 24px rgba(255, 0, 0, 0.18));
}

.stats {
  display: grid;
  grid-template-columns: repeat(3, 160px);
  gap: 96px;
  grid-column: 1 / -1;
  justify-content: center;
}

.stat {
  text-align: center;
  width: 300px;
}

.stat strong {
  display: block;
  color: var(--blue);
  font-size: 45px;
  line-height: 1;
  font-weight: 700;
}

.stat span {
  display: block;
  margin-block-start: 22px;
  color: #4f5b67;
  font-size: 18px;
  line-height: 34px;
}

.honor-showcase {
  background: #eef6ff;
}

.honor-showcase img {
  width: 100%;
}

.home-product {
  position: relative;
  overflow: hidden;
  min-height: 960px;
  padding-block: 95px 85px;
}

.home-product__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-block-end: 56px;
}

.section-title span {
  display: block;
  margin-block-end: 22px;
  color: #006ad8;
  font-size: 20px;
  line-height: 24px;
}

.section-title strong {
  display: block;
  color: var(--black);
  font-size: 48px;
  line-height: 67px;
  font-weight: 600;
}

.tabs {
  display: flex;
  gap: 72px;
  padding-block-start: 56px;
}

.tab-btn {
  padding: 0 0 14px;
  color: #666;
  font-size: 16px;
  line-height: 20px;
  white-space: nowrap;
  cursor: pointer;
  background: none;
  border: 0;
  border-bottom: 2px solid transparent;
  transition:
    color 0.24s ease,
    transform 0.24s ease,
    border-color 0.24s ease;
}

.tab-btn:hover,
.tab-btn.is-active {
  color: var(--blue);
  transform: translateY(-2px);
  border-bottom-color: var(--blue);
}

.tab-panel {
  display: none;
}

.tab-panel.is-active {
  display: block;
}

.product-tab-card {
  display: grid;
  grid-template-columns: 420px 1fr;
  align-items: center;
  width: 100%;
  min-height: 540px;
  padding: 80px;
  background: var(--white);
  border-radius: 16px;
  box-shadow: 0 18px 60px rgba(20, 80, 138, 0.14);
}

.product-tab-card h3 {
  margin: 0 0 42px;
  color: #111;
  font-size: 40px;
  line-height: 67px;
  font-weight: 600;
}

.product-tab-card img {
  width: 520px;
  height: 430px;
  justify-self: center;
  object-fit: contain;
  border-radius: 14px;
  background: #f4f4f4;
}

.tab-arrows {
  display: flex;
  gap: 12px;
  margin-block-start: 84px;
}

.tab-arrows button {
  width: 34px;
  height: 34px;
  color: #667085;
  cursor: pointer;
  background: var(--white);
  border: 1px solid #d8dee8;
  border-radius: 4px;
}

.home-theory,
.theory-band {
  padding-block: 100px;
  background-size: cover;
  background-position: center;
}

.theory-title {
  text-align: center;
}

.theory-title h2 {
  margin: 0;
  color: #111;
  font-size: 40px;
  line-height: 67px;
  font-weight: 600;
}

.theory-title div {
  margin-block-start: 8px;
  color: #687586;
  font-size: 20px;
  line-height: 26px;
}

.theory-orbit {
  position: relative;
  width: 500px;
  height: 500px;
  margin: 70px auto 50px; /* 留出上下空间 */
}

.theory-orbit::before {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid #d8dee8;
  border-radius: 50%;
  z-index: 1;
}

.theory-center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: grid;
  place-items: center;
  align-content: center;
  gap: 12px;
  width: 260px;
  height: 260px;
  color: var(--white);
  background: radial-gradient(circle, #5bb8ff, #017fe8 66%, #0064c9);
  border-radius: 50%;
  box-shadow: 0 20px 55px rgba(0, 126, 232, 0.28);
  z-index: 10;
}

.theory-center img {
  width: 140px;
  height: auto;
}

.theory-center span {
  color: var(--white);
  font-size: 22px;
}

.theory-node {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 16px;
  width: max-content;
  z-index: 5;
}

.theory-node--1 {
  left: calc(50% + 216.5px - 32px);
  top: calc(50% - 125px);
  transform: translateY(-50%);
}

.theory-node--2 {
  left: calc(50% + 216.5px - 32px);
  top: calc(50% + 125px);
  transform: translateY(-50%);
}

.theory-node--3 {
  left: calc(50% - 32px);
  top: calc(50% + 250px);
  transform: translateY(-50%);
}

.theory-node--4 {
  right: calc(50% + 216.5px - 32px);
  top: calc(50% + 125px);
  transform: translateY(-50%);
  flex-direction: row-reverse;
  text-align: right;
}

.theory-node--5 {
  right: calc(50% + 216.5px - 32px);
  top: calc(50% - 125px);
  transform: translateY(-50%);
  flex-direction: row-reverse;
  text-align: right;
}

.theory-node i,
.theory-card i {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  flex-shrink: 0;
  color: var(--white);
  background: linear-gradient(135deg, #75c1ff, #0079e7);
  border-radius: 50%;
  box-shadow: 0 12px 28px rgba(0, 120, 232, 0.24);
}

.theory-node svg,
.theory-card svg,
.feature-icons svg {
  width: 32px;
  height: 32px;
  fill: none;
  stroke: currentColor;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.theory-node-text {
  display: flex;
  flex-direction: column;
}

.theory-node--4 .theory-node-text,
.theory-node--5 .theory-node-text {
  align-items: flex-end;
}

.theory-node strong {
  display: block;
  color: #333;
  font-size: 20px;
  line-height: 28px;
  font-weight: 600;
}

.theory-node span {
  display: block;
  margin-block-start: 6px;
  color: #74808d;
  font-size: 14px;
  line-height: 22px;
  max-width: 160px; /* 防止文字太长撑开 */
  white-space: normal; /* 允许换行 */
}

.home-welfare {
  position: relative;
  overflow: hidden;
}

.split {
  display: grid;
  grid-template-columns: 800px 470px;
  align-items: center;
  gap: 100px;
  min-height: 680px;
  padding-block: 90px;
}

.split h2 {
  margin: 22px 0 44px;
  color: #111;
  font-size: 48px;
  line-height: 67px;
  font-weight: 600;
}

.split h3 {
  margin: 24px 0 10px;
  color: #006ad8;
  font-size: 24px;
  line-height: 34px;
  font-weight: 600;
}

.round-img {
  width: 470px;
  height: 520px;
  object-fit: cover;
  border-radius: 12px;
}

.join-call {
  position: relative;
  overflow: hidden;
  display: grid;
  place-items: center;
  min-height: 280px;
  color: #1d4f88;
}

.join-call div {
  color: #1a1a1a;
  font-size: 36px;
  line-height: 30px;
  font-weight: 600;
}

.join-call strong {
  margin-block-start: 38px;
  color: var(--blue);
  font-size: 64px;
  line-height: 1;
  letter-spacing: 2px;
}

.home-news {
  padding-block: 95px 105px;
}

.home-news__grid {
  display: grid;
  grid-template-columns: repeat(2, 447px) 1fr;
  gap: 30px;
}

.news-card,
.news-row,
.featured-news,
.school-card,
.expert-card,
.certificate-card,
.advantage-card,
.condition-card {
  transition:
    transform 0.24s ease,
    box-shadow 0.24s ease;
}

.news-card:hover,
.news-row:hover,
.featured-news:hover,
.school-card:hover,
.expert-card:hover,
.certificate-card:hover,
.advantage-card:hover,
.condition-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 45px rgba(0, 61, 130, 0.14);
}

.news-card {
  display: block;
  overflow: hidden;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 12px;
}

.news-card img {
  width: 100%;
  height: 308px;
  object-fit: cover;
}

.news-card span {
  display: block;
  padding: 28px 30px 32px;
}

.news-card strong {
  display: block;
  color: #111;
  font-size: 24px;
  line-height: 36px;
  font-weight: 600;
}

.news-card em,
.news-card i,
.news-mini-list span,
.side-news em {
  display: block;
  color: #7a8593;
  font-size: 16px;
  line-height: 22px;
  font-style: normal;
}

.news-card em {
  margin-block: 20px 24px;
}

.news-card i,
.side-news b {
  color: var(--blue);
  font-style: normal;
}

.news-mini-list {
  display: grid;
  align-content: start;
  gap: 0;
  padding: 18px 36px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 12px;
}

.news-mini-list a {
  display: grid;
  gap: 10px;
  padding: 24px 0;
  border-bottom: 1px solid var(--line);
}

.news-mini-list a:last-child {
  border-bottom: 0;
}

.news-mini-list strong {
  color: #111;
  font-size: 20px;
  line-height: 30px;
  font-weight: 500;
}

.home-join-banner {
  min-height: 239px;
  padding-block: 40px;
  text-align: center;
  background: linear-gradient(135deg, #eff8ff, #eaf2ff);
}

.home-join-banner h2 {
  margin: 0 0 12px;
  color: #111;
  font-size: 36px;
  line-height: 42px;
}

.home-join-banner div {
  margin-block-end: 24px;
  color: #697586;
  font-size: 20px;
  line-height: 30px;
}

.inner-hero {
  display: flex;
  align-items: center;
  height: 660px;
  padding-block-start: 97px;
  color: var(--white);
  background-size: cover;
  background-position: center;
}

.inner-hero__copy div {
  margin-block-end: 8px;
  color: rgba(255, 255, 255, 0.95);
  font-size: 20px;
  line-height: 26px;
}

.inner-hero__copy h1 {
  margin: 0;
  color: var(--white);
  font-size: 48px;
  line-height: 64px;
  font-weight: 600;
}

.subnav {
  position: sticky;
  inset-block-start: 97px;
  z-index: 900;
  height: 75px;
  color: var(--white);
  background: #0076df;
}

.subnav__inner {
  display: flex;
  align-items: center;
  gap: 78px;
  height: 75px;
}

.subnav__item {
  display: inline-flex;
  align-items: center;
  height: 75px;
  color: var(--white);
  font-size: 16px;
  line-height: 30px;
  white-space: nowrap;
  border-bottom: 3px solid transparent;
  transition:
    transform 0.24s ease,
    border-color 0.24s ease;
}

.subnav__item:hover,
.subnav__item.is-active {
  transform: scale(1.05);
  border-bottom-color: var(--white);
}

.brand-origin {
  position: relative;
  overflow: hidden;
  padding-block: 80px 0;
}

.brand-origin__grid {
  display: grid;
  grid-template-columns: 841px 500px;
  gap: 80px;
  min-height: 915px;
  align-items: start;
}

.brand-origin h2,
.brand-honor h2,
.history h2,
.education-section h2,
.theory-list h2,
.expert-section h2,
.school-intro h2,
.school-vision h2,
.school-cooperation h2,
.join-advantages h2,
.join-process h2,
.join-conditions h2,
.join-faq h2,
.apply-section h2 {
  margin: 0 0 58px;
  color: #0072de;
  font-size: 48px;
  line-height: 64px;
  font-weight: 700;
}

.brand-origin .body-copy {
  margin-block-end: 22px;
}

.brand-origin strong {
  display: block;
  margin-block-start: 36px;
  color: #333;
  font-size: 18px;
  line-height: 30px;
}

.founder-img {
  width: 500px;
  height: 889px;
  object-fit: cover;
  object-position: top;
}

.brand-honor {
  padding-block: 80px 110px;
  background: linear-gradient(180deg, #fff, #f1f6fb);
}

.certificate-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 70px 72px;
}

.certificate-card {
  display: block;
  text-align: center;
}

.certificate-card img {
  width: 446px;
  height: 297px;
  object-fit: cover;
  border-radius: 4px;
}

.certificate-card span {
  display: block;
  margin-block-start: 22px;
  color: #555;
  font-size: 20px;
  line-height: 33px;
}

.history {
  padding-block: 90px 105px;
  background: var(--white);
  overflow: hidden;
}

.history-slider-wrapper {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 60px;
  padding: 0 10px; /* 减少 padding 让箭头往外靠 */
  width: 100%;
  height: 480px;
  box-sizing: border-box;
}

.history-slider-wrapper::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 10px; /* 匹配箭头的往外移动 */
  right: 10px;
  height: 2px;
  background: #e6e6e6;
  transform: translateY(-50%);
  z-index: 1;
}

.history-swiper {
  width: 100%; /* 让 swiper 撑满父容器 */
  height: 480px;
  overflow: hidden; /* 防止滑动时超出部分显示 */
  z-index: 2;
}

.history-line {
  display: flex;
  align-items: center;
  position: relative;
  height: 100%;
}

.history-item {
  position: relative;
  height: 100%; /* 填满父容器 */
  width: 265px;
  box-sizing: border-box;
}

.history-item__dot {
  position: absolute;
  top: 50%;
  left: 20px; /* 给点向右偏移，避免贴死左边 */
  width: 16px;
  height: 16px;
  background: #c5c5c5;
  border-radius: 50%;
  z-index: 2;
  transform: translateY(-50%);
  transition: all 0.3s ease;
}

/* 激活或 hover 时的圆点样式 */
.history-item:hover .history-item__dot,
.swiper-slide-active .history-item__dot {
  background: #007bf5;
  box-shadow: 0 0 0 6px rgba(0, 123, 245, 0.2);
}

.history-item img {
  position: absolute;
  left: 0;
  width: 100%; /* 图片撑满 265px */
  height: 180px;
  object-fit: cover;
  border-radius: 4px;
}

.history-item__content {
  position: absolute;
  left: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.history-item strong {
  color: #111;
  font-size: 28px;
  line-height: 39px;
}

.history-item span {
  color: #4d5662;
  font-size: 14px;
  line-height: 22px;
}

.history-item--top .history-item__content {
  bottom: calc(50% + 40px);
}
.history-item--top img {
  top: calc(50% + 40px);
}

.history-item--bottom img {
  bottom: calc(50% + 40px);
}
.history-item--bottom .history-item__content {
  top: calc(50% + 40px);
}

.history-prev,
.history-next {
  position: absolute;
  top: 53%;
  transform: translateY(-50%);
  width: 44px !important;
  height: 44px !important;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #d8dee8;
  border-radius: 50%;
  color: #8c97a7;
  background: #fff;
  cursor: pointer;
  transition: all 0.3s ease;
  z-index: 10;
  flex-shrink: 0; /* 防止箭头被 flex 挤压变形 */
}

.history-prev:hover:not(.swiper-button-disabled),
.history-next:hover:not(.swiper-button-disabled) {
  color: #007bf5;
  border-color: #007bf5;
}

.history-prev.swiper-button-disabled,
.history-next.swiper-button-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.history-prev {
  left: -20px;
}

.history-next {
  right: -20px;
}

/* 隐藏默认的 swiper 箭头 */
.history-prev::after,
.history-next::after {
  display: none;
}

.education-section {
  position: relative;
  overflow: hidden;
  padding-block: 90px 100px;
}

.education-grid {
  display: grid;
  grid-template-columns: 690px 1fr;
  gap: 70px;
  align-items: end;
}

.education-grid img {
  width: 690px;
  height: 520px;
  object-fit: cover;
}
.banner {
  width: 100%;
}
.education-list {
  padding: 16px 46px;
  background: var(--white);
  border-radius: 10px;
  box-shadow: var(--shadow);
}

.education-list a {
  display: grid;
  gap: 10px;
  padding: 24px 0;
  border-bottom: 1px solid var(--line);
}

.education-list a:last-child {
  border-bottom: 0;
}

.education-list strong {
  color: #111;
  font-size: 20px;
  line-height: 30px;
  font-weight: 500;
}

.education-list span {
  color: #7c8795;
  font-size: 16px;
}

.theory-list {
  padding-block: 95px;
  background: #fff;
}

.theory-card-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 25px 30px;
}

.theory-card {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 18px;
  min-height: 160px;
  padding: 32px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 6px;
}

.theory-card strong {
  color: #111;
  font-size: 26px;
  line-height: 30px;
}

.theory-card span {
  grid-column: 2;
  color: #6a7480;
  font-size: 16px;
  line-height: 24px;
}

.expert-section {
  padding-block: 90px 120px;
  background: var(--white);
}

.expert-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.expert-card {
  overflow: hidden;
  background: var(--white);
  border-radius: 4px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
}

.expert-card img {
  width: 100%;
  height: 335px;
  object-fit: cover;
  object-position: top;
}

.expert-card div {
  padding: 30px 28px;
}

.expert-card strong {
  color: #111;
  font-size: 20px;
  line-height: 30px;
}

.expert-card span {
  margin-inline-start: 18px;
  color: var(--blue);
  font-size: 18px;
  line-height: 30px;
}

.expert-card em {
  display: block;
  margin-block-start: 18px;
  color: #5e6875;
  font-size: 16px;
  line-height: 24px;
  font-style: normal;
}

.article-page {
  padding-block: 110px 120px;
}

.article-grid {
  display: grid;
  grid-template-columns: 841px 459px;
  gap: 100px;
  align-items: start;
}

.article-main h1 {
  margin: 0 0 45px;
  color: #111;
  text-align: center;
  font-size: 48px;
  line-height: 64px;
  font-weight: 700;
}

.article-meta {
  color: #777;
  text-align: center;
  font-size: 16px;
  line-height: 24px;
}

.article-line {
  height: 1px;
  margin-block: 42px;
  background: var(--line);
}

.article-text {
  margin-block-end: 28px;
  color: #5d6672;
  font-size: 17px;
  line-height: 34px;
}
.article-text p{
	margin-block-end: 28px;
	color: #5d6672;
	font-size: 17px;
	line-height: 34px;
}
.article-text p img{
	max-width: 100%;
	margin: 0 auto;
}

.article-cover {
  width: 841px;
  height: 415px;
  margin-block: 56px 70px;
  object-fit: cover;
}

.article-pager {
  display: grid;
  gap: 34px;
}

.article-pager a span {
  display: block;
  margin-block-end: 12px;
  color: #7b8591;
  font-size: 16px;
}

.article-pager a strong {
  color: #111;
  font-size: 20px;
  line-height: 32px;
  font-weight: 500;
}

.article-side h2 {
  margin: 0 0 38px;
  color: #111;
  font-size: 28px;
  line-height: 33px;
}

.side-news {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 20px;
  padding-block: 32px;
  border-top: 1px solid var(--line);
}

.side-news img {
  width: 160px;
  height: 120px;
  object-fit: cover;
}

.side-news strong {
  color: #111;
  font-size: 18px;
  line-height: 28px;
}

.side-news b {
  display: block;
  margin-block-start: 22px;
  font-size: 15px;
}

.product-detail-hero {
  padding-block: 97px 0;
  border-bottom: 1px solid #e6e6e6;
}

.product-detail-hero__grid {
  display: grid;
  grid-template-columns: 660px 1fr;
  width: min(var(--container), 100%);
  gap: 30px;
  align-items: center;
  min-height: 514px;
  padding-block: 34px 42px;
}

.product-detail-hero__grid > img {
  width: 540px;
  justify-self: end;
}

.product-en {
  display: flex;
  align-items: baseline;
  gap: 22px;
  color: #111;
  font-size: 52px;
  line-height: 54px;
  text-transform: uppercase;
  white-space: nowrap;
}

.product-en strong {
  color: #111;
  font-size: 52px;
  line-height: 54px;
  font-weight: 700;
}

.product-en span {
  color: #111;
  font-size: 52px;
}

.product-detail-hero h1 {
  margin: 44px 0 34px;
  color: #111;
  font-size: 52px;
  line-height: 62px;
  font-weight: 600;
}

.product-sub {
  color: #111;
  font-size: 24px;
  line-height: 42px;
}

.product-price {
  margin-block-start: 54px;
  color: #111;
  font-size: 44px;
  line-height: 1;
  font-weight: 600;
}

.product-mosaic {
  padding-block: 100px;
  background: #f7f7f7;
}

.mosaic-grid {
  display: grid;
  grid-template-columns: 378px 612px 378px;
  grid-template-rows: 280px 280px;
  gap: 16px;
}

.mosaic-grid img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.mosaic-tall {
  grid-row: span 2;
}

.product-intro {
  min-height: 800px;
  padding-block: 100px;
  background: linear-gradient(#ffffff 0%, #eae7e5 100%);
  position: relative;
  overflow: hidden;
}

.product-intro__grid {
  position: relative;
  display: grid;
  grid-template-columns: 610px 1fr;
  align-items: center;
  gap: 90px;
  z-index: 1;
}

.product-intro h2 {
  margin: 0 0 18px;
  color: #111;
  font-size: 48px;
  line-height: 67px;
}

.product-intro span {
  color: #999;
  font-size: 20px;
  line-height: 28px;
}

.product-intro h3 {
  margin: 72px 0 22px;
  color: #111;
  font-size: 30px;
  line-height: 42px;
}

.hotline {
  margin-block: 60px 72px;
  color: #111;
  font-size: 17px;
  line-height: 30px;
}

.hotline strong {
  color: var(--blue);
  font-size: 36px;
}

.feature-icons {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 42px 54px;
}

.feature-icons div {
  display: grid;
  justify-items: center;
  gap: 14px;
  color: #777;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
}

.feature-icons svg {
  width: 48px;
  height: 48px;
  color: #7d7d7d;
}

.product-intro__img-wrap {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 580px;
  height: 580px;
  justify-self: center;
}

/* 内部白色圆底板 */
.product-intro__img-wrap::before {
  content: "";
  position: absolute;
  width: 480px;
  height: 480px;
  background: #ffffff;
  border-radius: 50%;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
  z-index: 1;
}

/* 外部描边圆环（右半蓝，左半透明/灰） */
.product-intro__img-wrap::after {
  content: "";
  position: absolute;
  width: 580px;
  height: 580px;
  border-radius: 50%;
  border: 1px solid rgba(0, 123, 245, 0.15); /* 左侧使用极淡的蓝色作为底色边框 */
  border-top-color: #007bf5;
  border-right-color: #007bf5;
  transform: rotate(45deg);
  z-index: 2;
}

/* 装饰圆点容器 */
.product-intro__dots {
  position: absolute;
  width: 580px;
  height: 580px;
  z-index: 3;
  pointer-events: none;
}

.product-intro__dots::before,
.product-intro__dots::after {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  background: #007bf5;
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

.product-intro__dots::before {
  top: 0;
  left: 50%;
  box-shadow: 290px 290px 0 #007bf5; /* 巧妙利用阴影生成右侧中间的蓝点 */
}

.product-intro__dots::after {
  top: 100%;
  left: 50%;
}

.device-large {
  position: relative;
  width: auto;
  height: 440px;
  object-fit: contain;
  z-index: 4;
}

.product-copy {
  padding-block: 90px 120px;
  background: var(--white);
}

.welfare-article {
  padding-block: 80px 110px;
}

.welfare-article img {
  width: 100%;
  height: 560px;
  margin-block-end: 70px;
  object-fit: cover;
}

.school-intro,
.school-vision,
.school-cooperation {
  padding-block: 85px 95px;
}

.school-intro-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 60px;
}

.school-intro-header h2 {
  flex-shrink: 0;
  margin: 0;
  font-size: 40px;
  line-height: 1.4;
  color: #111;
  font-weight: 700;
}

.text-blue {
  color: var(--blue, #007bf5);
  font-size: 40px;
}

.school-intro-header .body-copy {
  font-size: 16px;
  line-height: 2.2;
  color: #666;
  text-align: justify;
}

.school-photo-grid {
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: 20px;
  margin-block-start: 60px;
}

.school-photo-grid img {
  width: 100%;
  height: 600px;
  object-fit: cover;
  border-radius: 12px;
}

.school-vision {
  background: #f4f6f8;
}

.school-vision .ysj-container {
  display: block;
}

.school-vision-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 60px;
}

.school-vision-header .body-copy {
  font-size: 16px;
  line-height: 2.2;
  color: #666;
  text-align: justify;
}

.school-vision-header h2 {
  flex-shrink: 0;
  margin: 0;
  font-size: 40px;
  line-height: 1.4;
  color: #111;
  font-weight: 700;
}

.school-vision img.vision-img {
  width: 100%;
  height: 600px;
  object-fit: cover;
  border-radius: 12px;
  margin-block-start: 60px;
}

.school-cooperation {
  background: #fff;
}

.co-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-block-end: 58px;
}

.co-head h2 {
  margin: 0;
}

.co-head span {
  color: var(--blue);
  font-size: 15px;
}

.school-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 36px;
}

.school-card {
  padding: 20px 20px 38px;
  background: var(--white);
  border-radius: 10px;
  box-shadow: var(--shadow);
}

.school-card img {
  width: 100%;
  height: 250px;
  object-fit: cover;
  border-radius: 8px;
}

.school-card strong {
  display: block;
  margin-block: 32px 12px;
  color: #111;
  font-size: 22px;
  line-height: 29px;
}

.school-card span {
  color: #6c7682;
  font-size: 16px;
  line-height: 24px;
}

.join-advantages,
.join-faq,
.apply-section {
  padding-block: 90px 110px;
  background: #f5f5f5;
}

.join-advantages h2,
.join-process h2,
.join-conditions h2,
.join-faq h2,
.apply-section h2 {
  color: #111;
  text-align: center;
  font-size: 36px;
  line-height: 42px;
}

.advantage-grid,
.condition-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}

.advantage-card,
.condition-card {
  display: grid;
  justify-items: center;
  min-height: 260px;
  padding: 42px 42px 36px;
  text-align: center;
  background: var(--white);
  border-radius: 10px;
}

.advantage-card b,
.condition-card b {
  display: grid;
  place-items: center;
  width: 76px;
  height: 76px;
  margin-block-end: 34px;
  color: var(--white);
  font-size: 34px;
  line-height: 30px;
  background: linear-gradient(135deg, #99d6ff, #0075df);
  border-radius: 50%;
}

.advantage-card strong,
.condition-card strong {
  color: #111;
  font-size: 24px;
  line-height: 30px;
  font-weight: 700;
}

.advantage-card span,
.condition-card span {
  margin-block-start: 22px;
  color: #697383;
  font-size: 16px;
  line-height: 28px;
}

.join-process {
  padding-block: 90px 118px;
  background: #fff;
}

.join-process .ysj-container {
  width: min(1880px, calc(100% - 40px));
}

.join-process h2 {
  margin-bottom: 52px;
}

.process-diagram {
  position: relative;
  width: 1880px;
  min-width: 1300px;
  height: 648px;
  margin: 0 auto;
}

.process-diagram::before,
.process-diagram::after {
  content: "";
  position: absolute;
  left: 214px;
  width: 1220px;
  border-top: 4px dashed #1d2430;
}

.process-diagram::before {
  top: 95px;
}

.process-diagram::after {
  top: 454px;
}

.process-turn {
  position: absolute;
  top: 95px;
  left: 1434px;
  width: 252px;
  height: 363px;
  border: 4px dashed #1d2430;
  border-left: 0;
  border-radius: 0 180px 180px 0;
}

.process-arrow {
  position: absolute;
  width: 0;
  height: 0;
}

.process-arrow--start {
  top: 85px;
  left: 165px;
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  border-left: 18px solid #1d2430;
}

.process-arrow--turn {
  top: 354px;
  left: 1650px;
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  border-top: 24px solid #1d2430;
}

.process-row {
  position: absolute;
  inset: 0;
}

.process-row--top {
  top: 0;
}

.process-row--bottom {
  top: 0;
}

.process-step {
  position: absolute;
  width: 344px;
  padding-top: 75px;
}

.process-step--1 {
  top: 62px;
  left: 315px;
}

.process-step--2 {
  top: 62px;
  left: 763px;
}

.process-step--3 {
  top: 62px;
  left: 1211px;
}

.process-step--6 {
  top: 425px;
  left: 315px;
}

.process-step--5 {
  top: 425px;
  left: 763px;
}

.process-step--4 {
  top: 425px;
  left: 1211px;
}

.process-step__dot {
  position: absolute;
  top: 4px;
  left: 40px;
  width: 52px;
  height: 52px;
  background: #1d87f5;
  border: 4px solid #1d2430;
  border-radius: 50%;
}

.process-step__body {
  display: flex;
  align-items: flex-start;
  gap: 20px;
}

.process-step i {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 60px;
  height: 60px;
  color: #1d2430;
}

.process-step svg {
  width: 54px;
  height: 54px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.process-step__copy {
  width: 254px;
}

.process-step strong {
  display: block;
  margin-bottom: 8px;
  color: #111;
  font-size: 34px;
  line-height: 42px;
  font-weight: 700;
}

.process-step em {
  margin-right: 2px;
  font-style: normal;
}

.process-step span {
  display: block;
  color: #5f6773;
  font-size: 22px;
  line-height: 34px;
}

.process-mascot {
  position: absolute;
  left: 127px;
  top: 347px;
  width: 176px;
  height: 205px;
}

.process-mascot svg {
  width: 100%;
  height: 100%;
}

.join-conditions {
  position: relative;
  overflow: hidden;
  padding-block: 90px 110px;
}

.condition-card {
  border: 1px solid #75baff;
  background: rgba(255, 255, 255, 0.58);
}

.faq-item {
  border-bottom: 1px solid #a7cff8;
}

.faq-item button {
  display: flex;
  align-items: center;
  gap: 21px;
  width: 100%;
  min-height: 117px;
  padding: 0;
  color: #111;
  cursor: pointer;
  background: transparent;
  border: 0;
  text-align: left;
}

.faq-item button b {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 48px;
  height: 48px;
  color: #666;
  font-size: 27px;
  line-height: 1;
  font-weight: 700;
  background: #d8d8d8;
  border-radius: 50%;
}

.faq-item button strong {
  font-size: 20px;
  line-height: 39px;
  font-weight: 700;
}

.faq-item.is-open button b {
  color: #fff;
  background: var(--blue);
}

.faq-item.is-open button strong {
  color: var(--blue);
}

.faq-answer {
  display: none;
  position: relative;
  margin: 0 0 42px;
  padding: 20px 45px 2%;
  color: var(--white);
  font-size: 18px;
  line-height: 30px;
  background: var(--blue);
}

.faq-answer::before {
  content: "";
  position: absolute;
  top: -15px;
  left: 0;
  width: 0;
  height: 0;
  border-right: 21px solid transparent;
  border-bottom: 21px solid var(--blue);
}

.faq-item.is-open .faq-answer {
  display: block;
}

.apply-form {
  display: grid;
  gap: 24px;
}

.apply-form input,
.apply-form textarea {
  width: 100%;
  color: #111;
  font-size: 20px;
  background: var(--white);
  border: 0;
  border-radius: 8px;
}

.apply-form input {
  height: 110px;
  padding: 0 40px;
}

.apply-form textarea {
  height: 228px;
  padding: 36px 40px;
  resize: none;
}

.apply-form button {
  justify-self: center;
  width: 360px;
  height: 75px;
  color: var(--white);
  font-size: 24px;
  cursor: pointer;
  background: var(--blue);
  border: 0;
  border-radius: 6px;
  transition:
    transform 0.24s ease,
    box-shadow 0.24s ease;
}

.apply-form button:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 28px rgba(0, 120, 232, 0.25);
}

.news-page,
.news-list-page {
  padding-block: 80px 120px;
}
.ng_hui {
  background: #eef3f8;
  padding: 80px 0;
  text-align: center;
}
.featured-news-section {
  width: 1500px;
  margin: 0 auto;
}

.ng_hui .featured-news-section,
.ng_hui .featured-news {
  transition: none !important;
}

.ng_hui .featured-news-section:hover,
.ng_hui:hover,
.ng_hui .featured-news:hover {
  transform: none !important;
  box-shadow: none !important;
}

.featured-news-swiper {
  position: relative;
  overflow: hidden;
}

.featured-news-swiper .swiper-slide {
  height: auto;
}

.featured-news {
  display: grid;
  grid-template-columns: 700px 1fr;
  gap: 0;
  align-items: stretch;
  min-height: 460px;
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
}

.featured-news img {
  width: 700px;
  height: 460px;
  object-fit: cover;
}

.featured-news span {
  display: grid;
  align-content: start;
  gap: 28px;
  padding: 56px 48px 74px 48px;
}

.featured-news em {
  color: #8a94a1;
  font-size: 16px;
  line-height: 24px;
  font-style: normal;
}

.featured-news strong {
  color: var(--blue);
  font-size: 24px;
  line-height: 42px;
  font-weight: 700;
}

.featured-news b {
  color: #687586;
  font-size: 16px;
  line-height: 34px;
  font-weight: 400;
}

.featured-news i {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  justify-self: start;
  margin-top: 4px;
  padding: 0 7px 0 20px;
  height: 36px;
  color: #6c7682;
  font-size: 14px;
  line-height: 20px;
  font-style: normal;
  background: #f2f4f7;
  border-radius: 18px;
}

.featured-news i::after {
  content: ">";
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  color: #fff;
  background: var(--blue);
  border-radius: 50%;
  font-size: 14px;
  line-height: 1;
}

.featured-news-pagination {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
  padding-left: 748px;
}

.featured-news-pagination .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  margin: 0 !important;
  background: #c8d8ea;
  opacity: 1;
}

.featured-news-pagination .swiper-pagination-bullet-active {
  background: var(--blue);
}

.news-card-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 33px 30px;
}

.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 18px;
  margin-block-start: 80px;
  color: #536070;
  font-size: 16px;
}

.pagination a,
.pagination input {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  color: #536070;
  background: #fff;
  border: 1px solid #dbe3ee;
  border-radius: 2px;
}

.pagination a.is-active,
.pagination a:hover {
  color: #fff;
  background: var(--blue);
  border-color: var(--blue);
}

.pagination input {
  width: 60px;
  padding: 0;
  text-align: center;
}

.news-row {
  display: grid;
  grid-template-columns: 335px 1fr;
  gap: 90px;
  min-height: 260px;
  padding-block: 0 30px;
  margin-block-end: 30px;
  border-bottom: 1px solid var(--line);
}

.news-row img {
  width: 335px;
  height: 260px;
  object-fit: cover;
}

.news-row span {
  display: grid;
  align-content: center;
  gap: 22px;
}

.news-row strong {
  color: #111;
  font-size: 24px;
  line-height: 30px;
}

.news-row em,
.news-row b {
  color: #647080;
  font-size: 16px;
  line-height: 28px;
  font-style: normal;
  font-weight: 400;
}

.news-row i {
  color: var(--blue);
  font-size: 16px;
  font-style: normal;
}

.about-profile {
  position: relative;
  padding-block: 64px 72px;
  overflow: hidden;
}

.about-profile .ysj-container,
.about-culture .ysj-container,
.about-contact .ysj-container {
  position: relative;
  width: min(1240px, calc(100% - 80px));
  margin-inline: auto;
}

.about-profile__grid,
.about-contact__grid {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 62px;
  align-items: start;
}

.about-profile::before {
  content: "";
  position: absolute;
  left: -156px;
  top: -6px;
  width: 328px;
  height: 328px;
  background: radial-gradient(
    circle at 60% 50%,
    rgba(28, 130, 245, 0.32),
    rgba(28, 130, 245, 0.04) 70%,
    transparent 72%
  );
  border-radius: 50%;
}

.about-title-panel {
  position: relative;
  z-index: 1;
}

.about-title-panel h2,
.about-contact h2 {
  margin: 14px 0 12px;
  color: #111;
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
}

.about-title-panel h2::after {
  content: "°";
  display: inline-block;
  margin-left: 3px;
  color: var(--blue);
  font-size: 20px;
  line-height: 1;
  vertical-align: top;
}

.about-title-panel strong {
  display: block;
  color: var(--blue);
  font-size: 50px;
  line-height: 56px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: -1px;
}

.about-title-panel__icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin-top: 14px;
  color: var(--blue);
}

.about-title-panel__icon svg {
  width: 30px;
  height: 30px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.about-profile__content,
.about-contact__content {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.about-profile h3 {
  margin: 10px 0 18px;
  color: #111;
  font-size: 26px;
  line-height: 32px;
  font-weight: 600;
  white-space: nowrap;
}

.about-profile .body-copy {
  max-width: 860px;
  color: #666f7a;
  font-size: 18px;
  line-height: 28px;
}

.about-profile .stats {
  justify-content: start;
  grid-template-columns: repeat(4, minmax(92px, max-content));
  gap: 58px;
  max-width: 760px;
  margin-top: 34px;
}

.about-profile .stat {
  width: auto;
  text-align: left;
}

.about-profile .stat strong {
  color: var(--blue);
  font-size: 30px;
  line-height: 1;
  display: flex;
}

.about-profile .stat strong span {
  color: inherit;
  font-size: 18px;
  line-height: 1;
}

.about-profile .stat span {
  margin-top: 10px;
  color: #626c77;
  font-size: 14px;
  line-height: 18px;
}

.about-profile .stat--accent strong,
.about-profile .stat--accent strong span {
  color: #f6b200;
}

.about-culture {
  position: relative;
  padding-block: 58px 72px;
  background:
    radial-gradient(
      circle at -10% 60%,
      rgba(28, 130, 245, 0.08),
      transparent 35%
    ),
    radial-gradient(
      circle at 110% 80%,
      rgba(28, 130, 245, 0.08),
      transparent 28%
    ),
    linear-gradient(180deg, #eef4fb 0%, #edf2f8 100%);
  overflow: hidden;
}

.about-culture h2 {
  margin: 0 0 22px;
  color: var(--blue);
  font-size: 28px;
  line-height: 40px;
}

.culture-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 600px;
  gap: 16px;
  align-items: stretch;
  justify-content: space-between;
}

.culture-main {
  position: relative;
  min-height: 408px;
  padding: 26px 30px 30px;
  color: #fff;
  text-align: center;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.08), transparent 35%),
    linear-gradient(180deg, #1e8cf7 0%, #0e62d8 100%);
  border-radius: 10px;
  box-shadow: 0 18px 50px rgba(7, 96, 197, 0.18);
  overflow: hidden;
}

.culture-main::after {
  content: "";
  position: absolute;
  inset: auto -14% -22% 10%;
  height: 58%;
  background: linear-gradient(
    140deg,
    rgba(255, 255, 255, 0.08),
    rgba(255, 255, 255, 0)
  );
  transform: rotate(-10deg);
  pointer-events: none;
}

.culture-main__icon,
.culture-side__icon,
.culture-oath__icon {
  display: grid;
  place-items: center;
  color: #d9ebff;
}

.culture-main__icon {
  width: 30px;
  height: 30px;
  margin: 0 auto 12px;
}

.culture-main__icon svg,
.culture-side__icon svg,
.culture-oath__icon svg {
  width: 34px;
  height: 34px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.culture-main h3 {
  margin: 0 0 20px;
  color: #fff;
  font-size: 18px;
  line-height: 28px;
  font-weight: 500;
}

.culture-rules {
  display: grid;
  gap: 7px;
}

.culture-rules p {
  margin: 0;
  color: rgba(255, 255, 255, 0.95);
  font-size: 16px;
  line-height: 30px;
}

.culture-side {
  display: grid;
  gap: 12px;
}

.culture-side__item {
  min-height: 160px;
  padding: 20px 22px;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 10px;
  box-shadow: 0 12px 34px rgba(41, 77, 122, 0.06);
  min-width: 0;
}

.culture-side__icon,
.culture-oath__icon {
  width: 35px;
  height: 35px;
  margin-bottom: 10px;
  color: var(--blue);
}

.culture-side strong,
.culture-oath strong {
  display: block;
  margin: 0 0 10px;
  color: #2f3742;
  font-size: 18px;
  line-height: 22px;
  font-weight: 500;
}

.culture-side span,
.culture-oath span {
  color: #77808d;
  font-size: 15px;
  line-height: 20px;
  white-space: nowrap;
}

.culture-oath {
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: 14px;
  margin-top: 10px;
  padding: 38px 24px 38px;
  background: rgba(255, 255, 255, 0.86);
  border-radius: 10px;
  box-shadow: 0 12px 34px rgba(41, 77, 122, 0.06);
}

.culture-oath span {
  white-space: normal;
  line-height: 24px;
}

.about-contact {
  position: relative;
  padding-block: 54px 74px;
  overflow: hidden;
}

.about-contact::after {
  content: "";
  position: absolute;
  right: 8px;
  bottom: -24px;
  width: 280px;
  height: 200px;
  background:
    radial-gradient(
      circle at 60% 30%,
      rgba(78, 149, 243, 0.42),
      rgba(78, 149, 243, 0.08) 55%,
      transparent 60%
    ),
    linear-gradient(145deg, rgba(87, 156, 246, 0.22), rgba(87, 156, 246, 0.02));
  border-radius: 160px 0 0 0;
  transform: rotate(-8deg);
  pointer-events: none;
}

.about-title-panel--contact h2 {
  margin-top: 0;
}

.about-contact .body-copy {
  max-width: none;
  margin-bottom: 24px;
  color: #666f7a;
  font-size: 18px;
  line-height: 26px;
}

.contact-grid {
  display: grid;
  grid-template-columns: 150px 150px minmax(250px, 1fr);
  gap: 18px;
  position: relative;
  z-index: 1;
  min-width: 0;
}

.contact-grid div {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
}

.contact-grid strong {
  display: block;
  color: #687281;
  font-size: 16px;
  line-height: 22px;
  font-weight: 400;
}

.contact-grid span {
  color: #3c4551;
  font-size: 16px;
  line-height: 22px;
}

.contact-grid div:last-child strong:first-child {
  color: #3c4551;
  font-size: 14px;
  line-height: 18px;
  font-weight: 500;
}

.contact-grid div:not(:last-child) span {
  white-space: nowrap;
}

.contact-highlight {
  color: var(--blue);
  font-weight: 700;
  font-size: 18px;
}

.site-footer {
  position: relative;
  overflow: hidden;
  min-height: 596px;
  color: var(--white);
}

.footer-inner {
  display: grid;
  grid-template-columns: 430px 150px 1fr;
  gap: 72px;
  padding-block: 80px 46px;
}

.footer-contact img {
  width: 260px;
  height: 126px;
  margin-block-end: 16px;
  object-fit: contain;
}

.footer-contact strong {
  display: block;
  margin-block: 12px 26px;
  color: var(--white);
  font-size: 16px;
  line-height: 30px;
}

.footer-contact span,
.footer-qr span,
.footer-slogan,
.footer-copy {
  color: rgba(255, 255, 255, 0.84);
  font-size: 16px;
  line-height: 30px;
}

.footer-contact span {
  display: block;
  margin-block-start: 10px;
}

.footer-qr {
  padding-block-start: 102px;
  text-align: center;
}

.footer-qr img {
  width: 110px;
  height: 110px;
  margin-inline: auto;
  margin-block-end: 18px;
}

.footer-main {
  padding-block-start: 112px;
}

.footer-nav {
  display: flex;
  gap: 54px;
  margin-block-end: 54px;
}

.footer-nav a {
  color: var(--white);
  font-size: 18px;
  line-height: 30px;
  white-space: nowrap;
  background-image: linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 0 1px;
  transition:
    color 0.2s ease,
    background-size 0.2s ease;
}

.footer-nav a:hover {
  color: var(--yellow);
  background-size: 100% 1px;
}

.footer-slogan {
  max-width: 678px;
  margin-block-end: 88px;
  font-size: 20px;
  line-height: 36px;
}

.footer-hotline {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 600px;
  height: 56px;
  padding-inline: 30px;
  border: 1px solid rgba(255, 255, 255, 0.38);
}

.footer-hotline span,
.footer-hotline a {
  color: var(--white);
  font-size: 20px;
  line-height: 36px;
}

.footer-hotline a {
  color: var(--yellow);
}

.footer-copy {
  padding-block-end: 34px;
  font-size: 14px;
}

.site-toast {
  justify-self: center;
  color: var(--blue);
  font-size: 18px;
  line-height: 28px;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.site-toast.is-show {
  opacity: 1;
}

@media (max-width: 1200px) {
  .ysj-container {
    width: min(1200px, calc(100% - 48px));
  }

  .site-header .ysj-container {
    width: min(1200px, calc(100% - 32px));
  }

  .header-inner {
    grid-template-columns: 150px 1fr 218px;
    gap: 16px;
  }

  .logo img {
    width: 150px;
  }

  .nav {
    gap: 18px;
  }

  .site-header .nav-link {
    font-size: 15px;
  }

  .site-header .phone-link {
    font-size: 14px;
  }

  .site-header .phone-link strong {
    font-size: 22px;
  }

  .home-about__grid {
    grid-template-columns: 620px 1fr;
  }

  .product-tab-card {
    width: 100%;
  }

  .split {
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 44px;
  }

  .round-img {
    width: 380px;
    height: 450px;
  }

  .product-detail-hero__grid {
    grid-template-columns: 45% 1fr;
    width: min(1200px, calc(100% - 48px));
    gap: 36px;
  }

  .product-detail-hero__grid > img {
    width: 100%;
  }

  .product-en,
  .product-en strong,
  .product-en span,
  .product-detail-hero h1 {
    font-size: 44px;
  }

  .product-sub {
    font-size: 22px;
  }

  .mosaic-grid {
    grid-template-columns: 1fr 1.62fr 1fr;
  }

  .brand-origin__grid {
    grid-template-columns: minmax(0, 1fr) 420px;
    gap: 50px;
  }

  .founder-img {
    width: 420px;
  }

  .advantage-grid,
  .condition-grid,
  .news-card-grid {
    gap: 24px;
  }

  .advantage-card,
  .condition-card {
    padding-inline: 30px;
  }

  .featured-news {
    grid-template-columns: 54% 1fr;
    gap: 46px;
  }

  .featured-news img {
    width: 100%;
  }

  .article-grid {
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 44px;
  }

  .article-cover {
    width: 100%;
  }

  .side-news {
    grid-template-columns: 128px minmax(0, 1fr);
    gap: 16px;
  }

  .side-news img {
    width: 128px;
    height: 96px;
  }

  .school-photo-grid {
    grid-template-columns: 38% 1fr;
  }

  .school-photo-grid img {
    width: 100%;
  }

  .about-profile .ysj-container,
  .about-culture .ysj-container,
  .about-contact .ysj-container {
    width: min(1240px, calc(100% - 60px));
  }

  .about-profile__grid,
  .about-contact__grid {
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 36px;
  }

  .about-title-panel strong {
    font-size: 46px;
    line-height: 46px;
  }

  .about-profile h3 {
    font-size: 20px;
    line-height: 30px;
  }

  .about-profile .stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
  }

  .about-profile .stat strong {
    font-size: 28px;
  }

  .culture-grid {
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 14px;
  }

  .contact-grid {
    grid-template-columns: 150px 150px minmax(220px, 1fr);
    gap: 16px;
  }

  .footer-inner {
    grid-template-columns: 320px 120px minmax(0, 1fr);
    gap: 38px;
  }

  .footer-main {
    min-width: 0;
  }

  .footer-nav {
    flex-wrap: wrap;
    gap: 16px 26px;
    min-width: 0;
  }

  .footer-slogan {
    max-width: 100%;
    margin-block-end: 60px;
  }

  .footer-hotline {
    width: 100%;
  }
}

.stat,
.news-card,
.news-row,
.featured-news,
.school-card,
.expert-card,
.certificate-card,
.advantage-card,
.condition-card,
.theory-card,
.product-tab-card,
.culture-main,
.culture-side__item,
.culture-oath,
.contact-grid div,
.feature-icons div,
.process-step__body,
.side-news,
.mosaic-grid img,
.school-photo-grid img,
.product-intro__img-wrap,
.founder-img,
.round-img,
.article-cover {
  transform: perspective(1000px) rotateX(var(--tilt-x, 0deg))
    rotateY(var(--tilt-y, 0deg)) translate3d(0, 0, 0);
}

.stat:hover,
.news-card:hover,
.news-row:hover,
.featured-news:hover,
.school-card:hover,
.expert-card:hover,
.certificate-card:hover,
.advantage-card:hover,
.condition-card:hover,
.theory-card:hover,
.product-tab-card:hover,
.culture-main:hover,
.culture-side__item:hover,
.culture-oath:hover,
.contact-grid div:hover,
.feature-icons div:hover,
.process-step__body:hover,
.side-news:hover,
.mosaic-grid img:hover,
.school-photo-grid img:hover,
.product-intro__img-wrap:hover,
.founder-img:hover,
.round-img:hover,
.article-cover:hover {
  transform: perspective(1000px) rotateX(var(--tilt-x, 0deg))
    rotateY(var(--tilt-y, 0deg)) translate3d(0, -3px, 0);
  box-shadow:
    0 16px 36px rgba(0, 78, 164, 0.12),
    0 0 0 1px rgba(0, 120, 232, 0.05);
}

.ysj-btn:hover,
.apply-form button:hover {
  transform: translateY(-2px) scale(1.01);
}

.ysj-btn:active,
.tab-btn:active,
.apply-form button:active,
.tab-arrows button:active,
.history-prev:active,
.history-next:active {
  transform: translateY(1px) scale(0.98);
}

body.site-page::before,
body.site-page::after {
  pointer-events: none;
}

.ysj-reveal:not(.is-visible) {
  opacity: 0;
  transform: perspective(1000px) rotateX(var(--tilt-x, 0deg))
    rotateY(var(--tilt-y, 0deg)) translate3d(0, 34px, 0) scale(0.985);
}

.ysj-reveal.is-visible {
  opacity: 1;
  transform: perspective(1000px) rotateX(var(--tilt-x, 0deg))
    rotateY(var(--tilt-y, 0deg)) translate3d(0, 0, 0) scale(1);
}

.ysj-reveal.is-visible:hover {
  transform: perspective(1000px) rotateX(var(--tilt-x, 0deg))
    rotateY(var(--tilt-y, 0deg)) translate3d(0, -3px, 0) scale(1);
}

.ysj-reveal-group > * {
  transition-delay: var(--reveal-delay, 0ms);
}

.round-img,
.founder-img,
.product-intro__img-wrap,
.product-detail-hero__grid > img {
  animation: none !important;
}

.round-img:hover,
.founder-img:hover,
.product-intro__img-wrap:hover,
.product-detail-hero__grid > img:hover {
  transform: none;
}

.ysj-btn,
.apply-form button {
  background:
    linear-gradient(var(--blue), var(--blue)) padding-box,
    conic-gradient(
        from var(--btn-angle, 0deg),
        rgba(255, 225, 0, 0.66),
        rgba(255, 255, 255, 0.26),
        rgba(0, 120, 232, 0.36),
        rgba(255, 225, 0, 0.66)
      )
      border-box;
  border: 1px solid transparent;
  animation:
    ysj-button-breathe 2.8s ease-in-out infinite,
    ysj-button-border 5.5s linear infinite;
}

.tab-btn {
  background: none;
  animation: none;
}

.tab-btn.is-active,
.tab-btn:hover {
  background: none;
}

.tab-btn::after {
  position: absolute;
  inset-inline: 0;
  bottom: -2px;
  height: 2px;
  content: "";
  background: linear-gradient(90deg, var(--blue), var(--yellow), var(--blue));
  background-size: 200% 100%;
  opacity: 0;
  transform: scaleX(0.32);
  transition:
    opacity 0.24s ease,
    transform 0.24s ease;
}

.tab-btn.is-active::after,
.tab-btn:hover::after {
  opacity: 1;
  transform: scaleX(1);
  animation: ysj-tab-line 2.6s linear infinite;
}

@property --btn-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

@keyframes ysj-button-border {
  to {
    --btn-angle: 360deg;
  }
}

@keyframes ysj-tab-line {
  to {
    background-position: 200% 0;
  }
}

.nore {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 46px 0;
}
.noretxt {
  font-size: 24px;
  color: #0064c9;
  font-weight: bold;
}
.seemore {
  color: #0064c9;
  font-size: 14px;
}

.xiala {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  background-color: rgba(0, 0, 0, 0.5);
  top: 97px;
  transition: all 0.5s;
  opacity: 0;
  z-index: -1;
}
.xialatxt {
  padding: 10px 15px;
  text-align: center;
  white-space: nowrap;
}
.xialatxt a {
  font-size: 14px;
  color: #ffffff;
  white-space: nowrap;
}
.xialatxt a:hover {
  color: #ffe100;
}
.dingwei {
  position: relative;
}
.dingwei:hover .xiala {
  opacity: 1;
  z-index: 22;
}

.fenye ul {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 50px;
}
.fenye ul li {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  color: #536070;
  background: #fff;
  border: 1px solid #dbe3ee;
  border-radius: 2px;
}
.fenye ul li.active {
  color: #fff;
  background: #0078e8;
}
.fenye ul li.active span {
  color: #fff;
}
.fenye ul li.active a {
  color: #fff;
}
.fenye ul li a {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}