/* _cz2f5fmvw */
/* 全局样式 */
* {box-sizing: border-box;padding: 0;margin: 0}

:root {--gold-color: #ffd700;--gradient-1: linear-gradient(135deg, #0d2818 0%, #1a3d2e 50%, #2d5016 100%);--bg-light: #f5f5f5;--text-light: #ffffff;--primary-color: #0d2818;--text-dark: #333333;--secondary-color: #1a3d2e;--accent-color: #52b788;--gradient-2: linear-gradient(135deg, #1b4332 0%, #2d6a4f 100%);--gradient-3: linear-gradient(135deg, #40916c 0%, #52b788 100%)}

body {line-height: 1.6;color: var(--text-dark);font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;overflow-x: hidden}

.container {max-width: 1200px;padding: 0 20px;margin: 0 auto}

/* 导航栏 */
.navbar {height: 70px;background: rgba(13, 40, 24, 0.95);padding: 0;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);width: 100%;backdrop-filter: blur(10px);top: 0;z-index: 1000;position: fixed}

.navbar .container {height: 100%;display: flex;align-items: center;justify-content: space-between}

.nav-brand {color: var(--text-light);font-size: 1.5rem;font-weight: bold;display: flex;gap: 10px;align-items: center}

.logo-img {display: block;width: 123px;height: 23px;object-fit: contain}

.logo-fallback {align-items: center;display: none;gap: 10px}

.logo-fallback i {font-size: 1.8rem;color: var(--accent-color)}

.nav-menu {list-style: none;display: flex;gap: 2rem}

.nav-menu a {color: var(--text-light);font-weight: 500;transition: color 0.3s;text-decoration: none;position: relative}

.nav-menu a:hover {color: var(--accent-color)}

.nav-menu a::after {left: 0;bottom: -5px;width: 0;position: absolute;height: 2px;background: var(--accent-color);content: '';transition: width 0.3s}

.nav-menu a:hover::after {width: 100%}

.hamburger {flex-direction: column;cursor: pointer;gap: 5px;display: none}

.hamburger span {height: 3px;transition: all 0.3s;width: 25px;background: var(--text-light)}

/* 英雄区域 */
.hero {position: relative;background-size: cover;background-repeat: no-repeat;margin-top: 70px;height: 700px;overflow: hidden;background-position: center;background-image: url('../images/hero-bg-pc-1.jpg')}

