.about-banner {
       display: flex;
       align-items: center;
       max-width: 1440px;
       margin: 40px auto;
       margin-top: 200px;
       padding: 48px 60px;
       background: linear-gradient(90deg, #FFF6F6 0%, #ADD4FF 100%), rgba(0, 0, 0, 0);
       border-radius: 0px 0px 0px 0px;
       box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
       flex-wrap: wrap;
   }

   .about-banner-content {
       flex: 1;
       min-width: 600px;
       margin-right: 20px;
       padding-right: 40px;
   }

   .about-banner-title {
       font-weight: 700;
       font-size: 36px;
       color: #111827;
       line-height: 40px;
       margin-bottom: 12px;
   }

   .about-banner-desc {
       font-weight: 400;
       font-size: 18px;
       color: #374151;
       line-height: 28px;
       margin-bottom: 20px;
   }

   .about-banner-btns {
       display: flex;
       gap: 12px;
   }

   .about-banner-btn {
       padding: 8px 24px;
       border-radius: 4px;
       font-size: 16px;
       border: none;
       cursor: pointer;
       transition: all 0.3s;
   }

   .about-banner-btn.primary {
       background: #E63946;
       color: #FFFFFF;
   }

   .about-banner-btn.primary:hover {
       background: #960514;
   }

   .about-banner-btn.secondary {
       background: #FFFFFF;
       color: #E63946;
       border: 1px solid #E63946;
   }

   .about-banner-btn.secondary:hover {
       background: #E63946;
       color: #FFFFFF;
   }

   .about-banner-img {
       flex: 2;
       display: flex;
       justify-content: flex-end;
       margin-top: 0;
   }

   .about-banner-img img {
       width: 100%;
       max-width: none;
       height: auto;
       min-height: 320px;
       object-fit: cover;
       border-radius: 12px;
       box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
   }

   .about-banner-img img:hover {
       transform: scale(1.02);
   }

   /* 响应式适配：小屏幕堆叠 */
   @media (max-width: 768px) {
       .about-banner {
           flex-direction: column;
           padding: 30px 20px;
       }

       .about-banner-content {
           padding-right: 0;
           margin-bottom: 20px;
       }

       .about-banner-img {
           width: 100%;
           justify-content: center;
       }
   }

   .about-section {
       max-width: 1440px;
       padding: 0 20px;
       margin: 0 auto;
       margin-top: 55px;
   }

   .prototype-title {
       width: 1440px;
       height: 125px;
       font-family: Roboto, Roboto;
       font-weight: 700;
       font-size: 36px;
       color: #3D3D3D;
       line-height: 28px;
       text-align: center;
       font-style: normal;
       text-transform: none;
       margin: 0;
       display: inline-block;
   }

   .prototype-intro {
       width: 1440px;
       font-family: Roboto, Roboto;
       font-weight: 400;
       font-size: 18px;
       color: #3D3D3D;
       line-height: 40px;
       text-align: left;
       text-indent: 2em;
       font-style: normal;
       text-transform: none;
       margin: 20px 0;
   }


   .prototype-timeline {
       display: flex;
       align-items: flex-start;
       gap: 20px;
       margin: 90px 0;
       width: 1440px;
   }

   .timeline-img-container {
       display: flex;
       flex-direction: column;
       align-items: center;
       gap: 26px;
   }

   .timeline-img {
       width: 590px;
       height: auto;
       border-radius: 6px;
       object-fit: cover;
   }

   .timeline-img-container img:hover {
       transform: scale(1.02);
   }

   .timeline-img-desc {
       font-family: Roboto, Roboto;
       font-weight: 400;
       font-size: 18px;
       color: #3D3D3D;
       line-height: 28px;
       text-align: center;
       margin: 0;
       max-width: 590px;
   }


   .timeline-content {
       margin-left: 179px;
       flex: 1;
       text-align: left;
   }

   .timeline-title {
       font-family: Roboto, Roboto;
       font-weight: 700;
       font-size: 30px;
       color: #111827;
       line-height: 36px;
       text-align: left;
       font-style: normal;
       text-transform: none;
       margin: 0 0 10px 0;
       display: inline-block;
   }

   .timeline-subtitle {
       font-family: Roboto, Roboto;
       font-weight: 400;
       font-size: 16px;
       color: #4B5563;
       line-height: 24px;
       margin: 0 0 64px 0;
   }


   .timeline-simple {
       width: 600px;
       margin: 0 auto;
       font-family: "Microsoft YaHei", sans-serif;
   }

   .timeline-item {
       display: flex;
       align-items: flex-start;
       margin-bottom: 20px;
   }

   .timeline-date {
       color: #E63946;
       font-weight: 700;
       font-size: 18px;
       line-height: 28px;
       margin-right: 10px;
       flex-shrink: 0;
   }

   .timeline-text {
       flex: 1;
       padding-left: 10px;/
   }

   .timeline-texttitle {
       width: 120px;
       height: 36px;
       font-family: Roboto, Roboto;
       font-weight: 700;
       font-size: 20px;
       color: #111827;
       line-height: 28px;
       text-align: left;
       font-style: normal;
       text-transform: none;
       margin: 0 0 10px 0;
       display: inline-block;
   }


   .timeline-desc {
       font-weight: 400;
       font-size: 16px;
       color: #4B5563;
       line-height: 24px;
       display: block;
   }


   .prototype-detail {
       width: 1440px;
       font-family: Roboto, Roboto;
       font-weight: 400;
       font-size: 18px;
       color: #3D3D3D;
       line-height: 40px;
       text-align: left;
       font-style: normal;
       text-transform: none;
       margin: 20px 0;
   }

   .prototype-detail p {
       text-indent: 2em;
   }

   .about-contact-board {
       max-width: 1440px;
       margin: 0 auto;
       margin-top: 146px;
       display: flex;
       justify-content: space-between;
       gap: 40px;
   }

   .contact-box {
       flex: 1;
       background-color: #FFFFFF;
       border-radius: 12px;
       padding: 24px;
       /* box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05); */
   }

   .contact-title {
       font-weight: 700;
       font-size: 30px;
       color: #111827;
       line-height: 36px;
       margin-bottom: 8px;
       text-align: center;
   }

   .contact-subtitle {
       font-weight: 400;
       font-size: 16px;
       color: #4B5563;
       line-height: 24px;
       margin-bottom: 20px;
       text-align: center;
   }

   .contact-item {
       display: flex;
       align-items: center;
       margin-bottom: 16px;
       padding: 8px;
   }

   .contact-item i {
       width: 24px;
       height: 24px;
       color: #E63946;
       margin-right: 12px;
       flex-shrink: 0;
   }

   .contact-text {
       display: flex;
       flex-direction: column;
   }

   .contact-label {
       font-family: Roboto, Roboto;
       font-weight: 700;
       font-size: 18px;
       color: #111827;
       line-height: 28px;
       min-width: 40px;
       display: inline-block;
       margin-bottom: 4px;
   }

   .contact-value {
       font-family: Roboto, Roboto;
       font-weight: 400;
       font-size: 16px;
       color: #4B5563;
       line-height: 24px;
   }

   /* 留言板模块 */

   .leave-box {
       flex: 1;
       max-width: 700px;
       margin: 0 auto;
       padding: 24px;
       border-radius: 12px;
       box-shadow: 0 2px 12px rgba(0, 0, 0, 0.03);
   }


   .leave-title {
       font-weight: 700;
       font-size: 30px;
       color: #111827;
       line-height: 36px;
       margin-bottom: 8px;
       text-align: center;
   }


   .leave-subtitle {
       font-weight: 400;
       font-size: 16px;
       color: #4B5563;
       line-height: 24px;
       margin-bottom: 20px;
       text-align: center;
   }


   .leave-content {
       display: flex;
       align-items: flex-start;
       gap: 24px;
   }


   .leave-textarea {
       flex: 1;
       height: 255px;
       padding: 12px;
       font-size: 14px;
       color: #6B7280;
       border: 1px solid #E5E7EB;
       border-radius: 8px;
       resize: none;
   }


   .leave-right {
       display: flex;
       flex-direction: column;
       align-items: center;
       gap: 12px;
   }


   .leave-avatar {
       width: 160px;
       height: 220px;
       background: rgba(0, 0, 0, 0);
       border-radius: 12px 12px 12px 12px;
       object-fit: cover;
   }


   .leave-btn {
       background-color: #E53E3E;
       color: #FFFFFF;
       font-size: 14px;
       padding: 8px 24px;
       height: 36px;
       width: 160px;
       border: none;
       border-radius: 4px 4px 4px 4px;
       cursor: pointer;
       transition: background-color 0.3s;
   }

   .leave-btn:hover {
       background-color: #9e0a0a;
   }



   @media (max-width: 1440px) {
       .about-banner {
           padding: 32px 16px;
       }

       .about-section {
           padding: 0 10px;
       }

       .about-timeline-wrap {
           flex-direction: column;
           gap: 20px;
       }

       .about-contact-leave {
           flex-direction: column;
           gap: 20px;
       }

       .about-contact-box,
       .about-leave-box {
           min-width: unset;
           width: 100%;
           padding: 20px 10px;
       }
   }