/* NIWpaper — base styles, keyframes & hover states.
   All colors/sizes come from design_handoff_scholarpath/scholarpath-design.dc.html — do not tweak. */

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

@keyframes sp-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes sp-rise { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@keyframes sp-blink { 0%,49% { opacity: 1; } 50%,100% { opacity: 0; } }
@keyframes sp-zoom { from { transform: scale(1.07); } to { transform: scale(1); } }
@keyframes sp-heroin { from { opacity: 0; transform: translateY(34px); filter: blur(10px); } to { opacity: 1; transform: none; filter: none; } }

html { scroll-behavior: smooth; }
section[id] { scroll-margin-top: 84px; }

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

h1, h2 { text-wrap: balance; }
p { text-wrap: pretty; }
body { margin: 0; background: #fff; font-family: 'DM Sans','Noto Sans SC',system-ui,sans-serif; -webkit-font-smoothing: antialiased; }
a { color: #14202E; text-decoration: none; }
a:hover { color: #3F7A64; }
::selection { background: #0B1A33; color: #fff; }

/* nav links keep white/ink color even with the a:hover green rule */
[data-navink]:hover, [data-navghost]:hover, [data-navsolid]:hover { color: inherit; }

/* ---- hover states (style-hover in the design source) ---- */
.card-lift { transition: transform 0.35s cubic-bezier(.16,1,.3,1), box-shadow 0.35s; }
.card-lift:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(20,32,46,0.09); color: inherit; }

.paper-card { transition: transform 0.35s cubic-bezier(.16,1,.3,1), box-shadow 0.35s; }
.paper-card:hover { transform: translateY(-6px); box-shadow: 0 20px 44px rgba(20,32,46,0.1); color: inherit; }
.paper-card--tl:hover { transform: translateY(-6px) rotate(-0.4deg); }
.paper-card--tr:hover { transform: translateY(-6px) rotate(0.4deg); }

.fig-lift { transition: transform 0.35s cubic-bezier(.16,1,.3,1); }
.fig-lift:hover { transform: translateY(-5px); }

.marquee-track:hover { animation-play-state: paused; }

/* ---- tab pills ---- */
.pill {
  font-family: 'DM Sans','Noto Sans SC',sans-serif;
  font-size: 14.5px; font-weight: 700; letter-spacing: -0.01em;
  padding: 12px 24px; border-radius: 999px; cursor: pointer;
  border: 1px solid #DDD8CC; background: #fff; color: #54606F;
  transition: all 0.3s cubic-bezier(.16,1,.3,1);
}
.pill:hover { transform: translateY(-2px); }
.pill.on { border: 1px solid #14202E; background: #14202E; color: #fff; }

/* ---- tab panels ---- */
.panel { display: none; }
.panel.active { display: block; }

/* ---- FAQ accordion ---- */
.faq-q {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 30px 0; margin: 0; border: 0; background: none; cursor: pointer; text-align: left;
  font-family: inherit; color: inherit;
}
.faq-arrow {
  flex: none; width: 34px; height: 34px; border-radius: 50%;
  border: 1px solid #DDD8CC; color: #54606F; background: #fff;
  display: flex; align-items: center; justify-content: center; font-size: 16px;
  transition: transform 0.4s cubic-bezier(.16,1,.3,1), background 0.3s, color 0.3s, border-color 0.3s;
}
.faq-item.open .faq-arrow { transform: rotate(180deg); background: #14202E; color: #fff; border-color: #14202E; }
.faq-a {
  display: grid; grid-template-rows: 0fr;
  transition: grid-template-rows 0.5s cubic-bezier(.16,1,.3,1);
}
.faq-item.open .faq-a { grid-template-rows: 1fr; }
.faq-a-inner { overflow: hidden; }
.faq-a-inner > p { padding-bottom: 30px; }

/* ---- copy buttons (contact) ---- */
.copy-btn {
  font-family: 'DM Sans','Noto Sans SC',sans-serif; font-size: 12.5px; font-weight: 700;
  padding: 7px 16px; border-radius: 999px; border: 1px solid #14202E;
  background: #14202E; color: #fff; cursor: pointer;
  transition: all 0.3s cubic-bezier(.16,1,.3,1);
}
.copy-btn:hover { transform: translateY(-1px); }
.copy-btn.copied { background: #3F7A64; border-color: #3F7A64; }

/* ---- terminal step progress bars ---- */
.tprog {
  display: inline-block; width: 132px; height: 7px; border-radius: 4px;
  background: rgba(255,255,255,0.08); vertical-align: 1px; overflow: hidden;
}
.tprog-fill {
  display: block; width: 0%; height: 100%; border-radius: 4px;
  background: #8FB0FF; transition: width 0.12s linear, background 0.25s ease;
}
.tprog-fill.done { background: #7DC49A; }
.tres { color: #7DC49A; }

/* hero credit (Wikimedia CC BY-SA 4.0 attribution) */
.hero-credit {
  position: absolute; right: 14px; bottom: 10px; z-index: 6;
  font-size: 10.5px; color: rgba(255,255,255,0.55);
}
.hero-credit a { color: rgba(255,255,255,0.7); }

/* =====================================================================
   MOBILE (≤760px) — design_handoff_mobile 逐值实现。
   桌面（>760px）不受以下任何规则影响；!important 用于压过内联样式。
   ===================================================================== */

/* -- 移动端专属元素在桌面隐藏 -- */
.m-burger, .m-drawer, .m-drawer-mask, .hero-ctas, .figs-hint, .cta-short { display: none; }
.hscroll { scrollbar-width: none; }
.hscroll::-webkit-scrollbar { display: none; }

@media (max-width: 760px) {
  section[id] { scroll-margin-top: 70px !important; }
  body.drawer-open { overflow: hidden; }

  /* ---- 导航（padding 由 main.js 按断点+滚动态设置） ---- */
  [data-nav] > div > div > span[data-navink] { font-size: 22px !important; }
  [data-nav] > div > div > span:last-child { width: 6px !important; height: 6px !important; margin-left: 4px !important; margin-top: 5px !important; }
  [data-nav] nav { gap: 10px !important; }
  .nav-link, [data-navghost] { display: none !important; }
  [data-navsolid] { padding: 10px 18px !important; font-size: 13.5px !important; }
  .cta-full { display: none; }
  .cta-short { display: inline; }
  .m-burger {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px;
    width: 42px; height: 42px; flex: none; border-radius: 999px; cursor: pointer; padding: 0;
    border: 1px solid rgba(255,255,255,0.4); background: rgba(255,255,255,0.12);
    transition: all 0.35s ease;
  }
  .m-burger span { width: 16px; height: 2px; border-radius: 2px; background: #fff; transition: transform 0.3s ease, opacity 0.3s ease, background 0.35s ease; }
  .nav-on .m-burger, .drawer-open .m-burger { border-color: rgba(20,32,46,0.2); background: rgba(255,255,255,0.7); }
  .nav-on .m-burger span, .drawer-open .m-burger span { background: #14202E; }
  .drawer-open .m-burger .m-burger-l1 { transform: translateY(3.5px) rotate(45deg); }
  .drawer-open .m-burger .m-burger-l2 { transform: translateY(-3.5px) rotate(-45deg); }
  /* 抽屉面板为浅色，开启时导航字标/CTA 转深色态 */
  .drawer-open [data-navink] { color: #14202E !important; }
  .drawer-open [data-navsolid] { background: #14202E !important; color: #fff !important; }

  /* ---- 抽屉 ---- */
  .m-drawer-mask { display: block; position: fixed; inset: 0; z-index: 29; background: rgba(8,14,22,0.5); backdrop-filter: blur(4px); }
  .m-drawer-mask[hidden], .m-drawer[hidden] { display: none; }
  .m-drawer {
    display: flex; flex-direction: column; gap: 4px;
    position: fixed; top: 0; left: 0; right: 0; margin: 0 auto; z-index: 29;
    padding: 96px 28px 32px; background: #FCFBF8; border-radius: 0 0 26px 26px;
    box-shadow: 0 30px 60px rgba(8,14,22,0.25);
    animation: sp-rise 0.35s cubic-bezier(.16,1,.3,1) both;
  }
  .m-drawer a { padding: 16px 4px; font-size: 19px; font-weight: 700; letter-spacing: -0.015em; border-bottom: 1px solid #EAE7DE; display: flex; justify-content: space-between; align-items: center; }
  .m-drawer-arr { color: #8A93A5; font-size: 15px; }
  .m-drawer a.m-drawer-last { border-bottom: 0; }
  .m-drawer a.m-drawer-cta { margin-top: 18px; padding: 17px; border-radius: 999px; background: #14202E; color: #fff; text-align: center; font-size: 16px; font-weight: 700; display: block; border-bottom: 0; }

  /* ---- Hero ---- */
  .hero { min-height: 100svh !important; }
  .hero-img { object-position: 62% 50%; }
  .hero-grad { background: linear-gradient(180deg,rgba(8,14,22,0.5) 0%,rgba(8,14,22,0.16) 34%,rgba(8,14,22,0.3) 62%,rgba(8,14,22,0.72) 100%) !important; }
  .hero-vig { display: none; }
  .hero-content { padding: 120px 26px 42px !important; justify-content: flex-end !important; align-items: flex-start !important; gap: 22px !important; max-width: none !important; }
  .hero-badge { font-size: 12.5px !important; gap: 10px !important; padding: 7px 8px 7px 15px !important; background: rgba(8,14,22,0.42) !important; }
  .hero-badge-tag { font-size: 12.5px !important; padding: 5px 11px !important; letter-spacing: 0.1em !important; }
  .hero-content h1 { font-size: 44px !important; line-height: 1.08 !important; letter-spacing: -0.025em !important; text-align: left !important; text-shadow: 0 2px 24px rgba(8,14,22,0.4) !important; }
  .hero-sub { font-size: 15.5px !important; line-height: 1.7 !important; text-align: left !important; max-width: none !important; text-shadow: 0 1px 14px rgba(8,14,22,0.45) !important; }
  .hero-sub br { display: none; }
  .hero-ctas { display: flex; flex-direction: column; gap: 10px; width: 100%; }
  .hero-credit { bottom: 96px !important; font-size: 9.5px !important; color: rgba(255,255,255,0.5) !important; }
  .hero-credit a { color: rgba(255,255,255,0.65) !important; }
  .logo-bar-title { font-size: 9px !important; letter-spacing: 0.24em !important; }
  .logo-bar .logo-bar-title { display: inline-block; padding: 0 18px; }
  .logo-track { gap: 44px !important; animation-duration: 30s !important; padding: 10px 26px 15px !important; }
  .logo-track > span { font-size: 17px !important; }
  .logo-fade { width: 44px !important; }

  /* ---- 全局 section ---- */
  #process, #pricing, #faq { padding: 68px 24px !important; }
  .sec-pillars { padding: 64px 24px !important; }
  #proof { padding: 68px 0 !important; }
  #proof > div { padding: 0 24px; }
  #cases { padding: 60px 0 68px !important; }
  #cases > div { padding: 0 24px; }
  #contact { padding: 64px 24px 72px !important; }
  .sec-advisors { padding: 0 24px 68px !important; }
  .sec-reviews { padding: 60px 0 68px !important; }

  /* H2 阶梯 */
  #process h2, #pricing h2, #faq h2 { font-size: 31px !important; line-height: 1.15 !important; margin-bottom: 14px !important; }
  .sec-pillars h2, #proof h2 { font-size: 30px !important; line-height: 1.15 !important; }
  #cases h2, .sec-reviews h2 { font-size: 29px !important; line-height: 1.15 !important; }
  #contact h2 { font-size: 31px !important; line-height: 1.2 !important; }
  .sec-advisors h2 { font-size: 26px !important; margin-bottom: 26px !important; }
  /* 区块副标题 */
  #process > div > p, .sec-pillars > div > p, #proof p[style*="max-width:760px"], #cases p[style*="max-width:700px"], .sec-reviews > p, #pricing p[style*="max-width:640px"] { font-size: 15px !important; line-height: 1.65 !important; margin-bottom: 34px !important; max-width: 360px !important; }

  /* ---- 服务流程 ---- */
  #process [data-stagger] { display: flex !important; flex-direction: column; gap: 16px !important; }
  #process .card-lift { padding: 26px 24px 24px !important; position: relative; }
  #process .card-lift h3 { font-size: 20px !important; }
  #process .card-lift p { font-size: 14.5px !important; }
  #process .card-lift > span:last-child { position: absolute; top: 26px; right: 24px; margin: 0 !important; padding: 0 !important; font-size: 12.5px !important; }

  /* ---- 支柱与承诺 ---- */
  .sec-pillars [data-stagger] { display: flex !important; flex-direction: column; gap: 14px !important; }
  .sec-pillars .card-lift { padding: 26px 24px !important; gap: 10px !important; }
  .sec-pillars .card-lift > span { font-size: 25px !important; }
  .sec-pillars .card-lift h3 { font-size: 18.5px !important; }
  .sec-pillars .card-lift p { font-size: 14.5px !important; }
  .sec-pillars [data-reveal-delay] { display: flex !important; flex-direction: column; gap: 12px !important; margin-top: 14px !important; }
  .sec-pillars [data-reveal-delay] > div { padding: 20px 24px !important; gap: 5px !important; border-radius: 18px !important; }
  .sec-pillars [data-reveal-delay] span { font-size: 19px !important; line-height: 1.3 !important; }
  .sec-pillars [data-reveal-delay] p { font-size: 13.5px !important; line-height: 1.6 !important; }

  /* ---- 真实交付 ---- */
  #proof > div > p em { font-size: inherit; }
  .pill-row { justify-content: flex-start !important; flex-wrap: nowrap !important; overflow-x: auto; gap: 8px !important; padding: 0 24px 20px !important; margin: 0 -24px !important; scrollbar-width: none; }
  .pill-row::-webkit-scrollbar { display: none; }
  .pill-row .pill { flex: none; font-size: 13.5px; padding: 11px 20px; }
  [data-lock-h] { min-height: 0 !important; }

  .grid-code { display: flex !important; flex-direction: column; gap: 16px !important; }
  .grid-code [data-term], .grid-code [data-term] + div, .grid-code > div > div:last-child { font-size: 11.5px !important; }
  .proof-note { font-size: 12.5px !important; line-height: 1.6 !important; padding: 0 24px; }
  .m-hide { display: none !important; }
  [data-tstep] .tprog { display: none !important; } /* 移动端不跑进度条，直接完成态 */

  .grid-figs { display: flex !important; gap: 16px !important; overflow-x: auto; padding: 0 24px 8px; margin: 0 -24px; scroll-snap-type: x mandatory; }
  .grid-figs > .fig-lift { flex: none; width: 296px; scroll-snap-align: center; }
  .grid-figs > .fig-lift > div { height: 232px !important; }
  .grid-figs > .fig-lift > span { font-size: 11.5px !important; line-height: 1.5 !important; }
  .figs-hint { display: block; }

  .grid-evd { display: flex !important; flex-direction: column; gap: 18px !important; }
  .grid-evd > div { padding: 28px 26px !important; }
  .grid-evd > div > div[style*="170px"] { font-size: 110px !important; }
  .grid-evd > div > div[style*="190px"] { font-size: 120px !important; }
  .grid-evd p { font-size: 14.5px !important; line-height: 1.75 !important; }
  .grid-evd > div > p:first-of-type { font-size: 10.5px !important; letter-spacing: 0.16em !important; }
  .grid-evd div[style*="letter-spacing:0.24em"] { font-size: 13px !important; padding: 6px 15px !important; letter-spacing: 0.22em !important; right: 22px !important; bottom: 20px !important; }

  /* ---- 客户案例 ---- */
  .grid-stats { display: grid !important; grid-template-columns: 1fr 1fr 1fr !important; gap: 8px !important; margin-bottom: 26px !important; }
  .grid-stats > div { padding: 16px 12px !important; border-radius: 16px !important; text-align: center; align-items: center; }
  .grid-stats [data-count] { font-size: 22px !important; }
  .grid-stats > div > span:nth-child(2) { font-size: 11.5px !important; }
  .stat-desc { display: none !important; }
  .grid-case { display: flex !important; flex-direction: column; gap: 16px !important; }
  .grid-case > div { padding: 24px !important; }
  .grid-case h3 { font-size: 17.5px !important; line-height: 1.4 !important; }
  .grid-case span[style*="letter-spacing:0.14em"] { font-size: 10.5px !important; }
  .grid-case span[style*="color:#39465A"] { font-size: 13.5px !important; }
  .grid-case div[style*="grid-template-columns:118px"] { grid-template-columns: 96px 1fr !important; gap: 10px !important; }
  .grid-case span[style*="font-size:12.5px;color:#8A93A5"] { font-size: 11.5px !important; }
  .grid-case span[style*="font-family:'Newsreader'"] { font-size: 13px !important; }
  /* 柱状图行给确定高度（min-height 不构成 definite height，列的 height:100% 会塌掉；
     行本身是 flex:1 的 flex item，需 flex:none 才能让 height 生效） */
  .grid-case div[style*="min-height:96px"] { flex: none !important; height: 88px !important; min-height: 0 !important; }
  #cases > div > p:last-child { font-size: 12px !important; padding: 0 24px; }

  /* ---- 评价 ---- */
  .review-track { gap: 16px !important; }
  .review-track[style*="64s"] { animation-duration: 58s !important; }
  .review-track[style*="78s"] { animation-duration: 70s !important; }
  .review-card { width: 296px !important; padding: 22px 22px 20px !important; }
  .review-card .review-stars { font-size: 14px !important; margin-bottom: 12px !important; }
  .review-card .review-quote { font-size: 14px !important; margin-bottom: 18px !important; }
  .review-card .review-avatar { width: 38px !important; height: 38px !important; font-size: 13px !important; }
  .review-card .review-name { font-size: 13.5px !important; }
  .review-card .review-role { font-size: 11.5px !important; }

  /* ---- 定价 ---- */
  .grid-pricing { display: flex !important; flex-direction: column; gap: 18px !important; }
  .grid-pricing > div { padding: 32px 28px !important; }
  .grid-pricing h3 { font-size: 23px !important; }
  .grid-pricing p { font-size: 14.5px !important; }
  .grid-pricing span[style*="color:#39465A"] { font-size: 14px !important; }
  .price-big { font-size: 38px !important; }
  .grid-pricing a { padding: 16px !important; font-size: 15.5px !important; }

  /* ---- FAQ ---- */
  .faq-q { padding: 22px 0; gap: 14px; }
  .faq-q h3 { font-size: 16.5px !important; line-height: 1.45 !important; }
  .faq-arrow { width: 32px; height: 32px; font-size: 15px; }
  .faq-a-inner > p { padding-bottom: 24px; font-size: 14.5px !important; }

  /* ---- 顾问团队（横排卡） ---- */
  .sec-advisors [data-stagger] { display: flex !important; flex-direction: column; gap: 14px !important; }
  .sec-advisors .card-lift { display: grid !important; grid-template-columns: 54px 1fr; column-gap: 16px; row-gap: 3px !important; padding: 22px 24px !important; align-items: start; }
  .sec-advisors .card-lift > div { grid-row: 1 / span 3; width: 54px !important; height: 54px !important; margin-bottom: 0 !important; }
  .sec-advisors .card-lift > span:nth-of-type(1) { font-size: 17.5px !important; }
  .sec-advisors .card-lift > span:nth-of-type(2) { font-size: 14px !important; line-height: 1.55 !important; }
  .sec-advisors .card-lift > span:nth-of-type(3) { font-size: 12.5px !important; }

  /* ---- 联系 ---- */
  #contact > div { gap: 20px !important; }
  #contact > div > p { font-size: 15px !important; }
  .contact-ctas { flex-direction: column; width: 100%; gap: 12px !important; margin-top: 0 !important; }
  #mail-cta { width: 100%; padding: 17px !important; }
  .email-pill { width: 100%; flex-direction: row !important; flex-wrap: wrap; justify-content: center; padding: 13px 18px !important; gap: 8px !important; }
  .email-pill span { font-size: 13.5px !important; }
  .email-pill .copy-btn { font-size: 12px; padding: 6px 14px; }
  .tpl-card { max-width: none !important; margin-top: 8px !important; }
  .tpl-head { padding: 14px 18px !important; gap: 10px; }
  .tpl-head > span { font-size: 11.5px !important; letter-spacing: 0.1em !important; line-height: 1.5 !important; }
  .tpl-head .copy-btn { flex: none; font-size: 12px; padding: 6px 14px; }
  #mail-template { padding: 18px !important; font-size: 12px !important; line-height: 1.85 !important; }

  /* ---- Footer ---- */
  .site-footer { flex-direction: column; gap: 6px; padding: 28px 24px 34px !important; font-size: 13px !important; }
}