/* 首页专属样式：只写 ds.css 没有的版式，组件一律用 ds.css */

/* ---------- 规划辅导与竞赛微信条 ---------- */
.planning-banner { background: var(--gray-900); color: rgba(255,255,255,.82); }
.planning-banner-inner { display: flex; align-items: center; justify-content: center; min-height: 40px; max-width: calc(var(--container-wide) + var(--gutter) * 2); margin: 0 auto; padding: 8px var(--gutter); }
.planning-banner-message { font-size: var(--fs-footnote); text-align: center; }
.planning-banner-message strong { margin-left: 2px; color: #fff; font-weight: 700; letter-spacing: .02em; user-select: all; white-space: nowrap; }

/* ---------- Hero ---------- */
.home-hero { position: relative; overflow: hidden; padding: clamp(72px, 11vw, 148px) 0 clamp(64px, 8vw, 104px); text-align: center; }
.home-hero__inner { position: relative; display: grid; justify-items: center; gap: var(--space-6); }
.home-hero__badge { color: var(--text-2); }
.home-hero__badge b { color: var(--text); font-weight: 600; }
.home-hero h1 { max-width: 12em; }
.home-hero .t-lead { max-width: 34em; }
.home-hero .search { margin-top: var(--space-2); }
.home-quick { justify-content: center; --cluster-gap: 8px; color: var(--text-3); font-size: var(--fs-footnote); }
.home-quick > span { margin-right: 4px; }
.home-hero__aside { color: var(--text-2); font-size: var(--fs-callout); }
.home-hero__aside a { color: var(--accent); font-weight: 600; }
.home-hero__aside a:hover { text-decoration: underline; text-underline-offset: 4px; }

/* 入场：纯 CSS，逐层浮现 */
.home-hero__inner > * { animation: home-rise .9s var(--ease-out) both; }
.home-hero__inner > :nth-child(2) { animation-delay: .06s; }
.home-hero__inner > :nth-child(3) { animation-delay: .12s; }
.home-hero__inner > :nth-child(4) { animation-delay: .18s; }
.home-hero__inner > :nth-child(5) { animation-delay: .24s; }
.home-hero__inner > :nth-child(n+6) { animation-delay: .3s; }
@keyframes home-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

/* 漂浮的校徽与保研要素（装饰）：进页时从中心向外浮现，之后缓慢漂浮 */
.home-school-marks { position: absolute; inset: 0; pointer-events: none; user-select: none; }
.home-school-marks img { position: absolute; width: 56px; height: 56px; padding: 7px; object-fit: contain; border-radius: 50%; background: #fff; opacity: .2; box-shadow: 0 6px 24px rgba(35,55,100,.08); animation: home-mark-in 1s var(--ease-out) both, home-drift 12s ease-in-out infinite; animation-delay: calc(.45s + var(--i) * .05s), var(--d); }
.home-school-marks img:nth-child(1) { left: 17%; top: 8%; width: 64px; height: 64px; --i: 0; --d: 0s; }
.home-school-marks img:nth-child(2) { left: 26%; top: 22%; width: 44px; height: 44px; --i: 1; --d: -1.7s; }
.home-school-marks img:nth-child(3) { left: 21%; top: 42%; width: 56px; height: 56px; --i: 2; --d: -3.4s; }
.home-school-marks img:nth-child(4) { left: 1.5%; top: 31%; width: 48px; height: 48px; --i: 3; --d: -5.1s; }
.home-school-marks img:nth-child(5) { left: 18%; top: 70%; width: 52px; height: 52px; --i: 4; --d: -6.8s; }
.home-school-marks img:nth-child(6) { left: 1%; top: 90%; width: 44px; height: 44px; --i: 5; --d: -8.5s; }
.home-school-marks img:nth-child(7) { left: 14%; top: 86%; width: 60px; height: 60px; --i: 6; --d: -10.2s; }
.home-school-marks img:nth-child(8) { left: 27%; top: 92%; width: 42px; height: 42px; --i: 7; --d: -11.9s; }
.home-school-marks img:nth-child(9) { right: 22%; top: 9%; width: 60px; height: 60px; --i: 8; --d: -1.6s; }
.home-school-marks img:nth-child(10) { right: 27%; top: 24%; width: 42px; height: 42px; --i: 9; --d: -3.3s; }
.home-school-marks img:nth-child(11) { right: 13%; top: 39%; width: 56px; height: 56px; --i: 10; --d: -5s; }
.home-school-marks img:nth-child(12) { right: 1.5%; top: 30%; width: 46px; height: 46px; --i: 11; --d: -6.7s; }
.home-school-marks img:nth-child(13) { right: 20%; top: 72%; width: 52px; height: 52px; --i: 12; --d: -8.4s; }
.home-school-marks img:nth-child(14) { right: 1%; top: 91%; width: 44px; height: 44px; --i: 13; --d: -10.1s; }
.home-school-marks img:nth-child(15) { right: 20%; top: 85%; width: 58px; height: 58px; --i: 14; --d: -11.8s; }
.home-school-marks img:nth-child(16) { right: 7%; top: 88%; width: 46px; height: 46px; --i: 15; --d: -1.5s; }
@media (max-width: 1180px) { .home-school-marks { display: none; } }

.home-float { position: absolute; inset: 0; pointer-events: none; }
.home-float span { position: absolute; display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px 10px 10px; border: 1px solid var(--glass-line); border-radius: var(--r-pill); background: var(--glass-bg); -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); box-shadow: var(--shadow-2); color: var(--text); font-size: var(--fs-footnote); font-weight: 600; white-space: nowrap; animation: home-float-in 1s var(--ease-out) both, home-drift 9s ease-in-out infinite; animation-delay: calc(.3s + var(--i) * .07s), var(--d); }
.home-float .icon-tile { width: 32px; height: 32px; border-radius: 50%; }
.home-float .icon-tile svg { width: 16px; height: 16px; }
.home-float span:nth-child(1) { left: 4%; top: 13%; --i: 0; --d: 0s; --fx: 120px; }
.home-float span:nth-child(2) { right: calc(50% + 370px); top: 27%; --i: 1; --d: -2.3s; --fx: 120px; }
.home-float span:nth-child(3) { left: 3%; top: 45%; --i: 2; --d: -4.6s; --fx: 120px; }
.home-float span:nth-child(4) { right: calc(50% + 400px); top: 61%; --i: 3; --d: -6.9s; --fx: 120px; }
.home-float span:nth-child(5) { left: 6%; top: 77%; --i: 4; --d: -0.2s; --fx: 120px; }
.home-float span:nth-child(6) { right: 5%; top: 12%; --i: 5; --d: -2.5s; --fx: -120px; }
.home-float span:nth-child(7) { left: calc(50% + 370px); top: 27%; --i: 6; --d: -4.8s; --fx: -120px; }
.home-float span:nth-child(8) { right: 3%; top: 44%; --i: 7; --d: -7.1s; --fx: -120px; }
.home-float span:nth-child(9) { left: calc(50% + 400px); top: 60%; --i: 8; --d: -0.4s; --fx: -120px; }
.home-float span:nth-child(10) { right: 6%; top: 76%; --i: 9; --d: -2.7s; --fx: -120px; }
/* 入场用 translate/scale，漂浮用 transform，两者叠加互不覆盖 */
@keyframes home-float-in { from { opacity: 0; translate: var(--fx) 24px; scale: .6; filter: blur(6px); } to { opacity: 1; translate: 0 0; scale: 1; filter: blur(0); } }
@keyframes home-mark-in { from { opacity: 0; scale: .4; } to { opacity: .2; scale: 1; } }
@keyframes home-drift { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }

/* ---------- 近期机会 ---------- */
.home-opps { padding-top: 0; }
.home-opps__layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--space-6); align-items: start; }
.home-opps__toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-4); }
.home-opps__filters { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.home-opps__filters label { display: inline-flex; align-items: center; }
.home-opps__count { margin-top: var(--space-3); padding-inline: var(--space-2); }
.home-opps .list { min-height: 300px; }
.home-row .row__media { font-family: var(--font-display); font-size: 18px; font-weight: 700; color: var(--accent); background: var(--accent-soft); }
.home-row .row__school { color: var(--text); font-weight: 600; }
.home-row .row__title { margin: 0; font-family: var(--font-sans); letter-spacing: 0; }
.home-row:hover .row__title { color: var(--accent); }
.home-row .row__aside { min-width: 140px; }
.home-loading { padding: var(--space-4) var(--space-6); display: grid; gap: var(--space-5); }
.home-loading > div { display: grid; grid-template-columns: 48px 1fr 72px; gap: var(--space-4); align-items: center; }

/* 免费定位侧卡（测试锁定 class="discovery-aside"） */
.discovery-aside { position: sticky; top: calc(var(--header-h) + 24px); display: grid; gap: var(--space-5); padding: var(--space-8); border-radius: var(--r-xl); background: var(--aurora), var(--bg-elevated); box-shadow: var(--shadow-2); overflow: hidden; }
.discovery-aside h2 { font-size: var(--fs-title-2); line-height: var(--lh-title); letter-spacing: var(--ls-tight); }
.discovery-aside p { color: var(--text-2); font-size: var(--fs-callout); }
.home-benefits { display: grid; gap: var(--space-4); }
.home-benefits li { display: grid; grid-template-columns: 36px 1fr; gap: var(--space-3); align-items: start; font-size: var(--fs-callout); font-weight: 600; line-height: 1.45; }
.home-benefits .icon-tile { width: 36px; height: 36px; border-radius: 10px; }
.home-benefits .icon-tile svg { width: 18px; height: 18px; }
.home-benefits small { display: block; margin-top: 2px; color: var(--text-3); font-size: var(--fs-footnote); font-weight: 400; }

/* ---------- 阶段路径：四步等宽，大号序号 + 进度轨道表达先后 ---------- */
.home-stage-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-4); margin: 0; padding: 0; list-style: none; }
.home-stage-list > li { display: flex; min-width: 0; }
.home-stage { flex: 1; min-height: 288px; padding: var(--space-6) var(--space-6) var(--space-8); background: var(--bg); box-shadow: none; }
.home-stage__head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); }
.home-stage__num { font-family: var(--font-display); font-size: 64px; font-weight: 600; line-height: .86; letter-spacing: -.05em; font-variant-numeric: tabular-nums; color: var(--gray-300); transition: color var(--dur-2) var(--ease); }
.home-stage__go { display: grid; place-items: center; width: 36px; height: 36px; flex: none; border-radius: 50%; background: var(--bg-elevated); color: var(--gray-600); box-shadow: var(--shadow-1); transition: background var(--dur-2) var(--ease), color var(--dur-2) var(--ease); }
.home-stage__track { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; margin-top: var(--space-8); }
.home-stage__track i { height: 3px; border-radius: 2px; background: var(--gray-200); }
.home-stage-list > li:nth-child(1) .home-stage__track i:nth-child(-n+1),
.home-stage-list > li:nth-child(2) .home-stage__track i:nth-child(-n+2),
.home-stage-list > li:nth-child(3) .home-stage__track i:nth-child(-n+3),
.home-stage-list > li:nth-child(4) .home-stage__track i { background: var(--accent); }
.home-stage .card__title { margin-top: auto; padding-top: var(--space-6); font-size: var(--fs-title-3); }
.home-stage:hover .home-stage__num { color: var(--accent); }
.home-stage:hover .home-stage__go { background: var(--accent); color: #fff; }
.home-stage:hover .btn__arrow { transform: translateX(2px); }
.home-stage--lead { background: var(--grad-dark); color: var(--text-on-dark); box-shadow: var(--shadow-2); }
.home-stage--lead .home-stage__num { color: transparent; background: linear-gradient(180deg, #fff 0%, rgba(157,188,255,.55) 100%); -webkit-background-clip: text; background-clip: text; }
.home-stage--lead .home-stage__go { background: rgba(255,255,255,.12); color: #fff; box-shadow: none; }
.home-stage--lead .home-stage__track i { background: rgba(255,255,255,.16); }
.home-stage-list > li:nth-child(3) .home-stage--lead .home-stage__track i:nth-child(-n+3) { background: var(--blue-300); }
.home-stage--lead .card__title { color: #fff; }
.home-stage--lead .card__body { color: var(--text-on-dark-2); }
.home-stage--lead:hover .home-stage__num { color: transparent; }
.home-stage--lead:hover .home-stage__go { background: #fff; color: var(--navy-900); }

/* ---------- 经验 ---------- */
.home-exp .card__title { margin-top: var(--space-4); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.home-exp .card__foot span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ok); font-weight: 600; }
.home-exp .card:hover .btn__arrow { transform: translateX(3px); color: var(--accent); }
.home-exp .empty { grid-column: 1 / -1; }
.home-exp [data-seo-card] { padding: var(--space-6) !important; }

/* ---------- 深色行动区 ---------- */
.home-cta { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: var(--space-12); align-items: center; padding: clamp(32px, 6vw, 80px); border-radius: var(--r-2xl); }
.home-cta h2 { font-size: var(--fs-display); line-height: 1.12; letter-spacing: var(--ls-hero); }
.home-cta p { margin-top: var(--space-5); color: var(--text-on-dark-2); font-size: var(--fs-callout); line-height: 1.7; max-width: 36em; }
.home-cta .cluster { margin-top: var(--space-8); }
.home-flow { display: grid; gap: var(--space-3); padding: var(--space-6); border: 1px solid rgba(255,255,255,.14); border-radius: var(--r-xl); background: rgba(255,255,255,.06); -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); }
.home-flow ol { display: grid; gap: var(--space-2); margin: 0; padding: 0; list-style: none; counter-reset: flow; }
.home-final { padding-top: 0; padding-bottom: var(--space-16); }
.home-flow li { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3) 0; color: #fff; font-weight: 600; counter-increment: flow; }
.home-flow li + li { border-top: 1px solid rgba(255,255,255,.1); }
.home-flow li::before { content: counter(flow); display: grid; place-items: center; width: 28px; height: 28px; flex: none; border-radius: 50%; background: rgba(255,255,255,.12); font-size: var(--fs-footnote); font-variant-numeric: tabular-nums; }

/* ---------- Responsive ---------- */
@media (max-width: 1180px) { .home-float { display: none; } }
@media (max-width: 1100px) { .home-stage-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .home-stage { min-height: 240px; } }
@media (max-width: 600px) {
  .home-stage-list { grid-template-columns: 1fr; gap: var(--space-3); }
  .home-stage { min-height: 0; padding: var(--space-5) var(--space-5) var(--space-6); }
  .home-stage__num { font-size: 44px; }
  .home-stage__track { margin-top: var(--space-5); }
  .home-stage .card__title { padding-top: var(--space-4); }
}
@media (max-width: 1000px) {
  .home-opps__layout { grid-template-columns: 1fr; }
  .discovery-aside { position: static; }
  .home-cta { grid-template-columns: 1fr; gap: var(--space-8); }
}
@media (max-width: 900px) {
  .home-hero { text-align: center; }
  .home-opps__toolbar { align-items: flex-start; flex-direction: column; }
  .home-opps__filters { width: 100%; }
  .home-opps .segmented { max-width: 100%; overflow-x: auto; }
  .home-row .row__aside { min-width: 0; }
  .discovery-aside { padding: var(--space-6); }
}
@media (prefers-reduced-motion: reduce) { .home-hero__inner > *, .home-float span, .home-school-marks img { animation: none; } }
.home-opps__filters .select { width: auto; }
