/* 修改页面容器宽度 */
.page-wrapper {
    /*max-width: 1920px;*/
    /*margin: 0 auto;*/
    width: 100%;
}

/* 修改主要内容区域 */
.page-main {
    max-width: 1920px;
    /*margin: 0 auto;*/
}

/* 修改页头宽度 */
.page-header {
    /*max-width: 1920px;*/
    /*margin: 0 auto;*/
    width: 100%;
}

/* 修改页脚宽度 */
.page-footer {
    /*max-width: 1920px;*/
    /*margin: 0 auto;*/
    width: 100%;
}

/* 修改内容容器宽度 */
.columns {
    max-width: 1920px;
    margin: 0 auto;
}
.top-message{
    color: #FFFFFF;
    background: #000000;
    font-size: 16px;
    height:50px;
    width: 100%;
    display: grid;   /* 同时垂直和水平居中 */
    place-items: center; /* 同时垂直和水平居中 */
}
.navigation .level0 > .level-top{
    line-height:85px !important;
}
.page-footer{
    background: #000000 !important;
}
.new_led {
    text-align: center;
    margin:0 auto;
    max-width: 1200px;
    padding: 20px 0 20px 0;
    background-color: #FFFBF5;
    position: relative;
}
/* 左侧色块 */
.new_led::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%; /* 先定位到中间 */
    transform: translateX(-100%); /* 向左移动一个自身宽度，即刚好贴在左边 */
    width: 50vw; /* 视口宽度的50%，确保能覆盖左侧空白 */
    height: 100%;
    background-color: #FFFBF5; /* 设置为和中间一样的颜色 */
    z-index: -1; /* 放到背后，避免遮挡内容 */
}

/* 右侧色块 */
.new_led::after {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    width: 50vw;
    height: 100%;
    background-color: #FFFBF5;
    z-index: -1;
}

.new_led h2 {
    font-size: 32px;
    color: #2d3436;
    font-weight: 700;
    margin-top:80px;
    margin-bottom:10px !important;
}

.new_led_img {
    display: flex;                      /* 启用Flexbox */
    justify-content: center;           /* 水平居中 */
    align-items: stretch;              /* 垂直拉伸等高 */
    gap: 30px;                         /* 元素间距 */
}

.new_led_img_show {
    flex: 1;                           /* 等分宽度 */
    max-width: 320px;                  /* 最大宽度 */
    min-width: 280px;                  /* 最小宽度 */
    background: white;
    border-radius: 15px;
    padding: 30px 20px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid #f0f0f0;
    text-align: center;
    display: flex;
    flex-direction: column;            /* 垂直排列内部元素 */
    align-items: center;               /* 水平居中内部元素 */
}

.new_led_img_show:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.12);
}

.new_led_img_show img {
    width: 120px;
    height: 120px;
    object-fit: contain;
    margin-bottom: 20px;
    border-radius: 50%;
    padding: 20px;
}

.new_led_img_show h3 {
    color: #000000;
    font-size: 20px;
    margin: 15px 0;
    font-weight: 600;
    flex-grow: 1;                      /* 标题区域可以扩展 */
}

.new_led_img_show p {
    color: #666;
    font-size: 16px;
    line-height: 1.5;
    margin-top: auto;                  /* 将描述推到底部 */
}

.newkey-footer-4col{
    flex-wrap: wrap;
    padding: 40px 20px;
    display: flex;
    justify-content: center; /* 水平居中 */
    gap: 30px;
    max-width: 1200px; /* 设置最大宽度 */
    margin: 0 auto; /* 左右自动边距实现居中 */
}

.newkey-footer-4col .footer-col h3{
    color:#FFFFFF;
    font-size: 18px;
    margin-bottom: 20px;
}
.footer.content .links {
    display: inline-block;
    padding-right: 50px;
    vertical-align: top;
    color: #808080;
}

/**
home page
 */

.breadcrumbs
{
    max-width:1425px !important;
}
.customer-account-link{
    display: inline-block;
    padding: 32px 15px;
}


.block-search{
    float:left !important;
}



.cms-home.cms-index-index .page-main
{
    margin: 20px auto !important;
}

.new-title{
    height:106px;
    padding-bottom: 20px;
}
.new-tile-left{
    float:left;
}
.new-title-right{
    float:right;
}

.new-title-right h1{
    color: #000000;
    font-weight: bold;
    margin-bottom:0;
}
.new-title-right p{
    color:#808080;
    margin-top:10px;
}

