.elementor-67 .elementor-element.elementor-element-41337ad2{--display:flex;--min-height:80px;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:center;--gap:24px 24px;--row-gap:24px;--column-gap:24px;border-style:solid;--border-style:solid;border-width:0px 0px 1px 0px;--border-top-width:0px;--border-right-width:0px;--border-bottom-width:1px;--border-left-width:0px;border-color:var( --e-global-color-primary );--border-color:var( --e-global-color-primary );--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:24px;--padding-right:24px;--z-index:99;}.elementor-67 .elementor-element.elementor-element-41337ad2:not(.elementor-motion-effects-element-type-background), .elementor-67 .elementor-element.elementor-element-41337ad2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-background );}.elementor-widget-theme-site-logo .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );}.elementor-67 .elementor-element.elementor-element-2701312d img{width:80px;}.elementor-67 .elementor-element.elementor-element-4b3446d8{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-end;--gap:24px 24px;--row-gap:24px;--column-gap:24px;}.elementor-widget-mega-menu > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title, .elementor-widget-mega-menu > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title > .e-n-menu-title-container, .elementor-widget-mega-menu > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title > .e-n-menu-title-container > span{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );--n-menu-title-line-height:var( --e-global-typography-accent-line-height );}.elementor-widget-mega-menu{--n-menu-title-font-size:var( --e-global-typography-accent-font-size );--n-menu-divider-color:var( --e-global-color-text );}.elementor-67 .elementor-element.elementor-element-c78d05c{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-67 .elementor-element.elementor-element-c78d05c.e-con{--flex-grow:1;--flex-shrink:0;}.elementor-67 .elementor-element.elementor-element-cf15c1c{--display:flex;}.elementor-67 .elementor-element.elementor-element-81d2cc7{--display:flex;}.elementor-67 .elementor-element.elementor-element-2d990c6{--display:flex;}.elementor-67 .elementor-element.elementor-element-eb7ae33{--display:flex;}.elementor-67 .elementor-element.elementor-element-1cb8186{--display:flex;}.elementor-67 .elementor-element.elementor-element-b0fe044{--n-menu-dropdown-content-max-width:initial;--n-menu-heading-justify-content:center;--n-menu-title-flex-grow:initial;--n-menu-title-justify-content:initial;--n-menu-title-justify-content-mobile:center;--n-menu-heading-wrap:wrap;--n-menu-heading-overflow-x:initial;--n-menu-title-distance-from-content:0px;--n-menu-toggle-icon-wrapper-animation-duration:500ms;--n-menu-title-space-between:0px;--n-menu-title-transition:300ms;--n-menu-icon-size:16px;--n-menu-dropdown-indicator-size:11px;--n-menu-dropdown-indicator-rotate:rotate(360deg);--n-menu-toggle-icon-size:20px;--n-menu-toggle-icon-hover-duration:500ms;--n-menu-toggle-icon-distance-from-dropdown:0px;}:where( .elementor-67 .elementor-element.elementor-element-b0fe044 > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-content ) > .e-con{background-color:#823B7700;}.elementor-67 .elementor-element.elementor-element-b0fe044.elementor-element{--align-self:center;}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__toggle .elementor-button{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-name a{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-price{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__footer-buttons .elementor-button{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__footer-buttons a.elementor-button--view-cart{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__footer-buttons a.elementor-button--checkout{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-menu-cart .woocommerce-mini-cart__empty-message{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );}.elementor-67 .elementor-element.elementor-element-c253407{--divider-style:solid;--subtotal-divider-style:solid;--elementor-remove-from-cart-button:none;--remove-from-cart-button:block;--toggle-button-border-width:0px;--cart-border-style:none;--cart-footer-layout:1fr 1fr;--products-max-height-sidecart:calc(100vh - 240px);--products-max-height-minicart:calc(100vh - 385px);}.elementor-67 .elementor-element.elementor-element-c253407 .widget_shopping_cart_content{--subtotal-divider-left-width:0;--subtotal-divider-right-width:0;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(min-width:768px){.elementor-67 .elementor-element.elementor-element-41337ad2{--content-width:1280px;}.elementor-67 .elementor-element.elementor-element-c78d05c{--content-width:100%;}}@media(max-width:1024px) and (min-width:768px){.elementor-67 .elementor-element.elementor-element-4b3446d8{--width:28%;}}@media(max-width:1024px){.elementor-67 .elementor-element.elementor-element-41337ad2{--padding-top:0px;--padding-bottom:0px;--padding-left:24px;--padding-right:24px;}.elementor-widget-theme-site-logo .widget-image-caption{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-67 .elementor-element.elementor-element-2701312d{padding:0px 0px 0px 0px;text-align:left;}.elementor-67 .elementor-element.elementor-element-2701312d img{width:80px;}.elementor-67 .elementor-element.elementor-element-4b3446d8{--gap:8px 8px;--row-gap:8px;--column-gap:8px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-mega-menu{--n-menu-title-font-size:var( --e-global-typography-accent-font-size );}.elementor-widget-mega-menu > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title, .elementor-widget-mega-menu > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title > .e-n-menu-title-container, .elementor-widget-mega-menu > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title > .e-n-menu-title-container > span{--n-menu-title-line-height:var( --e-global-typography-accent-line-height );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__toggle .elementor-button{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-name a{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-price{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__footer-buttons .elementor-button{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__footer-buttons a.elementor-button--view-cart{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__footer-buttons a.elementor-button--checkout{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-woocommerce-menu-cart .woocommerce-mini-cart__empty-message{font-size:var( --e-global-typography-primary-font-size );}}@media(max-width:767px){.elementor-67 .elementor-element.elementor-element-41337ad2{--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:8px 8px;--row-gap:8px;--column-gap:8px;--flex-wrap:nowrap;--padding-top:0px;--padding-bottom:0px;--padding-left:24px;--padding-right:24px;}.elementor-widget-theme-site-logo .widget-image-caption{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-67 .elementor-element.elementor-element-2701312d{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-67 .elementor-element.elementor-element-2701312d img{width:80px;}.elementor-67 .elementor-element.elementor-element-4b3446d8{--width:60%;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-end;--flex-wrap:nowrap;}.elementor-widget-mega-menu{--n-menu-title-font-size:var( --e-global-typography-accent-font-size );}.elementor-widget-mega-menu > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title, .elementor-widget-mega-menu > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title > .e-n-menu-title-container, .elementor-widget-mega-menu > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title > .e-n-menu-title-container > span{--n-menu-title-line-height:var( --e-global-typography-accent-line-height );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__toggle .elementor-button{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-name a{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-price{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__footer-buttons .elementor-button{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__footer-buttons a.elementor-button--view-cart{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__footer-buttons a.elementor-button--checkout{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-woocommerce-menu-cart .woocommerce-mini-cart__empty-message{font-size:var( --e-global-typography-primary-font-size );}}/* Start custom CSS for html, class: .elementor-element-d1f82cd */:root {
    --cmm-bg-body: #f9fafb;
    --cmm-bg-white: #ffffff;
    --cmm-text-head: #1f2937;
    --cmm-text-body: #4b5563;
    --cmm-text-light: #9ca3af;
    --cmm-blue-50: #eff6ff;
    --cmm-blue-600: #2563eb;
    --cmm-blue-700: #1d4ed8;
    --cmm-red: #dc2626;
    --cmm-border: #e5e7eb;
    --cmm-radius-xl: 12px;
    --cmm-radius-lg: 8px;
    --cmm-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  }

  /* * .cmm-menu-instance 容器
   */
  .cmm-menu-instance {
    box-sizing: border-box;
    width: 100%;
    /* 容器本身占满父级，依靠内部 card 控制视觉宽度 */
    padding: 10px !important; 
    background: transparent; 
    display: flex;
    justify-content: center;
    align-items: flex-start;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    position: relative;
    z-index: 999; 

    /* CSS Nesting */
    & * { box-sizing: border-box !important; }
    ul, li { list-style: none !important; margin: 0 !important; padding: 0 !important; }
    a { text-decoration: none !important; color: inherit; }

    /* 卡片主体 */
    .cmm-card {
      background: var(--cmm-bg-white);
      
      /* [核心修改] 宽度策略调整 */
      /* 1. 移动端默认 100% */
      width: 100%;
      
      border-radius: var(--cmm-radius-xl);
      box-shadow: var(--cmm-shadow-xl);
      border: 1px solid var(--cmm-border);
      overflow: hidden;
      display: flex;
      flex-direction: column;
      
      /* 高度控制：适应 8 个菜单项的高度 */
      min-height: 380px; 

      @media (min-width: 768px) {
        flex-direction: row;
        
        /* [核心修改] 桌面端强制固定宽度，防止跳动 */
        width: 1080px !important; 
        /* 保护措施：如果屏幕比 1080px 小，则不超过屏幕宽度的 95% */
        max-width: 95vw !important;
      }
    }

    /* 左侧导航栏 */
    .cmm-nav-col {
      width: 100%;
      background: var(--cmm-bg-white);
      display: flex;
      flex-direction: column;
      border-bottom: 1px solid var(--cmm-border);
      flex-shrink: 0; /* 防止被挤压 */

      @media (min-width: 768px) {
        /* 固定宽度 */
        width: 280px; 
        border-bottom: none;
        border-right: 1px solid var(--cmm-border);
      }
    }

    /* 导航标题 */
    .cmm-nav-header {
      padding: 14px 20px !important;
      background: #f8fafc;
      border-bottom: 1px solid var(--cmm-border);
      margin: 0 !important;

      h2 {
        font-size: 13px !important;
        font-weight: 700 !important;
        color: var(--cmm-text-head);
        text-transform: uppercase;
        letter-spacing: 0.05em;
        margin: 0 !important;
        padding: 0 !important;
      }
    }

    .cmm-nav-list {
      display: flex;
      flex-direction: column;
      padding: 6px 0 !important;
    }

    .cmm-nav-item {
      position: relative;
      margin: 0 !important;

      &.active .cmm-nav-btn {
        background-color: var(--cmm-blue-50) !important;
        color: var(--cmm-blue-700) !important;
        font-weight: 600 !important;
      }
      &.active .cmm-icon-arrow {
        opacity: 1;
        color: var(--cmm-blue-700);
      }
    }

    /* 按钮样式 - 更加紧凑 */
    .cmm-nav-btn {
      width: 100% !important;
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      padding: 12px 20px !important; /* 减少高度 */
      border: none !important;
      background: transparent !important;
      cursor: pointer !important;
      font-size: 15px !important;
      font-weight: 400 !important;
      color: var(--cmm-text-body) !important;
      transition: all 0.2s !important;
      text-align: left !important;

      &:hover {
        background-color: #f9fafb !important;
        color: #111827 !important;
      }
    }

    .cmm-icon-arrow {
      width: 14px;
      height: 14px;
      opacity: 0.4;
      transition: transform 0.3s;
      flex-shrink: 0; 
      @media (max-width: 767px) {
        .active & { transform: rotate(90deg); }
      }
    }

    /* 右侧内容区 */
    .cmm-content-col {
      display: none;
      /* [核心修改] flex: 1 确保填满剩余宽度 */
      flex: 1; 
      /* [改动] 减少内边距 */
      padding: 20px 24px !important; 
      background: var(--cmm-bg-white);
      position: relative;
      flex-direction: column;
      /* 确保内容垂直分布 */
      justify-content: flex-start;

      @media (min-width: 768px) {
        display: flex;
      }
    }

    /* 面板 */
    .cmm-panel {
      display: none;
      width: 100%;
      height: 100%;
      flex-direction: column;
      animation: cmmFadeIn 0.3s ease-out forwards;
      &.active { display: flex; }
    }

    @keyframes cmmFadeIn {
      from { opacity: 0; transform: translateY(2px); }
      to { opacity: 1; transform: translateY(0); }
    }

    .cmm-panel-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 16px !important; /* 减少间距 */
    }

    .cmm-panel-title {
      font-size: 20px !important; /* 稍微减小字号 */
      font-weight: 700 !important;
      color: var(--cmm-text-head);
      margin: 0 !important;
    }

    .cmm-link-all {
      font-size: 13px !important;
      font-weight: 500 !important;
      color: var(--cmm-blue-600) !important;
      display: flex;
      align-items: center;
      gap: 4px;
    }

    /* * [重构] 轮播容器 - 横向布局版
     */
    .cmm-carousel-container {
      /* [核心修改] flex: 1 允许其填充内容区域的高度，但由于卡片限高，这里也需要配合 */
      flex: 0 0 auto;
      width: 100%;
      /* [改动] 允许占满宽度 */
      max-width: 100%; 
      height: 220px; /* 固定高度，确保紧凑 */
      margin: 0 !important;
      position: relative;
      border-radius: var(--cmm-radius-lg);
      background: #fff;
      border: 1px solid var(--cmm-border);
      overflow: hidden;

      /* 桌面端悬停显示箭头 */
      @media (min-width: 768px) {
        &:hover .cmm-ctrl-btn { opacity: 1; }
      }
    }

    .cmm-slide {
      display: none;
      width: 100%;
      height: 100%;
      position: relative;
      text-decoration: none;
      
      /* [改动] 关键布局：横向排列 (Left Image, Right Content) */
      &.active {
        display: flex;
        flex-direction: row; 
        animation: cmmFadeIn 0.4s ease-in-out;
      }
    }

    .cmm-img-wrapper {
      position: relative;
      /* [改动] 图片占据左侧 40% */
      width: 40%; 
      height: 100%;
      overflow: hidden;
      flex-shrink: 0;
    }

    .cmm-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.7s;
      display: block; 
    }

    .cmm-carousel-container:hover .cmm-img {
      transform: scale(1.05);
    }

    .cmm-badge {
      position: absolute;
      top: 10px;
      left: 10px;
      background: var(--cmm-red);
      color: #fff;
      font-size: 11px !important;
      font-weight: 700 !important;
      padding: 4px 10px !important;
      border-radius: 4px;
      z-index: 20;
      display: flex;
      align-items: center;
      gap: 4px;
      line-height: 1;
      box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    }
    
    .cmm-badge svg { width: 11px; height: 11px; flex-shrink: 0; }

    .cmm-info-box {
      /* [改动] 内容占据右侧 60% */
      width: 60%;
      padding: 20px 24px !important;
      background: #fff;
      display: flex;
      flex-direction: column;
      justify-content: center; /* 垂直居中 */
      position: relative;
    }

    .cmm-prod-title {
      font-size: 18px !important;
      font-weight: 700 !important;
      color: var(--cmm-text-head);
      margin: 0 0 6px 0 !important;
      line-height: 1.3 !important;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    .cmm-prod-sub {
      font-size: 13px !important;
      color: var(--cmm-text-body);
      margin: 0 0 16px 0 !important;
    }

    .cmm-price-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 0 !important; /* 不需要 auto margin */
    }

    .cmm-price {
      font-size: 22px !important;
      font-weight: 700 !important;
      color: #111827;
    }

    .cmm-btn-cart {
      background: #111827 !important;
      color: #fff !important;
      width: 38px !important;
      height: 38px !important;
      padding: 0 !important;
      border-radius: 50% !important;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background-color 0.2s;
      border: none !important;
      &:hover { background: #374151 !important; }
    }

    /* 轮播控制 */
    .cmm-ctrl-btn {
      position: absolute;
      /* [改动] 居中位置调整 */
      top: 50%;
      transform: translateY(-50%);
      background: rgba(255, 255, 255, 0.9) !important;
      color: #1f2937 !important;
      width: 32px !important;
      height: 32px !important;
      border-radius: 50% !important;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 2px 5px rgba(0,0,0,0.1);
      z-index: 30;
      opacity: 0;
      transition: opacity 0.3s;
      border: none !important;
    }

    .cmm-prev { left: 10px; }
    .cmm-next { left: auto; right: 10px; /* 控制只在图片区域？不，全屏 */ }
    /* 让右侧按钮位于整个容器的右侧，或者只在图片上？通常全容器方便 */
    
    /* Dots */
    .cmm-dots {
      position: absolute;
      bottom: 12px;
      left: 20%; /* 位于图片区域中心附近 */
      transform: translateX(-50%);
      display: flex;
      gap: 6px;
      z-index: 30;
    }

    .cmm-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: rgba(255,255,255,0.6);
      transition: all 0.3s;
      cursor: pointer;
      &.active { background: #fff; width: 16px; border-radius: 99px; }
    }

    /* Footer */
    .cmm-footer {
      margin-top: auto; /* [核心修改] 让Footer自动沉底，填充剩余空间 */
      padding-top: 12px !important;
      border-top: 1px solid var(--cmm-border);
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }

    .cmm-footer-item {
      font-size: 11px !important;
      color: var(--cmm-text-light);
      margin: 0 !important;
    }

    .cmm-footer-label {
      font-weight: 600 !important;
      color: var(--cmm-text-body);
      margin-bottom: 2px !important;
      display: block;
      font-size: 12px !important;
    }

    /* Mobile Content */
    .cmm-mobile-content {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.3s ease-out;
      background: #f9fafb;
      border-bottom: 1px solid transparent;
      @media (min-width: 768px) { display: none !important; }
    }

    .active .cmm-mobile-content { border-color: var(--cmm-border); }

    .cmm-mobile-inner {
      padding: 16px !important;
      max-width: 320px;
      margin: 0 auto;
      /* Mobile override: Reset carousel to vertical for phone */
      .cmm-carousel-container { height: auto; max-width: 300px; }
      .cmm-slide.active { flex-direction: column; }
      .cmm-img-wrapper { width: 100%; height: 200px; }
      .cmm-info-box { width: 100%; padding: 16px !important; }
      .cmm-dots { left: 50%; bottom: 130px; } /* Adjust for mobile */
    }
  }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d1f82cd */:root {
    --cmm-bg-body: #f9fafb;
    --cmm-bg-white: #ffffff;
    --cmm-text-head: #1f2937;
    --cmm-text-body: #4b5563;
    --cmm-text-light: #9ca3af;
    --cmm-blue-50: #eff6ff;
    --cmm-blue-600: #2563eb;
    --cmm-blue-700: #1d4ed8;
    --cmm-red: #dc2626;
    --cmm-border: #e5e7eb;
    --cmm-radius-xl: 12px;
    --cmm-radius-lg: 8px;
    --cmm-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  }

  /* * .cmm-menu-instance 容器
   */
  .cmm-menu-instance {
    box-sizing: border-box;
    width: 100%;
    /* 容器本身占满父级，依靠内部 card 控制视觉宽度 */
    padding: 10px !important; 
    background: transparent; 
    display: flex;
    justify-content: center;
    align-items: flex-start;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    position: relative;
    z-index: 999; 

    /* CSS Nesting */
    & * { box-sizing: border-box !important; }
    ul, li { list-style: none !important; margin: 0 !important; padding: 0 !important; }
    a { text-decoration: none !important; color: inherit; }

    /* 卡片主体 */
    .cmm-card {
      background: var(--cmm-bg-white);
      
      /* [核心修改] 宽度策略调整 */
      /* 1. 移动端默认 100% */
      width: 100%;
      
      border-radius: var(--cmm-radius-xl);
      box-shadow: var(--cmm-shadow-xl);
      border: 1px solid var(--cmm-border);
      overflow: hidden;
      display: flex;
      flex-direction: column;
      
      /* 高度控制：适应 8 个菜单项的高度 */
      min-height: 380px; 

      @media (min-width: 768px) {
        flex-direction: row;
        
        /* [核心修改] 桌面端强制固定宽度，防止跳动 */
        width: 1080px !important; 
        /* 保护措施：如果屏幕比 1080px 小，则不超过屏幕宽度的 95% */
        max-width: 95vw !important;
      }
    }

    /* 左侧导航栏 */
    .cmm-nav-col {
      width: 100%;
      background: var(--cmm-bg-white);
      display: flex;
      flex-direction: column;
      border-bottom: 1px solid var(--cmm-border);
      flex-shrink: 0; /* 防止被挤压 */

      @media (min-width: 768px) {
        /* 固定宽度 */
        width: 280px; 
        border-bottom: none;
        border-right: 1px solid var(--cmm-border);
      }
    }

    /* 导航标题 */
    .cmm-nav-header {
      padding: 14px 20px !important;
      background: #f8fafc;
      border-bottom: 1px solid var(--cmm-border);
      margin: 0 !important;

      h2 {
        font-size: 13px !important;
        font-weight: 700 !important;
        color: var(--cmm-text-head);
        text-transform: uppercase;
        letter-spacing: 0.05em;
        margin: 0 !important;
        padding: 0 !important;
      }
    }

    .cmm-nav-list {
      display: flex;
      flex-direction: column;
      padding: 6px 0 !important;
    }

    .cmm-nav-item {
      position: relative;
      margin: 0 !important;

      &.active .cmm-nav-btn {
        background-color: var(--cmm-blue-50) !important;
        color: var(--cmm-blue-700) !important;
        font-weight: 600 !important;
      }
      &.active .cmm-icon-arrow {
        opacity: 1;
        color: var(--cmm-blue-700);
      }
    }

    /* 按钮样式 - 更加紧凑 */
    .cmm-nav-btn {
      width: 100% !important;
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      padding: 12px 20px !important; /* 减少高度 */
      border: none !important;
      background: transparent !important;
      cursor: pointer !important;
      font-size: 15px !important;
      font-weight: 400 !important;
      color: var(--cmm-text-body) !important;
      transition: all 0.2s !important;
      text-align: left !important;

      &:hover {
        background-color: #f9fafb !important;
        color: #111827 !important;
      }
    }

    .cmm-icon-arrow {
      width: 14px;
      height: 14px;
      opacity: 0.4;
      transition: transform 0.3s;
      flex-shrink: 0; 
      @media (max-width: 767px) {
        .active & { transform: rotate(90deg); }
      }
    }

    /* 右侧内容区 */
    .cmm-content-col {
      display: none;
      /* [核心修改] flex: 1 确保填满剩余宽度 */
      flex: 1; 
      /* [改动] 减少内边距 */
      padding: 20px 24px !important; 
      background: var(--cmm-bg-white);
      position: relative;
      flex-direction: column;
      /* 确保内容垂直分布 */
      justify-content: flex-start;

      @media (min-width: 768px) {
        display: flex;
      }
    }

    /* 面板 */
    .cmm-panel {
      display: none;
      width: 100%;
      height: 100%;
      flex-direction: column;
      animation: cmmFadeIn 0.3s ease-out forwards;
      &.active { display: flex; }
    }

    @keyframes cmmFadeIn {
      from { opacity: 0; transform: translateY(2px); }
      to { opacity: 1; transform: translateY(0); }
    }

    .cmm-panel-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 16px !important; /* 减少间距 */
    }

    .cmm-panel-title {
      font-size: 20px !important; /* 稍微减小字号 */
      font-weight: 700 !important;
      color: var(--cmm-text-head);
      margin: 0 !important;
    }

    .cmm-link-all {
      font-size: 13px !important;
      font-weight: 500 !important;
      color: var(--cmm-blue-600) !important;
      display: flex;
      align-items: center;
      gap: 4px;
    }

    /* * [重构] 轮播容器 - 横向布局版
     */
    .cmm-carousel-container {
      /* [核心修改] flex: 1 允许其填充内容区域的高度，但由于卡片限高，这里也需要配合 */
      flex: 0 0 auto;
      width: 100%;
      /* [改动] 允许占满宽度 */
      max-width: 100%; 
      height: 220px; /* 固定高度，确保紧凑 */
      margin: 0 !important;
      position: relative;
      border-radius: var(--cmm-radius-lg);
      background: #fff;
      border: 1px solid var(--cmm-border);
      overflow: hidden;

      /* 桌面端悬停显示箭头 */
      @media (min-width: 768px) {
        &:hover .cmm-ctrl-btn { opacity: 1; }
      }
    }

    .cmm-slide {
      display: none;
      width: 100%;
      height: 100%;
      position: relative;
      text-decoration: none;
      
      /* [改动] 关键布局：横向排列 (Left Image, Right Content) */
      &.active {
        display: flex;
        flex-direction: row; 
        animation: cmmFadeIn 0.4s ease-in-out;
      }
    }

    .cmm-img-wrapper {
      position: relative;
      /* [改动] 图片占据左侧 40% */
      width: 40%; 
      height: 100%;
      overflow: hidden;
      flex-shrink: 0;
    }

    .cmm-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.7s;
      display: block; 
    }

    .cmm-carousel-container:hover .cmm-img {
      transform: scale(1.05);
    }

    .cmm-badge {
      position: absolute;
      top: 10px;
      left: 10px;
      background: var(--cmm-red);
      color: #fff;
      font-size: 11px !important;
      font-weight: 700 !important;
      padding: 4px 10px !important;
      border-radius: 4px;
      z-index: 20;
      display: flex;
      align-items: center;
      gap: 4px;
      line-height: 1;
      box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    }
    
    .cmm-badge svg { width: 11px; height: 11px; flex-shrink: 0; }

    .cmm-info-box {
      /* [改动] 内容占据右侧 60% */
      width: 60%;
      padding: 20px 24px !important;
      background: #fff;
      display: flex;
      flex-direction: column;
      justify-content: center; /* 垂直居中 */
      position: relative;
    }

    .cmm-prod-title {
      font-size: 18px !important;
      font-weight: 700 !important;
      color: var(--cmm-text-head);
      margin: 0 0 6px 0 !important;
      line-height: 1.3 !important;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    .cmm-prod-sub {
      font-size: 13px !important;
      color: var(--cmm-text-body);
      margin: 0 0 16px 0 !important;
    }

    .cmm-price-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 0 !important; /* 不需要 auto margin */
    }

    .cmm-price {
      font-size: 22px !important;
      font-weight: 700 !important;
      color: #111827;
    }

    .cmm-btn-cart {
      background: #111827 !important;
      color: #fff !important;
      width: 38px !important;
      height: 38px !important;
      padding: 0 !important;
      border-radius: 50% !important;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background-color 0.2s;
      border: none !important;
      &:hover { background: #374151 !important; }
    }

    /* 轮播控制 */
    .cmm-ctrl-btn {
      position: absolute;
      /* [改动] 居中位置调整 */
      top: 50%;
      transform: translateY(-50%);
      background: rgba(255, 255, 255, 0.9) !important;
      color: #1f2937 !important;
      width: 32px !important;
      height: 32px !important;
      border-radius: 50% !important;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 2px 5px rgba(0,0,0,0.1);
      z-index: 30;
      opacity: 0;
      transition: opacity 0.3s;
      border: none !important;
    }

    .cmm-prev { left: 10px; }
    .cmm-next { left: auto; right: 10px; /* 控制只在图片区域？不，全屏 */ }
    /* 让右侧按钮位于整个容器的右侧，或者只在图片上？通常全容器方便 */
    
    /* Dots */
    .cmm-dots {
      position: absolute;
      bottom: 12px;
      left: 20%; /* 位于图片区域中心附近 */
      transform: translateX(-50%);
      display: flex;
      gap: 6px;
      z-index: 30;
    }

    .cmm-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: rgba(255,255,255,0.6);
      transition: all 0.3s;
      cursor: pointer;
      &.active { background: #fff; width: 16px; border-radius: 99px; }
    }

    /* Footer */
    .cmm-footer {
      margin-top: auto; /* [核心修改] 让Footer自动沉底，填充剩余空间 */
      padding-top: 12px !important;
      border-top: 1px solid var(--cmm-border);
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }

    .cmm-footer-item {
      font-size: 11px !important;
      color: var(--cmm-text-light);
      margin: 0 !important;
    }

    .cmm-footer-label {
      font-weight: 600 !important;
      color: var(--cmm-text-body);
      margin-bottom: 2px !important;
      display: block;
      font-size: 12px !important;
    }

    /* Mobile Content */
    .cmm-mobile-content {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.3s ease-out;
      background: #f9fafb;
      border-bottom: 1px solid transparent;
      @media (min-width: 768px) { display: none !important; }
    }

    .active .cmm-mobile-content { border-color: var(--cmm-border); }

    .cmm-mobile-inner {
      padding: 16px !important;
      max-width: 320px;
      margin: 0 auto;
      /* Mobile override: Reset carousel to vertical for phone */
      .cmm-carousel-container { height: auto; max-width: 300px; }
      .cmm-slide.active { flex-direction: column; }
      .cmm-img-wrapper { width: 100%; height: 200px; }
      .cmm-info-box { width: 100%; padding: 16px !important; }
      .cmm-dots { left: 50%; bottom: 130px; } /* Adjust for mobile */
    }
  }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d1f82cd */:root {
    --cmm-bg-body: #f9fafb;
    --cmm-bg-white: #ffffff;
    --cmm-text-head: #1f2937;
    --cmm-text-body: #4b5563;
    --cmm-text-light: #9ca3af;
    --cmm-blue-50: #eff6ff;
    --cmm-blue-600: #2563eb;
    --cmm-blue-700: #1d4ed8;
    --cmm-red: #dc2626;
    --cmm-border: #e5e7eb;
    --cmm-radius-xl: 12px;
    --cmm-radius-lg: 8px;
    --cmm-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  }

  /* * .cmm-menu-instance 容器
   */
  .cmm-menu-instance {
    box-sizing: border-box;
    width: 100%;
    /* 容器本身占满父级，依靠内部 card 控制视觉宽度 */
    padding: 10px !important; 
    background: transparent; 
    display: flex;
    justify-content: center;
    align-items: flex-start;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    position: relative;
    z-index: 999; 

    /* CSS Nesting */
    & * { box-sizing: border-box !important; }
    ul, li { list-style: none !important; margin: 0 !important; padding: 0 !important; }
    a { text-decoration: none !important; color: inherit; }

    /* 卡片主体 */
    .cmm-card {
      background: var(--cmm-bg-white);
      
      /* [核心修改] 宽度策略调整 */
      /* 1. 移动端默认 100% */
      width: 100%;
      
      border-radius: var(--cmm-radius-xl);
      box-shadow: var(--cmm-shadow-xl);
      border: 1px solid var(--cmm-border);
      overflow: hidden;
      display: flex;
      flex-direction: column;
      
      /* 高度控制：适应 8 个菜单项的高度 */
      min-height: 380px; 

      @media (min-width: 768px) {
        flex-direction: row;
        
        /* [核心修改] 桌面端强制固定宽度，防止跳动 */
        width: 1080px !important; 
        /* 保护措施：如果屏幕比 1080px 小，则不超过屏幕宽度的 95% */
        max-width: 95vw !important;
      }
    }

    /* 左侧导航栏 */
    .cmm-nav-col {
      width: 100%;
      background: var(--cmm-bg-white);
      display: flex;
      flex-direction: column;
      border-bottom: 1px solid var(--cmm-border);
      flex-shrink: 0; /* 防止被挤压 */

      @media (min-width: 768px) {
        /* 固定宽度 */
        width: 280px; 
        border-bottom: none;
        border-right: 1px solid var(--cmm-border);
      }
    }

    /* 导航标题 */
    .cmm-nav-header {
      padding: 14px 20px !important;
      background: #f8fafc;
      border-bottom: 1px solid var(--cmm-border);
      margin: 0 !important;

      h2 {
        font-size: 13px !important;
        font-weight: 700 !important;
        color: var(--cmm-text-head);
        text-transform: uppercase;
        letter-spacing: 0.05em;
        margin: 0 !important;
        padding: 0 !important;
      }
    }

    .cmm-nav-list {
      display: flex;
      flex-direction: column;
      padding: 6px 0 !important;
    }

    .cmm-nav-item {
      position: relative;
      margin: 0 !important;

      &.active .cmm-nav-btn {
        background-color: var(--cmm-blue-50) !important;
        color: var(--cmm-blue-700) !important;
        font-weight: 600 !important;
      }
      &.active .cmm-icon-arrow {
        opacity: 1;
        color: var(--cmm-blue-700);
      }
    }

    /* 按钮样式 - 更加紧凑 */
    .cmm-nav-btn {
      width: 100% !important;
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      padding: 12px 20px !important; /* 减少高度 */
      border: none !important;
      background: transparent !important;
      cursor: pointer !important;
      font-size: 15px !important;
      font-weight: 400 !important;
      color: var(--cmm-text-body) !important;
      transition: all 0.2s !important;
      text-align: left !important;

      &:hover {
        background-color: #f9fafb !important;
        color: #111827 !important;
      }
    }

    .cmm-icon-arrow {
      width: 14px;
      height: 14px;
      opacity: 0.4;
      transition: transform 0.3s;
      flex-shrink: 0; 
      @media (max-width: 767px) {
        .active & { transform: rotate(90deg); }
      }
    }

    /* 右侧内容区 */
    .cmm-content-col {
      display: none;
      /* [核心修改] flex: 1 确保填满剩余宽度 */
      flex: 1; 
      /* [改动] 减少内边距 */
      padding: 20px 24px !important; 
      background: var(--cmm-bg-white);
      position: relative;
      flex-direction: column;
      /* 确保内容垂直分布 */
      justify-content: flex-start;

      @media (min-width: 768px) {
        display: flex;
      }
    }

    /* 面板 */
    .cmm-panel {
      display: none;
      width: 100%;
      height: 100%;
      flex-direction: column;
      animation: cmmFadeIn 0.3s ease-out forwards;
      &.active { display: flex; }
    }

    @keyframes cmmFadeIn {
      from { opacity: 0; transform: translateY(2px); }
      to { opacity: 1; transform: translateY(0); }
    }

    .cmm-panel-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 16px !important; /* 减少间距 */
    }

    .cmm-panel-title {
      font-size: 20px !important; /* 稍微减小字号 */
      font-weight: 700 !important;
      color: var(--cmm-text-head);
      margin: 0 !important;
    }

    .cmm-link-all {
      font-size: 13px !important;
      font-weight: 500 !important;
      color: var(--cmm-blue-600) !important;
      display: flex;
      align-items: center;
      gap: 4px;
    }

    /* * [重构] 轮播容器 - 横向布局版
     */
    .cmm-carousel-container {
      /* [核心修改] flex: 1 允许其填充内容区域的高度，但由于卡片限高，这里也需要配合 */
      flex: 0 0 auto;
      width: 100%;
      /* [改动] 允许占满宽度 */
      max-width: 100%; 
      height: 220px; /* 固定高度，确保紧凑 */
      margin: 0 !important;
      position: relative;
      border-radius: var(--cmm-radius-lg);
      background: #fff;
      border: 1px solid var(--cmm-border);
      overflow: hidden;

      /* 桌面端悬停显示箭头 */
      @media (min-width: 768px) {
        &:hover .cmm-ctrl-btn { opacity: 1; }
      }
    }

    .cmm-slide {
      display: none;
      width: 100%;
      height: 100%;
      position: relative;
      text-decoration: none;
      
      /* [改动] 关键布局：横向排列 (Left Image, Right Content) */
      &.active {
        display: flex;
        flex-direction: row; 
        animation: cmmFadeIn 0.4s ease-in-out;
      }
    }

    .cmm-img-wrapper {
      position: relative;
      /* [改动] 图片占据左侧 40% */
      width: 40%; 
      height: 100%;
      overflow: hidden;
      flex-shrink: 0;
    }

    .cmm-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.7s;
      display: block; 
    }

    .cmm-carousel-container:hover .cmm-img {
      transform: scale(1.05);
    }

    .cmm-badge {
      position: absolute;
      top: 10px;
      left: 10px;
      background: var(--cmm-red);
      color: #fff;
      font-size: 11px !important;
      font-weight: 700 !important;
      padding: 4px 10px !important;
      border-radius: 4px;
      z-index: 20;
      display: flex;
      align-items: center;
      gap: 4px;
      line-height: 1;
      box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    }
    
    .cmm-badge svg { width: 11px; height: 11px; flex-shrink: 0; }

    .cmm-info-box {
      /* [改动] 内容占据右侧 60% */
      width: 60%;
      padding: 20px 24px !important;
      background: #fff;
      display: flex;
      flex-direction: column;
      justify-content: center; /* 垂直居中 */
      position: relative;
    }

    .cmm-prod-title {
      font-size: 18px !important;
      font-weight: 700 !important;
      color: var(--cmm-text-head);
      margin: 0 0 6px 0 !important;
      line-height: 1.3 !important;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    .cmm-prod-sub {
      font-size: 13px !important;
      color: var(--cmm-text-body);
      margin: 0 0 16px 0 !important;
    }

    .cmm-price-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 0 !important; /* 不需要 auto margin */
    }

    .cmm-price {
      font-size: 22px !important;
      font-weight: 700 !important;
      color: #111827;
    }

    .cmm-btn-cart {
      background: #111827 !important;
      color: #fff !important;
      width: 38px !important;
      height: 38px !important;
      padding: 0 !important;
      border-radius: 50% !important;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background-color 0.2s;
      border: none !important;
      &:hover { background: #374151 !important; }
    }

    /* 轮播控制 */
    .cmm-ctrl-btn {
      position: absolute;
      /* [改动] 居中位置调整 */
      top: 50%;
      transform: translateY(-50%);
      background: rgba(255, 255, 255, 0.9) !important;
      color: #1f2937 !important;
      width: 32px !important;
      height: 32px !important;
      border-radius: 50% !important;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 2px 5px rgba(0,0,0,0.1);
      z-index: 30;
      opacity: 0;
      transition: opacity 0.3s;
      border: none !important;
    }

    .cmm-prev { left: 10px; }
    .cmm-next { left: auto; right: 10px; /* 控制只在图片区域？不，全屏 */ }
    /* 让右侧按钮位于整个容器的右侧，或者只在图片上？通常全容器方便 */
    
    /* Dots */
    .cmm-dots {
      position: absolute;
      bottom: 12px;
      left: 20%; /* 位于图片区域中心附近 */
      transform: translateX(-50%);
      display: flex;
      gap: 6px;
      z-index: 30;
    }

    .cmm-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: rgba(255,255,255,0.6);
      transition: all 0.3s;
      cursor: pointer;
      &.active { background: #fff; width: 16px; border-radius: 99px; }
    }

    /* Footer */
    .cmm-footer {
      margin-top: auto; /* [核心修改] 让Footer自动沉底，填充剩余空间 */
      padding-top: 12px !important;
      border-top: 1px solid var(--cmm-border);
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }

    .cmm-footer-item {
      font-size: 11px !important;
      color: var(--cmm-text-light);
      margin: 0 !important;
    }

    .cmm-footer-label {
      font-weight: 600 !important;
      color: var(--cmm-text-body);
      margin-bottom: 2px !important;
      display: block;
      font-size: 12px !important;
    }

    /* Mobile Content */
    .cmm-mobile-content {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.3s ease-out;
      background: #f9fafb;
      border-bottom: 1px solid transparent;
      @media (min-width: 768px) { display: none !important; }
    }

    .active .cmm-mobile-content { border-color: var(--cmm-border); }

    .cmm-mobile-inner {
      padding: 16px !important;
      max-width: 320px;
      margin: 0 auto;
      /* Mobile override: Reset carousel to vertical for phone */
      .cmm-carousel-container { height: auto; max-width: 300px; }
      .cmm-slide.active { flex-direction: column; }
      .cmm-img-wrapper { width: 100%; height: 200px; }
      .cmm-info-box { width: 100%; padding: 16px !important; }
      .cmm-dots { left: 50%; bottom: 130px; } /* Adjust for mobile */
    }
  }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d1f82cd */:root {
    --cmm-bg-body: #f9fafb;
    --cmm-bg-white: #ffffff;
    --cmm-text-head: #1f2937;
    --cmm-text-body: #4b5563;
    --cmm-text-light: #9ca3af;
    --cmm-blue-50: #eff6ff;
    --cmm-blue-600: #2563eb;
    --cmm-blue-700: #1d4ed8;
    --cmm-red: #dc2626;
    --cmm-border: #e5e7eb;
    --cmm-radius-xl: 12px;
    --cmm-radius-lg: 8px;
    --cmm-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  }

  /* * .cmm-menu-instance 容器
   */
  .cmm-menu-instance {
    box-sizing: border-box;
    width: 100%;
    /* 容器本身占满父级，依靠内部 card 控制视觉宽度 */
    padding: 10px !important; 
    background: transparent; 
    display: flex;
    justify-content: center;
    align-items: flex-start;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    position: relative;
    z-index: 999; 

    /* CSS Nesting */
    & * { box-sizing: border-box !important; }
    ul, li { list-style: none !important; margin: 0 !important; padding: 0 !important; }
    a { text-decoration: none !important; color: inherit; }

    /* 卡片主体 */
    .cmm-card {
      background: var(--cmm-bg-white);
      
      /* [核心修改] 宽度策略调整 */
      /* 1. 移动端默认 100% */
      width: 100%;
      
      border-radius: var(--cmm-radius-xl);
      box-shadow: var(--cmm-shadow-xl);
      border: 1px solid var(--cmm-border);
      overflow: hidden;
      display: flex;
      flex-direction: column;
      
      /* 高度控制：适应 8 个菜单项的高度 */
      min-height: 380px; 

      @media (min-width: 768px) {
        flex-direction: row;
        
        /* [核心修改] 桌面端强制固定宽度，防止跳动 */
        width: 1080px !important; 
        /* 保护措施：如果屏幕比 1080px 小，则不超过屏幕宽度的 95% */
        max-width: 95vw !important;
      }
    }

    /* 左侧导航栏 */
    .cmm-nav-col {
      width: 100%;
      background: var(--cmm-bg-white);
      display: flex;
      flex-direction: column;
      border-bottom: 1px solid var(--cmm-border);
      flex-shrink: 0; /* 防止被挤压 */

      @media (min-width: 768px) {
        /* 固定宽度 */
        width: 280px; 
        border-bottom: none;
        border-right: 1px solid var(--cmm-border);
      }
    }

    /* 导航标题 */
    .cmm-nav-header {
      padding: 14px 20px !important;
      background: #f8fafc;
      border-bottom: 1px solid var(--cmm-border);
      margin: 0 !important;

      h2 {
        font-size: 13px !important;
        font-weight: 700 !important;
        color: var(--cmm-text-head);
        text-transform: uppercase;
        letter-spacing: 0.05em;
        margin: 0 !important;
        padding: 0 !important;
      }
    }

    .cmm-nav-list {
      display: flex;
      flex-direction: column;
      padding: 6px 0 !important;
    }

    .cmm-nav-item {
      position: relative;
      margin: 0 !important;

      &.active .cmm-nav-btn {
        background-color: var(--cmm-blue-50) !important;
        color: var(--cmm-blue-700) !important;
        font-weight: 600 !important;
      }
      &.active .cmm-icon-arrow {
        opacity: 1;
        color: var(--cmm-blue-700);
      }
    }

    /* 按钮样式 - 更加紧凑 */
    .cmm-nav-btn {
      width: 100% !important;
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      padding: 12px 20px !important; /* 减少高度 */
      border: none !important;
      background: transparent !important;
      cursor: pointer !important;
      font-size: 15px !important;
      font-weight: 400 !important;
      color: var(--cmm-text-body) !important;
      transition: all 0.2s !important;
      text-align: left !important;

      &:hover {
        background-color: #f9fafb !important;
        color: #111827 !important;
      }
    }

    .cmm-icon-arrow {
      width: 14px;
      height: 14px;
      opacity: 0.4;
      transition: transform 0.3s;
      flex-shrink: 0; 
      @media (max-width: 767px) {
        .active & { transform: rotate(90deg); }
      }
    }

    /* 右侧内容区 */
    .cmm-content-col {
      display: none;
      /* [核心修改] flex: 1 确保填满剩余宽度 */
      flex: 1; 
      /* [改动] 减少内边距 */
      padding: 20px 24px !important; 
      background: var(--cmm-bg-white);
      position: relative;
      flex-direction: column;
      /* 确保内容垂直分布 */
      justify-content: flex-start;

      @media (min-width: 768px) {
        display: flex;
      }
    }

    /* 面板 */
    .cmm-panel {
      display: none;
      width: 100%;
      height: 100%;
      flex-direction: column;
      animation: cmmFadeIn 0.3s ease-out forwards;
      &.active { display: flex; }
    }

    @keyframes cmmFadeIn {
      from { opacity: 0; transform: translateY(2px); }
      to { opacity: 1; transform: translateY(0); }
    }

    .cmm-panel-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 16px !important; /* 减少间距 */
    }

    .cmm-panel-title {
      font-size: 20px !important; /* 稍微减小字号 */
      font-weight: 700 !important;
      color: var(--cmm-text-head);
      margin: 0 !important;
    }

    .cmm-link-all {
      font-size: 13px !important;
      font-weight: 500 !important;
      color: var(--cmm-blue-600) !important;
      display: flex;
      align-items: center;
      gap: 4px;
    }

    /* * [重构] 轮播容器 - 横向布局版
     */
    .cmm-carousel-container {
      /* [核心修改] flex: 1 允许其填充内容区域的高度，但由于卡片限高，这里也需要配合 */
      flex: 0 0 auto;
      width: 100%;
      /* [改动] 允许占满宽度 */
      max-width: 100%; 
      height: 220px; /* 固定高度，确保紧凑 */
      margin: 0 !important;
      position: relative;
      border-radius: var(--cmm-radius-lg);
      background: #fff;
      border: 1px solid var(--cmm-border);
      overflow: hidden;

      /* 桌面端悬停显示箭头 */
      @media (min-width: 768px) {
        &:hover .cmm-ctrl-btn { opacity: 1; }
      }
    }

    .cmm-slide {
      display: none;
      width: 100%;
      height: 100%;
      position: relative;
      text-decoration: none;
      
      /* [改动] 关键布局：横向排列 (Left Image, Right Content) */
      &.active {
        display: flex;
        flex-direction: row; 
        animation: cmmFadeIn 0.4s ease-in-out;
      }
    }

    .cmm-img-wrapper {
      position: relative;
      /* [改动] 图片占据左侧 40% */
      width: 40%; 
      height: 100%;
      overflow: hidden;
      flex-shrink: 0;
    }

    .cmm-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.7s;
      display: block; 
    }

    .cmm-carousel-container:hover .cmm-img {
      transform: scale(1.05);
    }

    .cmm-badge {
      position: absolute;
      top: 10px;
      left: 10px;
      background: var(--cmm-red);
      color: #fff;
      font-size: 11px !important;
      font-weight: 700 !important;
      padding: 4px 10px !important;
      border-radius: 4px;
      z-index: 20;
      display: flex;
      align-items: center;
      gap: 4px;
      line-height: 1;
      box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    }
    
    .cmm-badge svg { width: 11px; height: 11px; flex-shrink: 0; }

    .cmm-info-box {
      /* [改动] 内容占据右侧 60% */
      width: 60%;
      padding: 20px 24px !important;
      background: #fff;
      display: flex;
      flex-direction: column;
      justify-content: center; /* 垂直居中 */
      position: relative;
    }

    .cmm-prod-title {
      font-size: 18px !important;
      font-weight: 700 !important;
      color: var(--cmm-text-head);
      margin: 0 0 6px 0 !important;
      line-height: 1.3 !important;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    .cmm-prod-sub {
      font-size: 13px !important;
      color: var(--cmm-text-body);
      margin: 0 0 16px 0 !important;
    }

    .cmm-price-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 0 !important; /* 不需要 auto margin */
    }

    .cmm-price {
      font-size: 22px !important;
      font-weight: 700 !important;
      color: #111827;
    }

    .cmm-btn-cart {
      background: #111827 !important;
      color: #fff !important;
      width: 38px !important;
      height: 38px !important;
      padding: 0 !important;
      border-radius: 50% !important;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background-color 0.2s;
      border: none !important;
      &:hover { background: #374151 !important; }
    }

    /* 轮播控制 */
    .cmm-ctrl-btn {
      position: absolute;
      /* [改动] 居中位置调整 */
      top: 50%;
      transform: translateY(-50%);
      background: rgba(255, 255, 255, 0.9) !important;
      color: #1f2937 !important;
      width: 32px !important;
      height: 32px !important;
      border-radius: 50% !important;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 2px 5px rgba(0,0,0,0.1);
      z-index: 30;
      opacity: 0;
      transition: opacity 0.3s;
      border: none !important;
    }

    .cmm-prev { left: 10px; }
    .cmm-next { left: auto; right: 10px; /* 控制只在图片区域？不，全屏 */ }
    /* 让右侧按钮位于整个容器的右侧，或者只在图片上？通常全容器方便 */
    
    /* Dots */
    .cmm-dots {
      position: absolute;
      bottom: 12px;
      left: 20%; /* 位于图片区域中心附近 */
      transform: translateX(-50%);
      display: flex;
      gap: 6px;
      z-index: 30;
    }

    .cmm-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: rgba(255,255,255,0.6);
      transition: all 0.3s;
      cursor: pointer;
      &.active { background: #fff; width: 16px; border-radius: 99px; }
    }

    /* Footer */
    .cmm-footer {
      margin-top: auto; /* [核心修改] 让Footer自动沉底，填充剩余空间 */
      padding-top: 12px !important;
      border-top: 1px solid var(--cmm-border);
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }

    .cmm-footer-item {
      font-size: 11px !important;
      color: var(--cmm-text-light);
      margin: 0 !important;
    }

    .cmm-footer-label {
      font-weight: 600 !important;
      color: var(--cmm-text-body);
      margin-bottom: 2px !important;
      display: block;
      font-size: 12px !important;
    }

    /* Mobile Content */
    .cmm-mobile-content {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.3s ease-out;
      background: #f9fafb;
      border-bottom: 1px solid transparent;
      @media (min-width: 768px) { display: none !important; }
    }

    .active .cmm-mobile-content { border-color: var(--cmm-border); }

    .cmm-mobile-inner {
      padding: 16px !important;
      max-width: 320px;
      margin: 0 auto;
      /* Mobile override: Reset carousel to vertical for phone */
      .cmm-carousel-container { height: auto; max-width: 300px; }
      .cmm-slide.active { flex-direction: column; }
      .cmm-img-wrapper { width: 100%; height: 200px; }
      .cmm-info-box { width: 100%; padding: 16px !important; }
      .cmm-dots { left: 50%; bottom: 130px; } /* Adjust for mobile */
    }
  }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d1f82cd */:root {
    --cmm-bg-body: #f9fafb;
    --cmm-bg-white: #ffffff;
    --cmm-text-head: #1f2937;
    --cmm-text-body: #4b5563;
    --cmm-text-light: #9ca3af;
    --cmm-blue-50: #eff6ff;
    --cmm-blue-600: #2563eb;
    --cmm-blue-700: #1d4ed8;
    --cmm-red: #dc2626;
    --cmm-border: #e5e7eb;
    --cmm-radius-xl: 12px;
    --cmm-radius-lg: 8px;
    --cmm-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  }

  /* * .cmm-menu-instance 容器
   */
  .cmm-menu-instance {
    box-sizing: border-box;
    width: 100%;
    /* 容器本身占满父级，依靠内部 card 控制视觉宽度 */
    padding: 10px !important; 
    background: transparent; 
    display: flex;
    justify-content: center;
    align-items: flex-start;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    position: relative;
    z-index: 999; 

    /* CSS Nesting */
    & * { box-sizing: border-box !important; }
    ul, li { list-style: none !important; margin: 0 !important; padding: 0 !important; }
    a { text-decoration: none !important; color: inherit; }

    /* 卡片主体 */
    .cmm-card {
      background: var(--cmm-bg-white);
      
      /* [核心修改] 宽度策略调整 */
      /* 1. 移动端默认 100% */
      width: 100%;
      
      border-radius: var(--cmm-radius-xl);
      box-shadow: var(--cmm-shadow-xl);
      border: 1px solid var(--cmm-border);
      overflow: hidden;
      display: flex;
      flex-direction: column;
      
      /* 高度控制：适应 8 个菜单项的高度 */
      min-height: 380px; 

      @media (min-width: 768px) {
        flex-direction: row;
        
        /* [核心修改] 桌面端强制固定宽度，防止跳动 */
        width: 1080px !important; 
        /* 保护措施：如果屏幕比 1080px 小，则不超过屏幕宽度的 95% */
        max-width: 95vw !important;
      }
    }

    /* 左侧导航栏 */
    .cmm-nav-col {
      width: 100%;
      background: var(--cmm-bg-white);
      display: flex;
      flex-direction: column;
      border-bottom: 1px solid var(--cmm-border);
      flex-shrink: 0; /* 防止被挤压 */

      @media (min-width: 768px) {
        /* 固定宽度 */
        width: 280px; 
        border-bottom: none;
        border-right: 1px solid var(--cmm-border);
      }
    }

    /* 导航标题 */
    .cmm-nav-header {
      padding: 14px 20px !important;
      background: #f8fafc;
      border-bottom: 1px solid var(--cmm-border);
      margin: 0 !important;

      h2 {
        font-size: 13px !important;
        font-weight: 700 !important;
        color: var(--cmm-text-head);
        text-transform: uppercase;
        letter-spacing: 0.05em;
        margin: 0 !important;
        padding: 0 !important;
      }
    }

    .cmm-nav-list {
      display: flex;
      flex-direction: column;
      padding: 6px 0 !important;
    }

    .cmm-nav-item {
      position: relative;
      margin: 0 !important;

      &.active .cmm-nav-btn {
        background-color: var(--cmm-blue-50) !important;
        color: var(--cmm-blue-700) !important;
        font-weight: 600 !important;
      }
      &.active .cmm-icon-arrow {
        opacity: 1;
        color: var(--cmm-blue-700);
      }
    }

    /* 按钮样式 - 更加紧凑 */
    .cmm-nav-btn {
      width: 100% !important;
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      padding: 12px 20px !important; /* 减少高度 */
      border: none !important;
      background: transparent !important;
      cursor: pointer !important;
      font-size: 15px !important;
      font-weight: 400 !important;
      color: var(--cmm-text-body) !important;
      transition: all 0.2s !important;
      text-align: left !important;

      &:hover {
        background-color: #f9fafb !important;
        color: #111827 !important;
      }
    }

    .cmm-icon-arrow {
      width: 14px;
      height: 14px;
      opacity: 0.4;
      transition: transform 0.3s;
      flex-shrink: 0; 
      @media (max-width: 767px) {
        .active & { transform: rotate(90deg); }
      }
    }

    /* 右侧内容区 */
    .cmm-content-col {
      display: none;
      /* [核心修改] flex: 1 确保填满剩余宽度 */
      flex: 1; 
      /* [改动] 减少内边距 */
      padding: 20px 24px !important; 
      background: var(--cmm-bg-white);
      position: relative;
      flex-direction: column;
      /* 确保内容垂直分布 */
      justify-content: flex-start;

      @media (min-width: 768px) {
        display: flex;
      }
    }

    /* 面板 */
    .cmm-panel {
      display: none;
      width: 100%;
      height: 100%;
      flex-direction: column;
      animation: cmmFadeIn 0.3s ease-out forwards;
      &.active { display: flex; }
    }

    @keyframes cmmFadeIn {
      from { opacity: 0; transform: translateY(2px); }
      to { opacity: 1; transform: translateY(0); }
    }

    .cmm-panel-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 16px !important; /* 减少间距 */
    }

    .cmm-panel-title {
      font-size: 20px !important; /* 稍微减小字号 */
      font-weight: 700 !important;
      color: var(--cmm-text-head);
      margin: 0 !important;
    }

    .cmm-link-all {
      font-size: 13px !important;
      font-weight: 500 !important;
      color: var(--cmm-blue-600) !important;
      display: flex;
      align-items: center;
      gap: 4px;
    }

    /* * [重构] 轮播容器 - 横向布局版
     */
    .cmm-carousel-container {
      /* [核心修改] flex: 1 允许其填充内容区域的高度，但由于卡片限高，这里也需要配合 */
      flex: 0 0 auto;
      width: 100%;
      /* [改动] 允许占满宽度 */
      max-width: 100%; 
      height: 220px; /* 固定高度，确保紧凑 */
      margin: 0 !important;
      position: relative;
      border-radius: var(--cmm-radius-lg);
      background: #fff;
      border: 1px solid var(--cmm-border);
      overflow: hidden;

      /* 桌面端悬停显示箭头 */
      @media (min-width: 768px) {
        &:hover .cmm-ctrl-btn { opacity: 1; }
      }
    }

    .cmm-slide {
      display: none;
      width: 100%;
      height: 100%;
      position: relative;
      text-decoration: none;
      
      /* [改动] 关键布局：横向排列 (Left Image, Right Content) */
      &.active {
        display: flex;
        flex-direction: row; 
        animation: cmmFadeIn 0.4s ease-in-out;
      }
    }

    .cmm-img-wrapper {
      position: relative;
      /* [改动] 图片占据左侧 40% */
      width: 40%; 
      height: 100%;
      overflow: hidden;
      flex-shrink: 0;
    }

    .cmm-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.7s;
      display: block; 
    }

    .cmm-carousel-container:hover .cmm-img {
      transform: scale(1.05);
    }

    .cmm-badge {
      position: absolute;
      top: 10px;
      left: 10px;
      background: var(--cmm-red);
      color: #fff;
      font-size: 11px !important;
      font-weight: 700 !important;
      padding: 4px 10px !important;
      border-radius: 4px;
      z-index: 20;
      display: flex;
      align-items: center;
      gap: 4px;
      line-height: 1;
      box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    }
    
    .cmm-badge svg { width: 11px; height: 11px; flex-shrink: 0; }

    .cmm-info-box {
      /* [改动] 内容占据右侧 60% */
      width: 60%;
      padding: 20px 24px !important;
      background: #fff;
      display: flex;
      flex-direction: column;
      justify-content: center; /* 垂直居中 */
      position: relative;
    }

    .cmm-prod-title {
      font-size: 18px !important;
      font-weight: 700 !important;
      color: var(--cmm-text-head);
      margin: 0 0 6px 0 !important;
      line-height: 1.3 !important;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    .cmm-prod-sub {
      font-size: 13px !important;
      color: var(--cmm-text-body);
      margin: 0 0 16px 0 !important;
    }

    .cmm-price-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 0 !important; /* 不需要 auto margin */
    }

    .cmm-price {
      font-size: 22px !important;
      font-weight: 700 !important;
      color: #111827;
    }

    .cmm-btn-cart {
      background: #111827 !important;
      color: #fff !important;
      width: 38px !important;
      height: 38px !important;
      padding: 0 !important;
      border-radius: 50% !important;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background-color 0.2s;
      border: none !important;
      &:hover { background: #374151 !important; }
    }

    /* 轮播控制 */
    .cmm-ctrl-btn {
      position: absolute;
      /* [改动] 居中位置调整 */
      top: 50%;
      transform: translateY(-50%);
      background: rgba(255, 255, 255, 0.9) !important;
      color: #1f2937 !important;
      width: 32px !important;
      height: 32px !important;
      border-radius: 50% !important;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 2px 5px rgba(0,0,0,0.1);
      z-index: 30;
      opacity: 0;
      transition: opacity 0.3s;
      border: none !important;
    }

    .cmm-prev { left: 10px; }
    .cmm-next { left: auto; right: 10px; /* 控制只在图片区域？不，全屏 */ }
    /* 让右侧按钮位于整个容器的右侧，或者只在图片上？通常全容器方便 */
    
    /* Dots */
    .cmm-dots {
      position: absolute;
      bottom: 12px;
      left: 20%; /* 位于图片区域中心附近 */
      transform: translateX(-50%);
      display: flex;
      gap: 6px;
      z-index: 30;
    }

    .cmm-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: rgba(255,255,255,0.6);
      transition: all 0.3s;
      cursor: pointer;
      &.active { background: #fff; width: 16px; border-radius: 99px; }
    }

    /* Footer */
    .cmm-footer {
      margin-top: auto; /* [核心修改] 让Footer自动沉底，填充剩余空间 */
      padding-top: 12px !important;
      border-top: 1px solid var(--cmm-border);
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }

    .cmm-footer-item {
      font-size: 11px !important;
      color: var(--cmm-text-light);
      margin: 0 !important;
    }

    .cmm-footer-label {
      font-weight: 600 !important;
      color: var(--cmm-text-body);
      margin-bottom: 2px !important;
      display: block;
      font-size: 12px !important;
    }

    /* Mobile Content */
    .cmm-mobile-content {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.3s ease-out;
      background: #f9fafb;
      border-bottom: 1px solid transparent;
      @media (min-width: 768px) { display: none !important; }
    }

    .active .cmm-mobile-content { border-color: var(--cmm-border); }

    .cmm-mobile-inner {
      padding: 16px !important;
      max-width: 320px;
      margin: 0 auto;
      /* Mobile override: Reset carousel to vertical for phone */
      .cmm-carousel-container { height: auto; max-width: 300px; }
      .cmm-slide.active { flex-direction: column; }
      .cmm-img-wrapper { width: 100%; height: 200px; }
      .cmm-info-box { width: 100%; padding: 16px !important; }
      .cmm-dots { left: 50%; bottom: 130px; } /* Adjust for mobile */
    }
  }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d1f82cd */:root {
    --cmm-bg-body: #f9fafb;
    --cmm-bg-white: #ffffff;
    --cmm-text-head: #1f2937;
    --cmm-text-body: #4b5563;
    --cmm-text-light: #9ca3af;
    --cmm-blue-50: #eff6ff;
    --cmm-blue-600: #2563eb;
    --cmm-blue-700: #1d4ed8;
    --cmm-red: #dc2626;
    --cmm-border: #e5e7eb;
    --cmm-radius-xl: 12px;
    --cmm-radius-lg: 8px;
    --cmm-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  }

  /* * .cmm-menu-instance 容器
   */
  .cmm-menu-instance {
    box-sizing: border-box;
    width: 100%;
    /* 容器本身占满父级，依靠内部 card 控制视觉宽度 */
    padding: 10px !important; 
    background: transparent; 
    display: flex;
    justify-content: center;
    align-items: flex-start;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    position: relative;
    z-index: 999; 

    /* CSS Nesting */
    & * { box-sizing: border-box !important; }
    ul, li { list-style: none !important; margin: 0 !important; padding: 0 !important; }
    a { text-decoration: none !important; color: inherit; }

    /* 卡片主体 */
    .cmm-card {
      background: var(--cmm-bg-white);
      
      /* [核心修改] 宽度策略调整 */
      /* 1. 移动端默认 100% */
      width: 100%;
      
      border-radius: var(--cmm-radius-xl);
      box-shadow: var(--cmm-shadow-xl);
      border: 1px solid var(--cmm-border);
      overflow: hidden;
      display: flex;
      flex-direction: column;
      
      /* 高度控制：适应 8 个菜单项的高度 */
      min-height: 380px; 

      @media (min-width: 768px) {
        flex-direction: row;
        
        /* [核心修改] 桌面端强制固定宽度，防止跳动 */
        width: 1080px !important; 
        /* 保护措施：如果屏幕比 1080px 小，则不超过屏幕宽度的 95% */
        max-width: 95vw !important;
      }
    }

    /* 左侧导航栏 */
    .cmm-nav-col {
      width: 100%;
      background: var(--cmm-bg-white);
      display: flex;
      flex-direction: column;
      border-bottom: 1px solid var(--cmm-border);
      flex-shrink: 0; /* 防止被挤压 */

      @media (min-width: 768px) {
        /* 固定宽度 */
        width: 280px; 
        border-bottom: none;
        border-right: 1px solid var(--cmm-border);
      }
    }

    /* 导航标题 */
    .cmm-nav-header {
      padding: 14px 20px !important;
      background: #f8fafc;
      border-bottom: 1px solid var(--cmm-border);
      margin: 0 !important;

      h2 {
        font-size: 13px !important;
        font-weight: 700 !important;
        color: var(--cmm-text-head);
        text-transform: uppercase;
        letter-spacing: 0.05em;
        margin: 0 !important;
        padding: 0 !important;
      }
    }

    .cmm-nav-list {
      display: flex;
      flex-direction: column;
      padding: 6px 0 !important;
    }

    .cmm-nav-item {
      position: relative;
      margin: 0 !important;

      &.active .cmm-nav-btn {
        background-color: var(--cmm-blue-50) !important;
        color: var(--cmm-blue-700) !important;
        font-weight: 600 !important;
      }
      &.active .cmm-icon-arrow {
        opacity: 1;
        color: var(--cmm-blue-700);
      }
    }

    /* 按钮样式 - 更加紧凑 */
    .cmm-nav-btn {
      width: 100% !important;
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      padding: 12px 20px !important; /* 减少高度 */
      border: none !important;
      background: transparent !important;
      cursor: pointer !important;
      font-size: 15px !important;
      font-weight: 400 !important;
      color: var(--cmm-text-body) !important;
      transition: all 0.2s !important;
      text-align: left !important;

      &:hover {
        background-color: #f9fafb !important;
        color: #111827 !important;
      }
    }

    .cmm-icon-arrow {
      width: 14px;
      height: 14px;
      opacity: 0.4;
      transition: transform 0.3s;
      flex-shrink: 0; 
      @media (max-width: 767px) {
        .active & { transform: rotate(90deg); }
      }
    }

    /* 右侧内容区 */
    .cmm-content-col {
      display: none;
      /* [核心修改] flex: 1 确保填满剩余宽度 */
      flex: 1; 
      /* [改动] 减少内边距 */
      padding: 20px 24px !important; 
      background: var(--cmm-bg-white);
      position: relative;
      flex-direction: column;
      /* 确保内容垂直分布 */
      justify-content: flex-start;

      @media (min-width: 768px) {
        display: flex;
      }
    }

    /* 面板 */
    .cmm-panel {
      display: none;
      width: 100%;
      height: 100%;
      flex-direction: column;
      animation: cmmFadeIn 0.3s ease-out forwards;
      &.active { display: flex; }
    }

    @keyframes cmmFadeIn {
      from { opacity: 0; transform: translateY(2px); }
      to { opacity: 1; transform: translateY(0); }
    }

    .cmm-panel-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 16px !important; /* 减少间距 */
    }

    .cmm-panel-title {
      font-size: 20px !important; /* 稍微减小字号 */
      font-weight: 700 !important;
      color: var(--cmm-text-head);
      margin: 0 !important;
    }

    .cmm-link-all {
      font-size: 13px !important;
      font-weight: 500 !important;
      color: var(--cmm-blue-600) !important;
      display: flex;
      align-items: center;
      gap: 4px;
    }

    /* * [重构] 轮播容器 - 横向布局版
     */
    .cmm-carousel-container {
      /* [核心修改] flex: 1 允许其填充内容区域的高度，但由于卡片限高，这里也需要配合 */
      flex: 0 0 auto;
      width: 100%;
      /* [改动] 允许占满宽度 */
      max-width: 100%; 
      height: 220px; /* 固定高度，确保紧凑 */
      margin: 0 !important;
      position: relative;
      border-radius: var(--cmm-radius-lg);
      background: #fff;
      border: 1px solid var(--cmm-border);
      overflow: hidden;

      /* 桌面端悬停显示箭头 */
      @media (min-width: 768px) {
        &:hover .cmm-ctrl-btn { opacity: 1; }
      }
    }

    .cmm-slide {
      display: none;
      width: 100%;
      height: 100%;
      position: relative;
      text-decoration: none;
      
      /* [改动] 关键布局：横向排列 (Left Image, Right Content) */
      &.active {
        display: flex;
        flex-direction: row; 
        animation: cmmFadeIn 0.4s ease-in-out;
      }
    }

    .cmm-img-wrapper {
      position: relative;
      /* [改动] 图片占据左侧 40% */
      width: 40%; 
      height: 100%;
      overflow: hidden;
      flex-shrink: 0;
    }

    .cmm-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.7s;
      display: block; 
    }

    .cmm-carousel-container:hover .cmm-img {
      transform: scale(1.05);
    }

    .cmm-badge {
      position: absolute;
      top: 10px;
      left: 10px;
      background: var(--cmm-red);
      color: #fff;
      font-size: 11px !important;
      font-weight: 700 !important;
      padding: 4px 10px !important;
      border-radius: 4px;
      z-index: 20;
      display: flex;
      align-items: center;
      gap: 4px;
      line-height: 1;
      box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    }
    
    .cmm-badge svg { width: 11px; height: 11px; flex-shrink: 0; }

    .cmm-info-box {
      /* [改动] 内容占据右侧 60% */
      width: 60%;
      padding: 20px 24px !important;
      background: #fff;
      display: flex;
      flex-direction: column;
      justify-content: center; /* 垂直居中 */
      position: relative;
    }

    .cmm-prod-title {
      font-size: 18px !important;
      font-weight: 700 !important;
      color: var(--cmm-text-head);
      margin: 0 0 6px 0 !important;
      line-height: 1.3 !important;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    .cmm-prod-sub {
      font-size: 13px !important;
      color: var(--cmm-text-body);
      margin: 0 0 16px 0 !important;
    }

    .cmm-price-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 0 !important; /* 不需要 auto margin */
    }

    .cmm-price {
      font-size: 22px !important;
      font-weight: 700 !important;
      color: #111827;
    }

    .cmm-btn-cart {
      background: #111827 !important;
      color: #fff !important;
      width: 38px !important;
      height: 38px !important;
      padding: 0 !important;
      border-radius: 50% !important;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background-color 0.2s;
      border: none !important;
      &:hover { background: #374151 !important; }
    }

    /* 轮播控制 */
    .cmm-ctrl-btn {
      position: absolute;
      /* [改动] 居中位置调整 */
      top: 50%;
      transform: translateY(-50%);
      background: rgba(255, 255, 255, 0.9) !important;
      color: #1f2937 !important;
      width: 32px !important;
      height: 32px !important;
      border-radius: 50% !important;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 2px 5px rgba(0,0,0,0.1);
      z-index: 30;
      opacity: 0;
      transition: opacity 0.3s;
      border: none !important;
    }

    .cmm-prev { left: 10px; }
    .cmm-next { left: auto; right: 10px; /* 控制只在图片区域？不，全屏 */ }
    /* 让右侧按钮位于整个容器的右侧，或者只在图片上？通常全容器方便 */
    
    /* Dots */
    .cmm-dots {
      position: absolute;
      bottom: 12px;
      left: 20%; /* 位于图片区域中心附近 */
      transform: translateX(-50%);
      display: flex;
      gap: 6px;
      z-index: 30;
    }

    .cmm-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: rgba(255,255,255,0.6);
      transition: all 0.3s;
      cursor: pointer;
      &.active { background: #fff; width: 16px; border-radius: 99px; }
    }

    /* Footer */
    .cmm-footer {
      margin-top: auto; /* [核心修改] 让Footer自动沉底，填充剩余空间 */
      padding-top: 12px !important;
      border-top: 1px solid var(--cmm-border);
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }

    .cmm-footer-item {
      font-size: 11px !important;
      color: var(--cmm-text-light);
      margin: 0 !important;
    }

    .cmm-footer-label {
      font-weight: 600 !important;
      color: var(--cmm-text-body);
      margin-bottom: 2px !important;
      display: block;
      font-size: 12px !important;
    }

    /* Mobile Content */
    .cmm-mobile-content {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.3s ease-out;
      background: #f9fafb;
      border-bottom: 1px solid transparent;
      @media (min-width: 768px) { display: none !important; }
    }

    .active .cmm-mobile-content { border-color: var(--cmm-border); }

    .cmm-mobile-inner {
      padding: 16px !important;
      max-width: 320px;
      margin: 0 auto;
      /* Mobile override: Reset carousel to vertical for phone */
      .cmm-carousel-container { height: auto; max-width: 300px; }
      .cmm-slide.active { flex-direction: column; }
      .cmm-img-wrapper { width: 100%; height: 200px; }
      .cmm-info-box { width: 100%; padding: 16px !important; }
      .cmm-dots { left: 50%; bottom: 130px; } /* Adjust for mobile */
    }
  }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d1f82cd */:root {
    --cmm-bg-body: #f9fafb;
    --cmm-bg-white: #ffffff;
    --cmm-text-head: #1f2937;
    --cmm-text-body: #4b5563;
    --cmm-text-light: #9ca3af;
    --cmm-blue-50: #eff6ff;
    --cmm-blue-600: #2563eb;
    --cmm-blue-700: #1d4ed8;
    --cmm-red: #dc2626;
    --cmm-border: #e5e7eb;
    --cmm-radius-xl: 12px;
    --cmm-radius-lg: 8px;
    --cmm-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  }

  /* * .cmm-menu-instance 容器
   */
  .cmm-menu-instance {
    box-sizing: border-box;
    width: 100%;
    /* 容器本身占满父级，依靠内部 card 控制视觉宽度 */
    padding: 10px !important; 
    background: transparent; 
    display: flex;
    justify-content: center;
    align-items: flex-start;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    position: relative;
    z-index: 999; 

    /* CSS Nesting */
    & * { box-sizing: border-box !important; }
    ul, li { list-style: none !important; margin: 0 !important; padding: 0 !important; }
    a { text-decoration: none !important; color: inherit; }

    /* 卡片主体 */
    .cmm-card {
      background: var(--cmm-bg-white);
      
      /* [核心修改] 宽度策略调整 */
      /* 1. 移动端默认 100% */
      width: 100%;
      
      border-radius: var(--cmm-radius-xl);
      box-shadow: var(--cmm-shadow-xl);
      border: 1px solid var(--cmm-border);
      overflow: hidden;
      display: flex;
      flex-direction: column;
      
      /* 高度控制：适应 8 个菜单项的高度 */
      min-height: 380px; 

      @media (min-width: 768px) {
        flex-direction: row;
        
        /* [核心修改] 桌面端强制固定宽度，防止跳动 */
        width: 1080px !important; 
        /* 保护措施：如果屏幕比 1080px 小，则不超过屏幕宽度的 95% */
        max-width: 95vw !important;
      }
    }

    /* 左侧导航栏 */
    .cmm-nav-col {
      width: 100%;
      background: var(--cmm-bg-white);
      display: flex;
      flex-direction: column;
      border-bottom: 1px solid var(--cmm-border);
      flex-shrink: 0; /* 防止被挤压 */

      @media (min-width: 768px) {
        /* 固定宽度 */
        width: 280px; 
        border-bottom: none;
        border-right: 1px solid var(--cmm-border);
      }
    }

    /* 导航标题 */
    .cmm-nav-header {
      padding: 14px 20px !important;
      background: #f8fafc;
      border-bottom: 1px solid var(--cmm-border);
      margin: 0 !important;

      h2 {
        font-size: 13px !important;
        font-weight: 700 !important;
        color: var(--cmm-text-head);
        text-transform: uppercase;
        letter-spacing: 0.05em;
        margin: 0 !important;
        padding: 0 !important;
      }
    }

    .cmm-nav-list {
      display: flex;
      flex-direction: column;
      padding: 6px 0 !important;
    }

    .cmm-nav-item {
      position: relative;
      margin: 0 !important;

      &.active .cmm-nav-btn {
        background-color: var(--cmm-blue-50) !important;
        color: var(--cmm-blue-700) !important;
        font-weight: 600 !important;
      }
      &.active .cmm-icon-arrow {
        opacity: 1;
        color: var(--cmm-blue-700);
      }
    }

    /* 按钮样式 - 更加紧凑 */
    .cmm-nav-btn {
      width: 100% !important;
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      padding: 12px 20px !important; /* 减少高度 */
      border: none !important;
      background: transparent !important;
      cursor: pointer !important;
      font-size: 15px !important;
      font-weight: 400 !important;
      color: var(--cmm-text-body) !important;
      transition: all 0.2s !important;
      text-align: left !important;

      &:hover {
        background-color: #f9fafb !important;
        color: #111827 !important;
      }
    }

    .cmm-icon-arrow {
      width: 14px;
      height: 14px;
      opacity: 0.4;
      transition: transform 0.3s;
      flex-shrink: 0; 
      @media (max-width: 767px) {
        .active & { transform: rotate(90deg); }
      }
    }

    /* 右侧内容区 */
    .cmm-content-col {
      display: none;
      /* [核心修改] flex: 1 确保填满剩余宽度 */
      flex: 1; 
      /* [改动] 减少内边距 */
      padding: 20px 24px !important; 
      background: var(--cmm-bg-white);
      position: relative;
      flex-direction: column;
      /* 确保内容垂直分布 */
      justify-content: flex-start;

      @media (min-width: 768px) {
        display: flex;
      }
    }

    /* 面板 */
    .cmm-panel {
      display: none;
      width: 100%;
      height: 100%;
      flex-direction: column;
      animation: cmmFadeIn 0.3s ease-out forwards;
      &.active { display: flex; }
    }

    @keyframes cmmFadeIn {
      from { opacity: 0; transform: translateY(2px); }
      to { opacity: 1; transform: translateY(0); }
    }

    .cmm-panel-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 16px !important; /* 减少间距 */
    }

    .cmm-panel-title {
      font-size: 20px !important; /* 稍微减小字号 */
      font-weight: 700 !important;
      color: var(--cmm-text-head);
      margin: 0 !important;
    }

    .cmm-link-all {
      font-size: 13px !important;
      font-weight: 500 !important;
      color: var(--cmm-blue-600) !important;
      display: flex;
      align-items: center;
      gap: 4px;
    }

    /* * [重构] 轮播容器 - 横向布局版
     */
    .cmm-carousel-container {
      /* [核心修改] flex: 1 允许其填充内容区域的高度，但由于卡片限高，这里也需要配合 */
      flex: 0 0 auto;
      width: 100%;
      /* [改动] 允许占满宽度 */
      max-width: 100%; 
      height: 220px; /* 固定高度，确保紧凑 */
      margin: 0 !important;
      position: relative;
      border-radius: var(--cmm-radius-lg);
      background: #fff;
      border: 1px solid var(--cmm-border);
      overflow: hidden;

      /* 桌面端悬停显示箭头 */
      @media (min-width: 768px) {
        &:hover .cmm-ctrl-btn { opacity: 1; }
      }
    }

    .cmm-slide {
      display: none;
      width: 100%;
      height: 100%;
      position: relative;
      text-decoration: none;
      
      /* [改动] 关键布局：横向排列 (Left Image, Right Content) */
      &.active {
        display: flex;
        flex-direction: row; 
        animation: cmmFadeIn 0.4s ease-in-out;
      }
    }

    .cmm-img-wrapper {
      position: relative;
      /* [改动] 图片占据左侧 40% */
      width: 40%; 
      height: 100%;
      overflow: hidden;
      flex-shrink: 0;
    }

    .cmm-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.7s;
      display: block; 
    }

    .cmm-carousel-container:hover .cmm-img {
      transform: scale(1.05);
    }

    .cmm-badge {
      position: absolute;
      top: 10px;
      left: 10px;
      background: var(--cmm-red);
      color: #fff;
      font-size: 11px !important;
      font-weight: 700 !important;
      padding: 4px 10px !important;
      border-radius: 4px;
      z-index: 20;
      display: flex;
      align-items: center;
      gap: 4px;
      line-height: 1;
      box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    }
    
    .cmm-badge svg { width: 11px; height: 11px; flex-shrink: 0; }

    .cmm-info-box {
      /* [改动] 内容占据右侧 60% */
      width: 60%;
      padding: 20px 24px !important;
      background: #fff;
      display: flex;
      flex-direction: column;
      justify-content: center; /* 垂直居中 */
      position: relative;
    }

    .cmm-prod-title {
      font-size: 18px !important;
      font-weight: 700 !important;
      color: var(--cmm-text-head);
      margin: 0 0 6px 0 !important;
      line-height: 1.3 !important;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    .cmm-prod-sub {
      font-size: 13px !important;
      color: var(--cmm-text-body);
      margin: 0 0 16px 0 !important;
    }

    .cmm-price-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 0 !important; /* 不需要 auto margin */
    }

    .cmm-price {
      font-size: 22px !important;
      font-weight: 700 !important;
      color: #111827;
    }

    .cmm-btn-cart {
      background: #111827 !important;
      color: #fff !important;
      width: 38px !important;
      height: 38px !important;
      padding: 0 !important;
      border-radius: 50% !important;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background-color 0.2s;
      border: none !important;
      &:hover { background: #374151 !important; }
    }

    /* 轮播控制 */
    .cmm-ctrl-btn {
      position: absolute;
      /* [改动] 居中位置调整 */
      top: 50%;
      transform: translateY(-50%);
      background: rgba(255, 255, 255, 0.9) !important;
      color: #1f2937 !important;
      width: 32px !important;
      height: 32px !important;
      border-radius: 50% !important;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 2px 5px rgba(0,0,0,0.1);
      z-index: 30;
      opacity: 0;
      transition: opacity 0.3s;
      border: none !important;
    }

    .cmm-prev { left: 10px; }
    .cmm-next { left: auto; right: 10px; /* 控制只在图片区域？不，全屏 */ }
    /* 让右侧按钮位于整个容器的右侧，或者只在图片上？通常全容器方便 */
    
    /* Dots */
    .cmm-dots {
      position: absolute;
      bottom: 12px;
      left: 20%; /* 位于图片区域中心附近 */
      transform: translateX(-50%);
      display: flex;
      gap: 6px;
      z-index: 30;
    }

    .cmm-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: rgba(255,255,255,0.6);
      transition: all 0.3s;
      cursor: pointer;
      &.active { background: #fff; width: 16px; border-radius: 99px; }
    }

    /* Footer */
    .cmm-footer {
      margin-top: auto; /* [核心修改] 让Footer自动沉底，填充剩余空间 */
      padding-top: 12px !important;
      border-top: 1px solid var(--cmm-border);
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }

    .cmm-footer-item {
      font-size: 11px !important;
      color: var(--cmm-text-light);
      margin: 0 !important;
    }

    .cmm-footer-label {
      font-weight: 600 !important;
      color: var(--cmm-text-body);
      margin-bottom: 2px !important;
      display: block;
      font-size: 12px !important;
    }

    /* Mobile Content */
    .cmm-mobile-content {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.3s ease-out;
      background: #f9fafb;
      border-bottom: 1px solid transparent;
      @media (min-width: 768px) { display: none !important; }
    }

    .active .cmm-mobile-content { border-color: var(--cmm-border); }

    .cmm-mobile-inner {
      padding: 16px !important;
      max-width: 320px;
      margin: 0 auto;
      /* Mobile override: Reset carousel to vertical for phone */
      .cmm-carousel-container { height: auto; max-width: 300px; }
      .cmm-slide.active { flex-direction: column; }
      .cmm-img-wrapper { width: 100%; height: 200px; }
      .cmm-info-box { width: 100%; padding: 16px !important; }
      .cmm-dots { left: 50%; bottom: 130px; } /* Adjust for mobile */
    }
  }/* End custom CSS */