.hero-background {height: 100%;width: 100%;background: 
        radial-gradient(circle at 20% 50%, rgba(82, 183, 136, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(26, 61, 46, 0.1) 0%, transparent 50%);left: 0;position: absolute;top: 0}

.hero .container {display: flex;align-items: flex-end;padding-bottom: 50px;height: 100%;position: relative;justify-content: center;z-index: 2}

.hero-download-buttons {display: flex;align-items: center;justify-content: center;gap: 20px}

.hero-download-btn {text-decoration: none;display: inline-block;transition: transform 0.3s ease}

.hero-download-btn:hover {transform: translateY(-5px)}

.download-btn-img {display: block;width: 196px;object-fit: contain;height: 61px}

/* 移动端下载按钮区域 */
.mobile-download-section {display: none;background: var(--primary-color);padding: 30px 0}

.mobile-download-buttons {flex-direction: row;justify-content: center;align-items: center;display: flex;gap: 20px}

.mobile-download-btn {transition: transform 0.3s ease;text-decoration: none;display: inline-block}

.mobile-download-btn:hover {transform: translateY(-3px)}

.mobile-download-btn-img {display: block;width: 175px;height: 73px;object-fit: contain}

/* 新闻资讯 */
.news-section {background: var(--primary-color);padding: 80px 0}

.news-section-title {color: var(--text-light);text-align: center;margin-bottom: 1rem;font-size: 2rem}

.news-section-subtitle {font-size: 1rem;text-align: center;color: var(--accent-color);margin-bottom: 3rem}

.news-content {grid-template-columns: 1fr 1fr;gap: 40px;display: grid;align-items: start}

.news-featured {display: flex;gap: 20px;flex-direction: column}

.news-featured-image {border-radius: 10px;width: 100%;overflow: hidden}

.news-featured-image img {width: 100%;object-fit: cover;display: block;height: auto}

.news-featured-article {padding: 20px 0}

.news-featured-title {margin-bottom: 15px;color: var(--text-light);font-weight: 600;font-size: 1.1rem;line-height: 1.6}

.news-featured-date {color: var(--accent-color);font-size: 0.9rem}

.news-list {display: flex;gap: 20px;flex-direction: column}

.news-item {background: rgba(255, 255, 255, 0.05);transition: all 0.3s;padding: 15px;gap: 15px;display: flex;border-radius: 10px;cursor: pointer}

.news-item:hover {background: rgba(255, 255, 255, 0.1);transform: translateX(5px)}

.news-item-thumbnail {flex-shrink: 0;border-radius: 8px;height: 80px;width: 120px;overflow: hidden}

.news-item-thumbnail img {width: 100%;height: 100%;object-fit: cover}

.news-item-content {display: flex;flex: 1;justify-content: space-between;flex-direction: column}

.news-item-title {margin-bottom: 10px;-webkit-line-clamp: 2;line-clamp: 2;line-height: 1.5;color: var(--text-light);display: -webkit-box;font-size: 0.9rem;overflow: hidden;-webkit-box-orient: vertical;font-weight: 500}

.news-item-date {font-size: 0.8rem;color: var(--accent-color)}

/* AA朋友圈 */
.friends-circle-section {background: var(--primary-color);padding: 80px 0}

.friends-circle-title {text-align: center;margin-bottom: 1rem;font-size: 2rem;color: var(--text-light)}

.friends-circle-subtitle {margin-bottom: 3rem;color: var(--text-light);font-size: 1rem;text-align: center;opacity: 0.9}

.friends-circle-wrapper {width: 100%;gap: 20px;position: relative;overflow: hidden;display: flex;align-items: center}

.friends-circle-section .container {overflow: hidden;max-width: calc(375px * 4 + 30px * 3 + 40px);margin: 0 auto;width: 100%}

.friends-nav-btn {font-size: 1.2rem;transition: all 0.3s;transform: translateY(-50%);height: 50px;cursor: pointer;position: absolute;width: 50px;z-index: 10;display: flex;border: 2px solid var(--accent-color);top: 50%;border-radius: 50%;justify-content: center;color: var(--text-light);align-items: center;background: rgba(255, 255, 255, 0.1)}

.friends-nav-prev {left: -25px}

.friends-nav-next {right: -25px}

.friends-nav-btn:hover {background: var(--accent-color);transform: translateY(-50%) scale(1.1)}

.friends-circle-list {gap: 30px;overflow-x: hidden;scroll-behavior: smooth;-ms-overflow-style: none;overflow-y: hidden;padding: 20px 0;display: flex;scrollbar-width: none;width: 100%}

.friends-circle-list::-webkit-scrollbar {display: none}

.friend-card {height: 482px;background: transparent;border-radius: 15px;position: relative;flex-shrink: 0;width: 375px;transition: transform 0.3s;overflow: hidden}

.friend-card:hover {transform: translateY(-10px)}

.friend-card-image {position: relative;background: transparent;height: 100%;overflow: hidden;width: 100%}

.friend-card-image img {object-fit: contain;display: block;height: 100%;width: 100%}

.friend-name {font-size: 1.2rem;color: var(--text-light);margin-bottom: 15px;text-align: center;font-weight: 600}

.friend-badges {justify-content: center;gap: 10px;display: flex;flex-wrap: wrap;align-items: center}

.friend-badge {color: var(--text-light);padding: 5px 12px;font-size: 0.85rem;border-radius: 20px;background: rgba(255, 255, 255, 0.2)}

.friend-social {gap: 5px;display: flex;color: #ff0000;font-size: 0.9rem;align-items: center}

.friend-social i {font-size: 1.2rem}

.friend-logo {font-size: 0.85rem;align-items: center;color: var(--text-light);gap: 5px;display: flex}

.friend-logo i {font-size: 1rem;color: var(--accent-color)}

/* 介绍板块 */
.intro-section {padding: 100px 0;background: var(--primary-color)}

.intro-section-title {color: var(--text-light);margin-bottom: 1rem;font-size: 1.5rem;text-align: center}

.intro-section-subtitle {margin-bottom: 3rem;color: var(--accent-color);font-size: 0.9rem;opacity: 0.9;text-align: center}

.intro-content {display: grid;gap: 60px;grid-template-columns: 1fr 1fr;align-items: center;justify-items: center}

.intro-text {gap: 20px;flex-direction: column;margin-top: -50px;display: flex}

.intro-title {color: var(--accent-color);margin-bottom: 20px;font-size: 1.4rem;font-weight: bold}

.intro-description {line-height: 1.8;font-size: 0.85rem;color: rgba(255, 255, 255, 0.9);margin-bottom: 15px}

.intro-features {gap: 15px;flex-direction: column;margin-top: 20px;display: flex}

.intro-feature-item {font-size: 1rem;display: flex;color: var(--text-light);align-items: center;gap: 12px}

.intro-feature-item i {color: var(--accent-color);font-size: 1.2rem}

.intro-image {height: 500px;border-radius: 15px;overflow: hidden;width: 100%}

.intro-image img {height: 100%;display: block;object-fit: cover;width: 100%}

/* 介绍小板块 */
.intro-sub-sections {padding: 80px 0;background: var(--primary-color)}

.intro-sub-item {align-items: center;display: grid;grid-template-columns: 1fr 1fr;gap: 60px;margin-bottom: 80px}

.intro-sub-item:last-child {margin-bottom: 0}

.intro-sub-reverse .intro-sub-text {grid-column: 1}

.intro-sub-reverse .intro-sub-image {grid-column: 2}

.intro-sub-text {flex-direction: column;display: flex;gap: 20px}

.intro-sub-title {font-weight: bold;color: var(--accent-color);margin-bottom: 15px;font-size: 1.4rem}

.intro-sub-description {line-height: 1.8;color: rgba(255, 255, 255, 0.9);font-size: 0.85rem}

.intro-sub-image {height: 400px;width: 100%;border-radius: 15px;overflow: hidden}

.intro-sub-image img {display: block;height: 100%;width: 100%;object-fit: cover}

.btn {border-radius: 50px;font-weight: 600;border: 2px solid transparent;display: inline-flex;transition: all 0.3s;padding: 15px 30px;gap: 10px;align-items: center;text-decoration: none}

.btn-primary {box-shadow: 0 5px 20px rgba(82, 183, 136, 0.4);color: var(--text-light);background: var(--accent-color)}

.btn-primary:hover {transform: translateY(-3px);background: #40916c;box-shadow: 0 8px 25px rgba(82, 183, 136, 0.6)}

.btn-secondary {color: var(--text-light);background: transparent;border: 2px solid var(--text-light)}

.btn-secondary:hover {background: var(--text-light);color: var(--primary-color)}


/* 功能特色 */
.features {background: var(--primary-color);padding: 100px 0}

.section-title {color: var(--text-light);text-align: center;margin-bottom: 1rem;font-size: 2.5rem}

.section-subtitle {font-size: 1.2rem;margin-bottom: 3rem;color: var(--accent-color);text-align: center}

.features-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));gap: 2rem;margin-top: 3rem}