.nav-sections,.navigation{
    background: #FFFFFF !important;
    font-size: 1.8rem;
    margin-bottom: 0 !important;
}

.cms-skincare-guide .new_led_img_show
{
    background: #F2F2F2;
}

.cms-skincare-guide .breadcrumbs,.cms-skincare-guide .page-title-wrapper{
    display:none;
}

.cms-skincare-guide .content-heading h2{
    text-align: center !important;
    font-weight: Bold !important;
}
.cms-skincare-guide .faq{
    margin-top:100px;
}

body{
    font-family: 'Poppins', sans-serif;
}

.footer-col span{
    color:#7B7B7B;
}
.cms-index-index .product-item-info{
    border: 1px solid #E3E3E3;
}

@media screen and (min-width: 768px), print {
    .page-layout-1column .block.widget .products-grid .product-item {
        margin-left: 2% !important;
        width: calc((100% - 11.58%) / 3) !important;
        text-align:center;
    }
}

.products-grid.grid{
    background-color:#FFFBF5;
    position: relative; /* 为伪元素提供定位参考 */
}

/* 左侧色块 */
.products-grid.grid::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%; /* 先定位到中间 */
    transform: translateX(-100%); /* 向左移动一个自身宽度，即刚好贴在左边 */
    width: 50vw; /* 视口宽度的50%，确保能覆盖左侧空白 */
    height: 100%;
    background-color: #FFFBF5; /* 设置为和中间一样的颜色 */
    z-index: -1; /* 放到背后，避免遮挡内容 */
}

/* 右侧色块 */
.products-grid.grid::after {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    width: 50vw;
    height: 100%;
    background-color: #FFFBF5;
    z-index: -1;
}


.page-main {
    width: 100%;
    max-width: 1425px !important;
    margin: 0 auto;
    justify-content: space-between;
    align-items: center;
    padding: 0 !important;
}

.header.content{
    width: 100% ;
    max-width: 1425px !important;
    display: block;
    margin: 0 auto !important;
    justify-content: space-between;
    align-items: center;
    padding:0 !important;
    height: 85px;
}
.logo{
    margin:21px !important;
    width:85px;
    height:42px !important;
}

.sections.nav-sections
{
    width: 50% !important;
    display: block;
    float: left;
    margin-left:200px;
}
.block-search {
    margin: 26px auto;
}

.minicart-wrapper {
    vertical-align: middle;
    margin: 28px 0 !important;
    float:none !important;
}


/**
gift page
 */
.gift_tile{
    width:100%;
    height:159px;
    text-align: center;
}
.gift_tile h1{
    color:#000000;
    font-weight: bold;
    margin-top:50px;
    margin-bottom: 10px !important;
}
.gift_tile p,.product-detail .product-desc p{
    color:#000000;
    font-family: 'Poppins', sans-serif;
    font-size:20px;
}

.product-left{
    display:inline-block;
    width:700px;
}
.product-left img{
    width:700px;
    height: 700px;
}
.product-right
{
    width:700px;
    height:700px;
    display:inline-block;
}
.product-detail
{
    height: 600px;
    padding: 30px;
}
.product-detail .product-desc
{
    height:460px;
}
.product-info
{
    background-color: #FFFFFF;
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px;
    border: 1px solid #E3E3E3;
}


.product-info img{
    width: 140px;
    height: 140px;
    border: 1px solid #E3E3E3;
}


.product-info .product-name{

}
.product-info .product-price{
    padding-top: 15px;
}

.product-list .product-row
{
    width:1400px;
    height:700px;
    display: flex;                /* 启用flex布局 */
    /*gap: 25px;                    !* 两个div之间的间距 *!*/
    margin-bottom:25px;
    background-color: #F2F2F2;

}

.fad{
    text-align: center;
    margin: 60px auto;
    max-width: 1200px;
    padding: 0 20px;
}

