.detail-container {
     width: 100%;
     margin: 0 auto;
     margin-top: 50px;
     box-sizing: border-box;
 }

 .detail-header-bg {
     position: relative;
     background: url(/static/images/bg.jpeg) no-repeat center;
     background-size: cover;
     padding: 50px 20px;
     margin-bottom: 40px;
 }

 .detail-header {
     background: linear-gradient(180deg, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 1) 100%);
     border-radius: 8px;
     padding: 40px;
     width: 80%;
     margin: 0 auto;
 }

 .detail-title {
     font-size: 32px;
     line-height: 1.4;
     margin: 0;
     color: #333;
     font-weight: 700;
     text-align: center;
 }

 .id-container {
     padding: 0;
 }

 .id-module {
     width: 80%;
     margin: 0 auto;
     box-sizing: border-box;
 }

 .id-content-wrapper {
     display: flex;
     justify-content: center;
     margin-bottom: 40px;
     position: relative;
 }

 .id-left {
     margin: 0 auto;
     box-sizing: border-box;
     background: #FFFFFF;
     border-radius: 8px;
     padding: 40px;
     box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
 }

 .id-section-title {
     font-size: 25px;
     font-weight: 600;
     color: #222;
     margin: 24px 0 8px;
 }

 .id-text {
     color: #636363;
     font-size: 16px;
     line-height: 1.8;
     margin: 8px 0;
 }

 .id-text-strong {
     font-weight: 600;
     color: #333;
 }

.online-upload-wrapper {
     text-align: center;
     margin-bottom: 32px;
}

.online-upload-wrapper .wq-upload-drag {
     margin: 0 auto;
}

.online-upload-wrapper .upload-caption {
     margin-top: 12px;
     font-size: 14px;
     color: #666;
}

 .scenario-grid {
     margin-top: 16px;
 }

 .scenario-grid .layui-col-md6 {
     margin-bottom: 20px;
 }

 .scenario-card {
     padding-right: 24px;
     box-sizing: border-box;
     display: flex;
     flex-direction: column;
    /*height: 420px;*/
 }

 .scenario-title {
     font-size: 18px;
     font-weight: 600;
     color: #FD5E20;
     margin-bottom: 6px;
 }

 .scenario-text {
     color: #636363;
     font-size: 15px;
     line-height: 1.7;
 }

.scenario-text-block {
    min-height: 88px; /* 固定每个场景文字区域高度，保证图片起点一致 */
}

.scenario-card img {
     display: block;
     max-width: 100%;
     height: 300px;
     margin: 20px auto 20px auto;
     border-radius: 6px;
     box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
     object-fit: contain;
}

.report-preview-row {
     margin-top: 8px;
     margin-bottom: 16px;
}

.report-preview-card {
     text-align: center;
}

.report-preview-card img {
     display: inline-block;
     max-width: 80%;
     height: auto;
     margin-top: 15px;
     margin-bottom: 15px;
     border-radius: 8px;
     box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}

 .id-list {
     margin: 12px 0 12px 32px;
     padding-left: 8px;
 }

 .id-list li {
     color: #636363;
     font-size: 16px;
     line-height: 1.8;
     margin-bottom: 4px;
     list-style-position: outside;
 }

 ul.id-list li {
     list-style-type: disc !important;
 }

 ol.id-list {
     padding-left: 20px;
 }

 ol.id-list li {
     list-style-type: decimal;
 }

 @media (max-width: 767px) {
     .detail-header {
         padding: 20px 14px;
         width: 100%;
         box-sizing: border-box;
     }
     .detail-title {
         font-size: 22px;
         text-align: center;
     }
     .id-module {
         width: 100%;
         padding: 0 12px;
         box-sizing: border-box;
     }
    .id-left {
        padding: 20px 16px;
        border-radius: 10px;
    }
    /* 移动端：场景卡片改为自适应高度，图片按比例缩放 */
   .scenario-card {
        padding-right: 0;
        height: auto;
        margin-bottom: 20px;
    }
    .scenario-card img {
        max-width: 100%;
        height: auto;
        margin: 16px auto 16px auto;
        padding-top:unset!important;
    }

     .scenario-grid .layui-col-md6{
         margin-bottom:unset!important;
     }
 }

/* iPad 横竖屏：稍微减小图片高度，保持两列布局 */
@media (min-width: 768px) and (max-width: 1024px) {
    .scenario-card {
        height: 360px;
    }
    .scenario-card img {
        height: 240px;
    }

    .scenario-grid .layui-col-md6{
        margin-bottom:unset!important;
    }
}