body {
     background-color: #f9f9f9;
 }

 .container {
     /*max-width: 1200px;*/
     margin: 0 auto;
     padding: 40px 20px;
 }

 /* 顶部按钮组 */
 .tab-wrap {
     display: flex;
     justify-content: center;
     gap: 24px;
     margin-bottom: 50px;
 }

 .tab-btn {
     display: block;
     padding: 0 24px;
     height: 52px;
     line-height: 52px;
     text-align: center;
     font-size: 16px;
     font-weight: 500;
     border: none;
     border-radius: 4px;
     cursor: pointer;
     transition: var(--transition-base);
     background-color: var(--color-white);
     border: 1px solid var(--color-dropdown-bg);
     color: var(--color-dropdown-bg);
 }

 .tab-btn.active,
 .tab-btn:hover {
     background-color: var(--color-dropdown-bg);
     color: var(--color-white);
     box-shadow: var(--shadow-md);
 }

 /* 列表容器 */
 .doc-list {
     /* display: flex;
     flex-direction: column;
     gap: 30px; */
 }

 /* 列表项 通用样式 */
 .doc-item {
     display: flex;
     gap: 30px;
     background-color: var(--color-white);
     border-radius: 12px;
     box-shadow: var(--shadow-sm);
     overflow: hidden;
     transition: var(--transition-base);
     padding: 30px;
     margin-bottom: 30px;
 }

 /* 图片区域 */
 .doc-img {
     width: calc(50% - 15px);
     height: 380px;

 }

 .doc-img img {
     width: 100%;
     height: 100%;
     object-fit: cover;
 }

 .doc-img:hover {
     transform: scale(1.05);
 }


 /* 文案区域 */
 .doc-content {
     flex: 1;
     display: flex;
     flex-direction: column;
     gap: 16px;
 }

 .doc-title {
     font-size: 24px;
     font-family: var(--font-heading);
     color: var(--color-accent);
     font-weight: 600;
 }

 .doc-subtitle {
     font-size: 16px;
     color: var(--color-text-muted);
 }

 /* 操作按钮组 */
 .btn-group {
     display: flex;
     gap: 16px;
     margin-top: 12px;
 }

 .oper-btn {
     padding: 10px 24px;
     border-radius: 4px;
     font-size: 15px;
     cursor: pointer;
     transition: var(--transition-fast);
     border: none;
 }

 .preview-btn {
     background-color: var(--color-dropdown-bg);
     color: var(--color-white);
 }

 .preview-btn:hover {
     background-color: var(--color-nav-hover);

 }

 .download-btn {
     background-color: transparent;
     border: 1px solid var(--color-dropdown-bg);
     color: var(--color-dropdown-bg);
 }

 .download-btn:hover {
     background-color: var(--color-nav-hover);
     color: #fff;
 }

 .more-btn {
     background-color: var(--color-dropdown-bg);
     color: var(--color-white);
     border-radius: 5px;
     font-family: var(--font-heading);
     font-size: 1rem;
     padding: 10px 20px;
     letter-spacing: 1px;
     border: none;
     font-weight: 700;
     transition: all var(--transition-base);
     margin: 0 auto;
     display: block;
 }

 .more-btn:hover {
     background-color: var(--color-nav-hover);
     color: #fff;
 }

 /* 响应式适配 */
 @media (max-width: 768px) {
     .container {
         padding: 20px 15px;
     }

     .tab-wrap {
         gap: 12px;
         margin-bottom: 30px;
     }

     .tab-btn {
         height: 44px;
         line-height: 44px;
         padding: 0 20px;
         font-size: 14px;
     }

     .doc-item,
     .doc-item.even {
         flex-direction: column;
         text-align: center;
         padding: 20px;
         margin-bottom: 20px;
         gap: 20px;
     }

     .doc-img {
         margin: 0 auto;
         width: 100%;
         height: 240px;
     }

     .doc-content {
         gap: 12px;
     }

     .doc-title {
         font-size: 18px;
     }

     .doc-subtitle {
         font-size: 14px;
     }

     .btn-group {
         justify-content: center;
         gap: 10px;
         margin-top: 8px;
     }

     .oper-btn {
         padding: 8px 18px;
         font-size: 13px;
     }

    .qualificationsList:nth-child(even) .doc-item {
    flex-direction: column-reverse !important;
}
 }

 @media (max-width: 576px) {
     .container {
         padding: 15px 10px;
     }

     .tab-wrap {
         gap: 8px;
         margin-bottom: 25px;
     }

     .tab-btn {
         height: 40px;
         line-height: 40px;
         padding: 0 16px;
         font-size: 0.8rem;
     }

     .doc-item,
     .doc-item.even {
         padding: 16px;
         margin-bottom: 16px;
         gap: 16px;
     }

     .doc-img {
         height: 200px;
     }

     .doc-content {
         gap: 10px;
     }

     .doc-title {
         font-size: 1.1rem;
     }

     .doc-subtitle {
         font-size: 0.9rem;
     }

     .btn-group {
         gap: 8px;
         flex-wrap: wrap;
     }

     .oper-btn {
         padding: 8px 14px;
         font-size: 0.8rem;
     }

     .more-btn {
         padding: 8px 16px;
         font-size: 0.8rem;
     }
 }