/* =============================================
   project-detail-experimental-01 页面样式
   响应式断点：XXL≥1920, XL1440-1919, LG1024-1439, MD768-1023, SM<768
   ============================================= */
.experimental-detail-01 { background: #F6F4F3; font-family: 'Inter', Arial, sans-serif; }
.experimental-detail-01 .nav-link { color: #000000 !important; }
.experimental-detail-01 .nav-link:hover, .experimental-detail-01 .nav-link.active,
.experimental-detail-01 .nav-link:focus, .experimental-detail-01 .nav-link:focus-visible { color: #0066ff !important; }
.experimental-detail-01 .brand-text { color: #000000; }
.experimental-main { min-height: 100vh; margin: 0 auto; }
.content-header { padding-top: clamp(50px, 6.25vw, 90px); padding-left: clamp(25px, 3.26vw, 47px); padding-right: clamp(15px, 2.08vw, 30px); }
.header-image { width: 100%; height: auto; }
.header-image img { width: 100%; object-fit: cover; display: block; }
.video-section { padding: clamp(25px, 3.47vw, 50px) clamp(15px, 2.08vw, 30px) 0 clamp(15px, 2.08vw, 30px); position: relative; }
.video-wrapper { position: relative; width: 100%; aspect-ratio: 16/9; border-radius: 5px; overflow: hidden; background-color: #000; }
.video-wrapper .xgplayer-container { width: 100%; height: 100%; }
.video-wrapper .xgplayer-container video { width: 100%; height: 100%; object-fit: cover; }
.video-cover { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; pointer-events: none; transition: opacity 0.3s ease; }
.video-cover img { width: 100%; height: 100%; object-fit: cover; }
.video-wrapper.playing .video-cover, .video-wrapper:hover .video-cover { opacity: 0; }
.publish-time { margin-top: clamp(18px, 2.08vw, 30px); margin-bottom: clamp(18px, 2.08vw, 30px); margin-right: clamp(25px, 2.99vw, 43px); display: flex; justify-content: flex-end; font-family: 'Inter', sans-serif; font-weight: 800; font-size: clamp(14px, 1.25vw, 18px); line-height: 150%; letter-spacing: 0.06em; color: #2E8BFF; }
.image-section { padding: 0 clamp(25px, 3.26vw, 47px) 0 clamp(25px, 3.26vw, 47px); }
.image-item img { width: 100%; max-width: 100%; height: auto; display: block; }
.footer-section { position: relative; display: flex; align-items: center; justify-content: space-between; padding: clamp(70px, 10.07vw, 145px) clamp(15px, 2.08vw, 30px) clamp(20px, 2.78vw, 40px); }
.next-short, .last-short { font-family: 'Inter', sans-serif; font-weight: 700; font-size: clamp(13px, 1.25vw, 18px); letter-spacing: 0.06em; line-height: 150%; color: #000000; text-decoration: none; }
.next-short:hover, .last-short:hover { color: #0066ff; }