/* 亿晟出品创业项目超市 · V6 全站轻量动效层 */

:root {
  --ys-motion-fast: 220ms;
  --ys-motion-normal: 560ms;
  --ys-motion-slow: 900ms;
  --ys-motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* 页面滚动进度：长手册、资料和下载清单都能直观看到阅读位置。 */
.ys-scroll-progress {
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  pointer-events: none;
  transform: scaleX(0);
  transform-origin: 0 50%;
  background: linear-gradient(90deg, #3156df, #087b72 72%, #e66a2c);
  box-shadow: 0 1px 8px rgba(49, 86, 223, 0.32);
  will-change: transform;
}

/* JS 就绪后才隐藏内容；脚本未加载时页面始终完整可见。 */
html.ys-motion-ready .ys-reveal {
  opacity: 0;
  filter: blur(1.5px);
  transform: translate3d(0, 22px, 0) scale(0.992);
  transition:
    opacity var(--ys-motion-normal) ease var(--ys-delay, 0ms),
    filter var(--ys-motion-normal) ease var(--ys-delay, 0ms),
    transform var(--ys-motion-normal) var(--ys-motion-ease) var(--ys-delay, 0ms);
  will-change: opacity, filter, transform;
}

html.ys-motion-ready .ys-reveal.ys-in-view {
  opacity: 1;
  filter: blur(0);
  transform: translate3d(0, 0, 0) scale(1);
  will-change: auto;
}

/* 首屏的光影和装饰只做缓慢微动，避免影响阅读。 */
.hero::before {
  transform-origin: 50% 50%;
  animation: ys-hero-glow 10s ease-in-out infinite alternate;
}

.hero::after {
  animation: ys-hero-orbit 12s ease-in-out infinite alternate;
}

.brand-mark,
.brand img,
.site-head .logo {
  animation: ys-brand-breathe 5.5s ease-in-out infinite;
}

/* 章节标识进入时展开，强化长页面的阅读节奏。 */
.document > h1::after,
.section-head h2::after,
.catalog-title h2::after {
  transform-origin: 0 50%;
  animation: ys-line-grow 720ms var(--ys-motion-ease) both;
}

/* 桌面交互反馈。 */
@media (hover: hover) and (pointer: fine) {
  .btn,
  .button,
  .ghost-button,
  .manifest,
  .zip,
  .hero-actions a,
  .closing a,
  .filters button,
  .role-switcher button,
  .reading-tools button {
    position: relative;
    overflow: hidden;
  }

  .btn::after,
  .button::after,
  .ghost-button::after,
  .manifest::after,
  .zip::after,
  .hero-actions a::after,
  .closing a::after {
    content: "";
    position: absolute;
    inset: -80% auto -80% -38%;
    width: 26%;
    pointer-events: none;
    opacity: 0;
    transform: rotate(17deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.42), transparent);
    transition: left 520ms ease, opacity 180ms ease;
  }

  .btn:hover::after,
  .button:hover::after,
  .ghost-button:hover::after,
  .manifest:hover::after,
  .zip:hover::after,
  .hero-actions a:hover::after,
  .closing a:hover::after {
    left: 112%;
    opacity: 1;
  }

  a.nav-card:hover::before,
  a.resource-card:hover::before,
  a.file-card:hover::before,
  .project-card:hover::before,
  .system:hover::before {
    animation: ys-accent-sweep 760ms var(--ys-motion-ease) both;
  }
}

/* 分享卡保持固定画布可截图，只加入不会遮挡内容的轻微呼吸动效。 */
html.ys-share-motion .brand-mark {
  animation: ys-share-brand 4.8s ease-in-out infinite;
}

html.ys-share-motion .flow b:nth-of-type(1) { animation: ys-share-chip 4.2s ease-in-out 0ms infinite; }
html.ys-share-motion .flow b:nth-of-type(2) { animation: ys-share-chip 4.2s ease-in-out 180ms infinite; }
html.ys-share-motion .flow b:nth-of-type(3) { animation: ys-share-chip 4.2s ease-in-out 360ms infinite; }
html.ys-share-motion .flow b:nth-of-type(4) { animation: ys-share-chip 4.2s ease-in-out 540ms infinite; }
html.ys-share-motion .flow b:nth-of-type(5) { animation: ys-share-chip 4.2s ease-in-out 720ms infinite; }

@keyframes ys-hero-glow {
  0% { transform: translate3d(-1.2%, -0.8%, 0) scale(1.01); opacity: 0.82; }
  100% { transform: translate3d(1.4%, 1%, 0) scale(1.055); opacity: 1; }
}

@keyframes ys-hero-orbit {
  0% { transform: translate3d(0, 0, 0) rotate(0.001deg); }
  100% { transform: translate3d(-12px, 10px, 0) rotate(3deg); }
}

@keyframes ys-brand-breathe {
  0%, 100% { box-shadow: 0 7px 20px rgba(16, 28, 59, 0.14); }
  50% { box-shadow: 0 9px 26px rgba(49, 86, 223, 0.22); }
}

@keyframes ys-line-grow {
  from { transform: scaleX(0.12); opacity: 0.28; }
  to { transform: scaleX(1); opacity: 1; }
}

@keyframes ys-accent-sweep {
  0% { opacity: 0.42; transform: scaleX(0.28); transform-origin: 0 50%; }
  100% { opacity: 0.9; transform: scaleX(1); transform-origin: 0 50%; }
}

@keyframes ys-share-brand {
  0%, 100% { box-shadow: 0 12px 32px rgba(10, 28, 92, 0.2); }
  50% { box-shadow: 0 15px 42px rgba(0, 107, 109, 0.28); }
}

@keyframes ys-share-chip {
  0%, 78%, 100% { transform: translateY(0); }
  86% { transform: translateY(-3px); }
}

@media (max-width: 720px) {
  .ys-scroll-progress { height: 2px; }

  .ys-mobile-top {
    position: fixed;
    z-index: 90;
    right: max(12px, env(safe-area-inset-right));
    bottom: max(14px, env(safe-area-inset-bottom));
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-width: 62px;
    min-height: 44px;
    padding: 0 13px;
    border: 1px solid rgba(49, 86, 223, 0.18);
    border-radius: 999px;
    color: #fff;
    background: rgba(30, 53, 145, 0.9);
    box-shadow: 0 12px 30px rgba(20, 38, 92, 0.24);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    font: 800 12px/1 -apple-system, BlinkMacSystemFont, "PingFang SC", sans-serif;
    opacity: 0;
    pointer-events: none;
    transform: translate3d(0, 12px, 0);
    transition: opacity 180ms ease, transform 220ms var(--ys-motion-ease);
  }

  .ys-mobile-top.ys-top-visible {
    opacity: 1;
    pointer-events: auto;
    transform: translate3d(0, 0, 0);
  }

  .ys-mobile-top span {
    font-size: 17px;
    line-height: 1;
  }

  html.ys-motion-ready .ys-reveal {
    filter: blur(0.7px);
    transform: translate3d(0, 14px, 0) scale(0.996);
    transition-duration: 460ms;
  }

  .hero::before { animation-duration: 13s; }
  .hero::after { animation-duration: 15s; }
}

@media (min-width: 721px) {
  .ys-mobile-top { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .ys-scroll-progress { box-shadow: none; }

  html.ys-motion-ready .ys-reveal,
  html.ys-motion-ready .ys-reveal.ys-in-view {
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
    transition: none !important;
  }

  .hero::before,
  .hero::after,
  .brand-mark,
  .brand img,
  .site-head .logo,
  .document > h1::after,
  .section-head h2::after,
  .catalog-title h2::after,
  html.ys-share-motion .flow b {
    animation: none !important;
  }
}