/*
Theme Name: MyThemes
Theme URI: https://runyusi.com
Author: Runyusi
Description: Runyusi Hair WordPress theme converted from static HTML.
Version: 1.0.0
Text Domain: mythemes
*/

/* ================================================================
       设计令牌 / Design Tokens
       ================================================================ */
    :root{
      --color-bg: #ffffff;
      --color-text: #000000;
      --color-accent: #da1984;
      --color-accent-tint: #fdeaf3;
      --color-gray-light: #f5f5f5;
      --color-gray-mid: #999999;
      --color-gray-line: #e5e5e5;
      --font-display: 'Playfair Display', serif;
      --font-title: 'Playfair Title', 'Playfair Display', serif;
      --font-body: 'Poppins', sans-serif;
      --font-semibold: 'Poppins SemiBold', 'Poppins', sans-serif;
      --container-width: 1400px;
      --radius-btn: 2px;
    }

    * { box-sizing: border-box; margin:0; padding:0; }
    html { scroll-behavior: smooth; }
    body {
      font-family: var(--font-body);
      color: var(--color-text);
      background: var(--color-bg);
      line-height: 1.6;
      -webkit-font-smoothing: antialiased;
    }
    img { max-width: 100%; display:block; }
    a { text-decoration:none; color:inherit; }
    ul { list-style:none; }
    button { font-family: inherit; cursor:pointer; border:none; background:none; }
    .container { max-width: var(--container-width); margin:0 auto; padding:0 24px; }

    h1,h2,h3 { font-family: var(--font-body); font-weight:600; }

    /* 静态站 Poppins font-weight:600 → 本地 Poppins-SemiBold.ttf */
    .announce-bar b,
    .badge,
    .gallery-badge,
    .item-badge,
    .category-tag,
    .category-btn,
    .category-load-more,
    .footer-col h4,
    .inquiry-input-group button,
    .value-card h3,
    .team-card h3,
    .category-header h2,
    .category-header .product-count strong,
    .specs-table td:first-child,
    .tab-btn {
      font-family: var(--font-semibold);
    }
    .announce-bar b,
    .badge,
    .gallery-badge,
    .item-badge,
    .category-btn,
    .category-load-more,
    .footer-col h4,
    .inquiry-input-group button,
    .value-card h3,
    .team-card h3,
    .category-header h2,
    .category-header .product-count strong,
    .specs-table td:first-child {
      font-weight: 600;
      -webkit-text-stroke: 0;
    }

    /* 首页板块大标题：固定 PLAYFAIRDISPLAY-BOLD-4.TTF */
    .section-head h2,
    .head-row h2,
    .brand-story-text h2,
    .page-banner h1,
    .banner-content h1 {
      font-family: var(--font-title);
      font-weight: 700;
    }

    .img-box{
      position:relative;
      width:100%;
      background:var(--color-gray-light);
      display:flex; align-items:center; justify-content:center;
      overflow:hidden;
      color: var(--color-gray-mid);
      font-size:12px; letter-spacing:.05em; text-align:center; padding:8px;
    }
    .img-box img{
      position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
    }
    .slide .img-box,
    .category-circle .img-box,
    .product-image .img-box{
      height:100%;
    }
    .brand-story-img .img-box{ aspect-ratio:16/9; }

    .section-head{
      text-align:center;
      margin-bottom:36px;
    }
    .section-head .eyebrow{
      color:var(--color-accent);
      font-size:13px;
      letter-spacing:.15em;
      text-transform:uppercase;
      font-weight:500;
      margin-bottom:8px;
      display:block;
    }
    .section-head h2{
      font-size:32px;
      letter-spacing:.01em;
      line-height:1.25;
    }
    .section-head .divider{
      width:48px; height:2px; background:var(--color-accent);
      margin:14px auto 0;
    }
    .head-row{
      display:flex; align-items:flex-end; justify-content:space-between;
      gap:16px;
      margin-bottom:32px;
    }
    .head-row h2{
      font-size:30px;
      line-height:1.25;
    }
    .view-all{
      color:var(--color-accent);
      font-size:14px; font-weight:500;
      letter-spacing:.03em;
      border-bottom:1px solid var(--color-accent);
      padding-bottom:2px;
      white-space:nowrap;
    }

    .btn{
      display:inline-block;
      padding:13px 32px;
      font-size:13px;
      letter-spacing:.1em;
      text-transform:uppercase;
      font-weight:500;
      border-radius: var(--radius-btn);
      transition: all .25s ease;
    }
    .btn-primary{
      background: var(--color-accent);
      color:#fff;
    }
    .btn-primary:hover{ background:#b31469; }
    .btn-outline{
      background:transparent;
      color:var(--color-text);
      border:1px solid var(--color-text);
    }
    .btn-outline:hover{
      background:var(--color-text);
      color:#fff;
    }

    .announce-bar{
      background:#000;
      color:#fff;
      text-align:center;
      font-size:12px;
      letter-spacing:.08em;
      padding:9px 20px;
      line-height:1.5;
    }
    .announce-bar b{ color: var(--color-accent); font-weight:600; font-family: var(--font-semibold); }

    header{
      position:sticky; top:0; z-index:200;
      background:#fff;
      border-bottom:1px solid var(--color-gray-line);
    }
    /* 登录后台后 WP 管理条会盖住吸顶导航，下移避开 */
    .admin-bar header{
      top:32px;
    }
    @media screen and (max-width:782px){
      .admin-bar header{
        top:46px;
      }
    }
    .nav-wrap{
      display:flex; align-items:center; justify-content:space-between;
      padding:16px 24px;
      max-width: var(--container-width);
      margin:0 auto;
      gap: 16px;
      position: relative;
    }
    .logo{
      flex-shrink: 0;
      z-index: 2;
    }
    .logo img{
      height:38px; width:auto;
      display:block;
    }
    .nav-links{
      display:flex; gap:44px;
      align-items: center;
    }
    /* 主导航顶层：Poppins Regular + 轻微加粗 */
    .nav-links > a,
    .nav-links > .nav-item-has-dropdown > a,
    .nav-links > .nav-item-has-dropdown .nav-dropdown-row > a{
      font-family: 'Poppins Nav', 'Poppins', sans-serif;
      font-size:16px;
      font-weight:400;
      letter-spacing:.06em;
      -webkit-text-stroke: 0.45px currentColor;
      position:relative;
      padding:6px 0;
      white-space: nowrap;
    }
    .nav-dropdown-row{
      display: contents;
    }
    .nav-dropdown-toggle{
      display: none;
    }
    .nav-links > a,
    .nav-links > .nav-item-has-dropdown > a,
    .nav-links > .nav-item-has-dropdown .nav-dropdown-row > a{
      position:relative;
      padding:6px 0;
    }
    .nav-links > a::after,
    .nav-links > .nav-item-has-dropdown > a::after,
    .nav-links > .nav-item-has-dropdown .nav-dropdown-row > a::after{
      content:''; position:absolute; left:0; bottom:0;
      width:0; height:2px; background:var(--color-accent);
      transition:width .25s ease;
    }
    .nav-links > a:hover::after,
    .nav-links > a.active::after,
    .nav-links > .nav-item-has-dropdown > a:hover::after,
    .nav-links > .nav-item-has-dropdown > a.active::after,
    .nav-links > .nav-item-has-dropdown .nav-dropdown-row > a:hover::after,
    .nav-links > .nav-item-has-dropdown .nav-dropdown-row > a.active::after{ width:100%; }
    .nav-links > a:hover,
    .nav-links > a.active,
    .nav-links > .nav-item-has-dropdown > a:hover,
    .nav-links > .nav-item-has-dropdown > a.active,
    .nav-links > .nav-item-has-dropdown .nav-dropdown-row > a:hover,
    .nav-links > .nav-item-has-dropdown .nav-dropdown-row > a.active{ color:var(--color-accent); }

    .nav-icons{
      display:flex; align-items:center; gap:16px;
      flex-shrink: 0;
      z-index: 2;
    }
    .nav-icons button{ position:relative; display:flex; align-items:center; justify-content:center; }
    .icon{ width:20px; height:20px; stroke:#000; fill:none; stroke-width:1.6; }
    .burger{
      display: none !important;
      width: 28px;
      height: 28px;
      flex-direction: column;
      justify-content: center;
      gap: 5px;
      padding: 0;
    }
    .burger span{
      display: block;
      width: 22px; height: 2px; background: #000;
      transition: transform .25s ease, opacity .25s ease;
      margin: 0 auto;
    }
    .burger.is-active span:nth-child(1){
      transform: translateY(7px) rotate(45deg);
    }
    .burger.is-active span:nth-child(2){
      opacity: 0;
    }
    .burger.is-active span:nth-child(3){
      transform: translateY(-7px) rotate(-45deg);
    }

    .nav-overlay{
      display: none;
    }

    /* 手机端抽屉内搜索：PC 隐藏 */
    .nav-mobile-search{
      display: none;
    }

    /* 头部搜索 */
    .header-search{
      position: relative;
    }
    .header-search-toggle.is-active .icon{
      stroke: var(--color-accent);
    }
    .header-search-panel{
      position: absolute;
      top: calc(100% + 14px);
      right: 0;
      width: 320px;
      background: #fff;
      border: 1px solid var(--color-gray-line);
      box-shadow: 0 12px 30px rgba(0,0,0,.08);
      padding: 12px;
      opacity: 0;
      visibility: hidden;
      transform: translateY(-6px);
      transition: all .2s ease;
      z-index: 300;
    }
    .header-search-panel.is-open{
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
    }
    .header-search-form{
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .header-search-input{
      flex: 1;
      min-width: 0;
      height: 40px;
      border: 1px solid var(--color-gray-line);
      padding: 0 12px;
      font-family: var(--font-body);
      font-size: 13px;
      outline: none;
      background: #fff;
    }
    .header-search-input:focus{
      border-color: var(--color-accent);
    }
    .header-search-submit{
      width: 40px;
      height: 40px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: var(--color-accent);
      flex-shrink: 0;
    }
    .header-search-submit .icon{
      stroke: #fff;
      width: 16px;
      height: 16px;
    }
    .header-search-submit:hover{
      background: #b31469;
    }

    /* 搜索结果页 */
    .breadcrumb{
      padding: 18px 0;
      border-bottom: 1px solid var(--color-gray-line);
    }
    .breadcrumb ul{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
    .breadcrumb li{ font-size:13px; color:var(--color-gray-mid); }
    .breadcrumb a:hover{ color:var(--color-accent); }
    .breadcrumb li.current{ color:var(--color-text); font-weight:500; }

    .search-banner{
      padding: 64px 0;
      text-align: center;
      background: var(--color-gray-light);
    }
    .search-banner h1{ font-size: 36px; margin-bottom: 10px; }
    .search-banner .subtitle{ color: var(--color-gray-mid); font-size: 14px; }
    .search-banner .divider{
      width:48px; height:2px; background:var(--color-accent);
      margin:16px auto 0;
    }

    .search-results{ padding: 0 0 80px; }
    section.search-results{ padding-top: 0; }
    .search-page-form{
      display:flex; gap:10px; max-width:560px; margin:0 auto 36px;
    }
    .search-page-form input{
      flex:1; height:46px; border:1px solid var(--color-gray-line);
      padding:0 16px; font-family:var(--font-body); font-size:14px; outline:none;
    }
    .search-page-form input:focus{ border-color:var(--color-accent); }
    .search-page-form button{
      padding:0 24px; background:var(--color-accent); color:#fff;
      font-size:13px; letter-spacing:.08em; text-transform:uppercase; font-weight:500;
    }
    .search-page-form button:hover{ background:#b31469; }
    .search-count{
      text-align:center; color:var(--color-gray-mid); font-size:13px; margin-bottom:28px;
    }
    .search-grid{
      display:grid; grid-template-columns:repeat(4,1fr); gap:28px;
    }
    .search-card-image{
      position: relative;
      overflow: hidden;
    }
    .search-card-image .img-box{ aspect-ratio:1/1; }
    .search-card-image .item-badges{
      position: absolute;
      top: 10px;
      left: 10px;
      z-index: 2;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 6px;
    }
    .search-card-image .item-badge{
      display: inline-block;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: .06em;
      padding: 4px 12px;
      border-radius: 2px;
      color: #fff;
      text-transform: uppercase;
      line-height: 1.3;
    }
    .search-card-image .item-badge.badge-hot{ background: #da1984; }
    .search-card-image .item-badge.badge-new{ background: #2a8a4a; }
    .search-card-image .item-badge.badge-oem{ background: #e67e22; }
    .search-card-title{
      margin-top:14px; font-size:15px; font-weight:500; line-height:1.4;
    }
    .search-card-excerpt{
      margin-top:8px; font-size:13px; color:var(--color-gray-mid); line-height:1.6;
    }
    .search-card-link:hover .search-card-title{ color:var(--color-accent); }
    .search-empty{
      text-align:center; padding:40px 0 20px;
    }
    .search-empty p{ margin-bottom:24px; color:var(--color-gray-mid); }
    .search-pagination{ margin-top:48px; text-align:center; }
    .search-pagination .nav-links,
    .search-pagination .page-numbers{
      display:inline-flex; gap:8px; align-items:center; flex-wrap:wrap; justify-content:center;
    }
    .search-pagination .page-numbers{
      min-width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center;
      border:1px solid var(--color-gray-line); font-size:13px; padding:0 10px;
    }
    .search-pagination .page-numbers.current,
    .search-pagination .page-numbers:hover{
      background:var(--color-accent); color:#fff; border-color:var(--color-accent);
    }

    @media (max-width: 1024px){
      .search-grid{ grid-template-columns:repeat(2,1fr); }
    }
    @media (max-width: 720px){
      .header-search-panel{ width: min(320px, calc(100vw - 32px)); right: -8px; }
      .search-grid{ grid-template-columns:1fr; }
      .search-page-form{ flex-direction:column; }
    }

    .hero-slider{
      position:relative;
      width:100%;
      aspect-ratio: 16/6.2;
      max-height:744px;
      overflow:hidden;
      background:var(--color-gray-light);
    }
    .slide{
      position:absolute; inset:0;
      opacity:0;
      transition:opacity .7s ease;
    }
    .slide.active{ opacity:1; }
    .slide a, .slide .img-box{ width:100%; height:100%; display:block; }

    .slider-arrow{
      position:absolute; top:50%; transform:translateY(-50%);
      width:44px; height:44px; border-radius:50%;
      background:rgba(255,255,255,.85);
      display:flex; align-items:center; justify-content:center;
      z-index:10; transition:background .2s;
    }
    .slider-arrow:hover{ background:#fff; }
    .slider-arrow svg{ width:18px; height:18px; stroke:#000; }
    .slider-arrow:hover svg{ stroke:var(--color-accent); }
    .arrow-prev{ left:20px; }
    .arrow-next{ right:20px; }
    .hero-slider .arrow-prev{ left:72px; }
    .hero-slider .arrow-next{ right:72px; }

    .slider-dots{
      position:absolute; bottom:20px; left:50%; transform:translateX(-50%);
      display:flex; gap:8px; z-index:10;
    }
    .dot{
      width:9px; height:9px; border-radius:50%;
      background:rgba(0,0,0,.25);
      transition: background .2s, transform .2s;
    }
    .dot.active{ background:var(--color-accent); transform:scale(1.15); }

    section{ padding:64px 0; }
    .alt-bg{ background:var(--color-gray-light); }

    .category-grid{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:40px 24px;
    }
    .category-item{
      text-align:center;
      display:flex;
      flex-direction:column;
      align-items:center;
    }
    .category-circle{
      width: 85%;
      aspect-ratio: 1/1;
      max-width: 260px;
      margin: 0 auto;
      border-radius: 50%;
      overflow: hidden;
      border: 1px solid var(--color-gray-line);
      transition: border-color .25s, transform .25s;
    }
    .category-item:hover .category-circle{
      border-color:var(--color-accent);
      transform:translateY(-4px);
    }
    .category-item p{
      margin-top:16px;
      font-size:14px;
      font-weight:500;
      position:relative;
      display:inline-block;
    }
    .category-item p::after{
      content:'';
      display:block;
      width:0;
      height:1px;
      background:var(--color-accent);
      margin:6px auto 0;
      transition:width .25s ease;
    }
    .category-item:hover p::after{
      width:60%;
    }

    .category-btn{
      display:inline-block;
      margin-top:10px;
      padding:6px 20px;
      font-size:12px;
      font-weight:400;
      color:var(--color-accent);
      background:transparent;
      border:1.5px solid var(--color-accent);
      border-radius:20px;
      letter-spacing:0.04em;
      transition:all 0.3s ease;
      text-decoration:none;
    }
    .category-btn:hover{
      background:var(--color-accent);
      color:#fff;
      transform:translateY(-2px);
      box-shadow:0 4px 16px rgba(218,25,132,0.3);
    }
    .category-btn:active{
      transform:scale(0.95);
    }
    .category-item.is-hidden{
      display:none;
    }
    .category-load-more-wrap{
      text-align:center;
      margin-top:32px;
    }
    .category-load-more{
      display:inline-block;
      padding:12px 32px;
      font-size:13px;
      font-weight:400;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:#fff;
      background:var(--color-accent);
      border:none;
      border-radius:var(--radius-btn);
      transition:background .25s ease;
    }
    .category-load-more:hover{
      background:#b31469;
    }

    /* ================================================================
       热销产品 / Hot Selling Products
       ================================================================ */
    .products-section {
      position: relative;
      overflow: visible;
    }

    .products-carousel-wrapper {
      position: relative;
      padding: 0 30px;
    }

    .products-carousel-clip {
      overflow: hidden;
    }

    .product-grid {
      display: flex;
      gap: 28px;
      transition: transform 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
      will-change: transform;
    }

    .product-card {
      flex: 0 0 auto;
      width: calc(25% - 21px);
      min-width: 0;
      position: relative;
      display: block;
      color: inherit;
      text-decoration: none;
    }

    .product-image {
      position: relative;
      aspect-ratio: 1 / 1;
      overflow: hidden;
      background: var(--color-gray-light);
    }

    .badge {
      position: absolute; top:12px; left:12px; z-index:5;
      background:var(--color-accent); color:#fff;
      font-size:10px; font-weight:600; letter-spacing:.06em;
      padding:5px 10px;
    }

    .product-hover-btn {
      position:absolute; left:0; right:0; bottom:0;
      background:var(--color-accent); color:#fff;
      text-align:center; padding:12px;
      font-size:12px; letter-spacing:.08em; text-transform:uppercase; font-weight:500;
      transform:translateY(100%);
      transition:transform .25s ease;
    }
    .product-card:hover .product-hover-btn { transform:translateY(0); }

    .product-name {
      margin-top:16px; font-size:15px; font-weight:500; text-align:center;
    }

    .carousel-arrow {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 48px;
      height: 48px;
      border-radius: 50%;
      background: rgba(255,255,255,0.95);
      box-shadow: 0 4px 20px rgba(0,0,0,0.10);
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 20;
      border: 1px solid #eee;
      cursor: pointer;
      transition: all 0.25s ease;
    }
    .carousel-arrow:hover {
      background: #fff;
      box-shadow: 0 6px 24px rgba(0,0,0,0.12);
      border-color: var(--color-accent);
    }
    .carousel-arrow svg {
      width: 20px;
      height: 20px;
      stroke: #222;
      stroke-width: 2.2;
      fill: none;
    }
    .carousel-arrow:hover svg {
      stroke: var(--color-accent);
    }

    .carousel-arrow.arrow-prev {
      left: -20px;
      transform: translateY(-50%) translateX(0);
    }

    .carousel-arrow.arrow-next {
      right: -20px;
      transform: translateY(-50%) translateX(0);
    }
    
    /* ================================================================
       通用大型下拉菜单样式 — 与静态站 index.html 保持一致
       ================================================================ */
    .nav-item-has-dropdown {
      position: static; 
    }

    .nav-wrap {
      position: relative; 
    }

    .mega-menu {
      position: absolute;
      top: 100%;
      left: 24px;   
      right: 24px;  
      background: #ffffff;
      box-shadow: 0 15px 35px rgba(0,0,0,0.08);
      border: 1px solid var(--color-gray-line);
      padding: 35px 40px;
      opacity: 0;
      visibility: hidden;
      transition: all 0.25s ease-in-out;
      z-index: 999;
      font-family: var(--font-body);
      line-height: 1.6;
      -webkit-font-smoothing: antialiased;
    }

    .nav-item-has-dropdown:hover .mega-menu {
      opacity: 1;
      visibility: visible;
    }

    .mega-menu-container {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); 
      gap: 40px;
      max-width: 1200px; 
      margin: 0 auto;    
    }

    .mega-menu-col h3 {
      font-size: 15px;
      font-weight: 600;
      color: #000;
      margin: 0 0 16px;
      padding: 0;
      text-transform: uppercase;
      font-family: var(--font-body) !important;
      letter-spacing: normal;
      line-height: 1.6;
      -webkit-text-stroke: 0;
    }
    .mega-menu-col h3 a {
      font-family: inherit !important;
      font-size: inherit !important;
      font-weight: inherit !important;
      letter-spacing: inherit !important;
      line-height: inherit !important;
      -webkit-text-stroke: 0 !important;
      color: inherit !important;
      text-decoration: none !important;
      padding: 0 !important;
      margin: 0 !important;
      display: inline !important;
      position: static !important;
    }
    .mega-menu-col h3 a:hover {
      color: var(--color-accent) !important;
    }
    .mega-menu-col h3 a::after,
    .mega-menu-col h3 a::before {
      display: none !important;
      content: none !important;
      width: 0 !important;
      height: 0 !important;
    }

    .mega-menu-col ul {
      display: flex;
      flex-direction: column;
      gap: 12px;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .mega-menu-col ul li {
      margin: 0;
      padding: 0;
      line-height: 1.6;
    }

    .mega-menu-col ul li a {
      font-size: 14px !important;
      color: #555 !important;
      font-weight: 400 !important;
      font-family: var(--font-body) !important;
      letter-spacing: normal !important;
      line-height: 1.6 !important;
      -webkit-text-stroke: 0 !important;
      text-decoration: none !important;
      padding: 0 !important;
      margin: 0 !important;
      display: inline !important;
      position: static !important;
      transition: color 0.2s ease;
      white-space: normal;
    }

    .mega-menu-col ul li a:hover {
      color: var(--color-accent) !important;
    }

    .mega-menu-col ul li a::after,
    .mega-menu-col ul li a::before {
      display: none !important;
      content: none !important;
      width: 0 !important;
      height: 0 !important;
    }

    @media (max-width: 1024px) {
      .product-card {
        width: calc(50% - 14px);
      }
      .carousel-arrow.arrow-prev {
        left: 8px;
        transform: translateY(-50%) translateX(0);
      }
      .carousel-arrow.arrow-next {
        right: 8px;
        transform: translateY(-50%) translateX(0);
      }
    }
    @media (max-width: 720px) {
      .product-card {
        width: calc(50% - 14px);
      }
      .carousel-arrow {
        width: 40px;
        height: 40px;
      }
      .carousel-arrow svg {
        width: 16px;
        height: 16px;
      }
      .carousel-arrow.arrow-prev {
        left: 4px;
        transform: translateY(-50%) translateX(0);
      }
      .carousel-arrow.arrow-next {
        right: 4px;
        transform: translateY(-50%) translateX(0);
      }
      .mega-menu {
        position: static;
        transform: none !important;
        width: 100%;
        left: auto;
        right: auto;
        box-shadow: none;
        border: none;
        border-top: 1px solid var(--color-gray-line);
        padding: 10px 0 8px 12px;
        opacity: 1;
        visibility: visible;
        display: none;
        margin-top: 4px;
      }
      .nav-item-has-dropdown.is-open > .mega-menu {
        display: block;
      }
      .nav-item-has-dropdown:hover .mega-menu {
        display: none;
      }
      .nav-item-has-dropdown.is-open:hover .mega-menu,
      .nav-item-has-dropdown.is-open .mega-menu {
        display: block;
      }
      .mega-menu-container {
        grid-template-columns: 1fr !important;
        gap: 18px;
        max-width: none;
      }
      .mega-menu-col h3 {
        margin-bottom: 16px;
        font-size: 15px;
      }
      .mega-menu-col ul {
        gap: 12px;
      }
      .mega-menu-col ul li a {
        font-size: 14px !important;
        padding: 0 !important;
        border-bottom: none;
        width: auto;
      }
    }

    .brand-story{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:48px;
      align-items:center;
    }
    .brand-story-text .eyebrow{
      color:var(--color-accent); font-size:13px; letter-spacing:.15em;
      text-transform:uppercase; font-weight:500; display:block; margin-bottom:10px;
    }
    .brand-story-text h2{
      font-family: var(--font-title);
      font-size:30px;
      font-weight:700;
      line-height:1.25;
      margin-bottom:10px;
    }
    .story-divider{
      width:48px; height:2px; background:var(--color-accent); margin-bottom:20px;
    }
    .brand-story-cont{
      --story-line-h: calc(15px * 1.7);
      /* 13 行正文 + 段落间距余量，保证当前三段默认不出现滚动条 */
      max-height: calc(var(--story-line-h) * 13 + 48px);
      overflow-y: hidden;
      overflow-x: hidden;
      margin-bottom: 28px;
      padding-right: 5px;
      max-width: 720px;
      width: 100%;
      color: #333;
      font-size: 15px;
      line-height: 1.7;
    }
    .brand-story-cont.is-scrollable{
      overflow-y: auto;
      scrollbar-width: thin;
      scrollbar-color: rgba(218, 25, 132, 0.55) transparent;
    }
    .brand-story-cont.is-scrollable::-webkit-scrollbar{
      width: 4px;
    }
    .brand-story-cont.is-scrollable::-webkit-scrollbar-track{
      background: transparent;
    }
    .brand-story-cont.is-scrollable::-webkit-scrollbar-thumb{
      background: rgba(218, 25, 132, 0.45);
      border-radius: 999px;
    }
    .brand-story-cont.is-scrollable::-webkit-scrollbar-thumb:hover{
      background: rgba(218, 25, 132, 0.75);
    }
    .brand-story-cont p{
      color:#333; font-size:15px; margin-bottom:16px; max-width:none;
      line-height: 1.7;
    }
    .brand-story-cont p:last-child{
      margin-bottom: 0;
    }
    .brand-story-text p{
      color:#333; font-size:15px; margin-bottom:28px; max-width:600px;
    }

    .brand-story-img .img-wrapper{
      position: relative;
      width: 100%;
    }

    .brand-story-img .advantage-badge{
      position: absolute;
      bottom: -80px;
      left: 20px;
      right: 20px;
      background: rgba(255, 255, 255, 0.92);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      padding: 20px 24px 18px;
      border-radius: 12px;
      z-index: 5;
      border: 1px solid rgba(255, 255, 255, 0.3);
      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.10);
      transition: all 0.3s ease;
    }

    .brand-story-img .advantage-badge:hover{
      background: rgba(255, 255, 255, 0.98);
      transform: translateY(-2px);
      box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
    }

    .brand-story-img .advantage-content{
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .brand-story-img .advantage-title{
      font-family: var(--font-display);
      font-size: 20px;
      font-weight: 700;
      color: var(--color-accent);
      letter-spacing: 0.02em;
    }

    .brand-story-img .advantage-desc{
      font-size: 13px;
      font-weight: 400;
      color: #555;
      letter-spacing: 0.03em;
    }

    .play-video-btn {
      position: absolute;
      top: 16px;
      right: 16px;
      width: 48px;
      height: 48px;
      border-radius: 50%;
      background: rgba(218, 25, 132, 0.9);
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 10;
      transition: all 0.3s ease;
      box-shadow: 0 4px 16px rgba(218, 25, 132, 0.4);
      border: 2px solid rgba(255, 255, 255, 0.3);
    }

    .play-video-btn:hover {
      background: rgba(218, 25, 132, 1);
      transform: scale(1.1);
      box-shadow: 0 6px 24px rgba(218, 25, 132, 0.6);
    }

    .play-video-btn svg {
      width: 22px;
      height: 22px;
      margin-left: 3px;
      fill: #fff;
      stroke: #fff;
    }

    .video-modal {
      display: none;
      position: fixed;
      inset: 0;
      z-index: 9999;
      align-items: center;
      justify-content: center;
      animation: modalFadeIn 0.3s ease;
    }

    .video-modal.active {
      display: flex;
    }

    .video-modal-overlay {
      position: absolute;
      inset: 0;
      background: rgba(0, 0, 0, 0.8);
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
    }

    .video-modal-content {
      position: relative;
      width: 90%;
      max-width: 800px;
      background: #000;
      border-radius: 16px;
      overflow: hidden;
      box-shadow: 0 24px 80px rgba(0, 0, 0, 0.6);
      z-index: 10;
      animation: modalContentIn 0.3s ease;
    }

    .video-modal-close {
      position: absolute;
      top: 12px;
      right: 12px;
      width: 40px;
      height: 40px;
      border-radius: 50%;
      background: rgba(0, 0, 0, 0.6);
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 20;
      border: 1px solid rgba(255, 255, 255, 0.15);
      transition: all 0.3s ease;
      cursor: pointer;
    }

    .video-modal-close:hover {
      background: rgba(218, 25, 132, 0.8);
      transform: rotate(90deg);
    }

    .video-modal-close svg {
      width: 24px;
      height: 24px;
      stroke: #fff;
      stroke-width: 2;
    }

    .video-modal-body {
      position: relative;
      padding-bottom: 56.25%;
      height: 0;
      background: #000;
    }

    .video-modal-body video {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: #000;
    }

    @keyframes modalFadeIn {
      from { opacity: 0; }
      to { opacity: 1; }
    }

    @keyframes modalContentIn {
      from {
        opacity: 0;
        transform: scale(0.95) translateY(20px);
      }
      to {
        opacity: 1;
        transform: scale(1) translateY(0);
      }
    }

    .stats-band{
      background:#da1984;
      padding:48px 0;
    }
    .stats-grid{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      text-align:center;
    }
    .stats-grid .stat + .stat{ border-left:1px solid rgba(255,255,255,0.3); }
    .stat-number{
      font-family: var(--font-body);
      font-size:36px; font-weight:700; color:#ffffff;
      line-height:1;
      letter-spacing:-.01em;
    }
    .stat-label{
      margin-top:8px; font-size:13px; color:#ffffff; letter-spacing:.02em;
    }

    .review-grid{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:24px;
    }
    .review-card{ text-align:center; }
    .review-video{
      position:relative;
      aspect-ratio:9/16;
      background:#111;
      overflow:hidden;
      cursor:pointer;
    }
    .review-video video{
      width:100%; height:100%; object-fit:cover;
      display:block;
    }
    .review-video .play-btn{
      position:absolute;
      top:50%; left:50%;
      transform:translate(-50%,-50%);
      width:56px; height:56px;
      border-radius:50%;
      background:rgba(255,255,255,.92);
      display:flex;
      align-items:center;
      justify-content:center;
      transition: all 0.3s ease;
      pointer-events:none;
      box-shadow: 0 4px 20px rgba(0,0,0,0.15);
    }
    .review-video .play-btn svg{
      width:20px; height:20px;
      fill:var(--color-accent);
      margin-left:3px;
    }
    .review-video .play-btn.hidden{
      opacity:0;
      transform:translate(-50%,-50%) scale(0.8);
    }
    .review-video:hover .play-btn:not(.hidden){
      transform:translate(-50%,-50%) scale(1.05);
      background:rgba(255,255,255,1);
    }
    .review-stars{
      margin-top:16px; display:flex; justify-content:center; gap:3px;
    }
    .review-stars svg{ width:15px; height:15px; fill:var(--color-accent); }
    .review-text{
      margin-top:10px; font-size:13.5px; color:#333; padding:0 6px;
    }
    .review-name{
      margin-top:10px; font-size:13px; font-weight:600; letter-spacing:.02em;
    }
    .review-card.is-hidden{
      display:none;
    }
    .review-load-more-wrap{
      text-align:center;
      margin-top:32px;
    }
    .review-load-more{
      display:inline-block;
      padding:12px 32px;
      font-size:13px;
      font-weight:400;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:#fff;
      background:var(--color-accent);
      border:none;
      border-radius:var(--radius-btn);
      transition:background .25s ease;
      cursor:pointer;
    }
    .review-load-more:hover{
      background:#b31469;
    }

    footer{
      background:#000; color:#fff; padding:64px 0 0;
    }
    .footer-grid{
      display:grid;
      grid-template-columns: 1.35fr 1fr 1.1fr 1fr;
      gap: 40px 32px;
      padding-bottom:48px;
      border-bottom:1px solid rgba(255,255,255,.12);
      align-items: start;
    }
    .footer-col{
      min-width: 0;
    }
    .footer-col:nth-child(3) {
      margin-left: 0;
    }
    .footer-col h4{
      font-family: var(--font-semibold);
      font-size:14px; letter-spacing:.06em; text-transform:uppercase;
      margin-bottom:20px; font-weight:600;
    }
    .footer-col p {
       font-size: 12.5px;
       color: #bbb;
       margin-bottom: 12px;
       line-height: 1.8;    
     }
    .footer-col p a{
      color: inherit;
      transition: color .2s;
      word-break: break-word;
    }
    .footer-col p a:hover{
      color: var(--color-accent);
    }
    .footer-col .footer-address{
      max-width: 80%;
    }
    .footer-col ul li{ margin-bottom:11px; }
    .footer-col ul li a{ font-size:13.5px; color:#ccc; transition:color .2s; }
    .footer-col ul li a:hover{ color:var(--color-accent); }
    .footer-nav-list{
      list-style: none;
      margin: 0;
      padding: 0;
    }
    .footer-nav-list .sub-menu{
      display: none;
    }
    .footer-logo img{ height:32px; margin-bottom:16px; filter:brightness(0) invert(1); }
    .social-icons{ display:flex; gap:14px; flex-wrap:wrap; margin-top: 4px; }
    .social-icons a{
      width:34px; height:34px;border-radius:50%;
      display:flex; align-items:center; justify-content:center; transition:.2s;
      background: transparent;
      overflow: hidden;
      flex-shrink: 0;
    }
    .social-icons a:hover{
      border-color: #da1984;
      background: #da1984;
    }
    .social-icons a img{
      width: 34px;
      height: 34px;
      object-fit: contain;
      display: block;
      filter: none;
    }
    .social-icons svg{ width:15px; height:15px; stroke:#fff; fill:none; }
    .footer-bottom{
      text-align:center; padding:22px 0; font-size:12px; color:#777;
    }
    .footer-bottom-sep{
      margin: 0 10px;
      color: #999;
    }
    .footer-sitemap{
      color: #777;
      text-decoration: none;
      transition: color .2s;
    }
    .footer-sitemap:hover{
      color: #fff;
    }
    
    .footer-inquiry .inquiry-desc {
      font-size: 13px;
      color: #bbb;
      margin-bottom: 16px;
      line-height: 1.5;
    }

    .inquiry-form {
      width: 100%;
    }

    .footer-cf7-form .wpcf7 {
      margin: 0;
    }
    .footer-cf7-form .form-note {
      display: none !important;
    }
    .footer-cf7-form .wpcf7-form {
      margin: 0;
    }
    .footer-cf7-form .wpcf7-form > p,
    .footer-cf7-form .wpcf7-form > div {
      margin: 0;
    }
    .footer-cf7-form .wpcf7-spinner {
      display: none;
    }
    .footer-cf7-form .wpcf7-response-output {
      margin: 12px 0 0;
      padding: 8px 10px;
      font-size: 12px;
      line-height: 1.4;
      border-radius: 4px;
      border-width: 1px;
      color: #fff;
    }
    .footer-cf7-form .wpcf7-not-valid-tip {
      font-size: 12px;
      color: #ffb3d4;
      margin-top: 6px;
    }
    .footer-cf7-form .inquiry-input-group .wpcf7-form-control-wrap {
      display: block;
      width: 100%;
    }

    .inquiry-input-group {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .inquiry-input-group input[type="email"],
    .inquiry-input-group input[type="text"],
    .inquiry-input-group input.wpcf7-form-control {
      width: 100%;
      background: rgba(255, 255, 255, 0.08);
      border: 1px solid rgba(255, 255, 255, 0.2);
      border-radius: 4px;
      padding: 12px 16px;
      color: #fff;
      font-size: 13px;
      font-family: var(--font-body);
      outline: none;
      transition: border-color 0.3s ease, background 0.3s ease;
      box-sizing: border-box;
    }

    .inquiry-input-group input::placeholder {
      color: #888;
      font-size: 13px;
    }

    .inquiry-input-group input:focus {
      border-color: var(--color-accent);
      background: rgba(255, 255, 255, 0.15);
    }

    .inquiry-input-group button,
    .inquiry-input-group input[type="submit"],
    .inquiry-input-group .wpcf7-submit {
      width: 100%;
      background: var(--color-accent);
      color: #fff;
      border: none;
      border-radius: 4px;
      padding: 12px 16px;
      font-size: 13px;
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      font-family: var(--font-semibold);
      cursor: pointer;
      transition: background 0.3s ease, transform 0.2s ease;
    }

    .inquiry-input-group button:hover,
    .inquiry-input-group input[type="submit"]:hover,
    .inquiry-input-group .wpcf7-submit:hover {
      background: #b31469;
      transform: translateY(-2px);
    }

    .inquiry-input-group button:active,
    .inquiry-input-group input[type="submit"]:active,
    .inquiry-input-group .wpcf7-submit:active {
      transform: scale(0.97);
    }

    /* 底部自适应 */
    @media (max-width: 1200px) {
      .footer-grid {
        grid-template-columns: 1.2fr 1fr 1fr 1fr;
        gap: 32px 24px;
      }
    }

    @media (max-width: 1024px) {
      footer {
        padding: 48px 0 0;
      }
      .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 36px 28px;
        padding-bottom: 36px;
      }
      .footer-col:nth-child(3),
      .footer-col:nth-child(4) {
        margin-left: 0;
      }
      .footer-col .footer-address {
        max-width: 100%;
      }
    }

    @media (max-width: 720px) {
      footer {
        padding: 40px 0 0;
      }
      .footer-grid {
        grid-template-columns: 1fr;
        gap: 32px;
        padding-bottom: 28px;
      }
      .footer-col h4 {
        margin-bottom: 14px;
      }
      .footer-col .footer-address {
        max-width: 100%;
      }
      .footer-logo img {
        height: 28px;
      }
      .social-icons {
        gap: 12px;
      }
      .footer-bottom {
        padding: 18px 0;
        font-size: 11px;
        line-height: 1.6;
      }
    }

    .reveal{
      opacity: 0;
      transform: translateY(28px);
      transition: opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1);
    }
    .reveal.in-view{
      opacity: 1;
      transform: translateY(0);
    }

    .slide .img-box img{
      transition: transform 6s ease-out;
      transform: scale(1);
    }
    .slide.active .img-box img{
      transform: scale(1.08);
    }

    .category-circle{ overflow:hidden; }
    .category-circle .img-box img,
    .product-image .img-box img{
      transition: transform .5s ease;
    }
    .category-item:hover .category-circle .img-box img{
      transform: scale(1.1);
    }
    .product-card:hover .product-image .img-box img{
      transform: scale(1.06);
    }

    .btn:active,
    .product-hover-btn:active,
    .play-video-btn:active{
      transform: scale(.96);
    }

    .stats-grid .stat{
      transition: transform .3s ease;
    }
    .stats-grid .stat:hover{
      transform: translateY(-4px);
    }

    .back-to-top{
      display: none !important;
    }

    /* ================================================================
       右侧浮动通讯栏：图标固定，内容从右侧滑出
       ================================================================ */
    .float-contact{
      position: fixed;
      right: 0;
      top: 50%;
      transform: translateY(-50%);
      z-index: 200;
      display: flex;
      flex-direction: column;
      align-items: flex-end;
    }
    .float-contact-item{
      position: relative;
      width: 50px;
      height: 50px;
      background: var(--color-accent);
      overflow: visible;
      margin-bottom: 1px;
    }
    .float-contact-item:last-child{
      margin-bottom: 0;
    }
    .float-contact-inner{
      display: block;
      width: 50px;
      height: 50px;
      position: relative;
      margin: 0;
      padding: 0;
      border: none;
      background: transparent;
      color: #fff;
      text-decoration: none;
      cursor: pointer;
      font-family: var(--font-body);
      appearance: none;
      -webkit-appearance: none;
    }
    .float-contact-icon{
      position: relative;
      z-index: 2;
      width: 50px;
      height: 50px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: var(--color-accent);
    }
    .float-contact-icon img{
      width: 32px;
      height: 32px;
      max-width: none;
      object-fit: contain;
      display: block;
    }
    .float-contact-text{
      position: absolute;
      right: 50px;
      top: 0;
      z-index: 1;
      height: 50px;
      min-width: 230px;
      box-sizing: border-box;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 0 16px;
      background: var(--color-accent);
      color: #fff;
      font-size: 13px;
      font-weight: 500;
      letter-spacing: .02em;
      white-space: nowrap;
      line-height: 1.3;
      transform: translateX(100%);
      transition: transform .35s ease;
      pointer-events: none;
    }
    .float-contact-item:hover .float-contact-text,
    .float-contact-item:focus-within .float-contact-text{
      transform: translateX(0);
      pointer-events: auto;
    }
    .float-contact-item.is-qr .float-contact-text{
      top: 50%;
      height: auto;
      padding: 10px 12px;
      transform: translateX(100%) translateY(-50%);
    }
    .float-contact-item.is-qr:hover .float-contact-text,
    .float-contact-item.is-qr:focus-within .float-contact-text{
      transform: translateX(0) translateY(-50%);
    }
    .float-contact-qr{
      width: 96px;
      height: 96px;
      max-width: none;
      object-fit: cover;
      display: block;
      background: #fff;
      border-radius: 2px;
    }
    .float-contact-item.is-icon-only .float-contact-text{
      display: none;
    }

    .announce-bar b{
      display: inline-block;
      animation: announcePulse 2.6s ease-in-out infinite;
    }
    @keyframes announcePulse{
      0%, 100% { opacity: 1; }
      50% { opacity: .65; }
    }

    @media (max-width: 1024px){
      /* 首页板块间距 / 标题 */
      section{ padding:48px 0; }
      .section-head{ margin-bottom:28px; }
      .section-head h2{ font-size:28px; }
      .head-row{ margin-bottom:24px; }
      .head-row h2{ font-size:26px; }
      .brand-story{
        grid-template-columns:1fr;
        gap:32px;
      }
      .brand-story-text h2{ font-size:26px; }
      .brand-story-img .img-wrapper{ margin-bottom:56px; }
      .brand-story-img .advantage-badge{
        bottom:-48px;
        left:16px;
        right:16px;
        padding:16px 18px;
      }
      .brand-story-img .advantage-title{ font-size:18px; }
      .stats-band{ padding:40px 0; }
      .stat-number{ font-size:32px; }
      .category-grid{ grid-template-columns:repeat(4,1fr); gap:28px 16px; }
      .category-load-more-wrap,
      .review-load-more-wrap{ margin-top:28px; }
      .review-grid{ grid-template-columns:repeat(2,1fr); gap:20px; }
      .products-carousel-wrapper{ padding:0 20px; }

      /* 平板起启用抽屉导航 */
      .nav-wrap{
        padding: 12px 16px;
      }
      .logo img{
        height: 32px;
      }
      .nav-links{
        position: fixed;
        top: 0;
        left: 0;
        width: min(86vw, 360px);
        height: 100vh;
        height: 100dvh;
        background: #fff;
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        gap: 0;
        padding: 72px 20px 32px;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        transform: translateX(-105%);
        transition: transform .3s ease;
        z-index: 220;
        box-shadow: 8px 0 30px rgba(0,0,0,.08);
      }
      .nav-links.open{
        transform: translateX(0);
      }
      .nav-links > a,
      .nav-links > .nav-item-has-dropdown{
        width: 100%;
        border-bottom: 1px solid var(--color-gray-line);
      }
      .nav-links > a,
      .nav-links > .nav-item-has-dropdown > a,
      .nav-links > .nav-item-has-dropdown .nav-dropdown-row > a{
        display: flex;
        align-items: center;
        justify-content: flex-start;
        width: 100%;
        padding: 14px 0;
        font-size: 15px;
        font-weight: 400;
        white-space: normal;
        -webkit-text-stroke: 0.55px currentColor;
      }
      .nav-dropdown-row{
        display: flex;
        align-items: center;
        width: 100%;
        min-height: 0;
      }
      .nav-dropdown-row > a{
        flex: 1;
        min-width: 0;
      }
      .nav-dropdown-toggle{
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 32px;
        height: auto;
        align-self: stretch;
        padding: 0;
        margin: 0 -4px 0 0;
        color: var(--color-gray-mid);
        font-size: 18px;
        line-height: 1;
        border: none;
        background: transparent;
        cursor: pointer;
      }
      .nav-dropdown-toggle::before{
        content: '+';
        font-weight: 400;
        -webkit-text-stroke: 0;
      }
      .nav-item-has-dropdown.is-open .nav-dropdown-toggle{
        color: var(--color-accent);
      }
      .nav-item-has-dropdown.is-open .nav-dropdown-toggle::before{
        content: '−';
      }
      .nav-links > a::after,
      .nav-links > .nav-item-has-dropdown > a::after,
      .nav-links > .nav-item-has-dropdown .nav-dropdown-row > a::after{
        display: none;
      }

      /* PC 搜索隐藏；抽屉内搜索显示 */
      .header-search{
        display: none !important;
      }
      .nav-mobile-search{
        display: block;
        width: 100%;
        margin-bottom: 8px;
        padding-bottom: 16px;
        border-bottom: 1px solid var(--color-gray-line);
      }
      .nav-mobile-search-form{
        display: flex;
        align-items: center;
        gap: 8px;
      }
      .nav-mobile-search-input{
        flex: 1;
        min-width: 0;
        height: 42px;
        border: 1px solid var(--color-gray-line);
        padding: 0 12px;
        font-family: var(--font-body);
        font-size: 14px;
        outline: none;
        background: #fff;
      }
      .nav-mobile-search-input:focus{
        border-color: var(--color-accent);
      }
      .nav-mobile-search-submit{
        width: 42px;
        height: 42px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: var(--color-accent);
        flex-shrink: 0;
      }
      .nav-mobile-search-submit .icon{
        stroke: #fff;
        width: 16px;
        height: 16px;
      }

      .burger{ display: flex !important; }
      .nav-overlay{
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,.4);
        opacity: 0;
        visibility: hidden;
        transition: opacity .25s ease, visibility .25s ease;
        z-index: 210;
      }
      .nav-overlay.is-open{
        opacity: 1;
        visibility: visible;
      }
      body.nav-open{
        overflow: hidden;
        touch-action: none;
      }

      /* 移动/平板下拉改为手风琴，不用 hover */
      .mega-menu {
        position: static !important;
        left: auto !important;
        right: auto !important;
        width: 100% !important;
        box-shadow: none !important;
        border: none !important;
        border-top: 1px solid var(--color-gray-line) !important;
        padding: 14px 0 12px 8px !important;
        opacity: 1 !important;
        visibility: visible !important;
        display: none !important;
        transform: none !important;
      }
      .nav-item-has-dropdown.is-open > .mega-menu {
        display: block !important;
      }
      .nav-item-has-dropdown:hover .mega-menu {
        display: none !important;
      }
      .nav-item-has-dropdown.is-open:hover > .mega-menu {
        display: block !important;
      }
      .mega-menu-container {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
        max-width: none !important;
      }
    }
    @media (max-width: 720px){
      .announce-bar{
        font-size: 11px;
        letter-spacing: .04em;
        padding: 8px 12px;
      }
      .nav-wrap{
        padding: 10px 14px;
      }
      .logo img{
        height: 28px;
      }
      .nav-icons{
        gap: 12px;
      }
      .nav-links{
        padding-top: 64px;
      }

      /* 首页板块间距 / 标题 */
      .container{ padding:0 16px; }
      section{ padding:36px 0; }
      .section-head{ margin-bottom:22px; }
      .section-head .eyebrow,
      .brand-story-text .eyebrow{
        font-size:11px;
        letter-spacing:.12em;
        margin-bottom:6px;
      }
      .section-head h2,
      .head-row h2,
      .brand-story-text h2{
        font-size:22px;
      }
      .section-head .divider,
      .story-divider{
        width:36px;
        margin-top:10px;
      }
      .head-row{ margin-bottom:20px; }
      .view-all{ font-size:13px; }
      .brand-story{ gap:24px; }
      .brand-story-cont{
        font-size:14px;
        margin-bottom:20px;
      }
      .brand-story-cont p{ font-size:14px; }
      .brand-story-img .img-wrapper{ margin-bottom:48px; }
      .brand-story-img .advantage-badge{
        bottom:-40px;
        left:12px;
        right:12px;
        padding:14px 14px;
      }
      .brand-story-img .advantage-title{ font-size:16px; }
      .brand-story-img .advantage-desc{ font-size:12px; }
      .stats-band{ padding:32px 0; }
      .stats-grid{ grid-template-columns:repeat(2,1fr); gap:20px 0; }
      .stats-grid .stat:nth-child(3){ border-left:none; }
      .stats-grid .stat{ border-left:none !important; }
      .stat-number{ font-size:28px; }
      .stat-label{ font-size:12px; margin-top:6px; }
      .category-grid{ grid-template-columns:repeat(2,1fr); gap:20px 12px; }
      .category-item p{ margin-top:12px; font-size:13px; }
      .category-load-more-wrap,
      .review-load-more-wrap{ margin-top:24px; }
      .review-grid{ gap:16px; }
      .products-carousel-wrapper{ padding:0 12px; }

      /* 首屏轮播按钮靠两边 */
      .hero-slider .arrow-prev{ left:10px; }
      .hero-slider .arrow-next{ right:10px; }
      .hero-slider .slider-arrow{
        width:36px;
        height:36px;
      }
      .hero-slider .slider-arrow svg{
        width:16px;
        height:16px;
      }
    }

    @media (max-width: 480px){
      section{ padding:28px 0; }
      .section-head h2,
      .head-row h2,
      .brand-story-text h2{
        font-size:20px;
      }
      .stat-number{ font-size:24px; }
      .stats-band{ padding:28px 0; }
    }

    @media (min-width: 1025px) and (max-width: 1280px){
      .nav-links{ gap: 28px; }
      .nav-links > a,
      .nav-links > .nav-item-has-dropdown > a{
        font-size: 14px;
        letter-spacing: .04em;
      }
    }