#section_LogicSeptCategoryBanner_1 {   display: flex;   justify-content: center;   align-items: center;   flex-direction: column;   font-family: "Poppins", sans-serif;   font-display: swap;   position: relative; }   #section_LogicSeptCategoryBanner_1 .container {     display: flex;     align-items: center;     flex-wrap: wrap;     flex-direction: row;     width: 100%;     max-width: 1090px;     gap: 20px;     margin: 0;     overflow: hidden;     position: relative; }   #section_LogicSeptCategoryBanner_1 .container .parts {     display: flex;     align-items: flex-start;     justify-content: space-between;     flex-direction: row;     width: calc(100% - 20px);     padding: 20px 10px;     gap: 20px;     position: relative; }   #section_LogicSeptCategoryBanner_1 .container .parts::before {     content: '';     position: absolute;     max-width: 300px;     left: 40%;     top: 0;     width: 100%;     padding: 20px 0;     height: 100%;     transform: skew(15deg);     background: linear-gradient(90deg, #f0f0f0 10%, #e0e0e0 10%, #e0e0e0 90%, #f0f0f0 90%, #f0f0f0 100%);     z-index: -1; }   #section_LogicSeptCategoryBanner_1 .container .pt1 {     display: flex;     flex-direction: column;     gap: 20px;     width: 100%; }   #section_LogicSeptCategoryBanner_1 .container .pt1 .title {     font-size: clamp(1.5rem, 3.5vw, 2rem);     line-height: 1.35;     color: #000000;     text-align: left;     margin: 0; }   #section_LogicSeptCategoryBanner_1 .container .pt1 .desc1 {     font-size: clamp(0.875rem, 1.6vw, 1rem);     line-height: 1.6;     color: #000000;     text-align: left; }   #section_LogicSeptCategoryBanner_1 .container .pt2 {     display: flex;     align-items: center;     max-width: 500px;     width: 100%; }   #section_LogicSeptCategoryBanner_1 .container .pt2 > video {     width: 100%;     height: auto;     aspect-ratio: 500 / 280; }   @media only screen and (max-width: 767px) {     #section_LogicSeptCategoryBanner_1 .container .parts {       flex-wrap: wrap;       align-items: center;       justify-content: center; } }  #section_LogicSeptCategory_2 {   background-color: #ffffff;   display: flex;   justify-content: center;   align-items: center;   flex-direction: column;   padding-top: 20px;   padding-bottom: 20px;   font-family: "Poppins", sans-serif; }   #section_LogicSeptCategory_2 .container {     display: flex;     flex-direction: row-reverse;     justify-content: space-between;     width: calc(100% - 20px);     max-width: 1170px;     min-height: 200px;     gap: 70px;     margin: 0;     padding: 0; }   #section_LogicSeptCategory_2 .container .pt1 {     display: flex;     flex-direction: column;     justify-content: space-between;     gap: 20px;     width: 100%;     position: relative; }   #section_LogicSeptCategory_2 .container .pt1::before {     content: '';     position: absolute;     left: -20px;     top: 0;     width: 2px;     opacity: 0.2;     height: 100%;     background-color: #000000; }   #section_LogicSeptCategory_2 .container .pt1 .title {     color: #000000;     font-size: clamp(1.5rem, 3.077vw, 2.25rem);     line-height: 1.35;     margin: 0;     width: 100%; }   #section_LogicSeptCategory_2 .container .pt1 .desc {     font-size: clamp(0.875rem, 1.37vw, 1rem);     line-height: 1.6;     color: #000000; }   #section_LogicSeptCategory_2 .container .pt2 {     display: flex;     flex-direction: column;     max-width: 534px;     max-height: 250px;     width: 100%;     overflow: hidden;     position: relative; }   #section_LogicSeptCategory_2 .container .pt2 .img_container {     max-width: 535px;     width: 100%;     display: block; }   #section_LogicSeptCategory_2 .container .pt2 img {     width: 100%;     height: auto;     aspect-ratio: 535 / 250;     object-fit: cover;     object-position: center; }   #section_LogicSeptCategory_2 .container .pt1 .btn {     background-color: transparent;     color: #1C2D4E;     align-self: flex-end;     border: 1px solid #1C2D4E;     border-radius: 30px;     min-width: 150px;     max-width: 200px;     font-size: clamp(0.875rem, 1.6vw, 1rem);     line-height: 1.6;     padding: 6px 10px;     box-sizing: border-box;     display: flex;     align-items: center;     justify-content: center;     text-align: center;     text-decoration: none;     transition: all .3s ease-in-out;     position: relative;     z-index: 1; }   #section_LogicSeptCategory_2 .container .pt1 .btn::before {     content: '';     position: absolute;     top: -5px;     left: -5px;     right: -5px;     bottom: -5px;     z-index: 1; }   #section_LogicSeptCategory_2 .container .pt1 .btn:hover,   #section_LogicSeptCategory_2 .container .pt1 .btn:focus,   #section_LogicSeptCategory_2 .container .pt1 .btn:active {     background-color: #1C2D4E;     color: #ffffff;     transition: all .3s ease-in-out; }   @media screen and (max-width: 767px) {     #section_LogicSeptCategory_2 .container {       flex-wrap: wrap;       align-items: center;       flex-direction: column-reverse;       width: calc(100% - 40px);       gap: 20px; }     #section_LogicSeptCategory_2 .container .pt1::before {       left: -10px;       top: 0; }     #section_LogicSeptCategory_2 .container .pt1 {       max-width: 515px;       width: calc(100% - 20px); } }  #section_LogicSeptCategory_3 {   background-color: #ffffff;   display: flex;   justify-content: center;   align-items: center;   flex-direction: column;   padding-top: 20px;   padding-bottom: 20px;   font-family: "Poppins", sans-serif; }   #section_LogicSeptCategory_3 .container {     display: flex;     flex-direction: row-reverse;     justify-content: space-between;     width: calc(100% - 20px);     max-width: 1170px;     min-height: 200px;     gap: 70px;     margin: 0;     padding: 0; }   #section_LogicSeptCategory_3 .container .pt1 {     display: flex;     flex-direction: column;     justify-content: space-between;     gap: 20px;     width: 100%;     position: relative; }   #section_LogicSeptCategory_3 .container .pt1::before {     content: '';     position: absolute;     left: -20px;     top: 0;     width: 2px;     opacity: 0.2;     height: 100%;     background-color: #000000; }   #section_LogicSeptCategory_3 .container .pt1 .title {     color: #000000;     font-size: clamp(1.5rem, 3.077vw, 2.25rem);     line-height: 1.35;     margin: 0;     width: 100%; }   #section_LogicSeptCategory_3 .container .pt1 .desc {     font-size: clamp(0.875rem, 1.37vw, 1rem);     line-height: 1.6;     color: #000000; }   #section_LogicSeptCategory_3 .container .pt2 {     display: flex;     flex-direction: column;     max-width: 534px;     max-height: 250px;     width: 100%;     overflow: hidden;     position: relative; }   #section_LogicSeptCategory_3 .container .pt2 .img_container {     max-width: 535px;     width: 100%;     display: block; }   #section_LogicSeptCategory_3 .container .pt2 img {     width: 100%;     height: auto;     aspect-ratio: 535 / 250;     object-fit: cover;     object-position: center; }   #section_LogicSeptCategory_3 .container .pt1 .btn {     background-color: transparent;     color: #1C2D4E;     align-self: flex-end;     border: 1px solid #1C2D4E;     border-radius: 30px;     min-width: 150px;     max-width: 200px;     font-size: clamp(0.875rem, 1.6vw, 1rem);     line-height: 1.6;     padding: 6px 10px;     box-sizing: border-box;     display: flex;     align-items: center;     justify-content: center;     text-align: center;     text-decoration: none;     transition: all .3s ease-in-out;     position: relative;     z-index: 1; }   #section_LogicSeptCategory_3 .container .pt1 .btn::before {     content: '';     position: absolute;     top: -5px;     left: -5px;     right: -5px;     bottom: -5px;     z-index: 1; }   #section_LogicSeptCategory_3 .container .pt1 .btn:hover,   #section_LogicSeptCategory_3 .container .pt1 .btn:focus,   #section_LogicSeptCategory_3 .container .pt1 .btn:active {     background-color: #1C2D4E;     color: #ffffff;     transition: all .3s ease-in-out; }   @media screen and (max-width: 767px) {     #section_LogicSeptCategory_3 .container {       flex-wrap: wrap;       align-items: center;       flex-direction: column-reverse;       width: calc(100% - 40px);       gap: 20px; }     #section_LogicSeptCategory_3 .container .pt1::before {       left: -10px;       top: 0; }     #section_LogicSeptCategory_3 .container .pt1 {       max-width: 515px;       width: calc(100% - 20px); } }  #section_LogicSeptCategory_4 {   background-color: #ffffff;   display: flex;   justify-content: center;   align-items: center;   flex-direction: column;   padding-top: 20px;   padding-bottom: 20px;   font-family: "Poppins", sans-serif; }   #section_LogicSeptCategory_4 .container {     display: flex;     flex-direction: row-reverse;     justify-content: space-between;     width: calc(100% - 20px);     max-width: 1170px;     min-height: 200px;     gap: 70px;     margin: 0;     padding: 0; }   #section_LogicSeptCategory_4 .container .pt1 {     display: flex;     flex-direction: column;     justify-content: space-between;     gap: 20px;     width: 100%;     position: relative; }   #section_LogicSeptCategory_4 .container .pt1::before {     content: '';     position: absolute;     left: -20px;     top: 0;     width: 2px;     opacity: 0.2;     height: 100%;     background-color: #000000; }   #section_LogicSeptCategory_4 .container .pt1 .title {     color: #000000;     font-size: clamp(1.5rem, 3.077vw, 2.25rem);     line-height: 1.35;     margin: 0;     width: 100%; }   #section_LogicSeptCategory_4 .container .pt1 .desc {     font-size: clamp(0.875rem, 1.37vw, 1rem);     line-height: 1.6;     color: #000000; }   #section_LogicSeptCategory_4 .container .pt2 {     display: flex;     flex-direction: column;     max-width: 534px;     max-height: 250px;     width: 100%;     overflow: hidden;     position: relative; }   #section_LogicSeptCategory_4 .container .pt2 .img_container {     max-width: 535px;     width: 100%;     display: block; }   #section_LogicSeptCategory_4 .container .pt2 img {     width: 100%;     height: auto;     aspect-ratio: 535 / 250;     object-fit: cover;     object-position: center; }   #section_LogicSeptCategory_4 .container .pt1 .btn {     background-color: transparent;     color: #1C2D4E;     align-self: flex-end;     border: 1px solid #1C2D4E;     border-radius: 30px;     min-width: 150px;     max-width: 200px;     font-size: clamp(0.875rem, 1.6vw, 1rem);     line-height: 1.6;     padding: 6px 10px;     box-sizing: border-box;     display: flex;     align-items: center;     justify-content: center;     text-align: center;     text-decoration: none;     transition: all .3s ease-in-out;     position: relative;     z-index: 1; }   #section_LogicSeptCategory_4 .container .pt1 .btn::before {     content: '';     position: absolute;     top: -5px;     left: -5px;     right: -5px;     bottom: -5px;     z-index: 1; }   #section_LogicSeptCategory_4 .container .pt1 .btn:hover,   #section_LogicSeptCategory_4 .container .pt1 .btn:focus,   #section_LogicSeptCategory_4 .container .pt1 .btn:active {     background-color: #1C2D4E;     color: #ffffff;     transition: all .3s ease-in-out; }   @media screen and (max-width: 767px) {     #section_LogicSeptCategory_4 .container {       flex-wrap: wrap;       align-items: center;       flex-direction: column-reverse;       width: calc(100% - 40px);       gap: 20px; }     #section_LogicSeptCategory_4 .container .pt1::before {       left: -10px;       top: 0; }     #section_LogicSeptCategory_4 .container .pt1 {       max-width: 515px;       width: calc(100% - 20px); } }  #section_LogicSeptCategory_5 {   background-color: #ffffff;   display: flex;   justify-content: center;   align-items: center;   flex-direction: column;   padding-top: 20px;   padding-bottom: 20px;   font-family: "Poppins", sans-serif; }   #section_LogicSeptCategory_5 .container {     display: flex;     flex-direction: row-reverse;     justify-content: space-between;     width: calc(100% - 20px);     max-width: 1170px;     min-height: 200px;     gap: 70px;     margin: 0;     padding: 0; }   #section_LogicSeptCategory_5 .container .pt1 {     display: flex;     flex-direction: column;     justify-content: space-between;     gap: 20px;     width: 100%;     position: relative; }   #section_LogicSeptCategory_5 .container .pt1::before {     content: '';     position: absolute;     left: -20px;     top: 0;     width: 2px;     opacity: 0.2;     height: 100%;     background-color: #000000; }   #section_LogicSeptCategory_5 .container .pt1 .title {     color: #000000;     font-size: clamp(1.5rem, 3.077vw, 2.25rem);     line-height: 1.35;     margin: 0;     width: 100%; }   #section_LogicSeptCategory_5 .container .pt1 .desc {     font-size: clamp(0.875rem, 1.37vw, 1rem);     line-height: 1.6;     color: #000000; }   #section_LogicSeptCategory_5 .container .pt2 {     display: flex;     flex-direction: column;     max-width: 534px;     max-height: 250px;     width: 100%;     overflow: hidden;     position: relative; }   #section_LogicSeptCategory_5 .container .pt2 .img_container {     max-width: 535px;     width: 100%;     display: block; }   #section_LogicSeptCategory_5 .container .pt2 img {     width: 100%;     height: auto;     aspect-ratio: 535 / 250;     object-fit: cover;     object-position: center; }   #section_LogicSeptCategory_5 .container .pt1 .btn {     background-color: transparent;     color: #1C2D4E;     align-self: flex-end;     border: 1px solid #1C2D4E;     border-radius: 30px;     min-width: 150px;     max-width: 200px;     font-size: clamp(0.875rem, 1.6vw, 1rem);     line-height: 1.6;     padding: 6px 10px;     box-sizing: border-box;     display: flex;     align-items: center;     justify-content: center;     text-align: center;     text-decoration: none;     transition: all .3s ease-in-out;     position: relative;     z-index: 1; }   #section_LogicSeptCategory_5 .container .pt1 .btn::before {     content: '';     position: absolute;     top: -5px;     left: -5px;     right: -5px;     bottom: -5px;     z-index: 1; }   #section_LogicSeptCategory_5 .container .pt1 .btn:hover,   #section_LogicSeptCategory_5 .container .pt1 .btn:focus,   #section_LogicSeptCategory_5 .container .pt1 .btn:active {     background-color: #1C2D4E;     color: #ffffff;     transition: all .3s ease-in-out; }   @media screen and (max-width: 767px) {     #section_LogicSeptCategory_5 .container {       flex-wrap: wrap;       align-items: center;       flex-direction: column-reverse;       width: calc(100% - 40px);       gap: 20px; }     #section_LogicSeptCategory_5 .container .pt1::before {       left: -10px;       top: 0; }     #section_LogicSeptCategory_5 .container .pt1 {       max-width: 515px;       width: calc(100% - 20px); } }  #section_LogicSeptCategoryTextBackground_6 {   display: flex;   justify-content: center;   align-items: center;   flex-direction: column;   position: relative;   overflow: hidden;   font-family: "Poppins", sans-serif; }   #section_LogicSeptCategoryTextBackground_6 .container {     display: flex;     align-items: center;     flex-direction: row;     width: calc(100% - 20px);     max-width: 1090px;     padding: 50px 0;     margin: 0;     gap: 20px;     z-index: 2; }   #section_LogicSeptCategoryTextBackground_6 .img_background {     position: absolute;     object-fit: cover;     object-position: center;     display: block;     width: 100%;     height: 100%;     min-height: 300px;     aspect-ratio: 16 / 9;     flex: 1;     z-index: 1; }   #section_LogicSeptCategoryTextBackground_6 .container .pt2 {     display: flex;     flex-direction: column;     align-items: center;     justify-content: flex-start;     width: 100%;     max-width: 650px;     gap: 20px;     z-index: 2; }   #section_LogicSeptCategoryTextBackground_6 .container .pt2 .title {     font-size: clamp(1.125rem, 2.5vw, 1.5rem);     line-height: 1.5;     margin: 0;     align-self: flex-start;     text-align: left;     color: #000000; }   #section_LogicSeptCategoryTextBackground_6 .container .pt2 .desc {     font-size: clamp(0.875rem, 1.6vw, 1rem);     line-height: 1.6;     color: #000000; }   @media screen and (max-width: 767px) {     #section_LogicSeptCategoryTextBackground_6 .container {       flex-direction: column;       justify-content: center;       align-items: center;       padding-top: 50px;       padding-bottom: 50px; }     #section_LogicSeptCategoryTextBackground_6 .container .pt2 .desc {       max-width: 100%;       align-self: flex-start; }     #section_LogicSeptCategoryTextBackground_6 .container .pt2 {       max-width: 100%;       margin-bottom: revert; } } 
