/* ============================================
   五一大赛每日精选视频 - cqftkz.cn
   Modern Glassmorphism Video Platform
   CSS Hash: _v7k3m
   ============================================ */

:root {
    --clr-primary_v7k3m: #6c5ce7;
    --clr-secondary_v7k3m: #00cec9;
    --clr-accent_v7k3m: #fd79a8;
    --clr-dark_v7k3m: #0a0a1a;
    --clr-darker_v7k3m: #06060f;
    --clr-surface_v7k3m: rgba(255,255,255,0.06);
    --clr-glass_v7k3m: rgba(255,255,255,0.08);
    --clr-text_v7k3m: #e8e8f0;
    --clr-muted_v7k3m: #8888a0;
    --radius_v7k3m: 16px;
    --glass-border_v7k3m: 1px solid rgba(255,255,255,0.12);
    --shadow_v7k3m: 0 8px 32px rgba(0,0,0,0.4);
    --transition_v7k3m: all 0.3s cubic-bezier(0.4,0,0.2,1);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

html { scroll-behavior: smooth; font-size: 16px; }

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
    background: var(--clr-darker_v7k3m);
    color: var(--clr-text_v7k3m);
    line-height: 1.6;
    overflow-x: hidden;
    min-height: 100vh;
}

/* Background Gradient Orbs */
.bg-orbs_v7k3m {
    position: fixed; top:0; left:0; width:100%; height:100%; z-index:0; pointer-events:none;
}
.bg-orbs_v7k3m::before {
    content:''; position:absolute; top:-20%; left:-10%; width:600px; height:600px;
    background: radial-gradient(circle, rgba(108,92,231,0.15) 0%, transparent 70%);
    border-radius:50%; animation: float_v7k3m 20s ease-in-out infinite;
}
.bg-orbs_v7k3m::after {
    content:''; position:absolute; bottom:-20%; right:-10%; width:500px; height:500px;
    background: radial-gradient(circle, rgba(0,206,201,0.12) 0%, transparent 70%);
    border-radius:50%; animation: float_v7k3m 25s ease-in-out infinite reverse;
}
@keyframes float_v7k3m {
    0%,100%{transform:translate(0,0)} 50%{transform:translate(60px,-40px)}
}

/* Header & Navigation */
.header_v7k3m {
    position: fixed; top:0; left:0; width:100%; z-index:1000;
    background: rgba(10,10,26,0.75);
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
    border-bottom: var(--glass-border_v7k3m);
    transition: var(--transition_v7k3m);
}
.header_v7k3m.scrolled_v7k3m {
    background: rgba(10,10,26,0.92);
    box-shadow: 0 4px 30px rgba(0,0,0,0.3);
}
.nav-container_v7k3m {
    max-width: 1400px; margin:0 auto; padding: 0 24px;
    display:flex; align-items:center; justify-content:space-between; height:70px;
}
.logo-wrap_v7k3m { display:flex; align-items:center; gap:12px; text-decoration:none; }
.logo-wrap_v7k3m svg { width:40px; height:40px; }
.logo-text_v7k3m {
    font-size:1.2rem; font-weight:700; color:#fff;
    background: linear-gradient(135deg, var(--clr-primary_v7k3m), var(--clr-secondary_v7k3m));
    -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}
.nav-links_v7k3m { display:flex; gap:8px; list-style:none; }
.nav-links_v7k3m a {
    color: var(--clr-muted_v7k3m); text-decoration:none; padding:8px 16px;
    border-radius:8px; font-size:0.9rem; font-weight:500;
    transition: var(--transition_v7k3m); position:relative;
}
.nav-links_v7k3m a:hover, .nav-links_v7k3m a.active_v7k3m {
    color:#fff; background: var(--clr-glass_v7k3m);
}
.nav-links_v7k3m a.active_v7k3m::after {
    content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%);
    width:20px; height:2px; background: var(--clr-primary_v7k3m); border-radius:2px;
}

/* Search Box */
.search-box_v7k3m {
    position:relative; width:240px;
}
.search-box_v7k3m input {
    width:100%; padding:10px 40px 10px 16px; border:none; outline:none;
    background: var(--clr-surface_v7k3m); color:#fff; border-radius:24px;
    font-size:0.85rem; border: var(--glass-border_v7k3m);
    transition: var(--transition_v7k3m);
}
.search-box_v7k3m input:focus {
    background: rgba(255,255,255,0.12);
    box-shadow: 0 0 0 2px rgba(108,92,231,0.3);
}
.search-box_v7k3m input::placeholder { color: var(--clr-muted_v7k3m); }
.search-icon_v7k3m {
    position:absolute; right:12px; top:50%; transform:translateY(-50%);
    color: var(--clr-muted_v7k3m); cursor:pointer; transition: var(--transition_v7k3m);
}
.search-icon_v7k3m:hover { color: var(--clr-primary_v7k3m); }

