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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.hero-background {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%);position: absolute;left: 0;height: 100%;top: 0;width: 100%}

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

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

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

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

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

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

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

.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;height: 73px;width: 175px;object-fit: contain}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.news-item-title {font-size: 0.9rem;line-clamp: 2;line-height: 1.5;overflow: hidden;-webkit-line-clamp: 2;color: var(--text-light);display: -webkit-box;-webkit-box-orient: vertical;margin-bottom: 10px;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;font-size: 2rem;margin-bottom: 1rem;color: var(--text-light)}

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

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

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

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

.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;padding: 20px 0;overflow-y: hidden;scroll-behavior: smooth;scrollbar-width: none;overflow-x: hidden;display: flex;width: 100%;-ms-overflow-style: none}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.intro-sub-item {display: grid;grid-template-columns: 1fr 1fr;gap: 60px;align-items: center;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;gap: 20px;display: flex}

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

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

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

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

.btn {align-items: center;border-radius: 50px;display: inline-flex;font-weight: 600;padding: 15px 30px;transition: all 0.3s;border: 2px solid transparent;gap: 10px;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 {box-shadow: 0 8px 25px rgba(82, 183, 136, 0.6);transform: translateY(-3px);background: #40916c}

.btn-secondary {background: transparent;color: var(--text-light);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 {text-align: center;font-size: 2.5rem;color: var(--text-light);margin-bottom: 1rem}

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

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

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

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

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

.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 {color: var(--text-light);padding: 100px 0;background: var(--primary-color)}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.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 {padding: 100px 0;background: var(--primary-color)}

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

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

.step-number {flex-shrink: 0;height: 60px;display: flex;justify-content: center;color: var(--text-light);font-weight: bold;width: 60px;font-size: 1.5rem;border-radius: 50%;background: var(--gradient-1);align-items: 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-weight: bold;font-size: 2.5rem;margin-bottom: 20px;text-align: center;color: var(--primary-color)}

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

.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 {color: var(--primary-color);font-size: 1.5rem;font-weight: bold;margin: 30px 0 15px}

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

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

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

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

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

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

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

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

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

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

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

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

.contact-item p {color: #666}

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

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

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

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

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

.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 {opacity: 0.8;line-height: 1.8;margin-bottom: 15px}

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

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

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

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

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

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

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

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

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

    .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-width: thin;scrollbar-color: var(--accent-color) transparent;flex-direction: row;-webkit-overflow-scrolling: touch;gap: 15px;padding-bottom: 10px;overflow-x: auto;display: flex;overflow-y: hidden}

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

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

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

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

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

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

    .friends-nav-btn {width: 40px;font-size: 1rem;height: 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 {text-align: center;margin-top: 0}

    .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 {margin-bottom: 50px;grid-template-columns: 1fr;gap: 30px}

    .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 {font-size: 1.2rem;text-align: center}

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

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

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

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

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

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

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

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

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


._cmhxpsyb9{}

._cc0mths4n{}

._cugrvlik9{}