/* ===== 字体引入 ===== */
      @import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap";

      /* ===== 全局变量 ===== */
      :root {
        --primary: #3b5df6;
        --primary-light: #617ef9;
        --primary-dark: #2a45c7;
        --secondary: #ff6b4a;
        --secondary-light: #ff8b6f;
        --success: #10b981;
        --warning: #f59e0b;
        --dark: #0b1b33;
        --gray-600: #4b5565;
        --gray-500: #6b7280;
        --gray-400: #9ca3af;
        --gray-300: #d1d5db;
        --gray-200: #e5e7eb;
        --gray-100: #f3f4f6;
        --light: #ffffff;
        --background: #fafcff;
        --gradient-primary: linear-gradient(135deg, #3b5df6 0%, #617ef9 100%);
        --gradient-secondary: linear-gradient(135deg, #ff6b4a 0%, #ff8b6f 100%);
        --gradient-dark: linear-gradient(135deg, #0b1b33 0%, #1a2b44 100%);
        --shadow-sm: 0 4px 6px -1px rgb(0 0 0 / 5%), 0 2px 4px -1px rgb(0 0 0 / 3%);
        --shadow-md: 0 10px 15px -3px rgb(0 0 0 / 5%), 0 4px 6px -2px rgb(0 0 0 / 2.5%);
        --shadow-lg: 0 20px 25px -5px rgb(0 0 0 / 5%), 0 10px 10px -5px rgb(0 0 0 / 2%);
        --shadow-xl: 0 25px 50px -12px rgb(0 0 0 / 15%);
        --border-radius-sm: 0.5rem;
        --border-radius: 1rem;
        --border-radius-lg: 1.5rem;
        --border-radius-xl: 2rem;
      }
      * {
        box-sizing: border-box;
        padding: 0;
        margin: 0;
      }
      html {
        scroll-behavior: smooth;
        font-size: 16px;
      }
      body {
        overflow-x: hidden;
        font-family:
          Inter,
          -apple-system,
          BlinkMacSystemFont,
          "Segoe UI",
          Roboto,
          "Microsoft YaHei",
          "PingFang SC",
          "Hiragino Sans GB",
          "Helvetica Neue",
          Arial,
          sans-serif;
        line-height: 1.6;
        color: var(--dark);
        background: var(--background);
      }

      /* ===== 通用样式 ===== */
      .container {
        max-width: 1280px;
        padding: 0 2rem;
        margin: 0 auto;
      }
      .section {
        position: relative;
        padding: 6rem 0;
      }
      .section-header {
        max-width: 700px;
        margin: 0 auto 4rem;
        text-align: center;
      }
      .section-tag {
        display: inline-block;
        padding: 0.375rem 1rem;
        margin-bottom: 1.25rem;
        font-size: 0.875rem;
        font-weight: 600;
        color: var(--primary);
        text-transform: uppercase;
        letter-spacing: 0.5px;
        background: rgb(59 93 246 / 8%);
        border-radius: 2rem;
      }
      .section-title {
        margin-bottom: 1.25rem;
        font-size: 2.75rem;
        font-weight: 700;
        line-height: 1.2;
        color: var(--dark);
        letter-spacing: -0.02em;
      }
      .section-title span {
        background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
        -webkit-text-fill-color: transparent;
        background-clip: text;
      }
      .section-desc {
        max-width: 600px;
        margin: 0 auto;
        font-size: 1.125rem;
        line-height: 1.7;
        color: var(--gray-500);
      }

      /* ===== 按钮样式 ===== */
      .btn {
        display: inline-flex;
        gap: 0.5rem;
        align-items: center;
        justify-content: center;
        padding: 0.75rem 2rem;
        font-size: 1rem;
        font-weight: 600;
        text-align: center;
        text-decoration: none;
        white-space: nowrap;
        cursor: pointer;
        border: none;
        border-radius: 3rem;
        outline: none;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      }
      .btn-primary {
        color: white;
        background: var(--gradient-primary);
        box-shadow: 0 8px 20px -8px rgb(59 93 246 / 50%);
      }
      .btn-primary:hover {
        box-shadow: 0 12px 25px -8px rgb(59 93 246 / 70%);
        transform: translateY(-2px);
      }
      .btn-secondary {
        color: white;
        background: var(--gradient-secondary);
        box-shadow: 0 8px 20px -8px rgb(255 107 74 / 50%);
      }
      .btn-secondary:hover {
        box-shadow: 0 12px 25px -8px rgb(255 107 74 / 70%);
        transform: translateY(-2px);
      }
      .btn-outline {
        color: var(--primary);
        background: transparent;
        border: 2px solid rgb(59 93 246 / 20%);
      }
      .btn-outline:hover {
        background: rgb(59 93 246 / 5%);
        border-color: var(--primary);
        transform: translateY(-2px);
      }
      .btn-white {
        color: var(--primary);
        background: white;
        box-shadow: 0 8px 20px -8px rgb(255 255 255 / 30%);
      }
      .btn-white:hover {
        box-shadow: 0 12px 25px -8px rgb(255 255 255 / 50%);
        transform: translateY(-2px);
      }
      .btn-outline-light {
        color: white;
        background: transparent;
        border: 2px solid rgb(255 255 255 / 30%);
      }
      .btn-outline-light:hover {
        background: rgb(255 255 255 / 10%);
        border-color: rgb(255 255 255 / 60%);
        transform: translateY(-2px);
      }
      .btn-large {
        padding: 1rem 2.5rem;
        font-size: 1.125rem;
      }

      /* ===== 导航栏 ===== */
      .navbar {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        z-index: 1000;
        background: rgb(255 255 255 / 90%);
        backdrop-filter: blur(10px);
        border-bottom: 1px solid rgb(0 0 0 / 5%);
        transition: all 0.3s ease;
      }
      .navbar.scrolled {
        background: rgb(255 255 255 / 98%);
        box-shadow: var(--shadow-md);
      }
      .nav-container {
        display: flex;
        align-items: center;
        justify-content: space-between;
        max-width: 1280px;
        padding: 1rem 2rem;
        margin: 0 auto;
      }
      .logo {
        display: flex;
        gap: 0.75rem;
        align-items: center;
        text-decoration: none;
      }
      .logo-img {
        width: 40px;
        height: 40px;
        border-radius: 8px;
        transition: transform 0.3s ease;
      }
      .logo:hover .logo-img {
        transform: scale(1.1);
      }
      .logo-text-wrap {
        display: flex;
        flex-direction: column;
        justify-content: center;
      }
      .logo-text-cn {
        font-size: 1.25rem;
        font-weight: 700;
        line-height: 1.2;
        background: rgb(0 0 0 / 70%);
        -webkit-text-fill-color: transparent;
        background-clip: text;
      }
      .logo-text-en {
        font-size: 0.56rem;
        font-weight: 500;
        line-height: 1.2;
        color: var(--gray-400);
        letter-spacing: 1px;
      }
      .nav-links {
        display: flex;
        gap: 2.5rem;
      }
      .nav-links li {
        list-style: none;
      }
      .nav-links a {
        position: relative;
        font-size: 1rem;
        font-weight: 500;
        color: var(--dark);
        text-decoration: none;
        transition: all 0.3s ease;
      }
      .nav-links a::after {
        position: absolute;
        bottom: -4px;
        left: 50%;
        width: 0;
        height: 2px;
        content: "";
        background: var(--gradient-primary);
        border-radius: 2px;
        transition: width 0.3s ease;
        transform: translateX(-50%);
      }
      .nav-links a:hover::after,
      .nav-links a.active::after {
        width: 100%;
      }
      .nav-links a:hover,
      .nav-links a.active {
        color: var(--primary);
      }
      .nav-cta {
        display: flex;
        gap: 1rem;
      }
      .menu-toggle {
        z-index: 1002;
        display: none;
        flex-direction: column;
        gap: 6px;
        padding: 0.5rem;
        cursor: pointer;
        background: none;
        border: none;
      }
      .menu-toggle span {
        width: 24px;
        height: 2px;
        background: var(--dark);
        border-radius: 2px;
        transition: all 0.3s ease;
      }
      .menu-toggle.active span:nth-child(1) {
        transform: rotate(45deg) translate(6px, 6px);
      }
      .menu-toggle.active span:nth-child(2) {
        opacity: 0;
        transform: translateX(-10px);
      }
      .menu-toggle.active span:nth-child(3) {
        transform: rotate(-45deg) translate(6px, -6px);
      }
      .nav-overlay {
        position: fixed;
        inset: 0;
        z-index: 999;
        display: none;
        background: rgb(0 0 0 / 50%);
        backdrop-filter: blur(4px);
        opacity: 0;
        transition: opacity 0.3s ease;
      }
      .nav-overlay.active {
        opacity: 1;
      }

      /* ===== Hero区域 ===== */
      .hero {
        position: relative;
        padding: 8rem 0 4rem;
        overflow: hidden;
        background: linear-gradient(135deg, #f5f9ff 0%, #ffffff 100%);
      }
      .hero::before {
        position: absolute;
        top: -50%;
        right: -10%;
        width: 80%;
        height: 200%;
        pointer-events: none;
        content: "";
        background: radial-gradient(circle, rgb(59 93 246 / 3%) 0%, transparent 70%);
        border-radius: 50%;
      }
      .hero::after {
        position: absolute;
        bottom: -20%;
        left: -10%;
        width: 60%;
        height: 150%;
        pointer-events: none;
        content: "";
        background: radial-gradient(circle, rgb(255 107 74 / 3%) 0%, transparent 70%);
        border-radius: 50%;
      }
      .hero-container {
        position: relative;
        z-index: 2;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 4rem;
        align-items: center;
        max-width: 1280px;
        padding: 0 2rem;
        margin: 0 auto;
      }
      .hero-content h1 {
        margin-bottom: 1.5rem;
        font-size: 3.75rem;
        font-weight: 800;
        line-height: 1.1;
        color: var(--dark);
        letter-spacing: -0.02em;
      }
      .hero-content h1 span {
        background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
        -webkit-text-fill-color: transparent;
        background-clip: text;
      }
      .hero-subtitle {
        max-width: 500px;
        margin-bottom: 2.5rem;
        font-size: 1.25rem;
        line-height: 1.8;
        color: var(--gray-500);
      }
      .hero-buttons {
        display: flex;
        gap: 1rem;
        margin-bottom: 3rem;
      }
      .hero-stats {
        display: flex;
        gap: 3rem;
      }
      .stat-item {
        text-align: left;
      }
      .stat-number {
        font-size: 2.5rem;
        font-weight: 700;
        line-height: 1.2;
        background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
        background-clip: text;
        -webkit-text-fill-color: transparent;
      }
      .stat-label {
        font-size: 0.9375rem;
        font-weight: 500;
        color: var(--gray-500);
      }
      .hero-image {
        position: relative;
      }
      .hero-image img {
        width: 100%;
        border-radius: var(--border-radius-lg);
        box-shadow: var(--shadow-xl);
        transition: all 0.5s ease;
        transform: perspective(1000px) rotateY(-5deg) rotateX(2deg);
      }
      .hero-image:hover img {
        transform: perspective(1000px) rotateY(0) rotateX(0) translateY(-10px);
      }
      .floating-card {
        position: absolute;
        z-index: 10;
        padding: 1rem 1.5rem;
        background: rgb(255 255 255 / 95%);
        backdrop-filter: blur(10px);
        border: 1px solid rgb(255 255 255 / 50%);
        border-radius: 1rem;
        box-shadow: var(--shadow-lg);
        animation: float 4s ease-in-out infinite;
      }
      .card-1 {
        top: 10%;
        left: -10%;
        animation-delay: 0s;
      }
      .card-2 {
        right: -5%;
        bottom: 10%;
        animation-delay: 2s;
      }
      .floating-card-content {
        display: flex;
        gap: 1rem;
        align-items: center;
      }
      .floating-card-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        font-size: 1.25rem;
        color: white;
        background: var(--gradient-primary);
        border-radius: 10px;
      }
      .floating-card-title {
        margin-bottom: 0.25rem;
        font-size: 1rem;
        font-weight: 600;
        color: var(--dark);
      }
      .floating-card-desc {
        font-size: 0.875rem;
        color: var(--gray-500);
      }
      .floating-card-desc.success {
        color: var(--success);
      }

      @keyframes float {
        0%,
        100% {
          transform: translateY(0);
        }
        50% {
          transform: translateY(-15px);
        }
      }

      /* ===== 功能卡片 ===== */
      .features-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 2rem;
      }
      .feature-card {
        position: relative;
        padding: 2.5rem 2rem;
        overflow: hidden;
        background: white;
        border: 1px solid rgb(0 0 0 / 2%);
        border-radius: var(--border-radius-lg);
        box-shadow: var(--shadow-md);
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      }
      .feature-card::before {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        height: 4px;
        content: "";
        background: var(--gradient-primary);
        transition: transform 0.3s ease;
        transform: scaleX(0);
      }
      .feature-card:hover {
        box-shadow: var(--shadow-xl);
        transform: translateY(-8px);
      }
      .feature-card:hover::before {
        transform: scaleX(1);
      }
      .feature-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 60px;
        height: 60px;
        margin-bottom: 1.75rem;
        font-size: 2rem;
        color: var(--primary);
        background: linear-gradient(135deg, rgb(59 93 246 / 10%) 0%, rgb(255 107 74 / 10%) 100%);
        border-radius: 16px;
      }
      .feature-card h3 {
        margin-bottom: 1rem;
        font-size: 1.375rem;
        font-weight: 600;
        color: var(--dark);
      }
      .feature-card p {
        margin: 0;
        line-height: 1.7;
        color: var(--gray-500);
      }

      /* ===== 展示区域 ===== */
      .showcase {
        position: relative;
        overflow: hidden;
        background: white;
      }
      .showcase::before {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        height: 100%;
        pointer-events: none;
        content: "";
        background: linear-gradient(135deg, rgb(59 93 246 / 2%) 0%, transparent 50%);
      }
      .showcase-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 5rem;
        align-items: center;
      }
      .showcase-content {
        position: relative;
      }
      .showcase-content h3 {
        margin: 1.25rem 0 1.5rem;
        font-size: 2.25rem;
        font-weight: 700;
        line-height: 1.2;
        color: var(--dark);
      }
      .showcase-content p {
        margin-bottom: 2rem;
        font-size: 1.125rem;
        line-height: 1.8;
        color: var(--gray-500);
      }
      .showcase-list {
        margin-bottom: 2rem;
      }
      .showcase-list li {
        display: flex;
        gap: 1rem;
        align-items: center;
        margin-bottom: 1rem;
        font-size: 1.0625rem;
        color: var(--gray-600);
      }
      .showcase-list li::before {
        display: flex;
        flex-shrink: 0;
        align-items: center;
        justify-content: center;
        width: 24px;
        height: 24px;
        font-size: 0.875rem;
        font-weight: 600;
        color: white;
        content: "✓";
        background: var(--gradient-primary);
        border-radius: 50%;
      }
      .showcase-image {
        position: relative;
      }
      .showcase-image img {
        width: 100%;
        border-radius: var(--border-radius-lg);
        box-shadow: var(--shadow-xl);
        transition: all 0.5s ease;
      }
      .showcase-image:hover img {
        transform: scale(1.02) translateY(-10px);
      }
      .showcase-mini-image {
        position: relative;
      }
      .showcase-mini-image img {
        width: 50%;
        border-radius: var(--border-radius-lg);
        box-shadow: var(--shadow-xl);
        transition: all 0.5s ease;
      }
      .showcase-mini-image:hover img {
        transform: scale(1.02) translateY(-10px);
      }

      /* ===== 数据分析 ===== */
      .analysis-main-image {
        position: relative;
        margin: 4rem 0;
        text-align: center;
      }
      .analysis-main-image img {
        max-width: 100%;
        border-radius: var(--border-radius-lg);
        box-shadow: var(--shadow-xl);
        transition: all 0.5s ease;
      }
      .analysis-main-image:hover img {
        box-shadow:
          var(--shadow-xl),
          0 30px 60px -15px rgb(59 93 246 / 30%);
        transform: translateY(-10px);
      }
      .analysis-features {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 2rem;
      }
      .analysis-card {
        padding: 2rem;
        text-align: center;
        background: white;
        border: 1px solid rgb(0 0 0 / 2%);
        border-radius: var(--border-radius);
        box-shadow: var(--shadow-md);
        transition: all 0.3s ease;
      }
      .analysis-card:hover {
        box-shadow: var(--shadow-xl);
        transform: translateY(-5px);
      }
      .analysis-card .icon {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 64px;
        height: 64px;
        margin: 0 auto 1.5rem;
        font-size: 2rem;
        color: var(--primary);
        background: linear-gradient(135deg, rgb(59 93 246 / 10%) 0%, rgb(255 107 74 / 10%) 100%);
        border-radius: 20px;
      }
      .analysis-card h4 {
        margin-bottom: 0.75rem;
        font-size: 1.25rem;
        font-weight: 600;
        color: var(--dark);
      }
      .analysis-card p {
        margin: 0;
        font-size: 0.9375rem;
        color: var(--gray-500);
      }

      /* ===== CTA区域 ===== */
      .cta {
        position: relative;
        padding: 6rem 2rem;
        overflow: hidden;
        color: white;
        text-align: center;
        background: var(--gradient-dark);
      }
      .cta::before {
        position: absolute;
        top: -50%;
        right: -10%;
        width: 80%;
        height: 200%;
        pointer-events: none;
        content: "";
        background: radial-gradient(circle, rgb(255 255 255 / 10%) 0%, transparent 70%);
        border-radius: 50%;
      }
      .cta::after {
        position: absolute;
        bottom: -50%;
        left: -10%;
        width: 80%;
        height: 200%;
        pointer-events: none;
        content: "";
        background: radial-gradient(circle, rgb(255 107 74 / 10%) 0%, transparent 70%);
        border-radius: 50%;
      }
      .cta-content {
        position: relative;
        z-index: 2;
        max-width: 700px;
        margin: 0 auto;
      }
      .cta h2 {
        margin-bottom: 1.5rem;
        font-size: 3rem;
        font-weight: 700;
        line-height: 1.2;
      }
      .cta p {
        margin-bottom: 2.5rem;
        font-size: 1.25rem;
        opacity: 0.9;
      }
      .cta-buttons {
        display: flex;
        gap: 1rem;
        justify-content: center;
      }

      /* ===== Footer ===== */
      .footer {
        position: relative;
        padding: 2.5rem 0 0;
        color: white;
        background: var(--dark);
      }
      .footer-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 1rem;
        margin-bottom: 1.5rem;
      }
      .footer-brand .logo-img {
        width: 48px;
        height: 48px;
      }
      .footer-brand .logo-text-cn {
        color: white;
        background: none;
        -webkit-text-fill-color: white;
      }
      .footer-brand .logo-text-en {
        color: #64748b;
      }
      .footer-brand p {
        margin: 0.75rem 0;
        font-size: 0.9375rem;
        line-height: 1.8;
        color: #94a3b8;
      }
      .footer h4 {
        position: relative;
        display: inline-block;
        margin-bottom: 1.5rem;
        font-size: 1.125rem;
        font-weight: 600;
        color: white;
      }
      .footer h4::after {
        position: absolute;
        bottom: -6px;
        left: 0;
        width: 40px;
        height: 2px;
        content: "";
        background: var(--gradient-primary);
        border-radius: 2px;
      }
      .footer-links {
        list-style: none;
      }
      .footer-links li {
        margin-bottom: 0.875rem;
      }
      .footer-links a {
        display: inline-block;
        font-size: 0.9375rem;
        color: #94a3b8;
        text-decoration: none;
        transition: all 0.3s ease;
      }
      .footer-links a:hover {
        color: white;
        transform: translateX(5px);
      }
      .footer-bottom {
        padding: 2rem 0;
        font-size: 0.875rem;
        color: #94a3b8;
        text-align: center;
        border-top: 1px solid rgb(255 255 255 / 10%);
      }
      .footer-bottom a {
        color: #94a3b8;
        text-decoration: none;
        transition: color 0.3s ease;
      }
      .footer-bottom a:hover {
        color: #ffffff;
      }
      .footer-bottom .ga-beian {
        display: inline-flex;
        gap: 4px;
        align-items: center;
      }
      .footer-bottom .ga-beian img {
        width: 16px;
        height: 16px;
      }

      /* ===== 移动端响应式 ===== */
      @media (width <= 1024px) {
        .hero-content h1 {
          font-size: 3rem;
        }
        .features-grid,
        .analysis-features {
          grid-template-columns: repeat(2, 1fr);
        }
      }

      @media (width <= 768px) {
        .section {
          padding: 4rem 0;
        }
        .section-title {
          font-size: 2rem;
        }
        .nav-links,
        .nav-cta {
          display: none;
        }
        .nav-links {
          position: fixed;
          top: 0;
          right: -100%;
          z-index: 1001;
          display: flex;
          flex-direction: column;
          gap: 1.5rem;
          width: 280px;
          height: 100vh;
          padding: 6rem 2rem 2rem;
          background: white;
          box-shadow: -5px 0 30px rgb(0 0 0 / 10%);
          transition: right 0.3s ease;
        }
        .nav-links.show {
          right: 0;
        }
        .nav-links a::after {
          left: 0;
          transform: none;
        }
        .nav-overlay.active {
          display: block;
        }
        .menu-toggle {
          display: flex;
        }
        .hero-container,
        .showcase-grid {
          grid-template-columns: 1fr;
          gap: 3rem;
        }
        .hero-container {
          text-align: center;
        }
        .hero-subtitle {
          margin-right: auto;
          margin-left: auto;
        }
        .hero-stats {
          justify-content: center;
        }
        .hero-buttons {
          justify-content: center;
        }
        .floating-card {
          display: none;
        }
        .features-grid,
        .analysis-features,
        .footer-grid {
          grid-template-columns: 1fr;
          gap: 1.5rem;
        }
        .showcase-grid.reverse {
          direction: ltr;
        }
        .footer-grid {
          text-align: center;
        }
        .footer h4::after {
          left: 50%;
          transform: translateX(-50%);
        }
        .footer-links a:hover {
          transform: translateX(0) scale(1.05);
        }
        .cta h2 {
          font-size: 2rem;
        }
        .cta-buttons {
          flex-direction: column;
          gap: 1rem;
          align-items: center;
        }
        .cta-buttons .btn {
          width: 100%;
          max-width: 300px;
        }
        .showcase-mini-image img {
          width: 80%;
        }
        .float-contact {
          right: 12px;
          bottom: 80px;
        }
        .float-contact-btn {
          width: 50px;
          height: 50px;
          font-size: 0.625rem;
        }
        .float-contact-btn .icon {
          font-size: 1.25rem;
        }
        .float-contact-btn .icon-img {
          width: 20px;
          height: 20px;
        }
        .float-qrcode {
          right: 60px;
        }
        .float-qrcode img {
          width: 120px;
          height: 120px;
        }
        .float-mini {
          right: 12px;
          bottom: 140px;
        }
        .float-mini-btn {
          width: 50px;
          height: 50px;
          font-size: 0.625rem;
        }
        .float-mini-btn .icon {
          font-size: 1.25rem;
        }
        .float-mini-btn .icon-img {
          width: 20px;
          height: 20px;
        }
        .float-mini-qrcode {
          right: 60px;
        }
        .float-mini-qrcode img {
          width: 120px;
          height: 120px;
        }
        .float-app {
          right: 12px;
          bottom: 200px;
        }
        .float-app-btn {
          width: 50px;
          height: 50px;
          font-size: 0.625rem;
        }
        .float-app-btn .icon-svg {
          width: 20px;
          height: 20px;
        }
        .float-app-qrcode {
          right: 60px;
        }
        .float-app-qrcode img {
          width: 120px;
          height: 120px;
        }
      }

      @media (width <= 480px) {
        .hero-content h1 {
          font-size: 2.25rem;
        }
        .hero-stats {
          flex-direction: column;
          gap: 1.5rem;
        }
        .hero-buttons {
          flex-direction: column;
        }
        .btn-large {
          width: 100%;
        }
        .section-title {
          font-size: 1.75rem;
        }
        .showcase-content h3 {
          font-size: 1.75rem;
        }
        .cta h2 {
          font-size: 1.75rem;
        }
      }

      /* ===== 动画 ===== */
      @keyframes fade-in-up {
        from {
          opacity: 0;
          transform: translateY(30px);
        }
        to {
          opacity: 1;
          transform: translateY(0);
        }
      }
      .animate {
        animation: fade-in-up 0.6s ease forwards;
      }

      /* ===== 悬浮咨询按钮 ===== */
      .float-contact {
        position: fixed;
        right: 20px;
        bottom: 100px;
        z-index: 999;
        display: flex;
        flex-direction: column;
        gap: 12px;
      }
      .float-contact-btn {
        display: flex;
        flex-direction: column;
        gap: 4px;
        align-items: center;
        justify-content: center;
        width: 60px;
        height: 60px;
        font-size: 0.75rem;
        color: white;
        cursor: pointer;
        background: linear-gradient(135deg, #2b7af3 0%, #1e6de0 100%);
        border: none;
        border-radius: 12px;
        box-shadow: 0 4px 15px rgb(43 122 243 / 40%);
        transition: all 0.3s ease;
      }
      .float-contact-btn:hover {
        box-shadow: 0 6px 20px rgb(43 122 243 / 60%);
        transform: translateY(-3px);
      }
      .float-contact-btn .icon {
        font-size: 1.5rem;
      }
      .float-contact-btn .icon-img {
        width: 24px;
        height: 24px;
        object-fit: contain;
      }
      .float-qrcode {
        position: absolute;
        right: 70px;
        bottom: 0;
        padding: 16px;
        text-align: center;
        visibility: hidden;
        background: white;
        border-radius: 12px;
        box-shadow: 0 10px 40px rgb(0 0 0 / 15%);
        opacity: 0;
        transition: all 0.3s ease;
      }
      .float-contact-btn:hover + .float-qrcode,
      .float-qrcode:hover {
        visibility: visible;
        opacity: 1;
      }
      .float-qrcode::after {
        position: absolute;
        top: 50%;
        right: -8px;
        content: "";
        border-color: transparent transparent transparent white;
        border-style: solid;
        border-width: 8px 0 8px 8px;
        transform: translateY(-50%);
      }
      .float-qrcode img {
        width: 140px;
        height: 140px;
        border-radius: 8px;
      }
      .float-qrcode p {
        margin-top: 8px;
        font-size: 0.875rem;
        font-weight: 500;
        color: var(--dark);
      }

      /* ===== 悬浮小程序按钮 ===== */
      .float-mini {
        position: fixed;
        right: 20px;
        bottom: 170px;
        z-index: 999;
        display: flex;
        flex-direction: column;
        gap: 12px;
      }
      .float-mini-btn {
        display: flex;
        flex-direction: column;
        gap: 4px;
        align-items: center;
        justify-content: center;
        width: 60px;
        height: 60px;
        font-size: 0.75rem;
        color: white;
        cursor: pointer;
        background: linear-gradient(135deg, #07c160 0%, #10b981 100%);
        border: none;
        border-radius: 12px;
        box-shadow: 0 4px 15px rgb(7 193 96 / 40%);
        transition: all 0.3s ease;
      }
      .float-mini-btn:hover {
        box-shadow: 0 6px 20px rgb(7 193 96 / 60%);
        transform: translateY(-3px);
      }
      .float-mini-btn .icon {
        font-size: 1.5rem;
      }
      .float-mini-btn .icon-img {
        width: 24px;
        height: 24px;
        object-fit: contain;
      }
      .float-mini-qrcode {
        position: absolute;
        right: 70px;
        bottom: 0;
        padding: 16px;
        text-align: center;
        visibility: hidden;
        background: white;
        border-radius: 12px;
        box-shadow: 0 10px 40px rgb(0 0 0 / 15%);
        opacity: 0;
        transition: all 0.3s ease;
      }
      .float-mini-btn:hover + .float-mini-qrcode,
      .float-mini-qrcode:hover {
        visibility: visible;
        opacity: 1;
      }
      .float-mini-qrcode::after {
        position: absolute;
        top: 50%;
        right: -8px;
        content: "";
        border-color: transparent transparent transparent white;
        border-style: solid;
        border-width: 8px 0 8px 8px;
        transform: translateY(-50%);
      }
      .float-mini-qrcode img {
        width: 140px;
        height: 140px;
        border-radius: 8px;
      }
      .float-mini-qrcode p {
        margin-top: 8px;
        font-size: 0.875rem;
        font-weight: 500;
        color: var(--dark);
      }

      /* ===== 悬浮APP下载按钮 ===== */
      .float-app {
        position: fixed;
        right: 20px;
        bottom: 240px;
        z-index: 999;
        display: flex;
        flex-direction: column;
        gap: 12px;
      }
      .float-app-btn {
        display: flex;
        flex-direction: column;
        gap: 4px;
        align-items: center;
        justify-content: center;
        width: 60px;
        height: 60px;
        font-size: 0.75rem;
        color: white;
        cursor: pointer;
        background: linear-gradient(135deg, #a4c639 0%, #8bc34a 100%);
        border: none;
        border-radius: 12px;
        box-shadow: 0 4px 15px rgb(164 198 57 / 40%);
        transition: all 0.3s ease;
      }
      .float-app-btn:hover {
        box-shadow: 0 6px 20px rgb(164 198 57 / 60%);
        transform: translateY(-3px);
      }
      .float-app-btn .icon-svg {
        width: 24px;
        height: 24px;
      }
      .float-app-qrcode {
        position: absolute;
        right: 70px;
        bottom: 0;
        padding: 16px;
        text-align: center;
        visibility: hidden;
        background: white;
        border-radius: 12px;
        box-shadow: 0 10px 40px rgb(0 0 0 / 15%);
        opacity: 0;
        transition: all 0.3s ease;
      }
      .float-app-btn:hover + .float-app-qrcode,
      .float-app-qrcode:hover {
        visibility: visible;
        opacity: 1;
      }
      .float-app-qrcode::after {
        position: absolute;
        top: 50%;
        right: -8px;
        content: "";
        border-color: transparent transparent transparent white;
        border-style: solid;
        border-width: 8px 0 8px 8px;
        transform: translateY(-50%);
      }
      .float-app-qrcode img {
        width: 140px;
        height: 140px;
        border-radius: 8px;
      }
      .float-app-qrcode p {
        margin-top: 8px;
        font-size: 0.875rem;
        font-weight: 500;
        color: var(--dark);
      }
      .float-app-qrcode .download-link {
        display: inline-block;
        padding: 6px 16px;
        margin-top: 8px;
        font-size: 0.75rem;
        color: white;
        text-decoration: none;
        background: linear-gradient(135deg, #a4c639 0%, #8bc34a 100%);
        border-radius: 20px;
        transition: all 0.3s ease;
      }
      .float-app-qrcode .download-link:hover {
        transform: scale(1.05);
      }

      /* ===== 直播订货区块 ===== */
      .live-section {
        background: linear-gradient(180deg, #fafcff 0%, #f0f4ff 50%, #fafcff 100%);
      }
      .live-tag {
        color: #ffffff !important;
        background: linear-gradient(135deg, #ff416c 0%, #ff4b2b 100%);
      }
      .live-showcase {
        display: flex;
        gap: 2rem;
        align-items: center;
        justify-content: center;
      }
      .live-features-left,
      .live-features-right {
        display: flex;
        flex: 1;
        flex-direction: column;
        gap: 1.5rem;
        max-width: 280px;
      }
      .live-feature-card {
        display: flex;
        gap: 1rem;
        align-items: flex-start;
        padding: 1.25rem;
        background: #ffffff;
        border-radius: 16px;
        box-shadow: 0 4px 20px rgb(0 0 0 / 6%);
        transition: all 0.3s ease;
      }
      .live-feature-card:hover {
        box-shadow: 0 8px 30px rgb(0 0 0 / 10%);
        transform: translateY(-4px);
      }
      .live-features-left .live-feature-card {
        transform-origin: right center;
      }
      .live-features-right .live-feature-card {
        transform-origin: left center;
      }
      .live-feature-icon {
        display: flex;
        flex-shrink: 0;
        align-items: center;
        justify-content: center;
        width: 48px;
        height: 48px;
        font-size: 1.5rem;
        background: linear-gradient(135deg, #ff416c10 0%, #ff4b2b10 100%);
        border-radius: 12px;
      }
      .live-feature-text h4 {
        margin-bottom: 0.25rem;
        font-size: 1rem;
        font-weight: 600;
        color: var(--dark);
      }
      .live-feature-text p {
        font-size: 0.875rem;
        line-height: 1.5;
        color: var(--gray-500);
      }
      .live-preview-center {
        position: relative;
        flex-shrink: 0;
      }
      .live-preview-center img {
        display: block;
        height: 520px;
        border-radius: 24px;
        box-shadow: 0 20px 60px rgb(255 65 108 / 20%);
      }
      .live-badge {
        position: absolute;
        top: -12px;
        left: 50%;
        z-index: 10;
        display: flex;
        gap: 6px;
        align-items: center;
        padding: 8px 20px;
        font-size: 0.875rem;
        font-weight: 700;
        color: #ffffff;
        letter-spacing: 1px;
        background: linear-gradient(135deg, #ff416c 0%, #ff4b2b 100%);
        border-radius: 20px;
        box-shadow: 0 4px 15px rgb(255 65 108 / 40%);
        transform: translateX(-50%);
      }
      .live-dot {
        display: inline-block;
        width: 8px;
        height: 8px;
        background: #ffffff;
        border-radius: 50%;
        animation: live-pulse 1.5s ease-in-out infinite;
      }

      @keyframes live-pulse {
        0%,
        100% {
          opacity: 1;
          transform: scale(1);
        }
        50% {
          opacity: 0.5;
          transform: scale(0.8);
        }
      }
      .live-viewers {
        position: absolute;
        right: -20px;
        bottom: 40px;
        padding: 10px 16px;
        font-size: 0.875rem;
        font-weight: 500;
        color: var(--dark);
        background: #ffffff;
        border-radius: 12px;
        box-shadow: 0 4px 20px rgb(0 0 0 / 10%);
      }

      /* 直播区块响应式 */
      @media (width <= 1024px) {
        .live-showcase {
          flex-direction: column;
          gap: 2.5rem;
        }
        .live-features-left,
        .live-features-right {
          flex-flow: row wrap;
          justify-content: center;
          max-width: 100%;
        }
        .live-feature-card {
          flex: 0 1 280px;
        }
        .live-preview-center img {
          height: 450px;
        }
        .live-viewers {
          right: 10px;
          bottom: 20px;
        }
      }

      @media (width <= 640px) {
        .live-features-left,
        .live-features-right {
          flex-direction: column;
          align-items: center;
        }
        .live-feature-card {
          width: 100%;
          max-width: 320px;
        }
        .live-preview-center img {
          height: 400px;
        }
      }