/* Mobile Menu Toggle */
.menu-toggle_v7k3m {
    display:none; background:none; border:none; cursor:pointer; padding:8px;
}
.menu-toggle_v7k3m span {
    display:block; width:24px; height:2px; background:#fff;
    margin:5px 0; transition: var(--transition_v7k3m); border-radius:2px;
}

/* Main Content */
.main-content_v7k3m {
    position:relative; z-index:1; padding-top:70px; min-height:100vh;
}

/* Hero Section */
.hero_v7k3m {
    padding:80px 24px 60px; text-align:center;
    background: linear-gradient(180deg, rgba(108,92,231,0.08) 0%, transparent 100%);
}
.hero_v7k3m h1 {
    font-size: clamp(1.8rem, 4vw, 3rem); font-weight:800; margin-bottom:16px;
    background: linear-gradient(135deg, #fff 0%, var(--clr-secondary_v7k3m) 100%);
    -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}
.hero-desc_v7k3m {
    max-width:700px; margin:0 auto 32px; color: var(--clr-muted_v7k3m);
    font-size:1.05rem; line-height:1.8;
}
.hero-tags_v7k3m { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }
.hero-tags_v7k3m span {
    padding:6px 16px; border-radius:20px; font-size:0.8rem;
    background: var(--clr-glass_v7k3m); border: var(--glass-border_v7k3m);
    color: var(--clr-secondary_v7k3m);
}

/* Breadcrumb */
.breadcrumb_v7k3m {
    max-width:1400px; margin:0 auto; padding:16px 24px;
    display:flex; align-items:center; gap:8px; font-size:0.85rem;
}
.breadcrumb_v7k3m a { color: var(--clr-muted_v7k3m); text-decoration:none; transition: var(--transition_v7k3m); }
.breadcrumb_v7k3m a:hover { color: var(--clr-primary_v7k3m); }
.breadcrumb_v7k3m span { color: var(--clr-muted_v7k3m); }
.breadcrumb_v7k3m .current_v7k3m { color: var(--clr-text_v7k3m); }

/* Section Titles */
.section_v7k3m {
    max-width:1400px; margin:0 auto; padding:40px 24px;
}
.section-header_v7k3m {
    display:flex; align-items:center; justify-content:space-between; margin-bottom:28px;
}
.section-title_v7k3m {
    font-size:1.5rem; font-weight:700; color:#fff;
    display:flex; align-items:center; gap:12px;
}
.section-title_v7k3m::before {
    content:''; width:4px; height:28px; border-radius:2px;
    background: linear-gradient(180deg, var(--clr-primary_v7k3m), var(--clr-secondary_v7k3m));
}
.section-more_v7k3m {
    color: var(--clr-muted_v7k3m); text-decoration:none; font-size:0.85rem;
    transition: var(--transition_v7k3m);
}
.section-more_v7k3m:hover { color: var(--clr-primary_v7k3m); }

/* Video Card Grid */
.video-grid_v7k3m {
    display:grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap:24px;
}
.video-card_v7k3m {
    background: var(--clr-glass_v7k3m);
    border: var(--glass-border_v7k3m);
    border-radius: var(--radius_v7k3m);
    overflow:hidden; transition: var(--transition_v7k3m);
    backdrop-filter: blur(10px);
}
.video-card_v7k3m:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow_v7k3m);
    border-color: rgba(108,92,231,0.3);
}
.card-thumb_v7k3m {
    position:relative; aspect-ratio:16/9; overflow:hidden; cursor:pointer;
}
.card-thumb_v7k3m img {
    width:100%; height:100%; object-fit:cover;
    transition: transform 0.5s cubic-bezier(0.4,0,0.2,1);
}
.video-card_v7k3m:hover .card-thumb_v7k3m img { transform: scale(1.08); }
.play-overlay_v7k3m {
    position:absolute; top:0; left:0; width:100%; height:100%;
    background: rgba(0,0,0,0.5); display:flex; align-items:center; justify-content:center;
    opacity:0; transition: var(--transition_v7k3m);
}
.video-card_v7k3m:hover .play-overlay_v7k3m { opacity:1; }
.play-btn_v7k3m {
    width:56px; height:56px; border-radius:50%;
    background: rgba(108,92,231,0.9); display:flex; align-items:center; justify-content:center;
    transform: scale(0.8); transition: var(--transition_v7k3m);
    box-shadow: 0 4px 20px rgba(108,92,231,0.4);
}
.video-card_v7k3m:hover .play-btn_v7k3m { transform: scale(1); }
.play-btn_v7k3m svg { width:24px; height:24px; fill:#fff; margin-left:3px; }
.card-duration_v7k3m {
    position:absolute; bottom:8px; right:8px; padding:2px 8px;
    background: rgba(0,0,0,0.75); border-radius:4px; font-size:0.75rem; color:#fff;
}
.card-info_v7k3m { padding:16px; }
.card-title_v7k3m {
    font-size:0.95rem; font-weight:600; color:#fff; margin-bottom:8px;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
    line-height:1.4;
}
.card-meta_v7k3m {
    display:flex; align-items:center; justify-content:space-between;
    font-size:0.8rem; color: var(--clr-muted_v7k3m);
}
.card-views_v7k3m { display:flex; align-items:center; gap:4px; }
.card-tag_v7k3m {
    padding:2px 8px; border-radius:4px; font-size:0.7rem;
    background: rgba(108,92,231,0.15); color: var(--clr-primary_v7k3m);
}

/* Reviews Section */
.reviews-grid_v7k3m {
    display:grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap:20px;
}
.review-card_v7k3m {
    background: var(--clr-glass_v7k3m); border: var(--glass-border_v7k3m);
    border-radius: var(--radius_v7k3m); padding:24px;
    backdrop-filter: blur(10px); transition: var(--transition_v7k3m);
}
.review-card_v7k3m:hover { border-color: rgba(108,92,231,0.3); }
.review-header_v7k3m { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.review-avatar_v7k3m {
    width:44px; height:44px; border-radius:50%;
    background: linear-gradient(135deg, var(--clr-primary_v7k3m), var(--clr-accent_v7k3m));
    display:flex; align-items:center; justify-content:center; font-weight:700; color:#fff; font-size:1rem;
}
.review-name_v7k3m { font-weight:600; color:#fff; font-size:0.9rem; }
.review-stars_v7k3m { color:#ffd700; font-size:0.85rem; letter-spacing:2px; }
.review-text_v7k3m { color: var(--clr-muted_v7k3m); font-size:0.88rem; line-height:1.7; }

/* Contact Section */
.contact-grid_v7k3m {
    display:grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap:24px;
}
.contact-card_v7k3m {
    background: var(--clr-glass_v7k3m); border: var(--glass-border_v7k3m);
    border-radius: var(--radius_v7k3m); padding:28px;
    backdrop-filter: blur(10px); text-align:center;
    transition: var(--transition_v7k3m);
}
.contact-card_v7k3m:hover { border-color: rgba(0,206,201,0.3); transform:translateY(-4px); }
.contact-icon_v7k3m {
    width:56px; height:56px; border-radius:14px; margin:0 auto 16px;
    background: linear-gradient(135deg, var(--clr-primary_v7k3m), var(--clr-secondary_v7k3m));
    display:flex; align-items:center; justify-content:center;
}
.contact-icon_v7k3m svg { width:28px; height:28px; fill:#fff; }
.contact-label_v7k3m { font-size:0.85rem; color: var(--clr-muted_v7k3m); margin-bottom:4px; }
.contact-value_v7k3m { font-size:1rem; font-weight:600; color:#fff; }

/* Share Buttons */
.share-bar_v7k3m {
    display:flex; gap:12px; justify-content:center; padding:32px 0; flex-wrap:wrap;
}
.share-btn_v7k3m {
    width:48px; height:48px; border-radius:12px; border:none; cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    transition: var(--transition_v7k3m); backdrop-filter: blur(10px);
}
.share-btn_v7k3m:hover { transform:translateY(-3px); }
.share-wechat_v7k3m { background: rgba(7,193,96,0.2); color:#07c160; }
.share-weibo_v7k3m { background: rgba(230,73,46,0.2); color:#e6492e; }
.share-douyin_v7k3m { background: rgba(254,44,85,0.2); color:#fe2c55; }
.share-bilibili_v7k3m { background: rgba(0,174,236,0.2); color:#00aeec; }
.share-btn_v7k3m svg { width:24px; height:24px; }

/* FAQ Section */
.faq-list_v7k3m { max-width:800px; margin:0 auto; }
.faq-item_v7k3m {
    background: var(--clr-glass_v7k3m); border: var(--glass-border_v7k3m);
    border-radius:12px; margin-bottom:12px; overflow:hidden;
    transition: var(--transition_v7k3m);
}
.faq-item_v7k3m:hover { border-color: rgba(108,92,231,0.3); }
.faq-item_v7k3m summary {
    padding:18px 24px; cursor:pointer; font-weight:600; color:#fff;
    font-size:0.95rem; list-style:none; display:flex; align-items:center; justify-content:space-between;
    transition: var(--transition_v7k3m);
}
.faq-item_v7k3m summary::-webkit-details-marker { display:none; }
.faq-item_v7k3m summary::after {
    content:'+'; font-size:1.3rem; color: var(--clr-primary_v7k3m);
    transition: transform 0.3s ease;
}
.faq-item_v7k3m[open] summary::after { transform: rotate(45deg); }
.faq-item_v7k3m[open] summary { color: var(--clr-primary_v7k3m); }
.faq-answer_v7k3m {
    padding:0 24px 18px; color: var(--clr-muted_v7k3m); font-size:0.9rem; line-height:1.8;
    animation: fadeIn_v7k3m 0.3s ease;
}
@keyframes fadeIn_v7k3m { from{opacity:0;transform:translateY(-8px)} to{opacity:1;transform:translateY(0)} }

/* Footer */
.footer_v7k3m {
    background: rgba(6,6,15,0.95); border-top: var(--glass-border_v7k3m);
    padding:48px 24px 24px; margin-top:60px;
}
.footer-inner_v7k3m {
    max-width:1400px; margin:0 auto;
    display:grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap:32px;
}
.footer-col_v7k3m h3 {
    font-size:1rem; font-weight:700; color:#fff; margin-bottom:16px;
    position:relative; padding-bottom:8px;
}
.footer-col_v7k3m h3::after {
    content:''; position:absolute; bottom:0; left:0; width:30px; height:2px;
    background: var(--clr-primary_v7k3m); border-radius:2px;
}
.footer-col_v7k3m a {
    display:block; color: var(--clr-muted_v7k3m); text-decoration:none;
    font-size:0.85rem; padding:4px 0; transition: var(--transition_v7k3m);
}
.footer-col_v7k3m a:hover { color: var(--clr-primary_v7k3m); padding-left:4px; }
.footer-bottom_v7k3m {
    max-width:1400px; margin:32px auto 0; padding-top:20px;
    border-top: var(--glass-border_v7k3m);
    display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px;
    font-size:0.8rem; color: var(--clr-muted_v7k3m);
}

/* Responsive */
@media (max-width:768px) {
    .nav-links_v7k3m {
        position:fixed; top:70px; left:0; width:100%; background:rgba(10,10,26,0.98);
        flex-direction:column; padding:20px; gap:4px;
        transform:translateY(-120%); transition: var(--transition_v7k3m);
        backdrop-filter: blur(20px); border-bottom: var(--glass-border_v7k3m);
    }
    .nav-links_v7k3m.open_v7k3m { transform:translateY(0); }
    .menu-toggle_v7k3m { display:block; }
    .search-box_v7k3m { width:180px; }
    .hero_v7k3m { padding:50px 16px 40px; }
    .video-grid_v7k3m { grid-template-columns: repeat(auto-fill, minmax(160px,1fr)); gap:12px; }
    .card-info_v7k3m { padding:10px; }
    .card-title_v7k3m { font-size:0.85rem; }
    .reviews-grid_v7k3m { grid-template-columns:1fr; }
    .footer-inner_v7k3m { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width:480px) {
    .nav-container_v7k3m { padding:0 12px; height:60px; }
    .search-box_v7k3m { width:140px; }
    .video-grid_v7k3m { grid-template-columns: repeat(2,1fr); gap:10px; }
    .section_v7k3m { padding:24px 12px; }
}

/* Utility */
.text-gradient_v7k3m {
    background: linear-gradient(135deg, var(--clr-primary_v7k3m), var(--clr-secondary_v7k3m));
    -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}
.glass-panel_v7k3m {
    background: var(--clr-glass_v7k3m); border: var(--glass-border_v7k3m);
    border-radius: var(--radius_v7k3m); backdrop-filter: blur(10px); padding:24px;
}
.update-time_v7k3m {
    text-align:center; padding:16px; font-size:0.8rem; color: var(--clr-muted_v7k3m);
}
