/* 从主页复制的核心样式，确保页面外观和响应式设计一致性 */
        * { margin: 0; padding: 0; box-sizing: border-box; }
        :root {
            --google-blue: #4285F4;
            --google-red: #DB4437;
            --google-yellow: #F4B400;
            --google-green: #0F9D58;
            --bg-light: #ffffff;
            --bg-secondary: #f8f9fa; 
            --text-dark: #333333;
            --text-light: #666666;
            --border-light: #e9ecef;
            --shadow-light: rgba(0,0,0,0.05);
            --top-bar-bg: #333; 
            --top-bar-text: #ffffff; 
        }
        body { font-family: 'Roboto', sans-serif; line-height: 1.6; color: var(--text-dark); background: var(--bg-light); overflow-x: hidden; }

        /* --- Global Container --- */
        .container { max-width: 1200px; margin: 0 auto; padding: 0 2rem; }

        /* --- Top Bar Styles (Contact Info) --- */
        .top-bar {
            background: var(--top-bar-bg);
            color: var(--top-bar-text);
            padding: 0.5rem 0;
            font-size: 0.9rem;
        }
        .top-bar-content {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
            display: flex; 
            justify-content: flex-end; 
            align-items: center;
        }
        .top-bar a {
            color: var(--top-bar-text);
            text-decoration: none;
            margin-left: 2rem;
            transition: color 0.3s ease;
        }
        .top-bar a:hover {
            color: var(--google-yellow);
        }
        .top-bar i {
            margin-right: 0.5rem;
        }

        /* --- Header and Navigation Styles --- */
        header { 
            background: rgba(255, 255, 255, 0.95); 
            color: var(--text-dark); 
            padding: 0.5rem 0; 
            position: sticky; 
            top: 0; 
            z-index: 1000; 
            backdrop-filter: blur(10px); 
            box-shadow: 0 2px 10px var(--shadow-light); 
        }
        .nav-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
            display: flex;
            justify-content: space-between; 
            align-items: center;
            position: relative; 
        }
        .logo {
            font-size: 1.8rem;
            font-weight: 500; 
            color: var(--google-blue); 
            text-decoration: none;
            letter-spacing: -1px; 
        }
        .eft-align-container {
    width: 66.7%;
    text-align: left;
    font-size: 12px;
}
        .logo .l-red { color: var(--google-red); font-weight: 500; }
        .logo .l-yellow { color: var(--google-yellow); font-weight: 500; }
        .logo .l-blue-2 { color: var(--google-blue); font-weight: 500; }
        .logo .l-green-2 { color: var(--google-green); font-weight: 500; }
        .logo .l-red-2 { color: var(--google-red); font-weight: 500; }
        .logo .suffix { color: var(--google-blue); font-weight: 400; margin-left: 3px; }

        nav ul { list-style: none; display: flex; justify-content: center; }
        nav li { margin: 0 1rem; }
        nav a { color: var(--text-dark); text-decoration: none; font-weight: 400; transition: all 0.3s ease; position: relative; }
        nav a::after { content: ''; position: absolute; bottom: -5px; left: 0; width: 0; height: 2px; background: var(--google-blue); transition: width 0.3s ease; }
        nav a:hover::after, nav a.active::after { width: 100%; }
        nav a:hover, nav a.active { color: var(--google-blue); }

        .menu-toggle {
            display: none; 
            font-size: 1.8rem;
            cursor: pointer;
            color: var(--google-blue);
        }
        
        /* --- Button Styles --- */
        .btn { 
            background: linear-gradient(90deg, var(--google-blue), var(--google-green)); 
            color: white; 
            padding: 1rem 2.5rem; 
            text-decoration: none; 
            border-radius: 50px; 
            transition: all 0.3s ease; 
            display: inline-block; 
            font-weight: 700; 
            box-shadow: 0 4px 12px rgba(66,133,244,0.3); 
            margin: 0.5rem 0.5rem; 
        }
        .btn:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(66,133,244,0.4); }
        /* --- FAQ Page Specific Styles --- */
        .page-hero {
            background: var(--bg-secondary);
            padding: 6rem 0 3rem;
            text-align: center;
            border-bottom: 3px solid var(--google-blue);
        }
        .page-hero h1 {
            font-size: 3.5rem; 
            font-weight: 900; 
            color: var(--google-blue); 
            margin-bottom: 0.5rem;
        }
        .page-hero p {
            font-size: 1.5rem;
            color: var(--text-dark);
            max-width: 800px;
            margin: 0 auto;
        }

        .faq-section {
            padding: 4rem 0;
            max-width: 900px;
            margin: 0 auto;
        }
        .faq-section h2 {
            text-align: center; 
            margin-bottom: 3rem; 
            color: var(--google-red); 
            font-size: 3rem; 
            font-weight: 700; 
            position: relative;
        }
        .faq-section h2::after {
            content: '';
            display: block;
            width: 80px;
            height: 4px;
            background: var(--google-green);
            margin: 0.5rem auto 0;
            border-radius: 2px;
        }
        
        /* Accordion Styles */
        .faq-item {
            border: 1px solid var(--border-light);
            margin-bottom: 1rem;
            border-radius: 8px;
            overflow: hidden;
            background: var(--bg-light);
        }

        .faq-question {
            padding: 1.5rem;
            font-size: 1.2rem;
            font-weight: 500;
            color: var(--text-dark);
            cursor: pointer;
            display: flex;
            justify-content: space-between;
            align-items: center;
            background: var(--bg-secondary);
            transition: background 0.3s ease;
        }
        .faq-question:hover {
            background: #e9ecef;
        }
        
        .faq-question i {
            margin-left: 1rem;
            transition: transform 0.3s ease;
            color: var(--google-blue);
        }
        
        .faq-answer {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.4s ease-out, padding 0.4s ease-out;
            background: var(--bg-light);
            color: var(--text-light);
        }
        
        .faq-answer.active {
            max-height: 500px; /* 足够大的值来展示内容 */
            padding: 1.5rem;
            border-top: 1px solid var(--border-light);
        }
        
        .faq-answer p {
            margin-bottom: 1rem;
        }
        .faq-answer p:last-child {
            margin-bottom: 0;
        }
        .faq-answer strong {
            color: var(--google-red);
        }
        /* --- Services Page Specific Styles --- */
        .page-hero {
            background: var(--bg-secondary);
            padding: 6rem 0 3rem;
            text-align: center;
            border-bottom: 3px solid var(--google-green);
        }
        .page-hero h1 {
            font-size: 3.5rem; 
            font-weight: 900; 
            color: var(--google-blue); 
            margin-bottom: 0.5rem;
        }
        .page-hero p {
            font-size: 1.5rem;
            color: var(--text-dark);
            max-width: 800px;
            margin: 0 auto;
        }

        .services-list-section {
            padding: 4rem 0;
            background: var(--bg-light);
        }
        .services-list-section h2 {
            text-align: center; 
            margin-bottom: 3rem; 
            color: var(--google-blue); 
            font-size: 3rem; 
            font-weight: 700; 
            position: relative;
        }
        .services-list-section h2::after {
            content: '';
            display: block;
            width: 80px;
            height: 4px;
            background: var(--google-yellow);
            margin: 0.5rem auto 0;
            border-radius: 2px;
        }

        /* Feature Card Styles - Detailed View */
        .feature-card {
            background: var(--bg-secondary);
            padding: 3rem;
            margin-bottom: 3rem;
            border-radius: 15px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.05);
            display: flex;
            align-items: flex-start;
            gap: 2.5rem;
            transition: transform 0.3s ease;
        }
        .feature-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 15px 40px rgba(0,0,0,0.1);
        }
        .feature-card:nth-child(even) {
            background: #f1f7fe; /* 浅蓝色背景用于区分 */
            flex-direction: row-reverse;
        }
        
        .feature-icon {
            font-size: 4rem;
            color: var(--google-blue);
            min-width: 100px;
            text-align: center;
            padding-top: 0.5rem;
        }
        .feature-content h3 {
            font-size: 2rem;
            color: var(--text-dark);
            margin-bottom: 0.8rem;
            border-bottom: 2px solid var(--border-light);
            padding-bottom: 0.5rem;
        }
        .feature-content p {
            margin-bottom: 1rem;
            color: var(--text-light);
        }
        .feature-content ul {
            list-style: none;
            padding-left: 0;
        }
        .feature-content li {
            margin-bottom: 0.5rem;
            padding-left: 1.5rem;
            position: relative;
            line-height: 1.4;
        }
        .feature-content li::before { 
            content: '★'; 
            color: var(--google-yellow); 
            font-weight: bold; 
            position: absolute; 
            left: 0;
        }

            /* --- Testimonials Page Specific Styles --- */
    .page-hero {
      background: var(--bg-secondary);
      padding: 6rem 0 3rem;
      text-align: center;
      border-bottom: 3px solid var(--google-green);
    }
    .page-hero h1 {
      font-size: 3.5rem;
      font-weight: 900;
      color: var(--google-green);
      margin-bottom: 0.5rem;
    }
    .page-hero p {
      font-size: 1.5rem;
      color: var(--text-dark);
      max-width: 800px;
      margin: 0 auto;
    }

    .testimonials-section {
      padding: 4rem 0;
    }
    .testimonials-section h2 {
      text-align: center;
      margin-bottom: 3rem;
      color: var(--google-blue);
      font-size: 3rem;
      font-weight: 700;
      position: relative;
    }
    .testimonials-section h2::after {
      content: '';
      display: block;
      width: 80px;
      height: 4px;
      background: var(--google-yellow);
      margin: 0.5rem auto 0;
      border-radius: 2px;
    }
   
    .testimonial-grid {
      display: grid;
      /* 调整网格布局以更好地容纳 6 个卡片 */
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 2rem;
    }
   
    .testimonial-card {
      background: var(--bg-light);
      padding: 2.5rem;
      border-radius: 15px;
      box-shadow: 0 8px 30px rgba(0,0,0,0.1);
      position: relative;
      border-left: 5px solid var(--google-blue);
      transition: transform 0.3s ease;
    }
    .testimonial-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 12px 40px rgba(0,0,0,0.15);
    }

    .quote-icon {
      font-size: 2.5rem;
      color: var(--google-red);
      opacity: 0.2;
      position: absolute;
      top: 15px;
      right: 20px;
    }
   
    .testimonial-text {
      font-style: italic;
      font-size: 1.1rem;
      margin-bottom: 1.5rem;
      color: var(--text-dark);
      position: relative;
    }

    .reviewer-info {
      display: flex;
      align-items: center;
      margin-top: 1rem;
      padding-top: 1rem;
      border-top: 1px solid var(--border-light);
    }
    .reviewer-avatar {
      width: 50px;
      height: 50px;
      background: var(--google-yellow);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      color: white;
      font-size: 1.2rem;
      font-weight: 700;
      margin-right: 1rem;
    }
    .reviewer-details h4 {
      font-size: 1.1rem;
      margin: 0;
      color: var(--google-blue);
    }
    .reviewer-details p {
      font-size: 0.9rem;
      color: var(--text-light);
      margin: 0;
      font-weight: 400;
    }
    .reviewer-details .metric-highlight {
      font-weight: 700;
      color: var(--google-green);
    }
   
        /* --- Contact Page Specific Styles --- */
        .page-hero {
            background: var(--bg-secondary);
            padding: 6rem 0 3rem;
            text-align: center;
            border-bottom: 3px solid var(--google-red);
        }
        .page-hero h1 {
            font-size: 3.5rem; 
            font-weight: 1200; 
            color: var(--google-red); 
            margin-bottom: 0.5rem;
        }
        .page-hero p {
            font-size: 1.5rem;
            color: var(--text-dark);
            max-width: 800px;
            margin: 0 auto;
        }

        .contact-content {
            padding: 4rem 0;
        }

        /* --- 优化后的表单样式 --- */
        .contact-form-container {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            max-width: 900px;
            margin: 0 auto 4rem;
            background: var(--bg-light);
            border-radius: 15px;
            /* 优化阴影效果 */
            box-shadow: 0 15px 50px rgba(0,0,0,0.1); 
            padding: 3.5rem 4rem; /* 增加整体内边距 */
            border-top: 5px solid var(--google-green);
        }
        .contact-form-container h2 {
            width: 100%;
            text-align: center;
            color: var(--google-blue);
            margin-bottom: 2.5rem; /* 增加标题和表单的间距 */
            font-size: 2.5rem;
            font-weight: 700;
        }
        
        .form-group {
            width: calc(50% - 10px);
            margin-bottom: 2rem; /* 增加行间距 */
        }
        .form-group.full-width {
            width: 100%;
        }

        .form-group label {
            display: block;
            margin-bottom: 0.6rem; 
            font-weight: 600; /* 加粗标签 */
            color: var(--google-blue); /* 提高标签颜色 */
            font-size: 1.05rem;
        }
        .form-group label i {
            color: var(--google-green); /* 优化图标颜色 */
            margin-right: 0.5rem;
        }

        .form-group input, .form-group textarea, .form-group select {
            width: 100%;
            padding: 0.9rem 1.2rem; /* 增加输入框内边距 */
            border: 1px solid #ced4da; /* 使用更柔和的边框颜色 */
            border-radius: 8px;
            font-size: 1rem;
            transition: border-color 0.3s ease, box-shadow 0.3s ease;
            background-color: var(--bg-secondary); /* 稍微区分背景 */
        }

        .form-group input:focus, .form-group textarea:focus, .form-group select:focus {
            border-color: var(--google-blue);
            box-shadow: 0 0 0 4px rgba(66, 133, 244, 0.3); /* 扩大焦点阴影 */
            outline: none;
            background-color: var(--bg-light);
        }
        
        .form-group textarea {
            min-height: 180px; /* 增加文本域高度 */
            resize: vertical;
        }
        
        .form-submit-btn {
            display: block;
            width: 100%;
            margin-top: 1.5rem; /* 确保按钮上方有足够的间距 */
            padding: 1rem 2rem;
            font-size: 1.2rem;
            cursor: pointer;
            border: none;
            text-decoration: none;
            background: linear-gradient(90deg, var(--google-blue), var(--google-green)); 
            color: white; 
            border-radius: 50px; 
            transition: all 0.3s ease; 
            font-weight: 700;
        }
        .form-submit-btn:hover {
            transform: translateY(-3px); /* 略微加大悬停效果 */
            box-shadow: 0 8px 20px rgba(66,133,244,0.5); /* 提高阴影清晰度 */
        }
        /* --- Contact Details Grid Styles (复用 FAQ 样式) --- */
        .contact-details-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 2rem;
            max-width: 1200px; 
            margin: 0 auto 4rem;
        }
        .contact-method {
            background: var(--bg-light); 
            padding: 2.5rem 1.5rem;
            border-radius: 15px;
            text-align: center;
            box-shadow: 0 8px 25px rgba(0,0,0,0.1);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            border: 1px solid var(--border-light);
        }
        .contact-method:hover {
            transform: translateY(-5px);
            box-shadow: 0 12px 30px rgba(0,0,0,0.15);
        }
        .contact-method i {
            font-size: 3.5rem;
            color: var(--google-yellow);
            margin-bottom: 1rem;
        }
        .contact-method h3 {
            font-size: 1.5rem;
            margin-bottom: 0.5rem;
            color: var(--text-dark);
        }
        .contact-method p {
            font-size: 0.9rem;
            color: var(--google-green);
            margin-bottom: 1rem;
            font-weight: 500;
        }
        .detail-link {
            font-weight: 700;
            color: var(--google-blue);
            text-decoration: none;
            font-size: 1.1rem;
            display: block;
            margin-top: 10px;
        }
        .wechat-qr {
            width: 120px;
            height: 120px;
            display: block;
            margin: 10px auto 0;
            border: 5px solid white;
            box-shadow: 0 2px 8px rgba(0,0,0,0.1);
            border-radius: 5px;
        }
        
        /* --- Map and Office Info --- */
        .office-info {
            max-width: 1200px;
            margin: 0 auto;
            text-align: center;
            padding-top: 2rem;
            border-top: 1px dashed var(--border-light);
        }
        .office-info h3 {
            color: var(--google-red);
            font-size: 2rem;
            margin-bottom: 1rem;
        }
        .map-placeholder {
            width: 100%;
            height: 400px;
            background: var(--bg-secondary);
            margin-top: 1.5rem;
            border-radius: 10px;
            overflow: hidden;
            border: 1px solid var(--border-light);
            box-shadow: 0 5px 20px rgba(0,0,0,0.08);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.5rem;
            color: var(--text-light);
        }
        .map-placeholder iframe {
             width: 100%;
             height: 100%;
             border: none;
        }
        /* --- About Page Specific Styles --- */
        .page-hero {
            background: var(--bg-secondary);
            padding: 6rem 0 3rem;
            text-align: center;
            border-bottom: 3px solid var(--google-blue);
        }
        .page-hero h1 {
            font-size: 3.5rem; 
            font-weight: 900; 
            color: var(--google-blue); 
            margin-bottom: 0.5rem;
        }
        .page-hero p {
            font-size: 1.5rem;
            color: var(--text-dark);
            max-width: 800px;
            margin: 0 auto;
        }

        .about-content-section {
            padding: 4rem 0;
        }
        .about-content-section h2 {
            text-align: left;
            margin-bottom: 2rem; 
            color: var(--text-dark); 
            font-size: 2.5rem; 
            font-weight: 700; 
            border-left: 5px solid var(--google-yellow);
            padding-left: 1rem;
        }
        .about-content-section h2::after { content: none; } 

        .mission-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 2rem;
            margin-top: 2rem;
        }
        .mission-card {
            background: var(--bg-secondary);
            padding: 2rem;
            border-radius: 10px;
            box-shadow: 0 4px 15px rgba(0,0,0,0.05);
            border-top: 5px solid var(--google-green);
        }
        .mission-card i {
            font-size: 2.5rem;
            color: var(--google-green);
            margin-bottom: 1rem;
        }
        .mission-card h3 {
            font-size: 1.5rem;
            color: var(--google-blue);
            margin-bottom: 0.8rem;
        }
        .mission-card p {
            font-size: 1rem;
            line-height: 1.6;
        }
        
                /* --- Cases Page Specific Styles --- */
        .page-hero {
            background: var(--bg-secondary);
            padding: 6rem 0 3rem;
            text-align: center;
            border-bottom: 3px solid var(--google-red);
        }
        .page-hero h1 {
            font-size: 3.5rem; 
            font-weight: 900; 
            color: var(--google-red); 
            margin-bottom: 0.5rem;
        }
        .page-hero p {
            font-size: 1.5rem;
            color: var(--text-dark);
            max-width: 800px;
            margin: 0 auto;
        }

        .cases-grid-section {
            padding: 4rem 0;
        }
        .cases-grid-section h2 {
            text-align: center; 
            margin-bottom: 3rem; 
            color: var(--text-dark); 
            font-size: 3rem; 
            font-weight: 700; 
            position: relative;
        }
        .cases-grid-section h2::after {
            content: '';
            display: block;
            width: 80px;
            height: 4px;
            background: var(--google-blue);
            margin: 0.5rem auto 0;
            border-radius: 2px;
        }
        
        .cases-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
            gap: 2.5rem;
        }
        
        .case-card {
            background: var(--bg-light);
            border-radius: 15px;
            overflow: hidden;
            box-shadow: 0 10px 30px rgba(0,0,0,0.1);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            border: 1px solid var(--border-light);
        }
        .case-card:hover {
            transform: translateY(-8px);
            box-shadow: 0 15px 45px rgba(0,0,0,0.15);
        }

        .case-header {
            background: var(--google-blue);
            color: white;
            padding: 1.5rem;
        }
        .case-header h3 {
            font-size: 1.5rem;
            margin-bottom: 0.5rem;
            font-weight: 700;
        }
        .case-header .tag {
            display: inline-block;
            background: var(--google-green);
            padding: 0.3rem 0.8rem;
            border-radius: 5px;
            font-size: 0.9rem;
            font-weight: 500;
        }

        .case-body {
            padding: 1.5rem;
        }
        .case-body p {
            color: var(--text-light);
            margin-bottom: 1rem;
        }
        
        .metrics-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 1rem;
            margin-top: 1rem;
            padding-top: 1rem;
            border-top: 1px dashed var(--border-light);
        }
        .metric {
            text-align: center;
        }
        .metric h4 {
            font-size: 2rem;
            color: var(--google-red);
            line-height: 1;
        }
        .metric p {
            font-size: 0.9rem;
            color: var(--text-dark);
            margin-bottom: 0;
        }
        
                /* --- Blog Page Specific Styles --- */
        .page-hero {
            background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), url('/image/home-banner.jpg') no-repeat center/cover;
            padding: 5rem 0 3rem;
            text-align: center;
            border-bottom: 3px solid var(--google-yellow);
        }
        .page-hero h1 {
            font-size: 3rem; 
            font-weight: 900; 
            color: var(--google-yellow); 
            margin-bottom: 0.5rem;
        }
        .page-hero p {
            font-size: 1.5rem;
            color: #ffffff;
            max-width: 800px;
            margin: 0 auto;
        }

        .blog-section {
            padding: 4rem 0;
        }
        .blog-section h2 {
            text-align: center; 
            margin-bottom: 3rem; 
            color: var(--google-blue); 
            font-size: 3rem; 
            font-weight: 700; 
            position: relative;
        }
        .blog-section h2::after {
            content: '';
            display: block;
            width: 80px;
            height: 4px;
            background: var(--google-red);
            margin: 0.5rem auto 0;
            border-radius: 2px;
        }
        
        .blog-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 2.5rem;
        }
        
        .blog-post-card {
            background: var(--bg-light);
            border-radius: 10px;
            overflow: hidden;
            box-shadow: 0 5px 20px rgba(0,0,0,0.08);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            border-top: 5px solid var(--google-green);
        }
        .blog-post-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 30px rgba(0,0,0,0.15);
        }

        .post-image {
            width: 100%;
            height: 200px;
            background-color: var(--bg-secondary); /* 占位背景色 */
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.5rem;
            color: var(--text-light);
            overflow: hidden;
        }
        .post-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .post-content {
            padding: 1.5rem;
        }
        .post-content .meta {
            font-size: 0.85rem;
            color: var(--google-green);
            margin-bottom: 0.5rem;
            display: flex;
            justify-content: space-between;
        }
        .post-content h3 {
            font-size: 1.5rem;
            margin-bottom: 1rem;
            font-weight: 700;
            color: var(--google-blue);
        }
        .post-content p {
            color: var(--text-light);
            margin-bottom: 1.5rem;
            font-size: 1rem;
            line-height: 1.5;
        }
        .read-more {
            color: var(--google-red);
            text-decoration: none;
            font-weight: 500;
            transition: color 0.3s;
        }
        .read-more:hover {
            color: var(--google-yellow);
        }
        
        /* --- Contact Details Grid Styles (复用主页样式) --- */
        .contact-details-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 2rem;
            max-width: 900px; 
            margin: 0 auto;
        }
        .contact-method {
            background: var(--bg-light); 
            padding: 2.5rem 1.5rem;
            border-radius: 15px;
            text-align: center;
            box-shadow: 0 8px 25px rgba(0,0,0,0.1);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            border: 1px solid var(--border-light);
        }
        .contact-method:hover {
            transform: translateY(-5px);
            box-shadow: 0 12px 30px rgba(0,0,0,0.15);
        }
        .contact-method i {
            font-size: 3.5rem;
            color: var(--google-blue);
            margin-bottom: 1rem;
        }
        .contact-method h3 {
            font-size: 1.5rem;
            margin-bottom: 0.5rem;
            color: var(--text-dark);
        }
        .contact-method p {
            font-size: 0.9rem;
            color: var(--google-green);
            margin-bottom: 1rem;
            font-weight: 500;
        }
        .detail-link {
            font-weight: 700;
            color: var(--google-blue);
            text-decoration: none;
            font-size: 1.1rem;
            display: block;
            margin-top: 10px;
        }
        .wechat-qr {
            width: 120px;
            height: 120px;
            display: block;
            margin: 10px auto 0;
            border: 5px solid white;
            box-shadow: 0 2px 8px rgba(0,0,0,0.1);
            border-radius: 5px;
        }
        /* Stats/Metrics Styles (复用主页样式) */
        .stats-about { 
            display: flex; 
            justify-content: space-around; 
            background: var(--bg-light); 
            padding: 3rem 0; 
            margin: 4rem 0;
            border-top: 1px solid var(--border-light);
            border-bottom: 1px solid var(--border-light);
        }
        .stat-about { text-align: center; color: var(--text-dark); padding: 0 5rem; }
        .stat-about h3 { font-size: 3.5rem; color: var(--google-yellow); line-height: 1; margin-bottom: 0.5rem; }
        .stat-about p { font-size: 1.1rem; }

        /* --- Contact Details Grid Styles (复用主页样式) --- */
        .contact-details-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 2rem;
            max-width: 900px; 
            margin: 0 auto;
        }
        .contact-method {
            background: var(--bg-light); 
            padding: 2.5rem 1.5rem;
            border-radius: 15px;
            text-align: center;
            box-shadow: 0 8px 25px rgba(0,0,0,0.1);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            border: 1px solid var(--border-light);
        }
        .contact-method:hover {
            transform: translateY(-5px);
            box-shadow: 0 12px 30px rgba(0,0,0,0.15);
        }
        .contact-method i {
            font-size: 3.5rem;
            color: var(--google-blue);
            margin-bottom: 1rem;
        }
        .contact-method h3 {
            font-size: 1.5rem;
            margin-bottom: 0.5rem;
            color: var(--text-dark);
        }
        .contact-method p {
            font-size: 0.9rem;
            color: var(--google-green);
            margin-bottom: 1rem;
            font-weight: 500;
        }
        .detail-link {
            font-weight: 700;
            color: var(--google-blue);
            text-decoration: none;
            font-size: 1.1rem;
            display: block;
            margin-top: 10px;
        }
        .wechat-qr {
            width: 120px;
            height: 120px;
            display: block;
            margin: 10px auto 0;
            border: 5px solid white;
            box-shadow: 0 2px 8px rgba(0,0,0,0.1);
            border-radius: 5px;
        }

        /* --- Floating WhatsApp Button and Bubble (复用主页样式) --- */
        .whatsapp-container {
            position: fixed;
            right: 20px;
            top: 96%; 
            transform: translateY(-50%); 
            z-index: 1001;
        }
        .floating-btn { 
            background: var(--google-green); 
            color: white; 
            width: 56px; 
            height: 56px; 
            border-radius: 50%; 
            display: flex; 
            align-items: center; 
            justify-content: center; 
            font-size: 1.5rem; 
            box-shadow: 0 3px 10px rgba(0,0,0,0.3); 
            transition: all 0.3s ease; 
            text-decoration: none;
            position: relative;
        }
        .floating-btn:hover { transform: scale(1.1); background: #25D366; }

        .chat-bubble {
            position: absolute;
            right: 70px; 
            top: 5px; 
            background: var(--bg-light);
            color: var(--text-dark);
            padding: 10px 15px;
            border-radius: 10px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
            white-space: nowrap;
            font-size: 0.9rem;
            opacity: 0; 
            visibility: hidden;
            transition: opacity 0.3s, visibility 0.3s;
            pointer-events: none;
            border: 1px solid var(--google-green);
        }
        .chat-bubble::after {
            content: '';
            position: absolute;
            right: -8px;
            top: 50%;
            transform: translateY(-50%);
            width: 0;
            height: 0;
            border-top: 8px solid transparent;
            border-bottom: 8px solid transparent;
            border-left: 8px solid var(--google-green);
        }
        .chat-bubble.show {
            opacity: 1;
            visibility: visible;
            pointer-events: auto;
        }

        /* --- Footer Styles --- */
        footer { background: var(--top-bar-bg); color: var(--top-bar-text); text-align: center; padding: 2rem; border-top: 1px solid var(--border-light); margin-top: 4rem; }
        footer a { color: var(--google-yellow); text-decoration: none; }

        /* --- Responsive Design & Mobile Navigation (复用主页样式) --- */
        @media (max-width: 768px) { 
            /* --- 顶部栏样式 --- */
            .top-bar-content { 
                justify-content: space-evenly; 
                padding: 0 0.5rem; 
            }
            .top-bar a { 
                margin: 0; 
                font-size: 0.75rem; 
                white-space: nowrap; 
            }

            /* Mobile Navigation Setup */
            .menu-toggle {
                display: block; 
            }
            
            nav {
                display: none; 
                position: absolute;
                top: 100%; 
                left: 0;
                width: 100%;
                background: rgba(255, 255, 255, 0.98); 
                box-shadow: 0 5px 10px rgba(0,0,0,0.1);
                padding: 1rem 0;
            }

            nav.active {
                display: block; 
            }

            nav ul { 
                flex-direction: column; 
                text-align: center; 
            }
            nav li { 
                margin: 0.5rem 0; 
                border-bottom: 1px solid var(--border-light); 
            }
            nav li:last-child {
                border-bottom: none;
            }
            nav a {
                display: block;
                padding: 0.8rem 0;
                font-size: 1.1rem;
            }
            nav a:hover {
                background: var(--bg-secondary);
            }
            nav a::after { content: none; } 

            .page-hero h1 { font-size: 2.5rem; }
            .page-hero p { font-size: 1.2rem; }
            .about-content-section h2 { font-size: 1.8rem; }
            .stats-about { flex-direction: column; } 
            .stat-about { margin-bottom: 1rem; }
            .contact-details-grid { grid-template-columns: 1fr; } 
            .whatsapp-container { right: 10px; }
            .chat-bubble { right: 80px; }
        }