.fad h2{
    font-size: 32px;
    color: #2d3436;
    margin-bottom: 40px;
    font-weight: 700;
}
.fad .cleared
{
    display: flex;
    justify-content: center;
    align-items: stretch;
    gap: 30px;
}
.fad .cleared .new_led_img_show
{
    flex: 1;
    max-width: 320px;
    min-width: 280px;
    background: white;
    border-radius: 15px;
    padding: 30px 20px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    border: 1px solid #f0f0f0;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.cms-index-index .block-title
{
    display: none;
}

a:hover
{
    text-decoration:none;
}



/*.faq-search-container {*/
/*    margin: 20px 0;*/
/*    position: relative;*/
/*}*/


/*.faq-search-wrapper {*/
/*    display: flex;*/
/*    align-items: center;*/
/*    gap: 10px;*/
/*}*/


/*.faq-search-input {*/
/*    flex: 9;*/
/*    height: 50px !important;*/
/*    padding: 0 20px !important;*/
/*    font-size: 18px;*/
/*    border: 2px solid #e1e1e1;*/
/*    border-radius: 25px;*/
/*    outline: none;*/
/*    background-color: #fff;*/
/*    transition: border-color 0.3s ease, box-shadow 0.3s ease;*/
/*}*/


/*.faq-search-input:focus {*/
/*    border-color: #1979c3;*/
/*    box-shadow: 0 4px 8px rgba(25, 121, 195, 0.1);*/
/*}*/
/*.faq-search-input input{*/
/*    height: 50px;*/
/*}*/

/*.faq-search-btn {*/
/*    flex: 1;*/
/*    height: 50px;*/
/*    padding: 0 10px;*/
/*    background-color: #1979c3;*/
/*    color: #fff;*/
/*    border: none;*/
/*    border-radius: 25px;*/
/*    font-size: 16px;*/
/*    font-weight: 600;*/
/*    cursor: pointer;*/
/*    white-space: nowrap;*/
/*    transition: background-color 0.3s ease, transform 0.1s ease;*/
/*    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);*/
/*}*/

/*.faq-search-btn:hover {*/
/*    background-color: #13659f;*/
/*    transform: scale(1.02);*/
/*}*/

/*.faq-search-btn:active {*/
/*    transform: scale(0.98);*/
/*}*/

/*.faq-search-wrappe input {*/
/*    height: 50px;*/
/*}*/



.newkey-product-compare .product-reviews-section .three-columns .images
{
    display: flex;
    gap: 3px;
}
.newkey-product-compare .product-reviews-section .three-columns .column
{
    width: 300px;
}
.newkey-product-compare .product-reviews-section .three-columns .column .content
{
    margin-top:20px ;
}
.newkey-product-compare .product-reviews-section .three-columns .column .content span
{
    font-weight: bold;
    font-size: 14px;
}
.newkey-product-compare .product-reviews-section .sections-header,
.newkey-product-compare .product-reviews-section .all-product-videos .recommend
{
    display:flex;
    justify-content: space-between;
}

.newkey-product-compare .product-reviews-section .all-product-videos
{
    margin-top:40px;
}


.newkey-product-compare .all-product-videos .prodct-info
{
    background-color: #FFFFFF;
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px;
    border: 1px solid #E3E3E3;
}



 /* 视频网格布局 - 用于多个视频 */
        .video-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 20px;
            margin-bottom: 20px;
        }

        /* 视频包装: 16:9 响应式 */
        .video-wrapper {
            position: relative;
            width: 100%;
            padding-bottom: 56.25%; /* 16:9 */
            background: #000;
            border-radius: 12px;
            overflow: hidden;
            box-shadow: 0 2px 10px rgba(0,0,0,0.2);
        }

        .video-wrapper iframe {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border: none;
        }

        /* 视频下方控制栏: 静音切换 + 分享/点赞组 */
        .video-actions-bar {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: space-between;
            margin: 20px 0 15px;
            padding: 8px 0;
            border-bottom: 1px solid #eee;
        }

        .mute-control {
            display: flex;
            align-items: center;
            gap: 10px;
        }

        .mute-btn {
            background: #f2f2f2;
            border: 1px solid #ccc;
            border-radius: 30px;
            padding: 8px 18px;
            font-size: 14px;
            font-weight: 600;
            color: #333;
            cursor: pointer;
            transition: all 0.2s;
            display: flex;
            align-items: center;
            gap: 6px;
        }

        .mute-btn:hover {
            background: #e6e6e6;
            border-color: #999;
        }

        .mute-btn.muted {
            background: #ddd;
            color: #666;
        }

        .mute-icon {
            font-size: 18px;
            line-height: 1;
        }

        .badge-magento {
            font-size: 13px;
            color: #777;
            background: #fafafa;
            padding: 4px 10px;
            border-radius: 20px;
            border: 1px solid #e1e1e1;
        }

        /* 社交互动区域 (点赞 + 分享) - 每个视频独立 */
        .video-card {
            background: #fff;
            border-radius: 8px;
            overflow: hidden;
            border: 1px solid #eee;
            transition: transform 0.2s, box-shadow 0.2s;
        }

        .video-card:hover {
            transform: translateY(-2px);
            box-shadow: 0 4px 12px rgba(0,0,0,0.1);
        }

        .social-interaction {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 12px 15px;
            background: #fafafa;
            border-top: 1px solid #eee;
        }

        .like-section {
            display: flex;
            align-items: center;
            gap: 10px;
        }

        .btn-like {
            background: none;
            border: 1px solid #e1e1e1;
            border-radius: 30px;
            padding: 6px 18px;
            font-size: 14px;
            font-weight: 600;
            color: #555;
            cursor: pointer;
            transition: all 0.2s;
            display: flex;
            align-items: center;
            gap: 6px;
        }

        .btn-like:hover {
            background-color: #f8f8f8;
            border-color: #1979c3;
            color: #1979c3;
        }

        .btn-like.liked {
            background-color: #1979c3;
            border-color: #1979c3;
            color: white;
        }

        .like-count {
            font-weight: 400;
            background: rgba(0,0,0,0.04);
            padding: 2px 8px;
            border-radius: 30px;
            font-size: 13px;
            margin-left: 5px;
        }

        .btn-like.liked .like-count {
            background: rgba(255,255,255,0.2);
            color: #fff;
        }

        .share-dropdown {
            position: relative;
            display: inline-block;
        }

        .btn-share {
            background: none;
            border: 1px solid #e1e1e1;
            border-radius: 30px;
            padding: 6px 18px;
            font-size: 14px;
            font-weight: 600;
            color: #555;
            cursor: pointer;
            transition: all 0.2s;
            display: flex;
            align-items: center;
            gap: 6px;
        }

        .btn-share:hover {
            background-color: #f8f8f8;
            border-color: #1979c3;
            color: #1979c3;
        }

        .share-menu {
            display: none;
            position: absolute;
            right: 0;
            top: 40px;
            background: white;
            border: 1px solid #ddd;
            border-radius: 12px;
            box-shadow: 0 6px 18px rgba(0,0,0,0.1);
            padding: 8px 0;
            min-width: 160px;
            z-index: 10;
        }

        .share-menu a {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 8px 16px;
            color: #333;
            text-decoration: none;
            font-size: 13px;
            transition: background 0.2s;
        }

        .share-menu a:hover {
            background-color: #f0f0f0;
            color: #1979c3;
        }

        .share-dropdown.open .share-menu {
            display: block;
        }

        /* 模拟YouTube静音播放样式 (静音指示器) */
        .mute-indicator {
            background: rgba(0,0,0,0.6);
            color: white;
            font-size: 13px;
            padding: 4px 12px;
            border-radius: 30px;
            position: absolute;
            bottom: 20px;
            right: 20px;
            z-index: 5;
            pointer-events: none;
            backdrop-filter: blur(2px);
            border: 1px solid rgba(255,255,255,0.2);
        }

        /* 小图标使用文本模拟 */
        .icon {
            font-size: 1.2em;
            line-height: 1;
        }

        hr {
            border: none;
            border-top: 1px solid #e9e9e9;
            margin: 20px 0 10px;
        }

        /* 提示信息 */
        .demo-note {
            background: #fff7e6;
            border-left: 4px solid #ffb500;
            padding: 12px 18px;
            border-radius: 8px;
            font-size: 14px;
            color: #5f4a28;
            margin-top: 15px;
        }

        .demo-note i {
            font-style: normal;
            background: #ffb50033;
            padding: 2px 8px;
            border-radius: 20px;
        }

        .video-title {
            padding: 10px 15px;
            font-size: 14px;
            font-weight: 600;
            color: #333;
            background: #fff;
            border-bottom: 1px solid #eee;
        }
.newkey-product-compare .product-reviews-section
{
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

.newkey-product-compare .product-reviews-section,
.hexablog-index-index .product-reviews-section
{
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}


.newkey-product-compare .product-reviews-section .three-columns,
.hexablog-index-index .product-reviews-section .three-columns
{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 150px;
    width: 100%;
}

.newkey-product-compare .product-reviews-section .three-columns .column,
.hexablog-index-index .product-reviews-section .three-columns .colum
{
    background: #fff;
    overflow: hidden;
    border: 1px solid #e9e9e9;
}

.newkey-product-compare .product-reviews-section .three-columns .column .product-info,
.hexablog-index-index .product-reviews-section .three-columns .column .product-info
{
    margin-bottom: 5px;
    background-color: #FFFFFF;
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px;
    border-top: 1px solid #E3E3E3
}

.hexablog-index-index .product-reviews-section .three-columns .images
{
    display: flex;
    gap: 3px;
}