/* 瀑布流：保留原始横竖比例，绝对定位排列，淡入出现 */
.wf-list { width: 100%; position: relative; overflow: hidden; }
.wf-item { position: absolute; left: 0; top: 0; visibility: hidden; }
.wf-item.show { visibility: visible; animation: wfIn 1s ease both; }
@keyframes wfIn { from { opacity: 0; } to { opacity: 1; } }
.card { cursor: pointer; margin-bottom: 1rem; }
.card img {
  width: 100%; height: auto; display: block; background: #EFE9E0;
  /* 统一轻微调色，让不同色调的照片并排时更协调；悬停恢复原色 */
  filter: saturate(.86) sepia(.08) contrast(.98);
  transition: filter .4s ease;
}
.card:hover img { filter: none; }
.card img.loading { aspect-ratio: 1 / 1; object-fit: cover; }
.card .text { margin-top: .6rem; text-align: center; color: var(--ink-soft); font-size: .8125rem; letter-spacing: .03em; }
.card:hover .text { color: var(--ink); }

/* 首页作品区：与轮播之间留白 + 区块标题 */
.works { padding: 90px 0 60px; }
.works-title {
  text-align: center; font-size: .8125rem; font-weight: 500; letter-spacing: .32em; text-transform: uppercase;
  color: var(--ink-soft); margin-bottom: 40px;
}
.works-title::after { content: ""; display: block; width: 32px; height: 1px; background: var(--accent-dark); margin: 16px auto 0; }
@media (max-width: 767px) { .works { padding: 56px 0 40px; } .works-title { margin-bottom: 28px; } }

/* 视频列表 */
.video-list { display: flex; flex-wrap: wrap; justify-content: center; gap: 0 16px; padding: 0 8px; }
.video-card {
  display: inline-flex; flex-direction: column; align-items: center; justify-content: center;
  cursor: pointer; margin-bottom: 16px; width: 100%;
}
@media (min-width: 640px) { .video-card { width: 330px; } }
@media (min-width: 768px) { .video-card { width: 360px; } }
.video-cover { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: #000; }
.video-cover img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
.video-cover .play {
  position: absolute; left: 50%; top: 50%; width: 56px; height: 56px; margin: -28px 0 0 -28px;
  border-radius: 50%; background: rgba(0, 0, 0, .45); display: flex; align-items: center; justify-content: center;
}
.video-cover .play::after { content: ""; border-left: 18px solid #fff; border-top: 11px solid transparent; border-bottom: 11px solid transparent; margin-left: 5px; }
.video-name { margin-top: .5rem; font-size: 1rem; color: var(--ink); }
.video-modal { position: fixed; inset: 0; z-index: 2000; background: rgba(0, 0, 0, .4); display: flex; align-items: center; justify-content: center; }
.video-modal video { width: 90vw; max-width: 1100px; max-height: 80vh; background: #000; }

/* 图文单页 */
.rich { padding: 2.5rem; color: var(--ink); line-height: 1.8; word-break: break-word; }
@media (min-width: 1024px) { .rich { padding: 2.5rem 14rem; } }
.rich h1 { font-size: 2em; font-weight: 700; margin: .5em 0; }
.rich h2 { font-size: 1.5em; font-weight: 700; margin: .5em 0; }
.rich h3 { font-size: 1.17em; font-weight: 700; margin: .5em 0; }
.rich p { margin: .4em 0; }
.rich b, .rich strong { font-weight: 700; }
.rich img { max-width: 100%; height: auto; margin: .6em 0; }
.rich a { color: var(--accent-dark); text-decoration: underline; text-underline-offset: 3px; }
.rich ul, .rich ol { padding-left: 1.5em; }
.clients { display: flex; flex-direction: column; }
.clients h3 { font-weight: 700; font-size: 1rem; color: var(--ink); }
.clients { padding: 2.5rem 1.5rem; line-height: 1.8; }