.style-detail, .news-detail { display: none; position: fixed; inset: 0; z-index: 70; }
.style-detail.open, .news-detail.open { display: block; }
.detail-overlay, .news-detail-overlay { position: absolute; inset: 0; background: #161b1fd9; backdrop-filter: blur(6px); }
.detail-panel, .news-detail-panel { position: absolute; overflow: auto; overscroll-behavior: contain; background: linear-gradient(135deg,#50565b,#2b3136); color: var(--paper); }
.detail-panel { right: 0; top: 0; height: 100%; width: min(560px,100%); padding: 76px 40px 40px; }
.detail-close, .news-detail-close { position: absolute; z-index: 2; right: 12px; top: 12px; width: 42px; height: 42px; border: 1px solid #ffffff66; border-radius: 50%; background: #30363bcc; color: #fff; font-size: 28px; }
.detail-panel h2 { font: 500 53px/1.15 var(--serif); margin: 24px 0; }
.detail-description { color: #d5d5cf; font-size: 16px; line-height: 1.8; }
.detail-description p { margin: 0 0 16px; }
.detail-description ul { padding-left: 22px; margin: 16px 0 26px; }
.detail-description li { margin: 5px 0; }
.detail-description strong { color: var(--yellow); }
.style-video-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin: 26px 0; }
.style-video-grid video { width: 100%; height: 200px; object-fit: contain; border-radius: 12px; }
#detail-cta { margin-top: 24px; }
.news-detail-panel { left: 50%; top: 50%; transform: translate(-50%,-50%); width: min(1000px,calc(100% - 36px)); max-height: calc(100svh - 40px); padding: clamp(22px,4vw,42px); box-shadow: 0 24px 80px #0006; }
.news-detail-body { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(240px,.85fr); gap: 30px; align-items: center; }
.news-detail-body img { width: 100%; max-height: 70svh; object-fit: contain; }
.news-detail-copy h2 { font-size: clamp(28px,4vw,42px); line-height: 1.12; margin: 0 0 18px; }
.news-detail-copy p { font-size: 16px; line-height: 1.7; color: #e0dfd8; }
.news-detail-copy .news-label { display: block; margin-bottom: 12px; }
.news-detail-cta { margin-top: 14px; }
@media(max-width:760px) {
  .news-detail-panel { padding: 54px 20px 22px; }
  .news-detail-body { grid-template-columns: 1fr; gap: 20px; }
  .news-detail-body img { max-height: 48svh; }
  .detail-panel { padding: 76px 7% 32px; }
  .detail-panel h2 { font-size: 42px; }
}