.feature-card {text-align: center;border: 1px solid rgba(82, 183, 136, 0.2);transition: all 0.3s;box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);background: rgba(82, 183, 136, 0.1);padding: 2rem;border-radius: 15px}

.feature-card:hover {background: rgba(82, 183, 136, 0.15);transform: translateY(-10px);box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3)}

.feature-icon {background: var(--gradient-1);margin: 0 auto 1.5rem;border-radius: 50%;display: flex;align-items: center;width: 80px;color: var(--text-light);font-size: 2rem;height: 80px;justify-content: center}

.feature-card h3 {color: var(--text-light);font-size: 1.5rem;margin-bottom: 1rem}

.feature-card p {line-height: 1.8;color: rgba(255, 255, 255, 0.9)}

/* 下载区域 */
.download {background: var(--primary-color);color: var(--text-light);padding: 100px 0}

.download .section-title,
.download .section-subtitle {color: var(--text-light)}

.download-grid {margin-top: 3rem;gap: 2rem;display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr))}

.download-card {text-align: center;transition: all 0.3s;border: 1px solid rgba(255, 255, 255, 0.2);border-radius: 15px;padding: 2rem;backdrop-filter: blur(10px);background: rgba(255, 255, 255, 0.1)}

.download-card:hover {background: rgba(255, 255, 255, 0.15);transform: translateY(-5px)}

.download-icon {margin-bottom: 1rem;color: var(--gold-color);font-size: 3rem}

.download-card h3 {font-size: 1.5rem;margin-bottom: 0.5rem}

.download-card p {opacity: 0.9;margin-bottom: 1.5rem}

.btn-download {color: var(--text-light);border-radius: 50px;padding: 12px 25px;align-items: center;display: inline-flex;gap: 8px;text-decoration: none;margin-bottom: 1rem;transition: all 0.3s;background: var(--accent-color)}

