/* 用途：首页沉浸式视觉与章节布局；只依赖现有内容和品牌色。 */
.portal-home {
  --home-dark: #101114;
  --home-light: #f8f7f4;
  --home-muted: #b8b5b0;
  --home-rule: #53504d;
  --home-accent: #ff9476;
}
.portal-home .hero-stage { background: var(--home-dark); color: var(--home-light); }
.portal-home .hero-stage::before { display: none; }
.portal-home .hero { min-height: min(760px, calc(100svh - 84px)); padding: 60px 0 80px; }
.portal-home .hero-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 0; align-items: center; }
.portal-home .hero-grid > div:first-child { position: relative; z-index: 2; }
.portal-home .hero-title { font-size: clamp(3.1rem, 5.5vw, 5.6rem); line-height: 1.15; letter-spacing: -.05em; }
.portal-home .hero-summary { max-width: 440px; margin-top: 30px; color: var(--home-light); opacity: .8; }
.portal-home .hero-stage .btn-primary { background: var(--coral); color: var(--home-dark); }
.portal-home .hero-profile { width: 100%; max-width: none; min-height: 500px; aspect-ratio: 1; position: relative; display: flex; justify-content: flex-end; align-items: flex-start; padding: 0 0 24px 36px; text-align: left; }
.portal-home .hero-profile::before, .portal-home .hero-profile::after { display: none; }
.portal-home .hero-field { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: -1; }
.portal-home .hero-field-hint { display: none; position: absolute; right: 12px; top: 18px; color: var(--home-muted); font-size: .76rem; }
.portal-home .field-ready .hero-field-hint { display: block; }
.portal-home .hero-profile-name { font-size: 1.6rem; line-height: 1.1; font-weight: 600; }
.portal-home .hero-profile-role { margin: 8px 0 0; font-size: .9rem; color: var(--home-light); }
.portal-home .hero-profile-fields { display: flex; position: static; margin-top: 24px; gap: 8px; flex-wrap: wrap; }
.portal-home .hero-profile-fields a, .portal-home .hero-profile-fields a:nth-child(n) { position: static; transform: none; padding: 8px 12px; border: 1px solid var(--home-rule); background: var(--home-dark); color: var(--home-light); font-size: .78rem; border-radius: 0; }
.portal-home .hero-profile-fields a:hover, .portal-home .hero-profile-fields a:nth-child(n):hover { transform: translateY(-3px); border-color: var(--home-accent); color: var(--home-light); }
.portal-home .home-experience { background: var(--home-light); }
.portal-home .experience-layout { display: block; padding-block: 110px; }
.portal-home .experience-intro { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 16px 80px; align-items: end; margin-bottom: 70px; }
.portal-home .experience-intro h2 { max-width: 730px; grid-row: span 2; font-size: clamp(2.6rem, 4vw, 4.4rem); line-height: 1.18; font-weight: 600; }
.portal-home .experience-intro p { margin: 0; }
.portal-home .experience-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; border-bottom: 0; }
.portal-home .experience-row { border-top: 2px solid var(--fg); }
.portal-home .experience-row summary { grid-template-columns: 1fr auto; gap: 12px; padding-block: 26px; }
.portal-home .experience-row summary .experience-index { grid-column: 1 / -1; margin-bottom: 34px; }
.portal-home .experience-row p { margin: 0 0 24px; }
.portal-home #services { background: var(--home-dark); color: var(--home-light); }
.portal-home #services .section-note { color: var(--home-muted); }
.portal-home #services .services-grid .service-item { border-color: var(--home-rule); padding-block: 40px; color: var(--home-light); }
.portal-home #services .service-desc { color: var(--home-muted); font-size: .95rem; }
.portal-home #services .service-num, .portal-home #services .service-price { color: var(--home-accent); }
.portal-home #services .service-name { font-size: clamp(1.45rem, 2vw, 2rem); }
.portal-home #projects .services-grid { grid-template-columns: 1.2fr .8fr; gap: 16px; }
.portal-home #projects .services-grid .service-item { min-height: 360px; display: flex; flex-direction: column; justify-content: space-between; }
.portal-home #projects .services-grid .service-item:first-child { background: var(--home-dark); color: var(--home-light); }
.portal-home #projects .services-grid .service-item:first-child .service-desc { color: var(--home-muted); }
.portal-home #projects .services-grid .service-item:first-child .service-num, .portal-home #projects .services-grid .service-item:first-child .service-price { color: var(--home-accent); }
.portal-home #projects .service-name { font-size: clamp(1.8rem, 3vw, 3rem); }
.portal-home #tools { background: var(--home-dark); color: var(--home-light); }
.portal-home #tools .section-note, .portal-home #tools .tools-preview-description { color: var(--home-muted); }
.portal-home #tools .tools-preview-link { background: transparent; border-color: var(--home-rule); }
.portal-home #tools .tools-preview-link:hover { border-color: var(--home-accent); }
.portal-home #tools .tools-preview-label { color: var(--home-accent); }
@media (max-width: 820px) {
  .portal-home .hero { min-height: 0; padding: 68px 0 56px; }
  .portal-home .hero-grid { grid-template-columns: 1fr; gap: 12px; }
  .portal-home .hero-title { font-size: clamp(2.7rem, 8vw, 4.2rem); }
  .portal-home .hero-profile { width: 100%; min-height: 0; max-width: 540px; margin: 0 auto; padding: 0 0 24px; text-align: left; }
  .portal-home .experience-layout { padding-block: 72px; }
  .portal-home .experience-intro { display: block; margin-bottom: 40px; }
  .portal-home .experience-intro p { margin: 20px 0; }
  .portal-home .experience-list { grid-template-columns: 1fr; gap: 0; }
  .portal-home .experience-row summary .experience-index { grid-column: auto; margin-bottom: 0; }
  .portal-home .experience-row summary { grid-template-columns: 28px minmax(0, 1fr) 24px; }
  .portal-home .experience-row p { margin-left: 38px; }
}
@media (max-width: 560px) {
  .portal-home .hero-title { font-size: clamp(2.2rem, 9.8vw, 2.7rem); }
  .portal-home .hero-profile { padding-bottom: 12px; }
  .portal-home .hero-profile-name { font-size: 1.35rem; }
  .portal-home .hero-profile-fields { gap: 6px; margin-top: 16px; }
  .portal-home .hero-profile-fields a, .portal-home .hero-profile-fields a:nth-child(n) { font-size: .72rem; padding: 8px; }
  .portal-home #projects .services-grid { grid-template-columns: 1fr; }
  .portal-home #projects .services-grid .service-item { min-height: 260px; }
}
@media (prefers-reduced-motion: reduce) {
  .portal-home .hero-profile-fields a { transition: none; }
}
@media (hover: none), (prefers-reduced-motion: reduce) {
  .portal-home .field-ready .hero-field-hint { display: none; }
}
