/* CSS Reset & Base Styles */* {    margin: 0;    padding: 0;    box-sizing: border-box;}html {    scroll-behavior: smooth;    font-size: 16px;}body {    font-family: 'Microsoft YaHei', 'PingFang SC', 'Hiragino Sans GB', 'WenQuanYi Micro Hei', sans-serif;    line-height: 1.6;    color: #333;    background-color: #fff;}img {    max-width: 100%;    height: auto;    display: block;}a {    text-decoration: none;    color: inherit;    transition: all 0.3s ease;}ul {    list-style: none;}/* Color Variables - 抖音代刷服务配色方案 */:root {    /* 主色调 - 专业蓝色系 */    --primary-color: #1e40af;         /* 深蓝色 */    --primary-light: #3b82f6;         /* 中蓝色 */    --primary-dark: #1e3a8a;          /* 深蓝色 */        /* 辅助色 - 强调色 */    --accent-orange: #f97316;         /* 橙色强调 */    --accent-green: #16a34a;          /* 绿色强调 */    --accent-purple: #7c3aed;         /* 紫色（抖音风格） */        /* 文字颜色 */    --text-primary: #1f2937;          /* 主要文字 */    --text-secondary: #4b5563;        /* 次要文字 */    --text-light: #6b7280;            /* 浅色文字 */    --text-white: #ffffff;            /* 白色文字 */        /* 背景颜色 */    --bg-white: #ffffff;              /* 纯白背景 */    --bg-light: #f8fafc;             /* 浅灰背景 */    --bg-dark: #1e293b;              /* 深色背景 */    --bg-gradient: linear-gradient(135deg, #1e40af 0%, #7c3aed 100%);        /* 边框和阴影 */    --border-color: #e2e8f0;          /* 边框颜色 */    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);    --shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.15);        /* 间距 */    --spacing-xs: 0.5rem;    --spacing-sm: 1rem;    --spacing-md: 1.5rem;    --spacing-lg: 2rem;    --spacing-xl: 3rem;    --spacing-2xl: 4rem;        /* 圆角 */    --radius-sm: 4px;    --radius-md: 8px;    --radius-lg: 12px;    --radius-xl: 16px;}/* Container */.container {    max-width: 1200px;    margin: 0 auto;    padding: 0 20px;}/* Typography */h1, h2, h3, h4, h5, h6 {    color: var(--text-primary);    font-weight: 600;    line-height: 1.3;    margin-bottom: 0.5em;}h1 {    font-size: 2.5rem;    font-weight: 700;}h2 {    font-size: 2rem;    font-weight: 600;}h3 {    font-size: 1.5rem;}h4 {    font-size: 1.25rem;}p {    margin-bottom: 1rem;    color: var(--text-secondary);}/* Buttons */.btn {    display: inline-flex;    align-items: center;    justify-content: center;    padding: 12px 24px;    border-radius: var(--radius-md);    font-weight: 500;    font-size: 16px;    border: none;    cursor: pointer;    transition: all 0.3s ease;    text-decoration: none;    min-width: 120px;    white-space: nowrap;}.btn-primary {    background: var(--bg-gradient);    color: var(--text-white);    box-shadow: var(--shadow-md);}.btn-primary:hover {    transform: translateY(-2px);    box-shadow: var(--shadow-lg);}.btn-secondary {    background: var(--bg-white);    color: var(--primary-color);    border: 2px solid var(--primary-color);}.btn-secondary:hover {    background: var(--primary-color);    color: var(--text-white);}.btn-outline {    background: transparent;    color: var(--primary-color);    border: 2px solid var(--primary-color);}.btn-outline:hover {    background: var(--primary-color);    color: var(--text-white);}.btn-large {    padding: 16px 32px;    font-size: 18px;    min-width: 160px;}/* Section Headers */.section-header {    text-align: center;    margin-bottom: var(--spacing-2xl);}.section-title {    font-size: 2.5rem;    color: var(--text-primary);    margin-bottom: var(--spacing-sm);    position: relative;}.section-title::after {    content: '';    position: absolute;    bottom: -8px;    left: 50%;    transform: translateX(-50%);    width: 60px;    height: 4px;    background: var(--bg-gradient);    border-radius: 2px;}.section-subtitle {    font-size: 1.125rem;    color: var(--text-light);    max-width: 600px;    margin: 0 auto;}/* Header */.header {    background: var(--bg-white);    box-shadow: var(--shadow-md);    position: fixed;    top: 0;    left: 0;    right: 0;    z-index: 1000;}.nav-container {    display: flex;    justify-content: space-between;    align-items: center;    padding: 1rem 2rem;    max-width: 1200px;    margin: 0 auto;}.logo {    display: flex;    align-items: center;    gap: var(--spacing-sm);}.logo-text {    font-size: 1.5rem;    font-weight: 700;    color: var(--primary-color);}.nav-menu {    display: flex;    align-items: center;    gap: var(--spacing-lg);}.nav-menu a {    color: var(--text-primary);    font-weight: 500;    padding: 0.5rem 1rem;    border-radius: var(--radius-md);    transition: all 0.3s ease;}.nav-menu a:hover,.nav-menu a[aria-current="page"] {    color: var(--primary-color);    background: rgba(30, 64, 175, 0.1);}.header-cta {    display: flex;    align-items: center;    gap: var(--spacing-sm);}.mobile-menu-toggle {    display: none;    flex-direction: column;    background: none;    border: none;    cursor: pointer;    padding: 0.5rem;}.mobile-menu-toggle span {    width: 25px;    height: 3px;    background: var(--text-primary);    margin: 3px 0;    transition: all 0.3s ease;}/* Hero Section */.hero {    padding: 120px 0 80px;    background: var(--bg-light);    position: relative;    overflow: hidden;}.hero::before {    content: '';    position: absolute;    top: 0;    left: 0;    right: 0;    bottom: 0;    background: var(--bg-gradient);    opacity: 0.05;}.hero-container {    display: grid;    grid-template-columns: 1fr 1fr;    gap: var(--spacing-2xl);    align-items: center;    max-width: 1200px;    margin: 0 auto;    padding: 0 2rem;    position: relative;    z-index: 1;}.hero-content {    max-width: 100%;}.hero-title {    font-size: 3.5rem;    font-weight: 800;    background: var(--bg-gradient);    -webkit-background-clip: text;    -webkit-text-fill-color: transparent;    margin-bottom: var(--spacing-sm);}.hero-subtitle {    font-size: 1.5rem;    color: var(--text-secondary);    margin-bottom: var(--spacing-md);}.hero-description {    font-size: 1.125rem;    color: var(--text-light);    margin-bottom: var(--spacing-lg);}.hero-features {    display: grid;    grid-template-columns: repeat(2, 1fr);    gap: var(--spacing-sm);    margin-bottom: var(--spacing-lg);}.feature-item {    display: flex;    align-items: center;    gap: var(--spacing-xs);    padding: 0.5rem;    background: var(--bg-white);    border-radius: var(--radius-md);    box-shadow: var(--shadow-sm);}.feature-item .icon {    color: var(--accent-green);    font-weight: bold;    font-size: 1.125rem;}.stats-row {    display: flex;    gap: var(--spacing-lg);    margin-bottom: var(--spacing-xl);}.stat-item {    text-align: center;}.stat-number {    display: block;    font-size: 2rem;    font-weight: 700;    color: var(--primary-color);}.stat-label {    display: block;    font-size: 0.875rem;    color: var(--text-light);}.hero-cta {    display: flex;    gap: var(--spacing-md);    align-items: center;}.hero-image {    text-align: center;}.hero-image img {    border-radius: var(--radius-xl);    box-shadow: var(--shadow-xl);    max-width: 100%;}/* About Section */.about {    padding: var(--spacing-2xl) 0;    background: var(--bg-white);}.about-content {    display: grid;    grid-template-columns: 1fr 1fr;    gap: var(--spacing-2xl);    align-items: center;}.about-text h3 {    color: var(--primary-color);    margin-bottom: var(--spacing-md);}.about-text p {    font-size: 1.125rem;    line-height: 1.8;    margin-bottom: var(--spacing-lg);}.about-highlights {    display: grid;    grid-template-columns: repeat(2, 1fr);    gap: var(--spacing-md);}.highlight-item {    display: flex;    align-items: flex-start;    gap: var(--spacing-sm);    padding: var(--spacing-md);    background: var(--bg-light);    border-radius: var(--radius-lg);    border-left: 4px solid var(--primary-color);}.highlight-icon {    font-size: 1.5rem;    flex-shrink: 0;}.highlight-content h4 {    color: var(--text-primary);    margin-bottom: 0.25rem;}.highlight-content p {    color: var(--text-light);    font-size: 0.875rem;    margin: 0;}.about-image img {    border-radius: var(--radius-lg);    box-shadow: var(--shadow-lg);}/* Services Section */.services {    padding: var(--spacing-2xl) 0;    background: var(--bg-light);}.services-grid {    display: grid;    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));    gap: var(--spacing-xl);}.service-card {    background: var(--bg-white);    padding: var(--spacing-xl);    border-radius: var(--radius-xl);    box-shadow: var(--shadow-md);    text-align: center;    transition: all 0.3s ease;    border: 2px solid transparent;}.service-card:hover {    transform: translateY(-10px);    box-shadow: var(--shadow-xl);    border-color: var(--primary-light);}.service-icon {    margin: 0 auto var(--spacing-md);    width: 80px;    height: 80px;    display: flex;    align-items: center;    justify-content: center;    background: linear-gradient(135deg, var(--primary-light), var(--accent-purple));    border-radius: 50%;}.service-icon img {    width: 60px;    height: 60px;    filter: brightness(0) invert(1);}.service-title {    color: var(--text-primary);    margin-bottom: var(--spacing-sm);}.service-description {    color: var(--text-light);    margin-bottom: var(--spacing-md);    line-height: 1.6;}.service-features {    margin-bottom: var(--spacing-lg);    text-align: left;}.service-features li {    padding: 0.25rem 0;    color: var(--text-secondary);    font-size: 0.9rem;}.service-price {    margin-bottom: var(--spacing-lg);    padding: var(--spacing-sm);    background: var(--bg-light);    border-radius: var(--radius-md);}.price-label {    color: var(--text-light);    font-size: 0.875rem;}.price-value {    color: var(--accent-orange);    font-size: 1.25rem;    font-weight: 700;}/* Advantages Section */.advantages {    padding: var(--spacing-2xl) 0;    background: var(--bg-white);}.advantages-grid {    display: grid;    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));    gap: var(--spacing-lg);}.advantage-item {    text-align: center;    padding: var(--spacing-xl);    background: var(--bg-light);    border-radius: var(--radius-lg);    transition: all 0.3s ease;}.advantage-item:hover {    transform: translateY(-5px);    background: var(--bg-white);    box-shadow: var(--shadow-lg);}.advantage-icon {    font-size: 3rem;    margin-bottom: var(--spacing-md);    display: block;}.advantage-item h3 {    color: var(--primary-color);    margin-bottom: var(--spacing-sm);}.advantage-item p {    color: var(--text-light);}/* Pricing Section */.pricing {    padding: var(--spacing-2xl) 0;    background: var(--bg-light);}.pricing-grid {    display: grid;    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));    gap: var(--spacing-xl);    margin-bottom: var(--spacing-xl);}.pricing-card {    background: var(--bg-white);    border-radius: var(--radius-xl);    padding: var(--spacing-xl);    box-shadow: var(--shadow-md);    text-align: center;    position: relative;    transition: all 0.3s ease;    border: 2px solid transparent;}.pricing-card:hover {    transform: translateY(-10px);    box-shadow: var(--shadow-xl);}.pricing-card.featured {    border-color: var(--primary-color);    transform: scale(1.05);}.pricing-card.featured:hover {    transform: scale(1.05) translateY(-10px);}.pricing-badge {    position: absolute;    top: -10px;    left: 50%;    transform: translateX(-50%);    background: var(--bg-gradient);    color: var(--text-white);    padding: 0.5rem 1rem;    border-radius: var(--radius-md);    font-size: 0.875rem;    font-weight: 600;}.pricing-header {    margin-bottom: var(--spacing-lg);}.pricing-title {    color: var(--text-primary);    margin-bottom: var(--spacing-md);}.pricing-price {    margin-bottom: var(--spacing-md);}.price-currency {    font-size: 1.25rem;    color: var(--text-secondary);    vertical-align: top;}.price-amount {    font-size: 3rem;    font-weight: 700;    color: var(--primary-color);}.price-period {    font-size: 1rem;    color: var(--text-light);}.pricing-features {    text-align: left;    margin-bottom: var(--spacing-lg);}.pricing-features li {    padding: 0.5rem 0;    color: var(--text-secondary);    border-bottom: 1px solid var(--border-color);}.pricing-features li:last-child {    border-bottom: none;}.pricing-notice {    text-align: center;    padding: var(--spacing-lg);    background: var(--bg-white);    border-radius: var(--radius-lg);    border: 2px solid var(--accent-green);}.pricing-notice h3 {    color: var(--accent-green);    margin-bottom: var(--spacing-sm);}/* Team Section */.team {    padding: var(--spacing-2xl) 0;    background: var(--bg-white);}.team-grid {    display: grid;    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));    gap: var(--spacing-xl);}.team-member {    text-align: center;    padding: var(--spacing-xl);    background: var(--bg-light);    border-radius: var(--radius-xl);    transition: all 0.3s ease;}.team-member:hover {    transform: translateY(-10px);    background: var(--bg-white);    box-shadow: var(--shadow-xl);}.member-image {    margin-bottom: var(--spacing-lg);}.member-image img {    width: 150px;    height: 150px;    border-radius: 50%;    margin: 0 auto;    object-fit: cover;    border: 4px solid var(--primary-color);}.member-name {    color: var(--text-primary);    margin-bottom: var(--spacing-xs);}.member-role {    color: var(--primary-color);    font-weight: 600;    margin-bottom: var(--spacing-sm);}.member-description {    color: var(--text-light);    line-height: 1.6;}/* Testimonials Section */.testimonials {    padding: var(--spacing-2xl) 0;    background: var(--bg-light);}.testimonials-grid {    display: grid;    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));    gap: var(--spacing-xl);}.testimonial-card {    background: var(--bg-white);    padding: var(--spacing-xl);    border-radius: var(--radius-xl);    box-shadow: var(--shadow-md);    transition: all 0.3s ease;}.testimonial-card:hover {    transform: translateY(-5px);    box-shadow: var(--shadow-lg);}.testimonial-content {    margin-bottom: var(--spacing-lg);}.testimonial-rating {    margin-bottom: var(--spacing-md);}.star {    color: #fbbf24;    font-size: 1.25rem;}.testimonial-text {    font-size: 1.125rem;    line-height: 1.8;    color: var(--text-secondary);    font-style: italic;}.testimonial-author {    display: flex;    align-items: center;    gap: var(--spacing-md);}.testimonial-author img {    width: 60px;    height: 60px;    border-radius: 50%;    object-fit: cover;}.author-name {    color: var(--text-primary);    margin-bottom: 0.25rem;}.author-title {    color: var(--text-light);    font-size: 0.875rem;    margin: 0;}/* Contact CTA Section */.contact-cta {    padding: var(--spacing-2xl) 0;    background: var(--bg-gradient);    color: var(--text-white);}.cta-content {    text-align: center;}.cta-content h2 {    color: var(--text-white);    font-size: 2.5rem;    margin-bottom: var(--spacing-md);}.cta-content p {    color: rgba(255, 255, 255, 0.9);    font-size: 1.25rem;    margin-bottom: var(--spacing-xl);}.contact-methods {    display: grid;    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));    gap: var(--spacing-lg);    margin-bottom: var(--spacing-xl);}.contact-item {    display: flex;    align-items: center;    gap: var(--spacing-sm);    padding: var(--spacing-md);    background: rgba(255, 255, 255, 0.1);    border-radius: var(--radius-lg);    backdrop-filter: blur(10px);}.contact-icon {    font-size: 1.5rem;    flex-shrink: 0;}.contact-info {    display: flex;    flex-direction: column;}.contact-label {    font-size: 0.875rem;    opacity: 0.8;}.contact-value {    font-weight: 600;    font-size: 1.125rem;}.cta-buttons {    display: flex;    justify-content: center;    gap: var(--spacing-md);}.cta-buttons .btn-secondary {    background: rgba(255, 255, 255, 0.2);    color: var(--text-white);    border-color: rgba(255, 255, 255, 0.3);}.cta-buttons .btn-secondary:hover {    background: var(--bg-white);    color: var(--primary-color);}/* Footer */.footer {    background: var(--bg-dark);    color: var(--text-white);    padding: var(--spacing-2xl) 0 var(--spacing-lg);}.footer-content {    display: grid;    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));    gap: var(--spacing-xl);    margin-bottom: var(--spacing-xl);}.footer-section h3 {    color: var(--text-white);    margin-bottom: var(--spacing-md);}.footer-logo {    display: flex;    align-items: center;    gap: var(--spacing-sm);    margin-bottom: var(--spacing-md);}.footer-logo-text {    font-size: 1.5rem;    font-weight: 700;    color: var(--primary-light);}.footer-description {    color: rgba(255, 255, 255, 0.7);    margin-bottom: var(--spacing-md);    line-height: 1.6;}.footer-stats {    display: flex;    gap: var(--spacing-md);}.footer-stat {    text-align: center;}.footer-stat .stat-number {    display: block;    color: var(--primary-light);    font-weight: 700;}.footer-stat .stat-label {    font-size: 0.75rem;    color: rgba(255, 255, 255, 0.6);}.footer-title {    color: var(--text-white);    font-size: 1.125rem;    margin-bottom: var(--spacing-md);}.footer-links {    display: flex;    flex-direction: column;    gap: 0.5rem;}.footer-links a {    color: rgba(255, 255, 255, 0.7);    transition: color 0.3s ease;}.footer-links a:hover {    color: var(--primary-light);}.contact-info {    display: flex;    flex-direction: column;    gap: var(--spacing-sm);}.contact-info .contact-item {    display: flex;    align-items: center;    gap: var(--spacing-xs);    color: rgba(255, 255, 255, 0.7);}.footer-bottom {    border-top: 1px solid rgba(255, 255, 255, 0.1);    padding-top: var(--spacing-lg);    display: flex;    justify-content: space-between;    align-items: center;    flex-wrap: wrap;    gap: var(--spacing-md);}.footer-legal {    display: flex;    align-items: center;    gap: var(--spacing-lg);    flex-wrap: wrap;}.legal-links {    display: flex;    gap: var(--spacing-md);}.legal-links a {    color: rgba(255, 255, 255, 0.6);    font-size: 0.875rem;}.legal-links a:hover {    color: var(--primary-light);}.footer-icp {    color: rgba(255, 255, 255, 0.5);    font-size: 0.875rem;}/* Responsive Design */@media (max-width: 1024px) {    .container {        padding: 0 var(--spacing-md);    }        .hero-container {        grid-template-columns: 1fr;        text-align: center;        gap: var(--spacing-xl);    }        .about-content {        grid-template-columns: 1fr;        gap: var(--spacing-xl);    }        .about-highlights {        grid-template-columns: 1fr;    }        .services-grid {        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));    }        .pricing-grid {        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));    }        .hero-features {        grid-template-columns: 1fr;    }}@media (max-width: 768px) {    .nav-menu {        display: none;    }        .header-cta {        display: none;    }        .mobile-menu-toggle {        display: flex;    }        .nav-container {        padding: 1rem;    }        .hero {        padding: 80px 0 40px;    }        .hero-container {        grid-template-columns: 1fr;        gap: var(--spacing-lg);        padding: 0 1.5rem;    }        .hero-content {        max-width: 90%;        margin: 0 auto;        text-align: center;    }        .hero-title {        font-size: 2.5rem;    }        .section-title {        font-size: 2rem;    }            .hero-cta {        flex-direction: column;        gap: var(--spacing-sm);    }        .hero-cta .btn {        width: 100%;        max-width: 280px;    }        .hero-image {        margin-top: var(--spacing-lg);    }        .hero-image img {        max-width: 90%;        margin: 0 auto;    }        .contact-methods {        grid-template-columns: 1fr;    }        .cta-buttons {        flex-direction: column;        align-items: center;    }        .cta-buttons .btn {        width: 100%;        max-width: 300px;    }        .footer-bottom {        flex-direction: column;        text-align: center;    }        .footer-legal {        flex-direction: column;        gap: var(--spacing-sm);    }}@media (max-width: 480px) {    .container {        padding: 0 var(--spacing-sm);    }        .hero-container {        padding: 0 1rem;    }        .hero-content {        max-width: 95%;    }        .hero-title {        font-size: 2rem;        margin-bottom: 0.5rem;    }        .hero-subtitle {        font-size: 1.25rem;        margin-bottom: 0.75rem;    }        .hero-description {        font-size: 1rem;        margin-bottom: 1.5rem;        max-width: 90%;        margin-left: auto;        margin-right: auto;    }        .hero-cta .btn {        max-width: 250px;        font-size: 0.95rem;    }        .hero-image img {        max-width: 85%;    }        .section-title {        font-size: 1.75rem;    }        .services-grid {        grid-template-columns: 1fr;    }        .advantages-grid {        grid-template-columns: 1fr;    }        .pricing-grid {        grid-template-columns: 1fr;    }        .team-grid {        grid-template-columns: 1fr;    }        .testimonials-grid {        grid-template-columns: 1fr;    }        .service-card,    .pricing-card,    .team-member,    .testimonial-card {        padding: var(--spacing-md);    }        .pricing-card.featured {        transform: none;    }        .pricing-card.featured:hover {        transform: translateY(-10px);    }}/* Accessibility */@media (prefers-reduced-motion: reduce) {    * {        animation-duration: 0.01ms !important;        animation-iteration-count: 1 !important;        transition-duration: 0.01ms !important;    }        html {        scroll-behavior: auto;    }}/* Focus styles for keyboard navigation */.btn:focus,a:focus {    outline: 2px solid var(--primary-color);    outline-offset: 2px;}/* Print styles */@media print {    .header,    .mobile-menu-toggle,    .btn,    .footer {        display: none !important;    }        body {        font-size: 12pt;        line-height: 1.4;    }        .container {        max-width: none;        padding: 0;    }}