.btn-download:hover {transform: scale(1.05);background: #40916c}

.download-size {opacity: 0.7;font-size: 0.9rem}

.download-app-showcase {text-align: center;margin: 3rem 0}

.app-screenshots {flex-wrap: wrap;justify-content: center;display: flex;gap: 2rem;align-items: center}

.app-screenshot-item {transition: none;box-shadow: none;border-radius: 0;position: relative;overflow: hidden;border: none;background: transparent}

.app-screenshot-item:hover {box-shadow: none;transform: none}

.app-screenshot-img {height: auto;display: block;max-width: 800px;object-fit: contain;width: 100%}

.app-screenshot-placeholder {justify-content: center;flex-direction: column;display: flex;max-width: 800px;color: var(--text-light);background: rgba(255, 255, 255, 0.1);height: 450px;width: 100%;align-items: center}

.app-screenshot-placeholder i {color: var(--accent-color);font-size: 4rem;margin-bottom: 1rem}

.app-screenshot-placeholder p {font-size: 1rem;opacity: 0.8}

@media (max-width: 768px) {.app-screenshot-img {
        max-width: 100%}
    
    .app-screenshot-placeholder {max-width: 100%;height: 300px}
}

/* 安装步骤 */
.steps {background: var(--primary-color);padding: 100px 0}

.steps-container {gap: 2rem;display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));margin-top: 3rem}

.step-item {gap: 1.5rem;display: flex;align-items: flex-start}

.step-number {width: 60px;display: flex;height: 60px;border-radius: 50%;font-weight: bold;flex-shrink: 0;font-size: 1.5rem;align-items: center;color: var(--text-light);background: var(--gradient-1);justify-content: center}

.step-content h3 {font-size: 1.3rem;color: var(--text-light);margin-bottom: 0.5rem}

.step-content p {color: rgba(255, 255, 255, 0.9)}

/* 文章正文板块 */
.article-section {background: var(--bg-light);padding: 100px 0}

.article-content {max-width: 900px;margin: 0 auto}

.article-title {font-size: 2.5rem;text-align: center;font-weight: bold;margin-bottom: 20px;color: var(--primary-color)}

.article-meta {justify-content: center;margin-bottom: 40px;display: flex;color: #666;padding-bottom: 20px;gap: 30px;border-bottom: 1px solid rgba(0, 0, 0, 0.1);font-size: 0.95rem}

.article-date,
.article-author {display: inline-block}

.article-body {color: #333;line-height: 1.8}

.article-body p {margin-bottom: 20px;font-size: 1rem}

.article-body h3 {font-size: 1.5rem;font-weight: bold;margin: 30px 0 15px;color: var(--primary-color)}

.article-list {padding-left: 0;list-style: none;margin: 20px 0}

.article-list li {padding: 10px 0 10px 25px;color: #333;position: relative}

.article-list li::before {color: var(--accent-color);content: '•';font-size: 1.5rem;line-height: 1;position: absolute;left: 0}

.article-tags {justify-content: center;display: flex;padding-top: 30px;margin-top: 40px;flex-wrap: wrap;gap: 10px;border-top: 1px solid rgba(0, 0, 0, 0.1)}

.tag {border-radius: 20px;border: 1px solid var(--accent-color);cursor: pointer;color: var(--primary-color);font-size: 0.9rem;background: rgba(82, 183, 136, 0.1);display: inline-block;transition: all 0.3s;padding: 8px 16px}

.tag:hover {background: var(--accent-color);transform: translateY(-2px);color: var(--text-light)}

/* 联系我们 */
.contact {background: white;padding: 100px 0}

.contact-grid {gap: 2rem;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));margin-top: 3rem;display: grid}

.contact-item {padding: 2rem;background: var(--bg-light);border-radius: 15px;text-align: center;transition: all 0.3s}

.contact-item:hover {transform: translateY(-5px);box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1)}

.contact-icon {display: flex;height: 70px;justify-content: center;font-size: 1.8rem;color: var(--text-light);border-radius: 50%;width: 70px;background: var(--gradient-2);margin: 0 auto 1.5rem;align-items: center}

.contact-item h3 {color: var(--primary-color);margin-bottom: 0.5rem;font-size: 1.3rem}

.contact-item p {color: #666}

/* 页脚 */
.footer {color: var(--text-light);background: var(--primary-color);padding: 50px 0 20px}

.footer-content {gap: 2rem;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));margin-bottom: 2rem;display: grid}

.footer-logo {margin-bottom: 20px}

.footer-logo-img {display: block;object-fit: contain;height: 35px;width: auto}

.footer-logo-fallback {font-weight: bold;color: var(--gold-color);align-items: center;font-size: 1.5rem;display: flex;gap: 10px}

.footer-logo-fallback i {color: var(--accent-color);font-size: 1.8rem}

