/* HMX_V1 首页装修 动态产品 / 动态新闻 新版式 (HM_MORE_V1 2026-10-03)
   e_index.html 输出 .dyn-prod-wrap.dynp-<版式> 与 .news-full-wrapper.dynn-<版式>
   本文件只写 showcase / framed / minimal 与 featured / magazine / overlay, 旧版式不受影响
   主题色跟随 --primary-blue / --hover-blue / --accent-blue / --primary-rgb */

/* ================= 动态产品: 公共 ================= */
.dyn-prod-wrap.dynp-showcase .product-grid,
.dyn-prod-wrap.dynp-framed .product-grid,
.dyn-prod-wrap.dynp-minimal .product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}
.dyn-prod-wrap.dynp-minimal .product-grid{gap:40px 32px}
.dyn-prod-wrap.dynp-showcase .dyn-head h2::after,
.dyn-prod-wrap.dynp-framed .dyn-head h2::after,
.dyn-prod-wrap.dynp-minimal .dyn-head h2::after{content:"";display:block;width:44px;height:3px;margin:16px auto 0;
border-radius:2px;background:var(--primary-blue,#0056b3)}
.dyn-prod-wrap.dynp-showcase .dyn-head p,
.dyn-prod-wrap.dynp-framed .dyn-head p,
.dyn-prod-wrap.dynp-minimal .dyn-head p{max-width:680px;margin:14px auto 0;line-height:1.7}

/* ---- showcase 浅底展台(左对齐 + 文字链接) ---- */
.dyn-prod-wrap.dynp-showcase .dyn-head{text-align:start}
.dyn-prod-wrap.dynp-showcase .dyn-head h2::after{margin:16px 0 0}
.dyn-prod-wrap.dynp-showcase .dyn-head p{margin:14px 0 0}
.dyn-prod-wrap.dynp-showcase .product-card,
.dyn-prod-wrap.dynp-showcase .product-card:hover{background:transparent;box-shadow:none;transform:none}
.dyn-prod-wrap.dynp-showcase .product-card .img-box{padding:12%;border-radius:14px;background:#f3f5f7}
.dyn-prod-wrap.dynp-showcase .product-card .img-box img{mix-blend-mode:multiply}
.dyn-prod-wrap.dynp-showcase .product-card .info-box{padding:18px 2px 0;text-align:start}
.dyn-prod-wrap.dynp-showcase .product-card .p-name{margin:0 0 10px;font-size:16px;font-weight:600}
.dyn-prod-wrap.dynp-showcase .view-more-btn,
.dyn-prod-wrap.dynp-showcase .view-more-btn:hover{align-self:flex-start;width:auto;padding:0 0 3px;border:0;
background:linear-gradient(currentColor,currentColor) no-repeat 0 100%/0 1px;color:var(--primary-blue,#0056b3);
font-size:13px;letter-spacing:.5px;text-transform:none;text-align:start;transition:background-size .3s ease,color .3s ease}
.dyn-prod-wrap.dynp-showcase .product-card:hover .view-more-btn{background-size:100% 1px;color:var(--hover-blue,#004494)}
[dir="rtl"] .dyn-prod-wrap.dynp-showcase .view-more-btn{background-position:100% 100%}

/* ---- framed 描边白卡 + 整宽按钮 ---- */
.dyn-prod-wrap.dynp-framed .product-card{overflow:hidden;border:1px solid #e6eaef;border-radius:14px;background:#fff;
transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease}
.dyn-prod-wrap.dynp-framed .product-card:hover{transform:translateY(-4px);border-color:transparent;
box-shadow:0 18px 40px rgba(16,24,40,.1)}
.dyn-prod-wrap.dynp-framed .product-card .img-box{padding:24px;border-bottom:1px solid #eef1f4;background:#fff}
.dyn-prod-wrap.dynp-framed .product-card .info-box{padding:18px 18px 20px}
.dyn-prod-wrap.dynp-framed .product-card .p-name{margin:0 0 16px;font-size:16px}
.dyn-prod-wrap.dynp-framed .view-more-btn{align-self:stretch;width:auto;padding:11px 12px;border:0;border-radius:8px;
background:rgba(var(--primary-rgb,0,86,179),.08);color:var(--primary-blue,#0056b3);font-size:12px;text-align:center;
transition:background-color .3s ease,color .3s ease}
.dyn-prod-wrap.dynp-framed .product-card:hover .view-more-btn,
.dyn-prod-wrap.dynp-framed .view-more-btn:hover{background:var(--primary-blue,#0056b3);color:#fff}

/* ---- minimal 极简无卡(产品名 + 主题色短线) ---- */
.dyn-prod-wrap.dynp-minimal .product-card,
.dyn-prod-wrap.dynp-minimal .product-card:hover{background:transparent;box-shadow:none;transform:none}
.dyn-prod-wrap.dynp-minimal .product-card .img-box{padding:8%;background:transparent}
.dyn-prod-wrap.dynp-minimal .product-card:hover .img-box img{transform:scale(1.06)}
.dyn-prod-wrap.dynp-minimal .product-card .info-box{padding:14px 4px 0}
.dyn-prod-wrap.dynp-minimal .product-card .p-name{margin:0;font-size:16px;font-weight:600}
.dyn-prod-wrap.dynp-minimal .product-card .info-box::after{content:"";display:block;width:24px;height:2px;
margin:12px auto 0;border-radius:2px;background:var(--primary-blue,#0056b3);transition:width .35s ease}
.dyn-prod-wrap.dynp-minimal .product-card:hover .info-box::after{width:56px}
.dyn-prod-wrap.dynp-minimal .view-more-btn{display:none}

/* ================= 动态新闻: 公共 ================= */
.news-full-wrapper.dynn-featured .news-item-row,
.news-full-wrapper.dynn-featured .news-item-row:hover,
.news-full-wrapper.dynn-magazine .news-item-row,
.news-full-wrapper.dynn-magazine .news-item-row:hover{border-radius:0;background:transparent;box-shadow:none}
.news-full-wrapper.dynn-featured .img-aspect-box,
.news-full-wrapper.dynn-magazine .img-aspect-box{border-radius:12px}
.news-full-wrapper.dynn-featured .no-news-message,
.news-full-wrapper.dynn-magazine .no-news-message,
.news-full-wrapper.dynn-overlay .no-news-message{grid-column:1/-1}

/* ---- featured 头条大图 + 右侧列表 ---- */
.news-full-wrapper.dynn-featured .news-list-flex{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);
gap:22px 44px;align-items:start}
.news-full-wrapper.dynn-featured .news-item-row:first-child{grid-row:span 3;flex-direction:column;gap:0}
.news-full-wrapper.dynn-featured .news-item-row:first-child .news-item-thumb{flex:none;width:100%;max-width:none}
.news-full-wrapper.dynn-featured .news-item-row:first-child .img-aspect-box{aspect-ratio:16/9;border-radius:16px}
.news-full-wrapper.dynn-featured .news-item-row:first-child .news-item-body{padding:24px 0 0}
.news-full-wrapper.dynn-featured .news-item-row:first-child .news-item-title{font-size:26px}
.news-full-wrapper.dynn-featured .news-item-row:not(:first-child){flex-direction:row;align-items:center;gap:20px;
padding-bottom:22px;border-bottom:1px solid var(--border-light,#e8ecf0)}
.news-full-wrapper.dynn-featured .news-item-row:not(:first-child) .news-item-thumb{flex:0 0 150px;max-width:150px}
.news-full-wrapper.dynn-featured .news-item-row:not(:first-child) .img-aspect-box{aspect-ratio:4/3;border-radius:10px}
.news-full-wrapper.dynn-featured .news-item-row:not(:first-child) .news-item-body{padding:0;justify-content:center}
.news-full-wrapper.dynn-featured .news-item-row:not(:first-child) .news-date{margin-bottom:6px;font-size:13px}
.news-full-wrapper.dynn-featured .news-item-row:not(:first-child) .news-item-title{margin:0;font-size:17px;
line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.news-full-wrapper.dynn-featured .news-item-row:not(:first-child) .news-item-desc,
.news-full-wrapper.dynn-featured .news-item-row:not(:first-child) .news-item-footer{display:none}
.news-full-wrapper.dynn-featured .news-item-row:last-child:not(:first-child){padding-bottom:0;border-bottom:0}

/* ---- magazine 杂志三列 ---- */
.news-full-wrapper.dynn-magazine .news-list-flex{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
gap:40px 30px}
.news-full-wrapper.dynn-magazine .news-item-row{flex-direction:column;gap:0}
.news-full-wrapper.dynn-magazine .news-item-thumb{flex:none;width:100%;max-width:none}
.news-full-wrapper.dynn-magazine .img-aspect-box{aspect-ratio:3/2}
.news-full-wrapper.dynn-magazine .news-item-body{padding:22px 0 0}
.news-full-wrapper.dynn-magazine .news-date{margin-bottom:10px;font-size:13px}
.news-full-wrapper.dynn-magazine .news-item-title{font-size:20px;line-height:1.4;display:-webkit-box;
-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.news-full-wrapper.dynn-magazine .news-item-desc{margin-bottom:18px;font-size:15px;-webkit-line-clamp:2}

/* ---- overlay 图上压字(整卡可点) ---- */
.news-full-wrapper.dynn-overlay .news-list-flex{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.news-full-wrapper.dynn-overlay .news-item-row{position:relative;z-index:0;flex-direction:column;
justify-content:flex-end;gap:0;min-height:380px;overflow:hidden;border-radius:16px;background:#0f1b2a;
transition:transform .35s ease,box-shadow .35s ease}
.news-full-wrapper.dynn-overlay .news-item-row:hover{transform:translateY(-4px);box-shadow:0 22px 46px rgba(16,24,40,.18)}
.news-full-wrapper.dynn-overlay .news-item-thumb{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;
flex:none;width:auto;max-width:none}
.news-full-wrapper.dynn-overlay .img-aspect-box{height:100%;aspect-ratio:auto;border-radius:0;background:#0f1b2a}
.news-full-wrapper.dynn-overlay .news-item-thumb::after{content:"";position:absolute;left:0;right:0;bottom:0;
height:80%;background:linear-gradient(to top,rgba(8,16,28,.92),rgba(8,16,28,.45) 55%,rgba(8,16,28,0));
pointer-events:none}
.news-full-wrapper.dynn-overlay .news-item-body{flex:none;padding:28px 26px 26px;justify-content:flex-end}
.news-full-wrapper.dynn-overlay .news-date{margin-bottom:10px;font-size:13px;color:rgba(255,255,255,.78)}
.news-full-wrapper.dynn-overlay .news-item-title{margin:0 0 16px;font-size:21px;line-height:1.4;display:-webkit-box;
-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.news-full-wrapper.dynn-overlay .news-item-title a,
.news-full-wrapper.dynn-overlay .news-item-row:hover .news-item-title a{color:#fff}
.news-full-wrapper.dynn-overlay .news-item-title a::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;
z-index:1;border-radius:16px}
.news-full-wrapper.dynn-overlay .news-item-title a:focus-visible{outline:0}
.news-full-wrapper.dynn-overlay .news-item-title a:focus-visible::after{box-shadow:inset 0 0 0 3px #fff}
.news-full-wrapper.dynn-overlay .news-item-desc{display:none}
.news-full-wrapper.dynn-overlay .news-btn-more{color:#fff;border-bottom-color:var(--accent-blue,#3b82f6)}

/* ================= 响应式 ================= */
@media (max-width:1024px){
.dyn-prod-wrap.dynp-showcase .product-grid,
.dyn-prod-wrap.dynp-framed .product-grid,
.dyn-prod-wrap.dynp-minimal .product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
}
@media (max-width:991px){
.news-full-wrapper.dynn-featured .news-list-flex{grid-template-columns:minmax(0,1fr)}
.news-full-wrapper.dynn-featured .news-item-row:first-child{grid-row:auto}
.news-full-wrapper.dynn-featured .news-item-row:first-child .news-item-title{font-size:22px}
.news-full-wrapper.dynn-magazine .news-list-flex,
.news-full-wrapper.dynn-overlay .news-list-flex{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:768px){
.dyn-prod-wrap.dynp-showcase .product-grid,
.dyn-prod-wrap.dynp-framed .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.dyn-prod-wrap.dynp-minimal .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 14px}
.dyn-prod-wrap.dynp-showcase .product-card .p-name,
.dyn-prod-wrap.dynp-framed .product-card .p-name,
.dyn-prod-wrap.dynp-minimal .product-card .p-name{font-size:14px}
.dyn-prod-wrap.dynp-showcase .product-card .info-box{padding:12px 2px 0}
.dyn-prod-wrap.dynp-framed .product-card .img-box{padding:14px}
.dyn-prod-wrap.dynp-framed .product-card .info-box{padding:12px 10px 14px}
.dyn-prod-wrap.dynp-framed .view-more-btn{padding:9px 8px;font-size:11px}
}
@media (max-width:640px){
.news-full-wrapper.dynn-magazine .news-list-flex,
.news-full-wrapper.dynn-overlay .news-list-flex{grid-template-columns:minmax(0,1fr)}
.news-full-wrapper.dynn-overlay .news-item-row{min-height:300px}
.news-full-wrapper.dynn-featured .news-item-row:not(:first-child) .news-item-thumb{flex-basis:112px;max-width:112px}
.news-full-wrapper.dynn-featured .news-item-row:not(:first-child) .news-item-title{font-size:16px}
}
@media (prefers-reduced-motion:reduce){
.dyn-prod-wrap.dynp-showcase *,.dyn-prod-wrap.dynp-framed *,.dyn-prod-wrap.dynp-minimal *,
.news-full-wrapper.dynn-featured *,.news-full-wrapper.dynn-magazine *,.news-full-wrapper.dynn-overlay *{
transition:none!important}
.dyn-prod-wrap.dynp-framed .product-card:hover,
.dyn-prod-wrap.dynp-showcase .product-card:hover .img-box img,
.dyn-prod-wrap.dynp-framed .product-card:hover .img-box img,
.dyn-prod-wrap.dynp-minimal .product-card:hover .img-box img,
.news-full-wrapper.dynn-overlay .news-item-row:hover,
.news-full-wrapper.dynn-featured .news-item-row:hover .img-aspect-box img,
.news-full-wrapper.dynn-magazine .news-item-row:hover .img-aspect-box img,
.news-full-wrapper.dynn-overlay .news-item-row:hover .img-aspect-box img{transform:none}
}
/* HMX_V1 end */
