轮播图1版

index.html

@@ -732,84 +732,23 @@
       }
       .hero {
         position: relative;
-        background: url("hero.jpeg") center/cover no-repeat;
+        padding: 0;
-        padding: 120px 0 64px;
+        height: 100vh;
-      }
+        min-height: 700px;
-      .hero::before {
+        overflow: hidden;
-        content: "";
-        position: absolute;
-        inset: 0;
-        background: linear-gradient(180deg, rgba(245, 247, 251, 0.85) 0%, rgba(245, 247, 251, 0.9) 100%);
       }
+      .hero::before { display: none; }
       .hero > .container {
         position: relative;
         z-index: 1;
+        width: 100%;
+        max-width: 100%;
+        padding: 0;
+        height: 100%;
       }
       .hero-inner {
-        display: grid;
-        gap: 36px;
-        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
-        align-items: center;
-      }
-      .eyebrow {
-        display: inline-block;
-        padding: 6px 14px;
-        border-radius: 999px;
-        background: var(--primary-weak);
-        color: var(--primary);
-        font-size: 13px;
-        font-weight: 600;
-        letter-spacing: 0.5px;
-        margin-bottom: 16px;
-      }
-      h1 {
-        font-size: 40px;
-        margin: 0 0 12px;
-        letter-spacing: 0.3px;
-        display: flex;
-        align-items: baseline;
-        flex-wrap: nowrap;
-      }
-      .brand-name {
-        font-size: 48px !important;
-        font-weight: 800 !important;
-        letter-spacing: -1px;
-        background: linear-gradient(
-          135deg,
-          #2f6bff 0%,
-          #06b6d4 25%,
-          #8b5cf6 50%,
-          #06b6d4 75%,
-          #2f6bff 100%
-        );
-        background-size: 200% auto;
-        -webkit-background-clip: text;
-        -webkit-text-fill-color: transparent;
-        background-clip: text;
-        animation: gradientFlow 15s ease-in-out infinite;
-        display: inline-block;
-        position: relative;
-        line-height: 1;
-        margin-right: 8px;
-        vertical-align: baseline;
-        transform: scaleY(1.15);
-        transform-origin: bottom;
-        top: 3px;
-      }
-      .brand-name::after {
-        content: '';
-        position: absolute;
-        top: 0;
-        left: -100%;
         width: 100%;
         height: 100%;
-        background: linear-gradient(
-          90deg,
-          transparent 0%,
-          rgba(255, 255, 255, 0.4) 50%,
-          transparent 100%
-        );
-        animation: shimmer 3s ease-in-out infinite;
       }
       @keyframes gradientFlow {
         0%, 100% { background-position: 0% center; }
@@ -819,31 +758,7 @@
         0% { left: -100%; }
         50%, 100% { left: 100%; }
       }
-      .lead {
+      /* Full-Width Hero Carousel */
-        font-size: 18px;
-        line-height: 1.7;
-        color: var(--muted);
-        margin: 0 0 20px;
-      }
-      .hero-tags {
-        display: flex;
-        flex-wrap: wrap;
-        gap: 10px;
-      }
-      .tag {
-        padding: 6px 12px;
-        border-radius: 999px;
-        background: #ffffff;
-        border: 1px solid var(--line);
-        font-size: 13px;
-        color: #3b4451;
-      }
-      .hero-media {
-        position: relative;
-        width: 580px;
-        height: 520px;
-      }
-      /* Carousel Styles - 3D Flip Transition */
       .carousel-container {
         position: relative;
         width: 100%;
@@ -856,44 +771,115 @@
       }
       .carousel-slide {
         position: absolute;
-        top: 0;
+        top: 0; left: 0;
-        left: 0;
+        width: 100%; height: 100%;
-        width: 100%;
-        height: 100%;
         opacity: 0;
         z-index: 1;
-        transition: opacity 0.8s ease-in-out;
+        transition: opacity 0.9s ease-in-out;
       }
       .carousel-slide.active {
         opacity: 1;
         z-index: 3;
-        transform: scale(1);
       }
       .carousel-slide.exit {
         opacity: 0;
         z-index: 2;
-        transition: opacity 0.8s ease-out;
+        transition: opacity 0.9s ease-out;
-      }
-      .carousel-slide.exit .slide-content {
-        box-shadow: none;
       }