.footer-section h3,
.footer-section h4 {margin-bottom: 1rem;color: var(--gold-color)}

.footer-section p {line-height: 1.8;opacity: 0.8;margin-bottom: 15px}

.footer-section ul {list-style: none}

.footer-section ul li {margin-bottom: 0.5rem}

.footer-section ul li a {opacity: 0.8;color: var(--text-light);transition: opacity 0.3s;text-decoration: none}

.footer-section ul li a:hover {color: var(--accent-color);opacity: 1}

.social-links {display: flex;gap: 1rem}

.social-links a {transition: all 0.3s;display: flex;align-items: center;border-radius: 50%;color: var(--text-light);justify-content: center;background: rgba(255, 255, 255, 0.1);width: 40px;height: 40px}

.social-links a:hover {background: var(--accent-color);transform: translateY(-3px)}

.footer-bottom {padding-top: 2rem;border-top: 1px solid rgba(255, 255, 255, 0.1);opacity: 0.8;text-align: center}

/* 响应式设计 */
@media (max-width: 768px) {.nav-menu {
        position: fixed;transition: 0.3s;background: var(--primary-color);flex-direction: column;box-shadow: 0 10px 27px rgba(0, 0, 0, 0.05);padding: 2rem 0;left: -100%;text-align: center;width: 100%;top: 70px}

    .nav-menu.active {left: 0}

    .hamburger {display: flex}

    .hamburger.active span:nth-child(1) {transform: rotate(45deg) translate(8px, 8px)}

    .hamburger.active span:nth-child(2) {opacity: 0}

    .hamburger.active span:nth-child(3) {transform: rotate(-45deg) translate(7px, -7px)}

    .hero {height: 600px;background-image: url('../images/hero-bg-mobile-1.jpg')}

    .hero-download-buttons {display: none}

    .mobile-download-section {display: block}

    .news-content {gap: 30px;grid-template-columns: 1fr}

    .news-featured-image {max-width: 100%}

    .news-list {scrollbar-color: var(--accent-color) transparent;gap: 15px;padding-bottom: 10px;overflow-x: auto;-webkit-overflow-scrolling: touch;overflow-y: hidden;scrollbar-width: thin;display: flex;flex-direction: row}

    .news-list::-webkit-scrollbar {height: 6px}

    .news-list::-webkit-scrollbar-track {background: rgba(255, 255, 255, 0.1);border-radius: 3px}

    .news-list::-webkit-scrollbar-thumb {border-radius: 3px;background: var(--accent-color)}

    .news-item {flex-shrink: 0;flex-direction: column;min-width: 280px;width: 280px}

    .news-item-thumbnail {width: 100%;height: 180px}

    .news-item-title {line-clamp: 3;-webkit-line-clamp: 3}

    .friends-nav-btn {height: 40px;font-size: 1rem;width: 40px}

    .friends-nav-prev {left: 10px}

    .friends-nav-next {right: 10px}

    .friends-circle-section .container {max-width: calc(300px + 40px)}

    .friends-circle-list {width: 100%}

    .friend-card {width: 300px;height: 386px}

    .intro-content {grid-template-columns: 1fr;gap: 40px}

    .intro-image {order: -1;height: 300px}

    .intro-text {margin-top: 0;text-align: center}

    .intro-section-title {font-size: 1.2rem}

    .intro-section-subtitle {margin-bottom: 2rem;font-size: 0.75rem}

    .intro-title {font-size: 1.1rem}

    .intro-description {font-size: 0.75rem}

    .intro-sub-item {gap: 30px;margin-bottom: 50px;grid-template-columns: 1fr}

    .intro-sub-reverse .intro-sub-text {order: 2;grid-column: 1}

    .intro-sub-reverse .intro-sub-image {order: 1;grid-column: 1}

    .intro-sub-image {height: 250px;order: -1}

    .intro-sub-title {text-align: center;font-size: 1.2rem}

    .intro-sub-description {text-align: center;font-size: 0.8rem}

    .features-grid,
    .download-grid,
    .steps-container,
    .contact-grid {grid-template-columns: 1fr}

    .article-title {font-size: 2rem}

    .article-meta {gap: 10px;flex-direction: column;text-align: center}

    .article-body {font-size: 0.95rem}

    .article-body h3 {font-size: 1.3rem}

    .footer-content {grid-template-columns: 1fr}
}

/* 平滑滚动 */
html {scroll-behavior: smooth}

/* 选中文本样式 */
::selection {background: var(--accent-color);color: var(--text-light)}


._cu3mgaem4{}

._com0a24aw{}

._chhuye738{}