/*--------------------------------------------------------------
# Section 17
--------------------------------------------------------------*/

 #section-17 {
   margin-top: 70px;
 }

 .title-wrapper-benefit {
   font-family: Gotham Rounded;
   font-size: 26px;
   font-weight: 400;

   color: var(--black);
 }

 .avatar-card-benefit {
   width: 98px !important;
   height: 98px !important;
   max-width: fit-content !important;
   max-height: fit-content !important;
 }

 .text-card-benefit {
   font-family: Gotham Rounded;
   font-size: 30px;
   font-weight: 400;
   line-height: 160%;
   color: var(--black);
 }

 .card-benefit-wrapper {
   margin-top: 40px;
   display: flex;
   flex-direction: column;
   gap: 40px;
 }

 .card-benefit {
   display: flex;
   gap: 30px;
   padding: 30px;
   border-radius: var(--border-radius-40);
 }

 .bg-pink-card {
   background: rgba(248, 198, 225, 30%);

 }

 .bg-blue-card {
   background: rgba(198, 215, 248, 30%);

 }

 .bg-green-card {
   background: rgba(222, 248, 198, 30%);
 }

 .action-section-17 {
   margin-top: 55px;
   display: flex;
   justify-content: space-evenly;
   align-items: center;
 }

 .btn-section-17 {
   display: flex;
   justify-content: space-evenly;
   align-items: center;
   width: 605px;
   max-width: 100%;
 }


 .title-terms-benefit {
   font-family: Gotham Rounded;
   font-size: 32px;
   font-weight: 500;
   line-height: 100%;
   color: var(--black);
   margin-bottom: 36px;
 }

 .text-terms {
   font-family: Gotham Rounded;
   font-size: 22px;
   font-weight: 300;
   color: var(--black);
 }

 .check-terms-benefit {
   width: 30px;
   height: 30px;
   border-radius: 50%;
 }

 .item-terms-benefit {
   display: flex;
   gap: 10px;
   align-items: flex-start;
 }

 .terms-benefit {
   margin-top: 82px;
 }

 .terms-wrapper {
   padding-left: 80px;
   display: flex;
   flex-direction: column;
   gap: 26px;
 }

 @media(max-width :992px) {
   .text-card-benefit {
     font-size: 22px;
   }

   .terms-wrapper {
     padding-left: 0;
   }
 }

 @media(max-width :576px) {
   .card-benefit {
     flex-direction: column;
     gap: 5px;
   }
 }