+      /* Product slide */
       .slide-content {
         position: relative;
-        width: 100%;
+        width: 100%; height: 100%;
-        height: 100%;
         display: flex;
         align-items: center;
         justify-content: center;
-        background: linear-gradient(145deg, #ffffff 0%, #f1f5f9 100%);
-        border-radius: 32px;
-        box-shadow: 0 40px 100px rgba(15, 23, 42, 0.15), 0 15px 40px rgba(15, 23, 42, 0.1);
         overflow: hidden;
       }
+      .slide-content.product-bg {
+        background: linear-gradient(145deg, #ffffff 0%, #f1f5f9 100%);
+      }
+      .slide-content.product-bg::after {
+        content: '';
+        position: absolute;
+        width: 600px; height: 600px;
+        border-radius: 50%;
+        background: radial-gradient(circle, rgba(47,107,255,0.08) 0%, transparent 70%);
+        right: -100px; bottom: -100px;
+        pointer-events: none;
+      }
+      .slide-content.product-bg::before {
+        content: '';
+        position: absolute;
+        width: 400px; height: 400px;
+        border-radius: 50%;
+        background: radial-gradient(circle, rgba(6,182,212,0.06) 0%, transparent 70%);
+        left: -50px; top: -50px;
+        pointer-events: none;
+      }
+      .slide-product-layout {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        gap: 80px;
+        width: 1120px;
+        max-width: 1120px;
+        margin: 0 auto;
+        position: relative;
+        z-index: 1;
+      }
+      .slide-product-info {
+        flex: 1;
+        min-width: 0;
+      }
+      .slide-product-info .eyebrow {
+        display: inline-block;
+        padding: 6px 14px;
+        border-radius: 999px;
+        background: var(--primary-weak);
+        color: var(--primary);
+        font-size: 13px;
+        font-weight: 600;
+        letter-spacing: 0.5px;
+        margin-bottom: 16px;
+      }
+      .slide-product-info h2 {
+        font-size: 36px;
+        font-weight: 800;
+        margin: 0 0 12px;
+        color: var(--text);
+        line-height: 1.2;
+      }
+      .slide-product-info .desc {
+        font-size: 17px;
+        line-height: 1.7;
+        color: var(--muted);
+        margin: 0 0 24px;
+      }
+      .slide-product-info .tags {
+        display: flex;
+        gap: 10px;
+        flex-wrap: wrap;
+      }
+      .slide-product-info .tags span {
+        padding: 6px 14px;
+        border-radius: 999px;
+        background: #fff;
+        border: 1px solid var(--line);
+        font-size: 13px;
+        color: #3b4451;
+      }
+      .slide-product-visual {
+        flex: 1;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        position: relative;
+      }
       .slide-image.main {
-        width: 380px;
+        width: 420px;
-        height: 400px;
+        height: 440px;
         object-fit: contain;
-        filter: drop-shadow(0 30px 60px rgba(15, 23, 42, 0.2));
+        filter: drop-shadow(0 30px 60px rgba(15, 23, 42, 0.18));
         position: relative;
         z-index: 1;
       }
@@ -902,12 +888,11 @@
       }
       @keyframes breathe {
         0%, 100% { transform: scale(1) translateY(0); }
-        50% { transform: scale(1.02) translateY(-12px); }
+        50% { transform: scale(1.03) translateY(-14px); }
       }
       .slide-badge {
         position: absolute;
-        width: 100px;
+        width: 110px; height: 110px;
-        height: 100px;
         border-radius: 50%;
         object-fit: cover;
         border: 5px solid #fff;
@@ -915,13 +900,11 @@
         z-index: 2;
       }
       .slide-badge.badge-1 {
-        top: 20px;
+        top: -10px; right: -10px;
-        right: 20px;
         animation: orbit1 5s ease-in-out infinite;
       }
       .slide-badge.badge-2 {
-        bottom: 100px;
+        bottom: 30px; left: -20px;
-        left: 20px;
         animation: orbit2 5s ease-in-out infinite 1s;
       }
       @keyframes orbit1 {
@@ -932,74 +915,6 @@
         0%, 100% { transform: translate(0, 0) rotate(0deg); }
         50% { transform: translate(8px, -8px) rotate(-5deg); }
       }
-      /* Navigation Dots - Horizontal Bottom */
-      .carousel-dots {
-        position: absolute;
-        bottom: 70px;
-        left: 50%;
-        transform: translateX(-50%);
-        display: flex;
-        gap: 10px;
-        z-index: 100;
-        pointer-events: auto;
-      }
-      .carousel-dot {
-        width: 10px;
-        height: 10px;
-        border-radius: 50%;
-        background: rgba(255, 255, 255, 0.5);
-        border: 2px solid rgba(47, 107, 255, 0.3);
-        cursor: pointer;
-        transition: all 0.3s ease;
-      }
-      .carousel-dot:hover {
-        background: rgba(255, 255, 255, 0.8);
-        transform: scale(1.2);
-      }
-      .carousel-dot.active {
-        background: var(--primary);
-        border-color: var(--primary);
-        transform: scale(1.3);
-      }
-      /* Navigation Arrows - Inside Frame */
-      .carousel-arrow {
-        position: absolute;
-        top: 50%;
-        transform: translateY(-50%);
-        width: 44px;
-        height: 44px;
-        border-radius: 50%;
-        background: rgba(255, 255, 255, 0.9);
-        border: none;
-        cursor: pointer;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
-        transition: all 0.3s ease;
-        z-index: 100;
-        opacity: 1;
-        pointer-events: auto;
-      }
-      .carousel-arrow.prev {
-        left: 16px;
-      }
-      .carousel-arrow.next {
-        right: 16px;
-      }
-      .carousel-arrow:hover {
-        background: var(--primary);
-        color: #fff;
-        transform: translateY(-50%) scale(1.1);
-        box-shadow: 0 6px 20px rgba(47, 107, 255, 0.4);
-      }
-      .carousel-arrow:active {
-        transform: translateY(-50%) scale(0.95);
-      }
-      .carousel-arrow svg {
-        width: 22px;
-        height: 22px;
-      }
       /* Activity Slide */
       .slide-content.activity-bg {
         background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
@@ -1008,15 +923,17 @@
         text-align: center;
         color: #fff;
         padding: 20px;
+        position: relative;
+        z-index: 1;
       }
       .activity-badge {
         display: inline-block;
-        padding: 6px 16px;
+        padding: 8px 20px;
         background: rgba(255, 255, 255, 0.25);
         border-radius: 20px;
-        font-size: 13px;
+        font-size: 14px;
         font-weight: 600;
-        margin-bottom: 16px;
+        margin-bottom: 20px;
         backdrop-filter: blur(10px);
       }
       .activity-badge.hot {
@@ -1028,23 +945,23 @@
         50% { transform: scale(1.05); }
       }
       .activity-title {
-        font-size: 32px;
+        font-size: 44px;
         font-weight: 800;
-        margin: 0 0 12px;
+        margin: 0 0 14px;
         text-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
       }
       .activity-desc {
-        font-size: 18px;
+        font-size: 22px;
         opacity: 0.95;
-        margin: 0 0 16px;
+        margin: 0 0 20px;
         line-height: 1.5;
       }
       .activity-date, .activity-code {
         display: inline-block;
-        padding: 8px 20px;
+        padding: 10px 24px;
         background: rgba(255, 255, 255, 0.2);
         border-radius: 25px;
-        font-size: 14px;
+        font-size: 15px;
         font-weight: 500;
         backdrop-filter: blur(10px);
       }
@@ -1056,9 +973,11 @@
         text-align: center;
         color: #fff;
         padding: 20px;
+        position: relative;
+        z-index: 1;
       }
       .notice-icon {
-        font-size: 48px;
+        font-size: 56px;
         display: block;
         margin-bottom: 16px;
         animation: bounce 2s ease-in-out infinite;
@@ -1068,34 +987,86 @@
         50% { transform: translateY(-10px); }
       }
       .notice-title {
-        font-size: 28px;
+        font-size: 36px;
         font-weight: 700;
-        margin: 0 0 12px;
+        margin: 0 0 14px;
         background: linear-gradient(135deg, #fff, #a8edea);
         -webkit-background-clip: text;
         -webkit-text-fill-color: transparent;
         background-clip: text;
       }
       .notice-desc {
-        font-size: 16px;
+        font-size: 18px;
         opacity: 0.85;
         margin: 0;
         line-height: 1.8;
       }
-      /* Hide old progress bar */
+      /* Dots */
-      .progress-bar {
+      .carousel-dots {
-        display: none;
+        position: absolute;
+        bottom: 28px;
+        left: 50%;
+        transform: translateX(-50%);
+        display: flex;
+        gap: 12px;
+        z-index: 100;
       }
-      /* Old styles cleanup */
+      .carousel-dot {
-      .hero-image {
+        width: 28px; height: 4px;
-        display: none;
+        border-radius: 2px;
+        background: rgba(0, 0, 0, 0.15);
+        border: none;
+        cursor: pointer;
+        transition: all 0.4s ease;
       }
-      .hero-pet-badge {
+      .carousel-slide.active .slide-content.activity-bg ~ .carousel-dots .carousel-dot,
-        display: none;
+      .carousel-slide.active .slide-content.notice-bg ~ .carousel-dots .carousel-dot {
+        background: rgba(255, 255, 255, 0.4);
       }
-      .hero-pet-badge {
+      .carousel-dot:hover {
-        display: none;
+        background: rgba(47, 107, 255, 0.5);
       }
+      .carousel-dot.active {
+        width: 48px;
+        background: var(--primary);
+        border-radius: 2px;
+      }
+      /* Arrows */
+      .carousel-arrow {
+        position: absolute;
+        top: 50%;
+        transform: translateY(-50%);
+        width: 52px; height: 52px;
+        border-radius: 50%;
+        background: rgba(255, 255, 255, 0.85);
+        border: none;
+        cursor: pointer;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
+        transition: all 0.3s ease;
+        z-index: 100;
+        backdrop-filter: blur(10px);
+      }
+      .carousel-arrow.prev { left: 32px; }
+      .carousel-arrow.next { right: 32px; }
+      .carousel-arrow:hover {
+        background: var(--primary);
+        color: #fff;
+        transform: translateY(-50%) scale(1.08);
+        box-shadow: 0 8px 28px rgba(47, 107, 255, 0.35);
+      }
+      .carousel-arrow:active {
+        transform: translateY(-50%) scale(0.96);
+      }
+      .carousel-arrow svg {
+        width: 24px; height: 24px;
+      }
+      /* Hide old elements */
+      .progress-bar { display: none; }
+      .hero-image { display: none; }
+      .hero-pet-badge { display: none; }
       @keyframes float {
         0%, 100% { transform: translateY(0); }
         50% { transform: translateY(-8px); }
@@ -1282,27 +1253,6 @@
         -webkit-text-fill-color: transparent;
         background-clip: text;
       }
-      /* Hero区域的品牌名 - 更大更醒目 */
-      .hero .brand-name {
-        font-size: 48px !important;
-        font-weight: 800 !important;
-        letter-spacing: -1px;
-        background: linear-gradient(
-          135deg,
-          #2f6bff 0%,
-          #06b6d4 25%,
-          #8b5cf6 50%,
-          #06b6d4 75%,
-          #2f6bff 100%
-        );
-        background-size: 200% auto;
-        -webkit-background-clip: text;
-        -webkit-text-fill-color: transparent;
-        background-clip: text;
-        animation: gradientFlow 15s ease-in-out infinite;
-        line-height: 1;
-        margin-right: 8px;
-      }
       .brand-slogan {
         font-size: 15px;
         color: var(--muted);
@@ -2287,14 +2237,14 @@
       .product-display-area.show::before {
         opacity: 1;
       }
-      /* 轮播指示器 */
+      /* 轮播指示器 - 产品区 */
       .carousel-indicators {
         display: flex;
         justify-content: center;
         gap: 8px;
         margin-top: 12px;
       }
-      .carousel-dot {
+      .carousel-indicators .carousel-dot {
         width: 8px;
         height: 8px;
         border-radius: 50%;
@@ -2304,11 +2254,11 @@
         transition: all 0.3s ease;
         padding: 0;
       }
-      .carousel-dot:hover {
+      .carousel-indicators .carousel-dot:hover {
         background: rgba(15, 23, 42, 0.4);
         transform: scale(1.2);
       }
-      .carousel-dot.active {
+      .carousel-indicators .carousel-dot.active {
         background: var(--primary);
         width: 24px;
         border-radius: 4px;
@@ -2760,10 +2710,6 @@
         from { transform: scale(0.95); opacity: 0; }
         to { transform: scale(1); opacity: 1; }
       }
-      .hero {
-        background-size: 200% 200%;
-        animation: gradientFlow 15s ease infinite;
-      }
       /* 滚动显示动画 */
       .scroll-reveal {
         opacity: 0;
@@ -3079,100 +3025,156 @@
     </div>
     <header class="hero snap-section">
       <div class="container hero-inner">
-        <div>
+        <div class="carousel-container">
-          <span class="eyebrow" data-i18n="hero_eyebrow">AIoT 主动式宠物健康管理开创者</span>
+          <div class="carousel-track" id="carouselTrack">
-          <h1><span class="brand-name">Chookoo</span> <span data-i18n="hero_title_suffix">宠科智能科技</span></h1>
+            <!-- Slide 1 - 智能猫厕所 -->
-          <p class="lead" data-i18n="hero_lead">
+            <div class="carousel-slide active" data-type="product">
-            聚焦宠物家庭智能健康管理，打造 AIoT 宠物健康生态，让健康可见、需求可解、宠爱无间。
+              <div class="slide-content product-bg">
-          </p>
+                <div class="slide-product-layout">
-          <div class="hero-tags">
+                  <div class="slide-product-info">
-            <span class="tag" data-i18n="hero_tag_1">宠物健康管理</span>
+                    <span class="eyebrow" data-i18n="carousel_s1_badge">热销产品</span>
-            <span class="tag" data-i18n="hero_tag_2">AIoT 智能硬件</span>
+                    <h2 data-i18n="carousel_s1_title">智能猫厕所 Pro</h2>
-            <span class="tag" data-i18n="hero_tag_3">主动式健康洞察</span>
+                    <p class="desc" data-i18n="carousel_s1_desc">毫米波雷达感知入仓，AI 自动识别排便健康，自动清理解放双手。</p>
-          </div>
+                    <div class="tags">
-        </div>
+                      <span data-i18n="carousel_s1_tag1">自动清理</span>
-        <div class="hero-media">
+                      <span data-i18n="carousel_s1_tag2">健康监测</span>
-          <div class="carousel-container">
+                      <span data-i18n="carousel_s1_tag3">静音运行</span>
-            <div class="carousel-track" id="carouselTrack">
+                    </div>
-              <!-- Slide 1 - 产品 -->
-              <div class="carousel-slide active" data-type="product">
-                <div class="slide-content">
-                  <img class="slide-image main" src="cat.png" alt="智能猫设备" />
-                  <img class="slide-badge badge-1" src="camera(1).jpg" alt="猫咪" onerror="this.style.display='none'" />
-                </div>
-              </div>
-              <!-- Slide 2 - 产品 -->
-              <div class="carousel-slide" data-type="product">
-                <div class="slide-content">
-                  <img class="slide-image main" src="dog.jpeg" alt="智能狗设备" />
-                  <img class="slide-badge badge-2" src="water(1).png" alt="狗狗" onerror="this.style.display='none'" />
-                </div>
-              </div>
-              <!-- Slide 3 - 活动 -->
-              <div class="carousel-slide" data-type="activity">
-                <div class="slide-content activity-bg">
-                  <div class="activity-content">
-                    <span class="activity-badge" data-i18n="carousel_activity_badge_1">限时活动</span>
-                    <h3 class="activity-title" data-i18n="carousel_activity_title_1">618年中大促</h3>
-                    <p class="activity-desc" data-i18n="carousel_activity_desc_1">全场产品低至5折起</p>
-                    <span class="activity-date" data-i18n="carousel_activity_date_1">6月1日 - 6月18日</span>
                   </div>
-                </div>
+                  <div class="slide-product-visual">
-              </div>
+                    <img class="slide-image main" src="cat.png" alt="智能猫设备" />
-              <!-- Slide 4 - 产品 -->
+                    <img class="slide-badge badge-1" src="camera(1).jpg" alt="猫咪" onerror="this.style.display='none'" />
-              <div class="carousel-slide" data-type="product">
+                  </div>
-                <div class="slide-content">
+                </div>
-                  <img class="slide-image main" src="feeder.png" alt="智能喂食器" onerror="this.src='cat.png'" />
+              </div>
-                </div>
+            </div>
-              </div>
+            <!-- Slide 2 - 智能狗厕所 -->
-              <!-- Slide 5 - 公告 -->
+            <div class="carousel-slide" data-type="product">
-              <div class="carousel-slide" data-type="notice">
+              <div class="slide-content product-bg">
-                <div class="slide-content notice-bg">
+                <div class="slide-product-layout">
-                  <div class="notice-content">
+                  <div class="slide-product-info">
-                    <span class="notice-icon">📢</span>
+                    <span class="eyebrow" data-i18n="carousel_s2_badge">新品上市</span>
-                    <h3 class="notice-title" data-i18n="carousel_notice_title">系统升级通知</h3>
+                    <h2 data-i18n="carousel_s2_title">智能狗厕所</h2>
-                    <p class="notice-desc" data-i18n="carousel_notice_desc">App 2.0版本全新上线<br/>新增健康报告、远程控制功能</p>
+                    <p class="desc" data-i18n="carousel_s2_desc">专属犬类设计，活水冲洗除异味，智能感应自动清洁。</p>
+                    <div class="tags">
+                      <span data-i18n="carousel_s2_tag1">犬类专用</span>
+                      <span data-i18n="carousel_s2_tag2">活水冲洗</span>
+                      <span data-i18n="carousel_s2_tag3">除菌除味</span>
+                    </div>
+                  </div>
+                  <div class="slide-product-visual">
+                    <img class="slide-image main" src="dog.jpeg" alt="智能狗设备" />
+                    <img class="slide-badge badge-2" src="water(1).png" alt="狗狗" onerror="this.style.display='none'" />
+                  </div>
+                </div>
+              </div>
+            </div>
+            <!-- Slide 3 - 活动 -->
+            <div class="carousel-slide" data-type="activity">
+              <div class="slide-content activity-bg">
+                <div class="activity-content">
+                  <span class="activity-badge" data-i18n="carousel_activity_badge_1">限时活动</span>
+                  <h3 class="activity-title" data-i18n="carousel_activity_title_1">618年中大促</h3>
+                  <p class="activity-desc" data-i18n="carousel_activity_desc_1">全场产品低至5折起</p>
+                  <span class="activity-date" data-i18n="carousel_activity_date_1">6月1日 - 6月18日</span>
+                </div>
+              </div>
+            </div>
+            <!-- Slide 4 - 智能喂食器 -->
+            <div class="carousel-slide" data-type="product">
+              <div class="slide-content product-bg">
+                <div class="slide-product-layout">
+                  <div class="slide-product-info">
+                    <span class="eyebrow" data-i18n="carousel_s4_badge">明星单品</span>
+                    <h2 data-i18n="carousel_s4_title">智能喂食器</h2>
+                    <p class="desc" data-i18n="carousel_s4_desc">定时定量精准出粮，防潮锁鲜，远程 APP 投喂关爱不断。</p>
+                    <div class="tags">
+                      <span data-i18n="carousel_s4_tag1">定时定量</span>
+                      <span data-i18n="carousel_s4_tag2">防潮锁鲜</span>
+                      <span data-i18n="carousel_s4_tag3">远程投喂</span>
+                    </div>
+                  </div>
+                  <div class="slide-product-visual">
+                    <img class="slide-image main" src="feeder.png" alt="智能喂食器" onerror="this.src='cat.png'" />
+                  </div>
+                </div>
+              </div>
+            </div>
+            <!-- Slide 5 - 公告 -->
+            <div class="carousel-slide" data-type="notice">
+              <div class="slide-content notice-bg">
+                <div class="notice-content">
+                  <span class="notice-icon">📢</span>
+                  <h3 class="notice-title" data-i18n="carousel_notice_title">系统升级通知</h3>
+                  <p class="notice-desc" data-i18n="carousel_notice_desc">App 2.0版本全新上线<br/>新增健康报告、远程控制功能</p>
+                </div>
+              </div>
+            </div>
+            <!-- Slide 6 - 智能饮水机 -->
+            <div class="carousel-slide" data-type="product">
+              <div class="slide-content product-bg">
+                <div class="slide-product-layout">
+                  <div class="slide-product-info">
+                    <span class="eyebrow" data-i18n="carousel_s6_badge">口碑之选</span>
+                    <h2 data-i18n="carousel_s6_title">智能饮水机</h2>
+                    <p class="desc" data-i18n="carousel_s6_desc">多级过滤活水循环，智能提醒换水，让宠物爱上喝水。</p>
+                    <div class="tags">
+                      <span data-i18n="carousel_s6_tag1">活水循环</span>
+                      <span data-i18n="carousel_s6_tag2">多级过滤</span>
+                      <span data-i18n="carousel_s6_tag3">智能提醒</span>
+                    </div>
+                  </div>
+                  <div class="slide-product-visual">
+                    <img class="slide-image main" src="water.png" alt="智能饮水机" />
+                  </div>
+                </div>
+              </div>
+            </div>
+            <!-- Slide 7 - 活动 -->
+            <div class="carousel-slide" data-type="activity">
+              <div class="slide-content activity-bg">
+                <div class="activity-content">
+                  <span class="activity-badge hot">🔥 HOT</span>
+                  <h3 class="activity-title" data-i18n="carousel_activity_title_2">新用户专享</h3>
+                  <p class="activity-desc" data-i18n="carousel_activity_desc_2">首单立减100元</p>
+                  <span class="activity-code" data-i18n="carousel_activity_code">优惠码: NEW100</span>
+                </div>
+              </div>
+            </div>
+            <!-- Slide 8 - AI摄像头 -->
+            <div class="carousel-slide" data-type="product">
+              <div class="slide-content product-bg">
+                <div class="slide-product-layout">
+                  <div class="slide-product-info">
+                    <span class="eyebrow" data-i18n="carousel_s8_badge">AI 新品</span>
+                    <h2 data-i18n="carousel_s8_title">AI 宠物摄像头</h2>
+                    <p class="desc" data-i18n="carousel_s8_desc">1080P 高清夜视，AI 行为识别，双向语音随时互动。</p>
+                    <div class="tags">
+                      <span data-i18n="carousel_s8_tag1">AI 识别</span>
+                      <span data-i18n="carousel_s8_tag2">高清夜视</span>
+                      <span data-i18n="carousel_s8_tag3">双向语音</span>
+                    </div>
+                  </div>
+                  <div class="slide-product-visual">
+                    <img class="slide-image main" src="camera(1).jpg" alt="AI摄像头" onerror="this.src='cat.png'" />
                   </div>
                 </div>
               </div>
-              <!-- Slide 6 - 产品 -->
-              <div class="carousel-slide" data-type="product">
-                <div class="slide-content">
-                  <img class="slide-image main" src="water.png" alt="智能饮水机" />
-                </div>
-              </div>
-              <!-- Slide 7 - 活动 -->
-              <div class="carousel-slide" data-type="activity">
-                <div class="slide-content activity-bg">
-                  <div class="activity-content">
-                    <span class="activity-badge hot">🔥 HOT</span>
-                    <h3 class="activity-title" data-i18n="carousel_activity_title_2">新用户专享</h3>
-                    <p class="activity-desc" data-i18n="carousel_activity_desc_2">首单立减100元</p>
-                    <span class="activity-code" data-i18n="carousel_activity_code">优惠码: NEW100</span>
-                  </div>
-                </div>
-              </div>
-              <!-- Slide 8 - 产品 -->
-              <div class="carousel-slide" data-type="product">
-                <div class="slide-content">
-                  <img class="slide-image main" src="camera(1).jpg" alt="AI摄像头" onerror="this.src='cat.png'" />
-                </div>
-              </div>
             </div>
-            <!-- Navigation Arrows -->
-            <button class="carousel-arrow prev" id="carouselPrev">
-              <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                <path d="M15 18l-6-6 6-6"/>
-              </svg>
-            </button>
-            <button class="carousel-arrow next" id="carouselNext">
-              <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                <path d="M9 18l6-6-6-6"/>
-              </svg>
-            </button>
-            <!-- Dots -->
-            <div class="carousel-dots" id="carouselDots"></div>
           </div>
+          <!-- Navigation Arrows -->
+          <button class="carousel-arrow prev" id="carouselPrev">
+            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+              <path d="M15 18l-6-6 6-6"/>
+            </svg>
+          </button>
+          <button class="carousel-arrow next" id="carouselNext">
+            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+              <path d="M9 18l6-6-6-6"/>
+            </svg>
+          </button>
+          <!-- Dots -->
+          <div class="carousel-dots" id="carouselDots"></div>
         </div>
       </div>
     </header>
@@ -3843,6 +3845,11 @@
             hero_tag_3: "主动式健康洞察",
             hero_glass_line1: "让每一份宠爱",
             hero_glass_line2: "都有<span class='highlight-word'>科学</span>回响",
+            carousel_s1_badge: "热销产品", carousel_s1_title: "智能猫厕所 Pro", carousel_s1_desc: "毫米波雷达感知入仓，AI 自动识别排便健康，自动清理解放双手。", carousel_s1_tag1: "自动清理", carousel_s1_tag2: "健康监测", carousel_s1_tag3: "静音运行",
+            carousel_s2_badge: "新品上市", carousel_s2_title: "智能狗厕所", carousel_s2_desc: "专属犬类设计，活水冲洗除异味，智能感应自动清洁。", carousel_s2_tag1: "犬类专用", carousel_s2_tag2: "活水冲洗", carousel_s2_tag3: "除菌除味",
+            carousel_s4_badge: "明星单品", carousel_s4_title: "智能喂食器", carousel_s4_desc: "定时定量精准出粮，防潮锁鲜，远程 APP 投喂关爱不断。", carousel_s4_tag1: "定时定量", carousel_s4_tag2: "防潮锁鲜", carousel_s4_tag3: "远程投喂",
+            carousel_s6_badge: "口碑之选", carousel_s6_title: "智能饮水机", carousel_s6_desc: "多级过滤活水循环，智能提醒换水，让宠物爱上喝水。", carousel_s6_tag1: "活水循环", carousel_s6_tag2: "多级过滤", carousel_s6_tag3: "智能提醒",
+            carousel_s8_badge: "AI 新品", carousel_s8_title: "AI 宠物摄像头", carousel_s8_desc: "1080P 高清夜视，AI 行为识别，双向语音随时互动。", carousel_s8_tag1: "AI 识别", carousel_s8_tag2: "高清夜视", carousel_s8_tag3: "双向语音",
             section_company_label: "公司介绍",
             section_company_title: "AIoT 主动式宠物健康管理开创者",
             section_company_p1: "宠科（Chookoo）成立于中国苏州，立足智慧健康管理领域，是一家专注于构建预防式健康生态的科技企业。",
@@ -4054,6 +4061,11 @@
             hero_tag_3: "Proactive Health Insights",
             hero_glass_line1: "Let every act of care",
             hero_glass_line2: "be supported by <span class='highlight-word'>science</span>",
+            carousel_s1_badge: "Best Seller", carousel_s1_title: "Smart Cat Litter Box Pro", carousel_s1_desc: "Millimeter-wave radar detects entry, AI analyzes waste health, auto-cleaning frees your hands.", carousel_s1_tag1: "Auto Clean", carousel_s1_tag2: "Health Monitor", carousel_s1_tag3: "Silent Mode",
+            carousel_s2_badge: "New Arrival", carousel_s2_title: "Smart Dog Toilet", carousel_s2_desc: "Designed for dogs, running water wash & deodorize, smart sensor auto-clean.", carousel_s2_tag1: "Dog-Specific", carousel_s2_tag2: "Water Wash", carousel_s2_tag3: "Odor Control",
+            carousel_s4_badge: "Top Pick", carousel_s4_title: "Smart Feeder", carousel_s4_desc: "Precise timed portions, moisture-proof freshness lock, remote APP feeding anywhere.", carousel_s4_tag1: "Precise Portions", carousel_s4_tag2: "Fresh Lock", carousel_s4_tag3: "Remote Feed",
+            carousel_s6_badge: "Customer Favorite", carousel_s6_title: "Smart Fountain", carousel_s6_desc: "Multi-stage filtration with circulating water, smart refill reminders so pets love to drink.", carousel_s6_tag1: "Circulation", carousel_s6_tag2: "Multi-Filter", carousel_s6_tag3: "Smart Remind",
+            carousel_s8_badge: "AI New", carousel_s8_title: "AI Pet Camera", carousel_s8_desc: "1080P HD night vision, AI behavior recognition, two-way voice interaction anytime.", carousel_s8_tag1: "AI Recognition", carousel_s8_tag2: "HD Night Vision", carousel_s8_tag3: "Two-way Voice",
             section_company_label: "Company",
             section_company_title: "AIoT Pioneer in Proactive Pet Health Management",
             section_company_p1: "Chookoo was founded in Suzhou, China, and focuses on smart health management as a technology company dedicated to building a preventive health ecosystem.",
@@ -4265,6 +4277,11 @@
             hero_tag_3: "能動的ヘルスインサイト",
             hero_glass_line1: "すべての愛に",
             hero_glass_line2: "<span class='highlight-word'>科学</span>のこたえを",
+            carousel_s1_badge: "売れ筋", carousel_s1_title: "スマート猫トイレ Pro", carousel_s1_desc: "ミリ波レーダーで入室検知、AI が排泄健康を自動分析、自動お掃除で手間ゼロ。", carousel_s1_tag1: "自動お掃除", carousel_s1_tag2: "健康モニター", carousel_s1_tag3: "静音設計",
+            carousel_s2_badge: "新発売", carousel_s2_title: "スマート犬トイレ", carousel_s2_desc: "犬専用設計、流水洗浄で消臭、スマートセンサー自動清掃。", carousel_s2_tag1: "犬専用", carousel_s2_tag2: "流水洗浄", carousel_s2_tag3: "消臭除菌",
+            carousel_s4_badge: "人気No.1", carousel_s4_title: "スマート給餌器", carousel_s4_desc: "タイマーで正確な量を給餌、防湿鮮度ロック、アプリで遠隔給餌。", carousel_s4_tag1: "定量給餌", carousel_s4_tag2: "鮮度ロック", carousel_s4_tag3: "遠隔給餌",
+            carousel_s6_badge: "口コミ人気", carousel_s6_title: "スマート飲水機", carousel_s6_desc: "多段ろ過循環水、スマート交換リマインダーでペットが喜んで飲む。", carousel_s6_tag1: "循環水", carousel_s6_tag2: "多段ろ過", carousel_s6_tag3: "交換リマインド",
+            carousel_s8_badge: "AI新商品", carousel_s8_title: "AIペットカメラ", carousel_s8_desc: "1080P高画質暗視、AI 行動認識、双方向音声でいつでもコミュニケーション。", carousel_s8_tag1: "AI認識", carousel_s8_tag2: "暗視カメラ", carousel_s8_tag3: "双方向音声",
             section_company_label: "会社紹介",
             section_company_title: "AIoT 主動型ペット健康管理のパイオニア",
             section_company_p1: "Chookoo は中国・蘇州で設立され、スマート健康管理分野に立脚し、予防型健康エコシステムの構築に特化したテクノロジー企業です。",
@@ -4331,6 +4348,11 @@
             hero_tag_3: "Insights proactifs",
             hero_glass_line1: "Chaque acte d’amour",
             hero_glass_line2: "mérite un écho <span class='highlight-word'>scientifique</span>",
+            carousel_s1_badge: "Best-seller", carousel_s1_title: "Litière Smart Chat Pro", carousel_s1_desc: "Radar millimétrique, analyse IA des selles, nettoyage automatique.", carousel_s1_tag1: "Auto-nettoyage", carousel_s1_tag2: "Santé", carousel_s1_tag3: "Silencieux",
+            carousel_s2_badge: "Nouveau", carousel_s2_title: "Toilette Smart Chien", carousel_s2_desc: "Conception canine, lavage à eau courante, nettoyage auto intelligent.", carousel_s2_tag1: "Pour chiens", carousel_s2_tag2: "Eau courante", carousel_s2_tag3: "Anti-odeur",
+            carousel_s4_badge: "Top vente", carousel_s4_title: "Distributeur Smart", carousel_s4_desc: "Portions précises, fraîcheur conservée, nourrissage à distance via APP.", carousel_s4_tag1: "Portions exactes", carousel_s4_tag2: "Fraîcheur", carousel_s4_tag3: "À distance",
+            carousel_s6_badge: "Préféré", carousel_s6_title: "Fontaine Smart", carousel_s6_desc: "Filtration multi-étapes, eau circulante, rappels intelligents.", carousel_s6_tag1: "Circulation", carousel_s6_tag2: "Multi-filtre", carousel_s6_tag3: "Rappel",
+            carousel_s8_badge: "IA Nouveau", carousel_s8_title: "Caméra IA Pet", carousel_s8_desc: "1080P vision nocturne, reconnaissance IA, audio bidirectionnel.", carousel_s8_tag1: "Reconnaissance IA", carousel_s8_tag2: "Vision nocturne", carousel_s8_tag3: "Audio双向",
             section_company_label: "Entreprise",
             section_company_title: "Pionnier AIoT de la santé animale proactive",
             section_company_p1: "Fondée à Suzhou (Chine), Chookoo est une entreprise technologique dédiée à la construction d’un écosystème de santé préventive.",
@@ -4397,6 +4419,11 @@
             hero_tag_3: "Proaktive Erkenntnisse",
             hero_glass_line1: "Jede Fürsorge verdient",
             hero_glass_line2: "ein <span class='highlight-word'>wissenschaftliches</span> Echo",
+            carousel_s1_badge: "Bestseller", carousel_s1_title: "Smart Katzenklo Pro", carousel_s1_desc: "Millimeterwellen-Radar, KI-Kotanalyse, automatische Reinigung.", carousel_s1_tag1: "Auto-Reinigung", carousel_s1_tag2: "Gesundheit", carousel_s1_tag3: "Leise",
+            carousel_s2_badge: "Neu", carousel_s2_title: "Smart Hundetoilette", carousel_s2_desc: "Hundespezifisches Design, fließendes Wasser, intelligente Reinigung.", carousel_s2_tag1: "Für Hunde", carousel_s2_tag2: "Wasserspülung", carousel_s2_tag3: "Geruchskontrolle",
+            carousel_s4_badge: "Beliebt", carousel_s4_title: "Smart Futterautomat", carousel_s4_desc: "Präzise Portionierung, Frischhaltung, APP-Steuerung aus der Ferne.", carousel_s4_tag1: "Präzise Portionen", carousel_s4_tag2: "Frischhaltung", carousel_s4_tag3: "Fernfütterung",
+            carousel_s6_badge: "Kundenliebling", carousel_s6_title: "Smart Trinkbrunnen", carousel_s6_desc: "Mehrstufige Filterung, zirkulierendes Wasser, intelligente Erinnerung.", carousel_s6_tag1: "Zirkulation", carousel_s6_tag2: "Multifilter", carousel_s6_tag3: "Erinnerung",
+            carousel_s8_badge: "KI Neu", carousel_s8_title: "KI Pet Kamera", carousel_s8_desc: "1080P Nachtsicht, KI-Verhalten, Zwei-Wege-Audio.", carousel_s8_tag1: "KI-Erkennung", carousel_s8_tag2: "Nachtsicht", carousel_s8_tag3: "2-Wege-Audio",
             section_company_label: "Unternehmen",
             section_company_title: "AIoT-Pionier für proaktives Haustier-Gesundheitsmanagement",
             section_company_p1: "Chookoo wurde in Suzhou (China) gegründet und ist ein Technologieunternehmen, das ein präventives Gesundheitsökosystem aufbaut.",
@@ -4463,6 +4490,11 @@
             hero_tag_3: "Проактивные инсайты",
             hero_glass_line1: "Каждой заботе —",
             hero_glass_line2: "<span class='highlight-word'>научный</span> отклик",
+            carousel_s1_badge: "Бестселлер", carousel_s1_title: "Умный кошачий туалет Pro", carousel_s1_desc: "Миллиметровый радар, ИИ-анализ, автоматическая уборка.", carousel_s1_tag1: "Автоуборка", carousel_s1_tag2: "Здоровье", carousel_s1_tag3: "Тихий",
+            carousel_s2_badge: "Новинка", carousel_s2_title: "Умный туалет для собак", carousel_s2_desc: "Для собак, проточная вода, умная автоуборка.", carousel_s2_tag1: "Для собак", carousel_s2_tag2: "Проточная вода", carousel_s2_tag3: "Без запаха",
+            carousel_s4_badge: "Хит", carousel_s4_title: "Умная кормушка", carousel_s4_desc: "Точное дозирование, защита от влаги, удалённая кормление через APP.", carousel_s4_tag1: "Дозирование", carousel_s4_tag2: "Свежесть", carousel_s4_tag3: "Дистанционно",
+            carousel_s6_badge: "Выбор клиентов", carousel_s6_title: "Умный фонтан", carousel_s6_desc: "Многоступенчатая фильтрация, циркуляция воды, умные напоминания.", carousel_s6_tag1: "Циркуляция", carousel_s6_tag2: "Мультифильтр", carousel_s6_tag3: "Напоминания",
+            carousel_s8_badge: "ИИ Новинка", carousel_s8_title: "ИИ Камера для питомцев", carousel_s8_desc: "1080P ночное видение, ИИ-поведение, двусторонняя аудиосвязь.", carousel_s8_tag1: "ИИ-анализ", carousel_s8_tag2: "Ночное видение", carousel_s8_tag3: "Двусторонняя связь",
             section_company_label: "О компании",
             section_company_title: "Пионер AIoT в проактивном управлении здоровьем питомцев",
             section_company_p1: "Chookoo основана в Сучжоу (Китай) и специализируется на создании превентивной экосистемы здоровья.",
@@ -4529,6 +4561,11 @@
             hero_tag_3: "رؤى صحية استباقية",
             hero_glass_line1: "لكل عناية",
             hero_glass_line2: "صدى <span class='highlight-word'>علمي</span>",
+            carousel_s1_badge: "الأكثر مبيعاً", carousel_s1_title: "مرحاض القطط الذكي Pro", carousel_s1_desc: "رادار ملي متري، تحليل ذكي للفضلات، تنظيف تلقائي.", carousel_s1_tag1: "تنظيف تلقائي", carousel_s1_tag2: "مراقبة صحية", carousel_s1_tag3: "صامت",
+            carousel_s2_badge: "جديد", carousel_s2_title: "مرحاض الكلاب الذكي", carousel_s2_desc: "تصميم مخصص للكلاب، غسيل بالماء الجاري، تنظيف ذكي.", carousel_s2_tag1: "للكلاب", carousel_s2_tag2: "ماء جاري", carousel_s2_tag3: "إزالة الروائح",
+            carousel_s4_badge: "الأكثر طلباً", carousel_s4_title: "الموزع الذكي", carousel_s4_desc: "كميات دقيقة، حماية من الرطوبة، إطعام عن بعد.", carousel_s4_tag1: "كميات دقيقة", carousel_s4_tag2: "طازج", carousel_s4_tag3: "عن بعد",
+            carousel_s6_badge: "مفضل", carousel_s6_title: "النافورة الذكية", carousel_s6_desc: "ترشيح متعدد المراحل، ماء متدفق، تذكيرات ذكية.", carousel_s6_tag1: "تدفق", carousel_s6_tag2: "ترشيح", carousel_s6_tag3: "تذكير",
+            carousel_s8_badge: "ذكاء اصطناعي", carousel_s8_title: "كاميرا AI للحيوانات", carousel_s8_desc: "رؤية ليلية 1080P، التعرف بالذكاء الاصطناعي، صوت ثنائي.", carousel_s8_tag1: "التعرف AI", carousel_s8_tag2: "رؤية ليلية", carousel_s8_tag3: "صوت ثنائي",
             section_company_label: "عن الشركة",
             section_company_title: "رائد إدارة صحة الحيوانات الأليفة الاستباقية عبر AIoT",
             section_company_p1: "تأسست Chookoo في سوتشو بالصين، وتركّز على إدارة الصحة الذكية، وهي شركة تقنية مكرسة لبناء منظومة صحة وقائية.",
@@ -4754,29 +4791,6 @@
           }
         });
 
-        // 鼠标跟随效果（仅用于hero区域）
-        const heroMedia = document.querySelector('.hero-media');
-        if (heroMedia) {
-          heroMedia.addEventListener('mousemove', (e) => {
-            const rect = heroMedia.getBoundingClientRect();
-            const x = (e.clientX - rect.left - rect.width / 2) / 25;
-            const y = (e.clientY - rect.top - rect.height / 2) / 25;
-
-            const heroImages = heroMedia.querySelectorAll('.hero-image');
-            heroImages.forEach((img, index) => {
-              const factor = index === 0 ? 1 : -1;
-              img.style.transform = `translateY(${y * factor}px) translateX(${x * factor}px)`;
-            });
-          });
-
-          heroMedia.addEventListener('mouseleave', () => {
-            const heroImages = heroMedia.querySelectorAll('.hero-image');
-            heroImages.forEach(img => {
-              img.style.transform = '';
-            });
-          });
-        }
-
         // 产品卡片交互：固定展示区方案 + 自动轮播
         const productCards = document.querySelectorAll('.product-card[data-product]');
         const displayArea = document.getElementById('productDisplayArea');