/* ===== RESET ===== */
html {
overflow-x: hidden;
width: 100%;
max-width: 100%;
}
*,
*::before,
*::after {
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
body {
margin: 0;
font-family: Montserrat, sans-serif;
font-size: 14px;
line-height: 1;
color: #333;
background: #fff;
overflow-x: hidden;
}
img {
max-width: 100%;
height: auto;
display: block;
}
a {
color: inherit;
text-decoration: none;
}
ul,
ol {
margin: 0;
padding: 0;
list-style: none;
}
h1,
h2,
h3,
h4,
h5,
h6,
p {
margin: 0;
}
.kt-container {
width: 960px;
margin: 0 auto;
padding: 0;
position: relative;
}
.kt-section {
padding: 60px 0;
}
.kt-section--gray {
background: #f5f6fa;
}
.kt-section__title {
font-size: 25px;
font-weight: 700;
color: #061b48;
text-align: center;
margin: 0 0 30px;
}
.kt-section__title span {
color: rgb(212, 155, 55);
}
/* ===== TOP BAR (SECTION1708) ===== */
.kt-top-bar {
background: rgb(19, 19, 31);
height: 61px;
display: flex;
align-items: center;
}
.kt-top-bar .kt-container {
display: flex;
align-items: center;
}
.kt-top-bar__logo {
flex-shrink: 0;
margin-right: 18px;
}
.kt-top-bar__logo img {
height: 44px;
width: auto;
display: block;
}
.kt-top-bar__group {
display: flex;
align-items: center;
gap: 6px;
}
.kt-top-bar__group svg {
flex-shrink: 0;
}
.kt-top-bar__text {
font-family: Montserrat, sans-serif;
font-size: 13px;
line-height: 1.4;
color: rgb(209, 197, 197);
letter-spacing: 0.2px;
}
.kt-top-bar__group--address {
position: absolute;
left: 178px;
top: 50%;
transform: translateY(-50%);
}
.kt-top-bar__group--phone {
position: absolute;
left: 640px;
top: 7px;
width: 263px;
}
.kt-top-bar__group--email {
position: absolute;
left: 641px;
top: 27px;
width: 401px;
}
.kt-top-bar__group--phone .kt-top-bar__text {
line-height: 1.6;
}
.kt-top-bar__group--email .kt-top-bar__text {
line-height: 1.6;
}
/* ===== HERO (SECTION1704) ===== */
.kt-hero {
position: relative;
overflow: hidden;
width: 100%;
}
.kt-hero__bg {
position: absolute;
inset: 0;
background-image: url("https://w.ladicdn.com/s1440x606/5abe59a5e9cb7e9e174311d4/sh2utterstock-736517164-min-20220718073713.jpg");
background-size: cover;
background-position: 50% 70%;
}
.kt-hero__overlay {
position: absolute;
inset: 0;
background: rgb(19 19 31 / 0%);
}
.kt-hero .kt-container {
position: relative;
z-index: 2;
width: 100%;
max-width: 960px;
margin: 0 auto;
}
.kt-hero__scale-wrap {
width: 960px;
transform-origin: top center;
position: relative;
}
/* Decorative boxes */
.kt-hero__deco-box {
position: absolute;
border-radius: 5px;
}
.kt-hero__deco-box--1 {
width: 90px;
height: 90px;
background: rgb(0 70 255 / 20%);
top: 330px;
left: -9px;
}
.kt-hero__deco-box--2 {
width: 51px;
height: 51px;
background: rgba(197, 206, 228, 0.2);
top: 74px;
left: 341px;
z-index: 5;
}
/* Gradient + border box */
.kt-hero__grad-box {
position: absolute;
top: 94px;
left: 29px;
width: 376px;
height: 287px;
}
.kt-hero__border-box {
position: absolute;
top: 50px;
left: -16px;
width: 324px;
height: 252px;
border: 2px solid rgb(255 255 255 / 63%);
border-radius: 5px;
pointer-events: none;
z-index: -1;
}
.kt-hero__grad-box {
background: linear-gradient(85deg, rgb(64, 91, 186), rgb(136, 139, 244));
border-radius: 5px;
box-shadow: rgb(7, 25, 58) 0px 0px 30px 0px;
}
/* Text inside gradient box */
.kt-hero__company-text,
.kt-hero__company-outline {
position: absolute;
top: 32px;
font-size: 33px;
font-weight: 700;
text-transform: uppercase;
line-height: 1.6;
}
.kt-hero__company-outline {
left: 26px;
background: linear-gradient(rgb(132, 219, 255), rgb(37, 98, 205));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
z-index: 1;
}
.kt-hero__company-text {
left: 23px;
background: rgb(255, 255, 255);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
z-index: 2;
}
.kt-hero__gold-box {
position: absolute;
top: 80px;
left: 26px;
width: 325px;
height: 47px;
background: rgb(212, 155, 55);
border-radius: 5px;
display: flex;
align-items: center;
justify-content: center;
}
.kt-hero__brand-text {
font-size: 25px;
font-weight: 700;
text-transform: uppercase;
line-height: 1.6;
color: #fff;
text-align: center;
z-index: 2;
}
.kt-hero__divider {
position: absolute;
top: 141px;
left: 124px;
width: 128px;
height: 1px;
border-top: 1px solid rgba(255, 255, 255, 0.4);
}
.kt-hero__slogan {
position: absolute;
top: 172px;
left: 23px;
font-size: 18px;
color: rgb(202, 224, 238);
text-transform: uppercase;
line-height: 1.5;
pointer-events: none;
}
/* Nav card */
.kt-hero__white-bg {
position: absolute;
top: 425px;
left: 0;
width: 960px;
height: 171px;
background: #fff;
border-radius: 6px;
box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 30px -15px;
}
.kt-hero__nav-sep {
position: absolute;
top: 453px;
left: 231px;
width: 0;
height: 117px;
border-right: 1px solid rgb(183, 183, 183);
}
.kt-hero__nav-item {
position: absolute;
top: 444px;
width: 176px;
height: 126px;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: 0;
text-decoration: none;
}
.kt-hero__nav-item[href*="gioi-thieu"] { left: 28px; }
.kt-hero__nav-item[href*="linh-vuc"] { left: 271px; }
.kt-hero__nav-item--recruit { left: 480px; }
.kt-hero__nav-item[href*="press"] { left: 753px; }
.kt-hero__nav-item svg {
margin-top: 0;
width: 39px;
height: 39px;
}
.kt-hero__nav-label {
font-size: 17px;
font-weight: 600;
color: rgb(54, 54, 54);
line-height: 1.4;
margin-top: 8px;
}
.kt-hero__nav-label strong {
font-weight: 700;
display: block;
}
.kt-hero__nav-btn {
display: inline-block;
background: rgb(212, 155, 55);
color: #fff;
font-size: 12px;
font-weight: 700;
padding: 5px 18px;
border-radius: 1000px;
letter-spacing: 0.5px;
margin-top: 8px;
}
/* Recruitment item */
.kt-hero__nav-item--recruit {
width: 240px;
height: 196px;
top: 411px;
}
.kt-hero__nav-recruit-bg {
position: absolute;
inset: 0;
background: linear-gradient(115deg, rgb(64, 91, 186), rgb(136, 139, 244));
border-radius: 12px;
}
.kt-hero__nav-item--recruit svg {
width: 56px;
height: 56px;
margin-top: 16px;
position: relative;
z-index: 1;
}
.kt-hero__nav-item--recruit .kt-hero__nav-label {
color: #fff;
position: relative;
z-index: 1;
}
.kt-hero__nav-item--recruit .kt-hero__nav-btn {
position: relative;
z-index: 1;
margin-top: 4px;
}
/* Animations */
@-webkit-keyframes ktFadeInUp {
0% {
opacity: 0;
-webkit-transform: translateY(20px);
transform: translateY(20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes ktFadeInUp {
0% {
opacity: 0;
transform: translateY(20px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
.kt-hero__nav-item {
-webkit-animation: ktFadeInUp 1.5s ease 0.2s both;
animation: ktFadeInUp 1.5s ease 0.2s both;
}
.kt-hero__nav-item:nth-child(3) {
-webkit-animation-duration: 1.5s;
animation-duration: 1.5s;
}
.kt-hero__nav-item:nth-child(4) {
-webkit-animation-duration: 2s;
animation-duration: 2s;
-webkit-animation-delay: 0.2s;
animation-delay: 0.2s;
}
.kt-hero__nav-item:nth-child(5) {
-webkit-animation-duration: 2.5s;
animation-duration: 2.5s;
-webkit-animation-delay: 0.2s;
animation-delay: 0.2s;
}
/* ===== INTRO (SECTION2328) ===== */
.kt-section-intro {
background: linear-gradient(rgb(10, 103, 233), rgb(5, 34, 74));
padding: 60px 0;
}
.kt-section-intro .kt-container {
position: relative;
}
.kt-section-intro__inner {
position: relative;
background: rgb(234, 242, 254);
border-radius: 20px;
min-height: 315px;
margin-top: 21px;
}
.kt-section-intro__image {
position: absolute;
top: 13px;
left: 13px;
width: 453px;
height: 288px;
overflow: hidden;
}
.kt-section-intro__image img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 20px;
display: block;
}
.kt-section-intro__content {
margin-left: 479px;
padding: 27px 30px;
}
.kt-section-intro__content h2 {
font-size: 25px;
font-weight: bold;
color: rgb(36, 36, 36);
line-height: 1.2;
margin: 0 0 20px;
}
.kt-section-intro__content h2 span {
color: rgb(10, 103, 233);
}
.kt-section-intro__content p {
font-size: 14px;
line-height: 1.6;
color: rgb(84, 84, 84);
margin: 0 0 12px;
}
.kt-section-intro__certs {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
margin-top: 40px;
}
.kt-section-intro__certs img {
width: 100%;
border-radius: 20px;
display: block;
}
/* ===== CERTIFICATION DETAILS (SECTION2339) ===== */
.kt-section-certs {
padding: 60px 0;
background: #fff;
}
.kt-section-certs .kt-container {
text-align: center;
}
.kt-certs__accent {
width: 230px;
height: 40px;
background: rgb(255, 246, 1);
margin: 0 auto 4px;
display: flex;
align-items: center;
justify-content: center;
}
.kt-certs__title {
font-size: 25px;
line-height: 1.6;
color: rgb(0, 0, 0);
font-weight: normal;
margin: 0;
}
.kt-certs__heading {
font-size: 48px;
font-weight: bold;
line-height: 1.6;
color: rgb(235, 88, 79);
margin: 0 0 4px;
}
.kt-certs__sub {
font-size: 36px;
font-weight: bold;
line-height: 1.6;
color: rgb(84, 84, 84);
margin: 0 0 30px;
}
.kt-certs__images {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 16px;
margin-bottom: 40px;
}
.kt-certs__images img {
width: 100%;
border-radius: 8px;
display: block;
}
.kt-certs__desc {
font-size: 15px;
line-height: 1.6;
color: rgb(0, 0, 0);
text-align: justify;
max-width: 923px;
margin: 0 auto;
}
/* ===== FACTORY ===== */
.kt-factory {
position: relative;
overflow: hidden;
}
.kt-factory__deco {
position: absolute;
top: 9px;
left: calc(50% - 888px);
width: 1723px;
height: 530px;
pointer-events: none;
z-index: 0;
}
.kt-factory__deco svg {
display: block;
}
.kt-factory__layout {
display: grid;
grid-template-columns: 426px 1fr;
gap: 40px;
align-items: start;
position: relative;
z-index: 1;
}
.kt-factory__card {
position: relative;
width: 426px;
height: 420px;
margin-bottom: 20px;
overflow: hidden;
}
.kt-factory__card-bg {
position: absolute;
inset: 0;
border-radius: 30px;
background: linear-gradient(120deg, rgb(60, 134, 255), rgb(41, 41, 102));
border: 2px solid #fff;
/* box-shadow: rgb(41, 41, 102) 0 10px 25px -10px; */
}
.kt-factory__card-title {
position: absolute;
z-index: 1;
top: 33.5px;
left: 33px;
font-size: 18px;
font-weight: 700;
color: rgb(239, 246, 255);
line-height: 1.4;
}
.kt-factory__card-sub {
position: absolute;
z-index: 1;
top: 93px;
left: 33px;
font-size: 14px;
line-height: 1.4;
color: #fff;
}
.kt-factory__video {
position: absolute;
bottom: 15px;
left: 11px;
width: 403px;
height: 223px;
border-radius: 30px;
overflow: hidden;
background: linear-gradient(rgb(245, 247, 250), rgb(195, 207, 226));
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
}
.kt-factory__video-thumb {
position: relative;
cursor: pointer;
line-height: 0;
}
.kt-factory__video-thumb img {
width: 100%;
height: 223px;
object-fit: cover;
}
.kt-factory__video-play {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 60px;
height: 60px;
}
.kt-factory__video-play svg {
width: 60px;
height: 60px;
}
.kt-factory__video iframe {
display: none;
border-radius: 30px;
}
.kt-factory__heading {
font-size: 28px;
font-weight: 700;
color: rgb(41, 41, 102);
line-height: 1.4;
text-shadow: rgb(214, 214, 255) 1px 1px 0;
margin-bottom: 16px;
}
.kt-factory__desc {
font-size: 16px;
line-height: 1.6;
color: rgb(88, 88, 144);
margin-bottom: 30px;
}
.kt-stats {
display: flex;
gap: 10px;
}
.kt-stat {
width: 170px;
text-align: center;
}
.kt-stat__icon {
width: 80px;
height: 79px;
margin: 0 auto 10px;
display: flex;
align-items: center;
justify-content: center;
background: rgb(61, 135, 255);
border: 2px solid #fff;
border-radius: 99px;
}
.kt-stat__icon svg {
width: 40px;
height: 40px;
}
.kt-stat__num {
font-size: 36px;
font-weight: 700;
color: rgb(41, 41, 102);
line-height: 1.2;
margin-bottom: 2px;
}
.kt-stat__label {
font-size: 14px;
line-height: 1.6;
color: rgb(88, 88, 144);
}
/* ===== FOUNDER ===== */
.kt-founder {
position: relative;
}
.kt-founder__bg-img {
position: absolute;
top: 0;
left: -482px;
width: 1928px;
height: 436px;
background-image: url("https://w.ladicdn.com/s2250x750/5c7362c6c417ab07e5196b05/qsxvtquj20200701103243.jpg");
background-size: cover;
background-position: 50% 0%;
filter: brightness(110%) saturate(105%);
}
.kt-founder__bg-overlay {
position: absolute;
inset: 0;
background-image: radial-gradient(circle, rgba(13, 13, 132, 0.9), rgb(1, 1, 232));
}
.kt-founder__logo {
display: none;
}
.kt-founder__text-bg {
display: none;
}
.kt-founder__deco {
position: absolute;
pointer-events: none;
z-index: 1;
}
.kt-founder__shape-hex-out {
position: absolute;
width: 450px;
height: 417px;
top: 82px;
left: -363px;
transform: rotate(42deg);
}
.kt-founder__shape-circle {
position: absolute;
width: 485px;
height: 485px;
top: -8px;
left: 544px;
}
.kt-founder__shape-hex-grad {
position: absolute;
width: 257px;
height: 238px;
top: 283px;
left: 794px;
transform: rotate(107deg);
}
.kt-founder__wrap {
display: flex;
gap: 40px;
position: relative;
z-index: 2;
min-height: 436px;
}
.kt-founder__text {
flex: 0 0 460px;
padding-top: 98px;
position: relative;
}
.kt-founder__title {
font-family: "Paytone One", sans-serif;
font-size: 50px;
font-weight: 700;
color: rgb(250, 250, 250);
line-height: 1.4;
margin-bottom: 6px;
}
.kt-founder__name {
font-size: 28px;
font-weight: 700;
color: rgb(250, 250, 250);
line-height: 1.4;
margin-bottom: 12px;
}
.kt-founder__line {
width: 377px;
height: 1px;
border-top: 1px solid rgb(255, 204, 56);
margin-bottom: 10px;
}
.kt-founder__badge {
font-size: 14px;
font-weight: 600;
color: rgb(250, 250, 250);
letter-spacing: 1px;
margin-bottom: 14px;
border-width: 1px;
border-radius: 0px;
border-style: solid;
border-color: rgb(255, 204, 56);
background-color: rgba(250, 178, 85, 0);
width: 377px;
text-align: center;
padding: 12px 5px;
}
.kt-founder__quote {
font-size: 14px;
line-height: 1.6;
color: rgb(250, 250, 250);
max-width: 442px;
}
.kt-founder__media {
flex: 1;
display: flex;
flex-direction: column;
justify-content: flex-end;
align-items: center;
padding-top: 11px;
overflow: visible;
}
.kt-founder__photo {
width: 555px;
height: auto;
max-width: none;
position: absolute;
right: -112px;
bottom: 0;
z-index: 2;
filter: brightness(113%) saturate(113%);
display: block;
}
.kt-founder__bottom {
position: relative;
margin-top: -20px;
padding: 40px 0 0px;
}
.kt-founder__bottom-row {
display: flex;
gap: 40px;
align-items: flex-start;
padding-top: 130px;
}
.kt-founder__bottom-left {
flex: 0 0 360px;
}
.kt-founder__blue-bg {
position: absolute;
top: 80px;
left: -542px;
width: 971px;
height: 820px;
border-bottom-right-radius: 50px;
background: rgb(13, 13, 132);
pointer-events: none;
z-index: -1;
}
.kt-founder__dot-grid {
position: absolute;
top: 74px;
left: -30px;
width: 80px;
height: 80px;
}
.kt-founder__reasons-title {
font-size: 36px;
font-weight: 700;
color: rgb(250, 250, 250);
line-height: 1.4;
margin-bottom: 30px;
padding-left: 21px;
max-width: 408px;
position: relative;
}
.kt-founder__cards {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 24px;
flex: 1;
position: relative;
margin-top: -84px;
margin-left: -24px;
}
.kt-founder__card {
position: relative;
padding-top: 20px;
height: 100%;
display: flex;
flex-direction: column;
}
.kt-founder__card-num {
font-size: 46px;
font-weight: 700;
line-height: 1.2;
color: rgb(250, 250, 250);
position: absolute;
top: -12px;
left: 0;
width: 144px;
text-align: center;
z-index: 1;
-webkit-text-stroke: 1px rgb(212, 155, 55);
text-shadow: 0 0 12px rgba(212, 155, 55, 0.6);
}
.kt-founder__card-num--dark {
color: rgb(0, 0, 0);
}
.kt-founder__card-box {
background: rgb(1, 1, 232);
border: 1px solid rgb(242, 242, 242);
border-radius: 10px;
box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 30px -10px;
padding: 20px 22px;
margin-left: 22px;
min-height: 140px;
flex: 1;
}
.kt-founder__card-box h4 {
font-size: 18px;
font-weight: 700;
color: rgb(250, 250, 250);
margin-bottom: 8px;
}
.kt-founder__card-box p {
font-size: 14px;
line-height: 1.6;
color: rgb(250, 250, 250);
}
.kt-founder__footer-desc {
font-size: 14px;
line-height: 1.6;
color: rgb(255, 255, 255);
text-align: left;
max-width: 335px;
margin-top: 24px;
margin-left: 21px;
position: relative;
}
/* ===== PRESS ===== */
/* ===== PRESS (SECTION2351) ===== */
.kt-press {
padding: 0px 0;
padding-bottom: 60px;
}
.kt-press__title {
font-size: 25px;
font-weight: 700;
color: rgb(10, 103, 233);
text-align: center;
margin: 0 0 16px;
}
.kt-press__line {
width: 400px;
height: 3px;
background: rgb(0, 0, 0);
margin: 0 auto 36px;
border-radius: 2px;
}
.kt-press__logos {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
gap: 24px;
}
.kt-press__logo {
flex: 0 0 auto;
display: flex;
align-items: center;
justify-content: center;
transition: 0.3s;
border-width: 2px;
border-radius: 24px;
border-style: solid;
border-color: rgb(7, 58, 145);
box-shadow: rgb(0, 0, 0) 0px 15px 20px -15px;
overflow: hidden;
}
.kt-press__logo:hover {
opacity: 0.8;
}
.kt-press__logo img {
width: 173px;
height: 96px;
object-fit: cover;
display: block;
}
/* ===== CULTURE (SECTION1768) ===== */
.kt-culture {
background: rgb(247, 247, 247);
position: relative;
overflow: hidden;
min-height: 613px;
}
.kt-culture .kt-container {
position: relative;
}
.kt-culture__deco-group {
position: absolute;
top: 158px;
left: -675px;
width: 1175px;
height: 418px;
pointer-events: none;
z-index: -1;
}
.kt-culture__deco-box {
position: absolute;
top: 0;
left: 0;
width: 1068px;
height: 387px;
background-image: linear-gradient(297deg, rgb(64, 91, 186), rgb(136, 139, 244));
/* opacity: 0.15; */
border-radius: 8px;
}
.kt-culture__deco-box--med {
position: absolute;
top: 211px;
left: 968px;
width: 207px;
height: 207px;
background-color: rgba(105, 136, 215, 0.1);
border-radius: 8px;
/* opacity: 0.08; */
}
.kt-culture__deco-box--sm {
position: absolute;
top: 258px;
left: 831px;
width: 113px;
height: 113px;
background-color: rgba(105, 136, 215, 0.1);
border-radius: 8px;
/* opacity: 0.06; */
}
.kt-culture__inner {
display: flex;
gap: 40px;
position: relative;
z-index: 1;
align-items: flex-start;
}
.kt-culture__items {
flex: 0 0 483px;
position: relative;
padding-top: 76px;
}
.kt-culture__card {
position: absolute;
width: 231px;
height: 195px;
}
.kt-culture__card:nth-child(1) { top: 0; left: 0; }
.kt-culture__card:nth-child(2) { top: 34px; left: 241px; }
.kt-culture__card:nth-child(4) { top: 204px; left: 0; }
.kt-culture__card:nth-child(3) { top: 238px; left: 240px; }
.kt-culture__card-bg {
position: absolute;
inset: 0;
background: rgb(255, 255, 255);
box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}
.kt-culture__card-img {
position: absolute;
top: 14px;
left: 16px;
width: 194px;
height: 128px;
background: linear-gradient(135deg, rgb(234,242,254), rgb(210,225,255));
display: flex;
align-items: center;
justify-content: center;
}
.kt-culture__card-img svg {
width: 56px;
height: 56px;
color: rgb(7, 58, 145);
display: block;
}
.kt-culture__card-text {
position: absolute;
font-size: 15px;
font-weight: 600;
color: rgb(51, 51, 51);
margin: 0;
text-align: center;
width: 153px;
top: 156px;
left: 36px;
line-height: 1.4;
}
.kt-culture__card:nth-child(2) .kt-culture__card-text {
width: 219px;
left: 5px;
}
.kt-culture__card:nth-child(3) .kt-culture__card-text {
width: 195px;
left: 17px;
top: 152px;
}
.kt-culture__card:nth-child(4) .kt-culture__card-text {
left: 37px;
top: 150px;
}
.kt-culture__content {
flex: 1;
padding-top: 65px;
max-width: 432px;
}
.kt-culture__title-block {
margin-bottom: 24px;
}
.kt-culture__title {
font-size: 46px;
font-weight: 700;
color: rgb(7, 58, 145);
margin: 0;
line-height: 1.2;
}
.kt-culture__subtitle {
font-size: 24px;
font-weight: 600;
color: rgb(7, 58, 145);
margin: 4px 0 0;
line-height: 1.2;
}
.kt-culture__line,
.kt-culture__line--short {
height: 2px;
background: rgb(212, 155, 55);
margin-top: 8px;
}
.kt-culture__line {
width: 60px;
}
.kt-culture__line--short {
width: 40px;
margin-top: 4px;
}
.kt-culture__desc {
font-size: 16px;
line-height: 1.7;
color: rgb(84, 84, 84);
margin: 0;
}
/* ===== HR (SECTION1797) ===== */
.kt-hr {
background: rgb(247, 247, 247);
position: relative;
overflow: hidden;
}
.kt-hr .kt-container {
position: relative;
min-height: 1380px;
}
.kt-hr__bg-card {
position: absolute;
top: 36.6px;
left: -56px;
width: 1078px;
height: 1424px;
background: #fff;
border-radius: 16px;
box-shadow: 0 0 30px -15px rgba(0,0,0,0.9);
z-index: 0;
}
.kt-hr__deco-box {
position: absolute;
top: 25.7px;
right: 10px;
width: 71px;
height: 71px;
background: rgba(105, 137, 215, 0.1);
border-radius: 8px;
z-index: 1;
}
.kt-hr__top {
display: flex;
gap: 60px;
position: relative;
z-index: 1;
padding-top: 78px;
padding-bottom: 36px;
}
.kt-hr__left {
flex: 0 0 432px;
}
.kt-hr__title-block {
position: relative;
width: 385px;
height: 101px;
}
.kt-hr__title {
font-size: 33px;
font-weight: 700;
color: rgb(52, 95, 170);
margin: 0;
line-height: 1.6;
position: absolute;
top: 0;
left: 0;
}
.kt-hr__subtitle {
font-size: 44px;
font-weight: 700;
color: rgb(52, 95, 170);
margin: 0;
line-height: 1.6;
position: absolute;
top: 31px;
left: 100px;
}
.kt-hr__line {
position: absolute;
top: 50px;
left: 0;
width: 91px;
height: 3px;
background: rgb(212, 155, 55);
border: 0;
}
.kt-hr__line--short {
position: absolute;
top: 36px;
left: 228.5px;
width: 85px;
height: 3px;
background: rgb(212, 155, 55);
border: 0;
}
.kt-hr__training {
margin-top: 30px;
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.kt-hr__badge {
width: 51px;
height: 51px;
flex: 0 0 51px;
border-radius: 1000px;
border: 1px solid rgb(185, 179, 179);
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.kt-hr__badge-inner {
width: 44px;
height: 44px;
border-radius: 1000px;
background: linear-gradient(245deg, rgb(213,155,54), rgb(232,148,40));
display: flex;
align-items: center;
justify-content: center;
font-size: 22px;
font-weight: 700;
color: #fff;
line-height: 1.6;
}
.kt-hr__training .kt-hr__heading {
font-size: 23px;
font-weight: 700;
color: rgb(70, 75, 79);
margin: 0;
line-height: 1.6;
flex: 1;
min-width: 200px;
padding-top: 8px;
}
.kt-hr__desc {
width: 100%;
font-size: 16px;
line-height: 1.8;
color: #000;
text-align: justify;
letter-spacing: 0.2px;
margin: 0;
}
.kt-hr__right {
flex: 1;
padding-top: 30px;
}
.kt-hr__img-collage {
position: relative;
width: 441px;
height: 330px;
margin-left: auto;
}
.kt-hr__img-main {
position: absolute;
top: 48px;
left: 22px;
width: 342px;
height: 255px;
object-fit: cover;
border-radius: 0;
z-index: 4;
border-radius: 8px;
}
.kt-hr__img-blur {
position: absolute;
top: 0;
left: 59px;
width: 342px;
height: 255px;
object-fit: cover;
filter: blur(4px);
}
.kt-hr__img-deco {
position: absolute;
top: 216.5px;
left: 0;
width: 113px;
height: 113px;
background: rgba(105, 136, 215, 0.2);
border-radius: 8px;
}
.kt-hr__img-person {
position: absolute;
top: 48px;
left: 241px;
width: 200px;
height: 225px;
object-fit: cover;
z-index: 2;
border-radius: 8px;
}
.kt-hr__gradient-bar {
position: absolute;
top: 455px;
left: 0;
width: 960px;
height: 160px;
background: linear-gradient(173deg, rgb(64,91,186), rgb(136,139,244));
border-radius: 6px;
z-index: 0;
margin-top: 54px;
}
.kt-hr__gold-bar {
position: relative;
z-index: 2;
width: 424px;
height: 45px;
margin: 10px 0 0 268px;
background: rgb(212, 155, 55);
border-radius: 4px;
display: flex;
align-items: center;
justify-content: center;
}
.kt-hr__gold-bar span {
font-size: 16px;
font-weight: 700;
color: #fff;
line-height: 1.6;
}
.kt-hr__courses {
display: flex;
gap: 18px;
position: relative;
z-index: 2;
margin-top: 14px;
padding-left: 39px;
}
.kt-hr__course-item {
flex: 0 0 283.5px;
height: 82px;
position: relative;
}
.kt-hr__course-shadow {
position: absolute;
top: 14px;
left: 14px;
width: 277px;
height: 75px;
background: rgb(34, 64, 130);
border-radius: 4px;
}
.kt-hr__course-bg {
position: absolute;
top: 7px;
left: 6.5px;
width: 277px;
height: 75px;
background: #fff;
border-radius: 4px;
}
.kt-hr__course-item p {
position: absolute;
z-index: 1;
width: 241px;
top: 16.5px;
left: 18px;
font-size: 16px;
line-height: 1.4;
color: #000;
text-align: center;
letter-spacing: 0.2px;
margin: 0;
text-shadow: rgb(250,250,250) 1px 2px 3px;
}
.kt-hr__dark {
position: relative;
margin-top: 20px;
z-index: 1;
}
.kt-hr__dark--1 {
margin-top: 69px;
}
.kt-hr__dark-bg {
position: absolute;
inset: 0;
background: rgb(25, 52, 109);
width: 100%;
}
.kt-hr__dark--1 .kt-hr__dark-bg {
height: 252px;
border-radius: 5px;
overflow: hidden;
}
.kt-hr__dark--2 .kt-hr__dark-bg {
height: 292px;
border-radius: 5px;
overflow: hidden;
}
.kt-hr__dark-inner {
position: relative;
z-index: 3;
display: flex;
gap: 30px;
align-items: flex-start;
padding: 30px 20px;
}
.kt-hr__dark--1 .kt-hr__dark-inner {
padding: 30px 120px;
min-height: 192px;
}
.kt-hr__dark--2 .kt-hr__dark-inner {
padding: 30px 81px 30px 55px;
min-height: 232px;
}
.kt-hr__dark-img {
border-radius: 6px;
overflow: hidden;
}
.kt-hr__dark--1 .kt-hr__dark-img {
flex: 0 0 274px;
margin-top: 15px;
}
.kt-hr__dark--1 .kt-hr__dark-img img {
width: 100%;
height: 181px;
object-fit: cover;
display: block;
}
.kt-hr__dark--2 .kt-hr__dark-img {
flex: 0 0 274px;
}
.kt-hr__dark--2 .kt-hr__dark-img img {
width: 100%;
height: 215.742px;
object-fit: cover;
display: block;
}
/* BOX1878 - small decorative box behind image */
.kt-hr__d2-box {
position: absolute;
top: 20px;
left: 583.62px;
width: 88.761px;
height: 88.761px;
background: rgba(255,255,255,0.1);
border-radius: 8px;
z-index: 1;
pointer-events: none;
}
/* GROUP1872 - decorative circles bottom-right */
.kt-hr__d2-deco {
position: absolute;
top: 169px;
left: 832.773px;
width: 127.227px;
height: 122.972px;
z-index: 0;
pointer-events: none;
}
.kt-hr__d2-deco .kt-hr__d2-dc {
position: absolute;
border-radius: 8px;
}
.kt-hr__d2-dc--a {
top: 0;
left: 13.63px;
width: 61.07px;
height: 61.07px;
background: rgba(255,255,255,0.1);
}
.kt-hr__d2-dc--b {
top: 31.05px;
left: 34.91px;
width: 80.56px;
height: 80.56px;
background: rgba(255,255,255,0.1);
}
.kt-hr__d2-dc--c {
top: 44.13px;
left: 0;
width: 27.32px;
height: 27.32px;
background: rgba(255,255,255,0.1);
}
/* Decorative circles - GROUP2164 (top-left) */
.kt-hr__deco-1 {
position: absolute;
top: 8px;
left: 0;
width: 172px;
height: 172px;
z-index: 0;
pointer-events: none;
}
.kt-hr__deco-1 .kt-hr__dc {
position: absolute;
border-radius: 8px;
}
.kt-hr__dc--a {
top: 0;
left: 20.65px;
width: 86.7px;
height: 86.7px;
background: rgba(255,255,255,0.1);
}
.kt-hr__dc--b {
top: 43.5px;
left: 43.78px;
width: 128.4px;
height: 128.4px;
background: rgba(178,187,203,0.1);
}
.kt-hr__dc--c {
top: 62.67px;
left: 0;
width: 38.8px;
height: 38.8px;
background: rgba(255,255,255,0.1);
}
/* Decorative circles - GROUP2163 (bottom-right) */
.kt-hr__deco-2 {
position: absolute;
top: 143px;
left: 844.5px;
width: 115.5px;
height: 111.6px;
z-index: 0;
pointer-events: none;
}
.kt-hr__deco-2 .kt-hr__dc {
position: absolute;
border-radius: 8px;
}
.kt-hr__dc--d {
top: 0;
left: 13.63px;
width: 61.07px;
height: 61.07px;
background: rgba(255,255,255,0.1);
}
.kt-hr__dc--e {
top: 31.05px;
left: 34.91px;
width: 80.56px;
height: 80.56px;
background: rgba(255,255,255,0.1);
}
.kt-hr__dc--f {
top: 44.13px;
left: 0;
width: 27.32px;
height: 27.32px;
background: rgba(255,255,255,0.1);
}
/* Content inside inner (flex) */
.kt-hr__dark--1 .kt-hr__dark-content {
flex: 1;
}
.kt-hr__dark-heading {
display: flex;
align-items: center;
gap: 14px;
margin-bottom: 16px;
}
.kt-hr__dark-heading .kt-hr__badge {
flex: 0 0 51px;
}
.kt-hr__dark-env-title {
font-size: 23px;
font-weight: 700;
color: #fff;
line-height: 1.6;
margin: 0;
}
.kt-hr__dark--1 .kt-hr__dark-lists ul {
margin: 0;
padding: 0;
list-style: none;
}
.kt-hr__dark--1 .kt-hr__dark-lists li {
padding-bottom: 9px;
padding-left: 29px;
position: relative;
font-size: 15px;
line-height: 1.4;
color: #fff;
text-align: justify;
list-style: none;
}
.kt-hr__dark--1 .kt-hr__dark-lists li::before {
content: "";
position: absolute;
top: 2px;
left: 0;
width: 19px;
height: 19px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4C12.76,4 13.5,4.11 14.2,4.31L15.77,2.74C14.61,2.26 13.34,2 12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12M7.91,10.08L6.5,11.5L11,16L21,6L19.59,4.58L11,13.17L7.91,10.08Z' fill='rgba(238,210,98,1)'/%3E%3C/svg%3E");
background-size: 100% 100%;
background-repeat: no-repeat;
}
.kt-hr__dark-title {
font-size: 23px;
font-weight: 700;
color: #fff;
margin: 0 0 16px;
line-height: 1.6;
}
.kt-hr__d2-lists {
position: relative;
z-index: 1;
}
.kt-hr__d2-lists ul {
margin: 0;
padding: 0;
list-style: none;
}
.kt-hr__d2-lists li {
padding-bottom: 9px;
padding-left: 29px;
position: relative;
font-size: 15px;
line-height: 1.4;
color: #fff;
text-align: justify;
list-style: none;
}
.kt-hr__d2-lists li::before {
content: "";
position: absolute;
top: 2px;
left: 0;
width: 19px;
height: 19px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4C12.76,4 13.5,4.11 14.2,4.31L15.77,2.74C14.61,2.26 13.34,2 12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12M7.91,10.08L6.5,11.5L11,16L21,6L19.59,4.58L11,13.17L7.91,10.08Z' fill='rgba(238,210,98,1)'/%3E%3C/svg%3E");
background-size: 100% 100%;
background-repeat: no-repeat;
}
.kt-hr__quote {
position: relative;
z-index: 1;
text-align: center;
padding: 40px 0 20px;
}
.kt-hr__quote-line1 {
font-size: 29px;
font-weight: 700;
color: rgb(38, 107, 225);
text-transform: uppercase;
line-height: 1.6;
margin: 0;
font-family: Montserrat, sans-serif;
}
.kt-hr__quote-line2 {
font-size: 17px;
font-weight: 400;
color: rgb(58, 58, 58);
text-transform: uppercase;
line-height: 1.6;
margin: 0;
font-family: Montserrat, sans-serif;
}
.kt-hr__bottom-box {
position: relative;
z-index: 1;
width: 863px;
margin: 0 auto;
padding: 20px 8px;
border: 1px solid rgb(222, 222, 222);
border-radius: 4px;
margin-top: 20px;
}
.kt-hr__bottom-box .kt-hr__quote {
padding: 0;
}
/* ===== RECRUITMENT CONTACT (SECTION1940) ===== */
.kt-recruit {
position: relative;
overflow: hidden;
height: 317px;
padding: 0;
background: rgb(247, 247, 247);
}
.kt-recruit .kt-container {
position: relative;
height: 100%;
}
.kt-recruit__photo {
position: absolute;
top: 28.617px;
left: 94.72px;
width: 1359.28px;
height: 274.666px;
background: url("https://w.ladicdn.com/s1700x600/5c7362c6c417ab07e5196b05/vsy5e-20200707041148.jpg") center/cover no-repeat;
border-radius: 6px;
z-index: 0;
}
.kt-recruit__overlay {
position: absolute;
top: 28.951px;
left: 256.72px;
width: 1193px;
height: 273.998px;
background: linear-gradient(314deg, rgb(65,92,187), rgba(136,141,245,0.8));
border-radius: 6px;
z-index: 1;
}
.kt-recruit__deco {
position: absolute;
top: 28.617px;
left: -203px;
width: 278.153px;
height: 277.872px;
z-index: 2;
pointer-events: none;
}
.kt-recruit__dc {
position: absolute;
background: rgba(105,136,215,0.1);
border-radius: 5px;
}
.kt-recruit__dc--1 {
top: 66.2637px;
left: 0;
width: 211.609px;
height: 211.608px;
}
.kt-recruit__dc--2 {
top: 0;
left: 103.808px;
width: 136.813px;
height: 136.813px;
}
.kt-recruit__dc--3 {
top: 100.467px;
left: 217.199px;
width: 60.9537px;
height: 60.9536px;
}
.kt-recruit__logo {
position: absolute;
top: 59.1205px;
left: 123px;
width: 245.19px;
height: 66px;
z-index: 3;
}
.kt-recruit__logo img {
width: 100%;
height: 100%;
object-fit: contain;
}
.kt-recruit__text {
position: absolute;
top: 59.1205px;
left: 400px;
width: 543px;
z-index: 3;
}
.kt-recruit__desc {
font-size: 15px;
line-height: 1.4;
color: rgb(255,255,255);
letter-spacing: 0.1px;
text-align: justify;
margin: 0 0 8px;
width: 519px;
}
.kt-recruit__line {
width: 519px;
border-top: 1px solid rgba(255,255,255,0.5);
margin: 0 0 8px;
padding: 8px 0;
}
.kt-recruit__company {
font-size: 20px;
font-weight: bold;
color: rgb(255,255,255);
text-transform: uppercase;
letter-spacing: 0;
line-height: 1.6;
text-align: justify;
margin: 0 0 6px;
width: 519px;
}
.kt-recruit__address {
font-size: 15px;
line-height: 1.4;
color: rgb(255,255,255);
letter-spacing: 0.1px;
text-align: justify;
margin: 0 0 6px;
width: 543px;
}
.kt-recruit__phone {
font-size: 15px;
line-height: 1.6;
color: rgb(255,255,255);
letter-spacing: 0.1px;
text-align: justify;
margin: 0 0 4px;
width: 531px;
}
.kt-recruit__hr {
font-size: 15px;
line-height: 1.6;
color: rgb(255,255,255);
letter-spacing: 0.1px;
text-align: justify;
margin: 0;
width: 531px;
}
/* ===== FORM ===== */
.kt-form {
height: 688px;
padding: 0;
overflow: hidden;
background: rgb(247, 247, 247);
}
.kt-form .kt-container {
height: 100%;
}
/* ---- Background card (BOX1963) ---- */
.kt-form__bg {
position: absolute;
top: 150.7px;
left: -159px;
width: 1274px;
height: 475px;
background: rgb(25, 53, 109);
border-radius: 8px;
}
/* ---- Decor top-right (GROUP1974) ---- */
.kt-form__deco {
position: absolute;
top: 96.2px;
left: 939.137px;
width: 292.863px;
height: 292px;
}
.kt-form__dc {
position: absolute;
border-radius: 5px;
background: rgba(105, 135, 215, 0.2);
}
.kt-form__dc:nth-child(1) {
width: 145.135px;
height: 145.137px;
left: 36.284px;
}
.kt-form__dc:nth-child(2) {
width: 220.295px;
height: 220.295px;
top: 71.704px;
left: 72.568px;
}
.kt-form__dc:nth-child(3) {
width: 66.521px;
height: 66.521px;
top: 106.26px;
}
/* ---- Decor bottom-left ---- */
.kt-form__bl {
position: absolute;
top: 410.7px;
left: -69px;
width: 174px;
height: 174px;
border-radius: 5px;
background: rgba(105, 135, 215, 0.2);
}
.kt-form__bl-sm {
position: absolute;
top: 528.7px;
left: -116px;
width: 76px;
height: 76px;
border-radius: 5px;
background: rgba(105, 135, 215, 0.2);
}
/* ---- Title group (GROUP2181) ---- */
.kt-form__title {
position: absolute;
top: 192.7px;
left: 310px;
height: 126px;
}
.kt-form__title--gold {
font-size: 46px;
font-weight: bold;
color: rgb(255, 210, 130);
text-align: center;
line-height: 1.6;
width: 587px;
}
.kt-form__title--light {
position: absolute;
top: 53px;
left: 205px;
width: 367px;
font-size: 46px;
font-weight: bold;
color: rgb(236, 236, 236);
text-align: center;
line-height: 1.6;
}
.kt-form__line {
position: absolute;
border-top: 3px solid rgba(155, 155, 155, 0.3);
border-right: 3px solid rgba(155, 155, 155, 0.3);
border-bottom: 1px solid rgba(155, 155, 155, 0.3);
border-left: 0;
}
.kt-form__line--1 {
width: 117px;
top: 68.5px;
left: 124px;
}
.kt-form__line--2 {
width: 79px;
top: 40px;
left: 452px;
}
/* ---- Subtitle (HEADLINE1266) ---- */
.kt-form__sub {
position: absolute;
top: 312.7px;
left: 426px;
width: 481px;
font-size: 14px;
line-height: 1.6;
color: rgb(252, 250, 207);
text-align: left;
letter-spacing: 0.2px;
}
/* ---- List (LIST_PARAGRAPH1952) ---- */
.kt-form__list {
position: absolute;
top: 382.7px;
left: 423px;
width: 553px;
}
.kt-form__list ol {
list-style: none;
counter-reset: form-counter;
padding: 0;
margin: 0;
}
.kt-form__list ol li {
counter-increment: form-counter;
font-size: 15px;
line-height: 1.4;
color: #fff;
text-align: left;
letter-spacing: 0.2px;
padding-bottom: 20px;
padding-left: 29px;
position: relative;
}
.kt-form__list ol li::before {
content: "0" counter(form-counter);
position: absolute;
top: -1px;
left: 0;
font-weight: 700;
color: rgb(255, 210, 130);
}
.kt-form__list ol li strong {
color: rgb(255, 210, 130);
}
/* ---- Form group (GROUP2136) ---- */
.kt-form__group {
position: absolute;
top: 82.7px;
left: -28px;
width: 421px;
height: 491px;
}
.kt-form__group-border {
position: absolute;
top: 68px;
left: 0;
width: 369.813px;
height: 423px;
border: 2px solid rgb(77, 92, 166);
border-radius: 8px;
pointer-events: none;
}
.kt-form__group-inner {
position: absolute;
top: 0;
left: 28px;
width: 393px;
height: 500px;
}
.kt-form__group-bg {
width: 100%;
height: 100%;
border-radius: 8px;
background: linear-gradient(139deg, rgb(64, 91, 186), rgb(136, 139, 244));
}
.kt-form__group-title {
position: absolute;
top: 36px;
left: 0;
width: 100%;
font-size: 26px;
font-weight: bold;
color: #fff;
text-align: center;
line-height: 1.4;
padding: 0 17px;
}
.kt-form__group-note {
position: absolute;
top: 76px;
left: 50.152px;
width: 280px;
font-size: 14px;
line-height: 1.6;
color: #fff;
text-align: center;
}
/* ---- Form inside ---- */
.kt-form__group-inner form {
position: absolute;
top: 145px;
left: 37.5615px;
width: 317.877px;
height: 281.362px;
font-family: Montserrat, sans-serif;
font-size: 12px;
color: #000;
}
.kt-form__group-inner form input,
.kt-form__group-inner form select {
width: 100%;
height: 40px;
padding: 0 12px;
margin-bottom: 6.9147px;
border: 1px solid rgb(7, 58, 145);
border-radius: 0;
background: #fff;
font-family: Montserrat, sans-serif;
font-size: 12px;
color: #000;
outline: none;
box-sizing: border-box;
-webkit-appearance: none;
appearance: none;
}
.kt-form__group-inner form input[type="date"] {
min-height: 40px;
line-height: 1;
}
.kt-date-wrap {
position: relative;
display: block;
margin-bottom: 6.9147px;
}
.kt-date-wrap .kt-date-input {
margin-bottom: 0;
}
.kt-date-label {
position: absolute;
left: 12px;
top: 50%;
transform: translateY(-50%);
font-size: 12px;
font-family: Montserrat, sans-serif;
color: #888;
pointer-events: none;
z-index: 2;
white-space: nowrap;
background: #fff;
padding: 0 2px;
}
.kt-date-input:focus + .kt-date-label,
.kt-date-input:valid + .kt-date-label {
display: none;
}
.kt-form__group-inner form input::placeholder {
color: #888;
}
.kt-form__group-inner form select {
appearance: none;
-webkit-appearance: none;
background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23888'/%3E%3C/svg%3E") no-repeat right 12px center;
cursor: pointer;
}
.kt-form__cv {
position: relative;
margin-bottom: 6.9147px;
}
.kt-form__cv input[type="file"] {
position: absolute;
inset: 0;
opacity: 0;
cursor: pointer;
z-index: 1;
width: 100%;
height: 100%;
}
.kt-form__cv label {
display: flex;
align-items: center;
width: 100%;
min-height: 40px;
padding: 8px 12px;
border: 1px solid rgb(7, 58, 145);
border-radius: 0;
background: #fff;
font-family: Montserrat, sans-serif;
font-size: 12px;
color: #888;
box-sizing: border-box;
cursor: pointer;
}
.kt-form__cv label span {
margin-left: 6px;
color: #000;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 200px;
}
.kt-form__cv input[type="file"]:hover + label {
border-color: #f4b64a;
}
.kt-form__submit {
width: 100%;
height: 40px;
border: none;
background: rgb(244, 182, 74);
color: #fff;
font-size: 16px;
font-weight: bold;
font-family: Montserrat, sans-serif;
cursor: pointer;
box-shadow: rgb(13, 23, 44) 0 0 30px -15px;
text-align: center;
letter-spacing: 1px;
}
.kt-form__submit:hover {
filter: brightness(1.08);
}
.kt-form__success {
display: none;
position: absolute;
top: 50%;
left: 0;
right: 0;
text-align: center;
padding: 30px;
z-index: 2;
}
.kt-form__success p {
font-size: 16px;
color: #fff;
font-weight: 600;
margin: 0;
}
/* ===== FOOTER ===== */
.kt-footer {
height: 433.08px;
padding: 0;
background: rgb(58, 58, 58);
}
.kt-footer .kt-container {
height: 100%;
}
/* ---- Logo (IMAGE2373) ---- */
.kt-footer__logo {
position: absolute;
top: 29.493px;
left: 56.611px;
width: 240.312px;
height: 68.489px;
background: url('https://w.ladicdn.com/s550x400/5abe59a5e9cb7e9e174311d4/logo-20210321143849.png') no-repeat center / contain;
display: block;
}
/* ---- Badges ---- */
.kt-footer__badge1,
.kt-footer__badge2 {
position: absolute;
border-radius: 5px;
}
.kt-footer__badge1 {
top: 122.771px;
left: 56.611px;
width: 120.099px;
height: 40.584px;
background: url('https://w.ladicdn.com/s450x450/5abe59a5e9cb7e9e174311d4/da-thong-bao-bo-cong-thuong-20220807103733.jpeg') no-repeat center / cover;
}
.kt-footer__badge2 {
top: 119.818px;
left: 184.053px;
width: 120.844px;
height: 45.4014px;
background: url('https://w.ladicdn.com/s450x350/5abe59a5e9cb7e9e174311d4/images-20220807103936.png') no-repeat center / cover;
}
/* ---- Left column groups ---- */
.kt-footer__grp {
position: absolute;
left: 56.611px;
height: 25px;
}
.kt-footer__ico {
position: absolute;
top: 0;
left: 0;
width: 22.5469px;
height: 22.5469px;
flex-shrink: 0;
}
.kt-footer__grp p {
position: absolute;
left: 34.286px;
top: 3px;
font-size: 14px;
line-height: 1.6;
color: #fff;
white-space: nowrap;
}
.kt-footer__grp p strong {
font-weight: bold;
}
.kt-footer__grp--company {
top: 192.796px;
width: 467.286px;
}
.kt-footer__grp--company p {
width: 433px;
font-size: 16px;
}
.kt-footer__grp--address {
top: 227.792px;
width: 502.286px;
}
.kt-footer__grp--address p {
width: 468px;
}
.kt-footer__grp--hotline {
top: 265.79px;
width: 270.286px;
}
.kt-footer__grp--hotline p {
width: 236px;
}
.kt-footer__grp--tax {
top: 302.79px;
width: 355.286px;
}
.kt-footer__grp--tax p {
width: 321px;
}
.kt-footer__grp--email {
top: 336.79px;
width: 355.286px;
}
.kt-footer__grp--email p {
width: 321px;
}
/* ---- Right column cards ---- */
.kt-footer__card {
position: absolute;
width: 287.714px;
height: 73.994px;
}
.kt-footer__card-icon {
position: absolute;
top: 1px;
left: 0;
width: 39px;
height: 39px;
background: url('https://w.ladicdn.com/s350x350/58511509a76157de3f399ae2/icon_phone-20191024083424.png') no-repeat center / contain;
}
.kt-footer__card-text {
position: absolute;
left: 51.714px;
}
.kt-footer__card-title {
font-size: 14px;
line-height: 1.6;
color: rgb(211, 211, 211);
margin: 0;
}
.kt-footer__card-phone {
display: block;
font-weight: bold;
font-size: 23px;
line-height: 1.6;
color: #fff;
text-decoration: none;
transition: 0.3s;
}
.kt-footer__card-phone:hover {
color: rgb(212, 155, 55);
}
.kt-footer__card-desc {
font-size: 13px;
line-height: 1.6;
color: #fff;
margin: 0;
}
/* Card 1: Hotline (08:00-21:30) - GROUP2390 */
.kt-footer__card--h1 {
top: 29.493px;
left: 621.282px;
}
.kt-footer__card--h1 .kt-footer__card-text {
top: 0;
}
.kt-footer__card--h1 .kt-footer__card-title {
width: 173px;
}
.kt-footer__card--h1 .kt-footer__card-phone {
font-size: 20px;
top: 19.998px;
width: 236px;
}
.kt-footer__card--h1 .kt-footer__card-desc {
position: absolute;
top: 52.994px;
width: 214px;
}
/* Card 2: Hotline (8:00-22:00) - GROUP2368 */
.kt-footer__card--h2 {
top: 119.818px;
left: 621.282px;
}
.kt-footer__card--h2 .kt-footer__card-text {
top: 0;
}
.kt-footer__card--h2 .kt-footer__card-title {
width: 167px;
}
.kt-footer__card--h2 .kt-footer__card-phone {
top: 19.998px;
width: 236px;
}
.kt-footer__card--h2 .kt-footer__card-desc {
position: absolute;
top: 52.994px;
width: 214px;
}
/* Card Zalo (GROUP2383) */
.kt-footer__card--zalo {
top: 307.818px;
left: 621.782px;
}
.kt-footer__card--zalo .kt-footer__card-icon {
width: 39px;
height: 39px;
background: url('https://w.ladicdn.com/s350x350/5abe59a5e9cb7e9e174311d4/zalo-logo-768x7681-20220807102455.png') no-repeat center / contain;
}
.kt-footer__card--zalo .kt-footer__card-text {
top: 0;
}
.kt-footer__card--zalo .kt-footer__card-title {
width: 184px;
}
.kt-footer__card--zalo .kt-footer__card-phone {
top: 19.998px;
width: 236px;
}
.kt-footer__card--zalo .kt-footer__card-desc {
position: absolute;
top: 52.994px;
width: 214px;
}
/* ---- Warranty freestanding ---- */
.kt-footer__warranty,
.kt-footer__bottom {
position: static;
}
.kt-footer__wico {
position: absolute;
top: 215.818px;
left: 621.782px;
width: 39px;
height: 39px;
background: url('https://w.ladicdn.com/s350x350/58511509a76157de3f399ae2/icon_phone-20191024083424.png') no-repeat center / contain;
}
.kt-footer__wtitle {
position: absolute;
top: 214.818px;
left: 674.496px;
width: 176px;
font-size: 14px;
line-height: 1.6;
color: rgb(211, 211, 211);
margin: 0;
}
.kt-footer__wphone {
position: absolute;
top: 234.816px;
left: 674.496px;
width: 236px;
font-weight: bold;
font-size: 23px;
line-height: 1.6;
color: #fff;
text-decoration: none;
transition: 0.3s;
}
.kt-footer__wphone:hover {
color: rgb(212, 155, 55);
}
.kt-footer__wdesc {
position: absolute;
top: 267.812px;
left: 674.496px;
width: 214px;
font-size: 13px;
line-height: 1.6;
color: #fff;
margin: 0;
}
/* ---- Separator line (LINE2361) ---- */
.kt-footer__line {
position: absolute;
bottom: 0;
left: 0.5px;
width: 960px;
height: 1px;
background: rgba(255, 255, 255, 0.1);
}
/* ===== RESPONSIVE ===== */
@media (max-width: 991px) {
.kt-container {
width: 100%;
padding: 0 15px;
}
.kt-top-bar .kt-container {
flex-wrap: wrap;
padding-top: 8px;
padding-bottom: 8px;
align-items: flex-start;
}
.kt-top-bar__group--address,
.kt-top-bar__group--phone,
.kt-top-bar__group--email {
position: static;
transform: none;
}
.kt-top-bar__group--address {
white-space: nowrap;
}
.kt-top-bar {
height: auto;
}
.kt-hero {
height: auto;
padding: 0;
overflow: hidden;
}
.kt-section-intro__inner {
margin-top: 0;
min-height: auto;
}
.kt-section-intro__image {
position: relative;
top: auto;
left: auto;
width: 100%;
padding: 20px 20px 0;
}
.kt-section-intro__content {
margin-left: 0;
padding: 10px 20px 20px;
}
.kt-certs__images {
grid-template-columns: repeat(2, 1fr);
}
.kt-factory__layout {
display: flex;
flex-direction: column;
}
.kt-factory__left {
align-self: stretch;
width: 100%;
}
.kt-factory__right {
order: -1;
}
.kt-factory__deco {
height: 700px;
}
.kt-factory__deco svg {
height: 700px !important;
}
.kt-recruit {
height: 435px;
padding: 0;
}
.kt-recruit .kt-container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.kt-recruit__deco {
display: block;
width: 154.027px;
height: 153.872px;
top: 27.128px;
left: 252.973px;
}
.kt-recruit__dc--1 {
width: 117.179px;
height: 117.178px;
top: 36.6936px;
}
.kt-recruit__dc--2 {
width: 75.7604px;
height: 75.7604px;
top: 0;
left: 57.4838px;
}
.kt-recruit__dc--3 {
width: 33.7532px;
height: 33.7531px;
top: 55.6337px;
left: 120.274px;
}
.kt-recruit__photo {
top: 0.3845px;
left: -248px;
height: 434.281px;
}
.kt-recruit__overlay {
top: 0;
left: -114px;
width: 1152px;
height: 433.82px;
}
.kt-recruit__text {
position: relative;
top: auto;
left: auto;
transform: none;
width: 100%;
max-width: 381px;
}
.kt-recruit__text p,
.kt-recruit__desc,
.kt-recruit__company,
.kt-recruit__address,
.kt-recruit__phone,
.kt-recruit__hr {
text-align: center;
width: auto;
}
.kt-recruit__company {
font-size: 16px;
line-height: 1.2;
}
.kt-recruit__logo {
position: relative;
top: auto;
left: auto;
transform: none;
width: 100%;
max-width: 346.43px;
height: 98px;
margin-bottom: 10px;
}
.kt-recruit__line {
width: 375px;
max-width: 100%;
margin: 0 auto;
}
.kt-founder__wrap {
flex-direction: column;
min-height: auto;
}
.kt-founder__text {
flex: none;
padding-top: 30px;
}
.kt-founder__photo {
width: 100%;
max-width: 455px;
}
.kt-founder__bottom {
margin-top: 0;
}
.kt-founder__bottom-row {
flex-direction: column;
align-items: center;
}
.kt-founder__bottom-left {
flex: none;
width: 100%;
}
.kt-founder__cards {
width: 100%;
}
.kt-founder__reasons-title {
text-align: center;
}
.kt-founder__footer-desc {
max-width: 100%;
}
.kt-founder__blue-bg {
width: 500px;
height: 100%;
top: 0;
}
.kt-founder__cards {
max-width: 100%;
}
.kt-stats {
justify-content: center;
}
.kt-culture {
/* min-height: auto; */
/* min-height: 1115px; */
}
.kt-culture__inner {
flex-direction: column;
}
.kt-culture__items {
flex: none;
width: 100%;
padding-top: 20px;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 16px;
}
.kt-culture__card {
position: relative;
top: auto !important;
left: auto !important;
width: 100%;
height: 195px;
}
.kt-culture__card-text {
position: absolute;
top: 156px;
left: 36px;
width: 153px;
}
.kt-culture__card:nth-child(2) .kt-culture__card-text {
left: 5px;
width: 219px;
}
.kt-culture__card:nth-child(3) .kt-culture__card-text {
top: 152px;
left: 17px;
width: 195px;
}
.kt-culture__card:nth-child(4) .kt-culture__card-text {
top: 150px;
left: 37px;
}
.kt-culture__content {
max-width: 100%;
padding-top: 0;
}
.kt-hr .kt-container {
min-height: auto;
max-width: 400px;
width: 100%;
padding: 0px 24px;
}
.kt-hr__bg-card {
display: block;
top: 0;
left: 10px;
width: calc(100% - 20px);
height: auto;
bottom: 0;
}
.kt-hr__deco-box {
display: block;
top: 10px;
right: 10px;
left: auto;
}
.kt-hr__top {
flex-direction: column;
padding-top: 40px;
}
.kt-hr__left {
flex: none;
width: 100%;
}
.kt-hr__title-block {
margin: 0 auto;
width: 385px;
max-width: 100%;
}
.kt-hr__subtitle {
margin-left: 60px;
font-size: 32px;
}
.kt-hr__line--short {
margin-left: 10px;
}
.kt-hr__right {
padding-top: 0;
}
.kt-hr__img-collage {
width: 100%;
max-width: 441px;
height: auto;
margin: 0 auto;
}
.kt-hr__img-main,
.kt-hr__img-blur,
.kt-hr__img-person {
position: relative;
top: auto;
left: auto;
width: 100%;
max-width: 342px;
height: auto;
margin: 0 auto;
}
.kt-hr__img-blur {
display: none;
}
.kt-hr__img-deco {
/* display: none; */
}
.kt-hr__img-person {
max-width: 200px;
margin-top: -60px;
margin-left: auto;
margin-right: 20px;
}
.kt-hr__gradient-bar {
position: relative;
top: auto;
left: auto;
width: calc(100% - 20px);
max-width: 400px;
height: 358px;
margin: 30px auto 0;
}
.kt-hr__gold-bar {
width: calc(100% - 20px);
max-width: 284px;
text-align: center;
height: auto;
min-height: 45px;
margin: 0 auto;
padding: 10px 16px;
top: -386px;
}
.kt-hr__gold-bar span {
font-size: 14px;
}
.kt-hr__courses {
flex-direction: column;
padding: 0;
margin-top: -369px;
gap: 16px;
align-items: center;
}
.kt-hr__course-item {
flex: none;
width: 100%;
max-width: 270px;
height: auto;
min-height: 75px;
}
.kt-hr__course-shadow {
top: 17px;
left: 15px;
width: calc(100% - 10px);
height: calc(100% - 10px);
}
.kt-hr__course-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.kt-hr__course-item p {
position: relative;
top: auto;
left: auto;
width: auto;
padding: 20px 10px;
}
.kt-hr__dark--1 .kt-hr__dark-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
bottom: 0;
border-radius: 5px;
}
.kt-hr__dark--2 .kt-hr__dark-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
bottom: 0;
border-radius: 5px;
}
.kt-hr__dark--2 .kt-hr__dark-inner {
padding: 30px 15px;
background: rgb(25, 52, 109);
}
.kt-hr__dark--2 .kt-hr__dark-img {
flex: none;
width: 100%;
max-width: 274px;
margin: 0 auto;
}
.kt-hr__dark--2 .kt-hr__dark-img img {
height: auto;
}
.kt-hr__d2-box,
.kt-hr__d2-deco {
/* display: none; */
}
.kt-hr__d2-box {
/* display: none; */
left: 0px;
z-index: 10;
}
.kt-hr__d2-deco {
/* display: none; */
right: 0px;
z-index: 10;
left: inherit;
top: 400px;
}
.kt-hr__d2-lists {
padding: 0 15px 20px;
}
.kt-hr__dark-inner {
flex-direction: column;
padding: 30px 15px;
}
.kt-hr__dark--1 .kt-hr__dark-inner {
padding: 30px 15px;
min-height: 192px;
background: rgb(25, 52, 109);
}
.kt-hr__dark--1 .kt-hr__dark-img {
flex: none;
width: calc(100% - 40px);
max-width: 334px;
height: 206px;
margin: 0 auto;
}
.kt-hr__dark--1 .kt-hr__dark-img img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: 50% 0%;
}
.kt-hr__dark-heading {
padding: 20px 15px 0;
}
.kt-hr__dark--1 .kt-hr__dark-lists {
padding: 6px 15px 20px;
}
.kt-hr__deco-1 {
display: block;
top: 0;
left: -16px;
z-index: 10;
}
.kt-hr__deco-2 {
display: block;
top: auto;
bottom: 0;
right: 0;
left: auto;
z-index: 10;
}
.kt-hr__quote {
padding: 20px 30px;
}
.kt-hr__quote-line1 {
font-size: 22px;
}
.kt-hr__bottom-box {
width: 100%;
max-width: 400px;
}
.kt-footer__top {
grid-template-columns: 1fr;
gap: 30px;
}
/* ---- Footer responsive 991px ---- */
.kt-footer {
height: auto;
min-height: 575px;
padding: 20px 0;
}
.kt-footer .kt-container {
width: 420px;
max-width: 100%;
margin: 0 auto;
}
.kt-footer__logo,
.kt-footer__badge1,
.kt-footer__badge2,
.kt-footer__grp,
.kt-footer__card,
.kt-footer__wico,
.kt-footer__wtitle,
.kt-footer__wphone,
.kt-footer__wdesc,
.kt-footer__line {
position: relative;
top: auto;
left: auto;
width: auto;
height: auto;
}
.kt-footer__logo {
width: 240px;
height: 68px;
margin: 0 auto 16px;
}
.kt-footer__badge1 {
width: 138px;
height: 48px;
margin: 0 auto 8px;
}
.kt-footer__badge2 {
width: 121px;
height: 46px;
margin: 0 auto 16px;
}
.kt-footer__grp {
height: auto;
min-height: 25px;
padding-left: 34px;
margin: 0 auto 8px;
max-width: 468px;
}
.kt-footer__ico {
top: 2px;
}
.kt-footer__grp p {
position: relative;
top: auto;
left: auto;
width: auto;
white-space: normal;
}
.kt-footer__grp--company p {
width: auto;
font-size: 14px;
}
.kt-footer__bottom {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 10px;
max-width: 500px;
margin: 0 auto 16px;
}
.kt-footer__card {
width: 100%;
max-width: none;
height: auto;
min-height: 70px;
padding-left: 44px;
margin: 0;
}
.kt-footer__card--h2 {
grid-column: 1;
grid-row: 1;
}
.kt-footer__card--h1 {
grid-column: 2;
grid-row: 1;
}
.kt-footer__card--zalo {
grid-column: 2;
grid-row: 2;
}
.kt-footer__card-icon {
width: 32px;
height: 32px;
}
.kt-footer__card-text {
position: relative;
left: auto;
}
.kt-footer__card-title {
font-size: 12px;
width: auto;
position: relative;
top: auto;
left: auto;
}
.kt-footer__card--h1 .kt-footer__card-desc,
.kt-footer__card--h2 .kt-footer__card-desc,
.kt-footer__card--zalo .kt-footer__card-desc {
position: relative;
top: auto;
width: auto;
font-size: 10px;
}
.kt-footer__card--h1 .kt-footer__card-phone,
.kt-footer__card--h2 .kt-footer__card-phone {
font-size: 16px;
}
.kt-footer__warranty {
position: relative;
padding: 8px 10px 8px 44px;
min-height: 70px;
grid-column: 1;
grid-row: 2;
}
.kt-footer__wico {
position: absolute;
top: 8px;
left: 6px;
width: 32px;
height: 32px;
}
.kt-footer__wtitle {
font-size: 12px;
line-height: 1.6;
color: rgb(211, 211, 211);
margin: 0;
}
.kt-footer__wphone {
display: block;
font-size: 16px;
line-height: 1.6;
color: #fff;
font-weight: bold;
text-decoration: none;
}
.kt-footer__wdesc {
font-size: 10px;
line-height: 1.6;
color: #fff;
margin: 0;
}
.kt-footer__line {
height: 1px;
width: 420px;
max-width: 100%;
margin: 20px auto 0;
background: rgba(255, 255, 255, 0.1);
}
.kt-form {
height: auto;
padding: 0;
}
.kt-form > .kt-container {
max-width: 400px;
}
#ktFormSection{
padding: 0px 0;
}
.kt-form__bg {
position: relative;
top: auto;
left: auto;
width: 100%;
height: 946px;
margin-bottom: -946px;
border-radius: 0;
}
.kt-form__deco,
.kt-form__bl,
.kt-form__bl-sm {
top: 0px;
left: 266px;
width: 24px;
height: 24px;
z-index: 10;
}
.kt-form__dc:nth-child(2) {
width: 50px;
height: 50px;
top: 71.704px;
left: 72.568px;
}
.kt-form__dc:nth-child(3) {
width: 66.521px;
height: 66.521px;
top: 41.26px;
}
.kt-form__dc:nth-child(1) {
width: 50px;
height: 50px;
left: 36.284px;
}
.kt-form__title {
position: relative;
top: auto;
left: auto;
height: 109px;
text-align: center;
padding: 40px 15px 0;
}
.kt-form__title--gold {
width: 100%;
font-size: 32px;
position: absolute;
left: -12%;
top: 24px;
}
.kt-form__title--light {
position: absolute;
top: 62px;
left: 65%;
transform: translateX(-50%);
width: 366px;
max-width: 100%;
font-size: 32px;
}
.kt-form__line--1 {
display: block;
width: 91px;
top: 71.5px;
left: 39px;
}
.kt-form__line--2 {
display: block;
width: 65px;
top: 61px;
right: 45px;
left: auto;
}
.kt-form__sub {
position: relative;
top: auto;
left: auto;
width: 100%;
text-align: center;
padding: 10px 15px;
}
.kt-form__list {
position: relative;
top: auto;
left: auto;
width: 100%;
padding: 0 15px 20px;
}
.kt-form__list ol li {
font-size: 14px;
}
.kt-form__group {
position: relative;
top: auto;
left: auto;
width: 100%;
height: auto;
padding: 0 15px 40px;
}
.kt-form__group-border {
position: absolute;
top: 8px;
left: 8px;
width: calc(100% - 16px);
height: calc(100% - 16px);
}
.kt-form__group-inner {
position: relative;
top: auto;
left: auto;
width: 100%;
height: auto;
padding: 20px 15px;
}
.kt-form__group-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 8px;
}
.kt-form__group-title {
position: relative;
top: auto;
left: auto;
padding: 0;
margin-bottom: 6px;
}
.kt-form__group-note {
position: relative;
top: auto;
left: auto;
width: 100%;
margin-bottom: 20px;
}
.kt-form__group-inner form {
position: relative;
top: auto;
left: auto;
width: 100%;
height: auto;
}
.kt-form__group-inner form input,
.kt-form__group-inner form select {
margin-bottom: 10px;
}
}
@media (max-width: 767px) {
.kt-top-bar {
height: auto;
padding: 0;
overflow: hidden;
}
.kt-top-bar .kt-container {
display: grid;
gap: 2px 6px;
padding: 8px 12px;
align-items: center;
grid-template-columns: auto 1fr;
grid-template-areas:
"logo email"
". phone"
"address address";
}
.kt-top-bar__logo {
position: relative;
top: auto;
left: auto;
margin-right: 0;
grid-area: logo;
align-self: start;
}
.kt-top-bar__logo img {
height: 40px;
}
.kt-top-bar__group--address {
position: relative;
top: auto;
left: auto;
transform: none;
width: auto;
white-space: nowrap;
grid-area: address;
overflow: hidden;
min-width: 0;
}
.kt-top-bar__group--phone {
position: relative;
top: auto;
left: auto;
width: auto;
grid-area: phone;
min-width: 0;
}
.kt-top-bar__group--email {
position: relative;
top: auto;
left: auto;
width: auto;
grid-area: email;
justify-self: end;
min-width: 0;
}
.kt-hero {
height: 804px;
padding: 0;
overflow: hidden;
}
.kt-hero__bg {
background-image: url("https://w.ladicdn.com/s768x803/5abe59a5e9cb7e9e174311d4/sh2utterstock-736517164-min-20220718073713.jpg");
background-position: 50% 0%;
}
.kt-hero .kt-container {
width: 100%;
max-width: 420px;
margin: 0 auto;
padding: 0;
overflow: visible;
}
.kt-hero__scale-wrap {
width: 420px;
transform-origin: top left;
max-width: none;
}
.kt-hero .kt-container {
/* overflow: hidden; */
}
.kt-hero__grad-box {
position: absolute;
top: 26px;
left: 24.5px;
width: 369px;
height: 269px;
margin: 0;
padding: 0;
}
.kt-hero__border-box {
position: absolute;
top: 0;
left: -1px;
width: 330px;
height: 233px;
border: 2px solid rgba(255,255,255,0.4);
}
.kt-hero__company-text,
.kt-hero__company-outline,
.kt-hero__company-empty {
position: absolute;
top: 24.34px;
font-size: 33px;
}
.kt-hero__company-outline {
left: 25.07px;
}
.kt-hero__company-text {
left: 20.07px;
}
.kt-hero__company-empty {
left: 36.13px;
font-size: 36px;
width: 351px;
pointer-events: none;
}
.kt-hero__gold-box {
position: absolute;
top: 82.79px;
left: 14.09px;
width: 315px;
height: 44px;
margin: 0;
display: block;
}
.kt-hero__brand-text {
position: absolute;
top: 2px;
left: 0;
width: 100%;
text-align: center;
font-size: 25px;
background: linear-gradient(rgb(42,49,85), rgb(64,78,136));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
padding: 0;
}
.kt-hero__brand-empty {
position: absolute;
top: 84.80px;
left: 46.93px;
font-size: 25px;
width: 297px;
pointer-events: none;
}
.kt-hero__divider {
position: absolute;
top: 151px;
left: 106px;
width: 131px;
margin: 0;
}
.kt-hero__slogan {
position: absolute;
top: 193px;
left: 20px;
font-size: 19px;
text-align: left;
margin: 0;
}
.kt-hero__deco-box--1 {
top: 252px;
left: 0;
width: 76px;
height: 76px;
}
.kt-hero__deco-box--2 {
top: 16px;
left: 358.5px;
width: 48px;
height: 48px;
}
.kt-hero__white-bg {
position: absolute;
top: 466px;
left: 23.4px;
width: 373px;
height: 315px;
padding: 0;
display: block;
background: #fff;
box-shadow: rgba(0,0,0,0.5) 0px 0px 30px -15px;
}
.kt-hero__nav-sep {
display: none;
}
.kt-hero__nav-item {
position: absolute;
top: auto;
left: auto;
display: block;
text-decoration: none;
animation: none;
}
.kt-hero__nav-item[href*="gioi-thieu"] {
top: 477.174px;
left: 52.95px;
width: 142px;
height: 121.127px;
}
.kt-hero__nav-item[href*="linh-vuc"] {
top: 477.174px;
left: 239.208px;
width: 142px;
height: 121.127px;
}
.kt-hero__nav-item--recruit {
top: 619.402px;
left: 23.394px;
width: 200.15px;
height: 154.493px;
}
.kt-hero__nav-item[href*="press"] {
top: 640.124px;
left: 236.795px;
width: 146px;
height: 116.909px;
}
.kt-hero__nav-item svg {
position: absolute;
top: 8px;
left: 50%;
transform: translateX(-50%);
width: 31.417px;
height: 31.417px;
margin: 0;
}
.kt-hero__nav-item--recruit svg {
width: 32.524px;
height: 32.525px;
}
.kt-hero__nav-item .kt-hero__nav-label {
position: absolute;
top: 39.127px;
left: 0;
width: 100%;
text-align: center;
font-size: 15px;
line-height: 1.3;
margin: 0;
color: rgb(54,54,54);
}
.kt-hero__nav-item[href*="linh-vuc"] .kt-hero__nav-label {
top: 39.398px;
}
.kt-hero__nav-item[href*="press"] .kt-hero__nav-label {
top: 34.525px;
}
.kt-hero__nav-item--recruit .kt-hero__nav-label {
color: #fff;
position: absolute;
top: 35.525px;
left: 0;
width: 100%;
text-align: center;
font-size: 15px;
line-height: 1.3;
margin: 0;
z-index: 1;
}
.kt-hero__nav-item .kt-hero__nav-btn {
position: absolute;
bottom: 8px;
left: 50%;
transform: translateX(-50%);
width: 102px;
height: 30px;
line-height: 30px;
font-size: 13px;
margin: 0;
padding: 0;
text-align: center;
}
.kt-hero__nav-item--recruit .kt-hero__nav-recruit-bg {
display: block;
position: absolute;
inset: 0;
background: linear-gradient(115deg, rgb(64,91,186), rgb(136,139,244));
border-radius: 12px;
}
.kt-section-intro__inner {
margin-top: 0;
min-height: auto;
}
.kt-section-intro__image {
position: relative;
top: auto;
left: auto;
width: 100%;
padding: 20px 20px 0;
}
.kt-section-intro__content {
margin-left: 0;
padding: 10px 20px 20px;
}
.kt-certs__images {
grid-template-columns: repeat(2, 1fr);
}
.kt-factory__layout {
display: flex;
flex-direction: column;
}
.kt-factory__left {
align-self: stretch;
width: 100%;
}
.kt-factory__right {
order: -1;
}
.kt-factory__deco {
height: 997px;
}
.kt-factory__deco svg {
height: 997px !important;
}
.kt-factory__card {
width: 100%;
max-width: 426px;
height: auto;
min-height: 420px;
margin: 0 auto;
}
.kt-factory__card-title {
position: relative;
top: auto;
left: auto;
padding: 33.5px 33px 0;
width: auto;
}
.kt-factory__card-sub {
position: relative;
top: auto;
left: auto;
padding: 10px 33px;
width: auto;
}
.kt-factory__video {
position: relative;
bottom: auto;
left: auto;
width: calc(100% - 22px);
max-width: 403px;
margin: 20px auto 15px;
}
.kt-stats {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 10px;
}
.kt-stat:first-child {
width: 100%;
}
.kt-certs__heading {
font-size: 20px;
}
.kt-certs__sub {
font-size: 16px;
}
.kt-certs__desc {
font-size: 13px;
}
/* ===== FOUNDER MOBILE (MATCH SECTION2209) ===== */
.kt-founder {
min-height: 1150px;
}
.kt-founder__logo {
display: none;
}
.kt-founder__bg-img {
width: calc(100% - 18px);
height: 592px;
top: 10.23px;
left: 9px;
z-index: 1;
background-image: url("https://w.ladicdn.com/s750x950/5c7362c6c417ab07e5196b05/qsxvtquj20200701103243.jpg");
}
.kt-founder__deco {
display: block;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
pointer-events: none;
z-index: 1;
}
.kt-founder__shape-hex-out {
width: 400px;
height: 370.8px;
top: -20.8px;
left: -315px;
transform: rotate(42deg);
}
.kt-founder__shape-circle {
width: 368px;
height: 368px;
top: 272.1px;
left: 14.8px;
}
.kt-founder__shape-hex-grad {
width: 236.8px;
height: 219.5px;
top: 415.7px;
left: 154.2px;
transform: rotate(107deg);
}
.kt-founder__wrap {
position: absolute;
display: block;
min-height: auto;
gap: 0;
z-index: 3;
top: 0;
left: 0;
width: 100%;
}
.kt-founder__text {
position: absolute;
flex: none;
padding-top: 0;
display: block;
top: 0;
left: 0;
width: 100%;
}
.kt-founder__text-bg {
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.kt-founder__text-bg .kt-founder__badge {
position: absolute;
top: 148.18px;
left: 38.5px;
width: calc(100% - 77px);
font-size: clamp(14px, 4.5vw, 20px);
font-family: "Paytone One", sans-serif;
font-weight: 700;
color: rgb(250, 250, 250);
line-height: 1.4;
letter-spacing: 0;
margin-bottom: 0;
border-width: 1px;
border-radius: 0px;
border-style: solid;
border-color: rgb(255, 204, 56);
background-color: rgba(250, 178, 85, 0);
text-align: center;
padding: 8px 5px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.kt-founder__text-bg .kt-founder__title {
position: absolute;
font-family: "Paytone One", sans-serif;
font-size: 40px;
top: 35.35px;
left: 38.5px;
width: calc(100% - 77px);
color: rgb(250, 250, 250);
line-height: 1.4;
margin-bottom: 0;
}
.kt-founder__text-bg .kt-founder__name {
position: absolute;
font-size: clamp(14px, 4.5vw, 22px);
top: 101.35px;
left: 38.5px;
width: calc(100% - 77px);
color: rgb(250, 250, 250);
margin-bottom: 0;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* hide original text elements, keep quote visible */
.kt-founder__text .kt-founder__title,
.kt-founder__text .kt-founder__name,
.kt-founder__text .kt-founder__badge {
display: none;
}
.kt-founder__quote {
position: absolute;
top: 240px;
left: 38.5px;
width: calc(100% - 77px);
font-size: clamp(12px, 3.5vw, 14px);
line-height: 1.6;
color: rgb(250, 250, 250);
max-width: calc(100% - 77px);
}
.kt-founder__media {
display: block;
position: absolute;
top: 302px;
left: 0%;
transform: translateX(-50%);
width: 366px;
height: 342px;
z-index: 2;
overflow: hidden;
}
.kt-founder__photo {
width: 100%;
height: 100%;
object-fit: contain;
position: static;
filter: brightness(113%) saturate(113%);
}
.kt-founder__bottom {
margin-top: 0;
padding: 0;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.kt-founder__bottom-row {
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding-top: 0;
}
.kt-founder__bottom-left {
display: block;
position: absolute;
top: 36px;
left: 38.5px;
width: calc(100% - 77px);
max-width: 360px;
text-align: left;
}
.kt-founder__reasons-title {
font-size: 24px;
text-align: left;
padding-left: 0;
max-width: 100%;
}
.kt-founder__footer-desc {
font-size: 13px;
text-align: left;
margin-top: 12px;
max-width: 100%;
margin-top: 0px;
margin-left: 0px;
}
.kt-founder__dot-grid {
display: none;
}
.kt-founder__blue-bg {
width: calc(100% + 72.2px);
height: 1000px;
top: 0;
left: -79.6px;
z-index: 0;
}
.kt-founder__cards {
display: flex;
flex-direction: column;
gap: 23px;
position: absolute;
top: 300px;
left: -5px;
width: calc(100% + 10px);
max-width: calc(100% + 10px);
padding-top: 108px;
}
.kt-founder__card {
position: relative;
display: block;
padding-top: 20px;
height: 168px;
}
.kt-founder__card-num {
position: absolute;
top: 0;
left: 0;
width: 144px;
font-size: 46px;
font-weight: 700;
line-height: 1.2;
color: rgb(250, 250, 250);
text-align: center;
z-index: 1;
-webkit-text-stroke: 0;
text-shadow: none;
}
.kt-founder__card-num--dark {
color: rgb(0, 0, 0);
-webkit-text-stroke: 0;
text-shadow: none;
}
.kt-founder__card-box {
position: relative;
z-index: 0;
margin-left: 22px;
background: rgb(1, 1, 232);
border: 1px solid rgb(242, 242, 242);
border-radius: 10px;
box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 30px -10px;
padding: 18px 20px;
min-height: 130px;
display: flex;
flex-direction: column;
justify-content: center;
}
.kt-founder__card-box h4 {
font-size: 18px;
font-weight: 700;
color: rgb(250, 250, 250);
margin-bottom: 6px;
}
.kt-founder__card-box p {
font-size: 14px;
line-height: 1.6;
color: rgb(250, 250, 250);
margin: 0;
}
.kt-culture__inner {
flex-direction: column;
}
.kt-culture__items {
flex: none;
width: 100%;
padding-top: 20px;
display: flex;
flex-wrap: wrap;
gap: 16px;
order: 2;
}
.kt-culture__card {
position: relative;
top: auto !important;
left: auto !important;
width: calc(50% - 8px);
height: 175px;
}
.kt-culture__card:nth-child(1) { order: 1; }
.kt-culture__card:nth-child(2) { order: 2; margin-top: 34px; }
.kt-culture__card:nth-child(4) { order: 3; }
.kt-culture__card:nth-child(3) { order: 4; margin-top: 34px; }
.kt-culture__card-img {
width: 140px;
height: 100px;
top: 10px;
left: 50%;
transform: translateX(-50%);
}
.kt-culture__card-img svg {
width: 40px;
height: 40px;
}
.kt-culture__card-text {
position: relative;
top: auto;
left: auto;
width: auto;
margin-top: 120px;
text-align: center;
}
.kt-culture__card:nth-child(2) .kt-culture__card-text,
.kt-culture__card:nth-child(3) .kt-culture__card-text,
.kt-culture__card:nth-child(4) .kt-culture__card-text {
width: auto;
left: auto;
top: auto;
}
.kt-culture__content {
max-width: 100%;
padding-top: 0;
order: 1;
}
.kt-culture__title-block {
text-align: center;
}
.kt-culture__line,
.kt-culture__line--short {
margin-left: auto;
margin-right: auto;
}
.kt-culture__deco-group {
top: 0;
}
.kt-culture__deco-box {
width: 100%;
max-width: 937px;
}
.kt-hr__quote-line1 {
font-size: 20px;
}
.kt-hr__quote-line2 {
font-size: 14px;
}
.kt-section {
padding: 40px 0;
}
.kt-section-intro__image {
width: 100%;
}
.kt-section-intro__content {
padding: 20px;
min-height: auto;
}
.kt-section-intro__content h2 {
font-size: 22px;
}
.kt-section-intro__certs {
display: flex;
gap: 16px;
margin-top: 24px;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
scroll-snap-type: x mandatory;
padding-bottom: 8px;
}
.kt-section-intro__certs img {
flex: 0 0 auto;
width: 235px;
height: 235px;
object-fit: cover;
border-radius: 20px;
scroll-snap-align: start;
}
.kt-press {
padding-bottom: 40px;
}
.kt-press__title {
font-size: 22px;
}
.kt-press__line {
width: calc(100% - 77px);
max-width: 400px;
margin: 0 auto 28px;
}
.kt-press__logos {
gap: 12px;
}
.kt-press__logo {
flex: 0 0 calc(50% - 6px);
box-shadow: none;
}
.kt-press__logo img {
width: 100%;
height: auto;
max-height: 168px;
object-fit: contain;
}
.kt-footer__top {
grid-template-columns: 1fr;
}
.kt-footer__bottom {
grid-template-columns: 1fr;
}
.kt-footer__card--h2,
.kt-footer__card--h1,
.kt-footer__card--zalo,
.kt-footer__warranty {
grid-column: 1;
}
.kt-footer__card--h2 {
grid-row: 1;
}
.kt-footer__card--h1 {
grid-row: 2;
}
.kt-footer__card--zalo {
grid-row: 3;
}
.kt-footer__warranty {
grid-row: 4;
}
.kt-footer__logo {
width: 160px;
height: 46px;
}
.kt-footer__card-phone,
.kt-footer__wphone {
font-size: 18px;
}
.kt-form__title--gold {
font-size: 32px;
}
.kt-form__title--light {
font-size: 32px;
}
.kt-form__list ol li {
font-size: 13px;
padding-bottom: 14px;
padding-left: 24px;
}
.kt-form__group-title {
font-size: 20px;
}
.kt-form__group-note {
font-size: 13px;
}
}
@media (max-width: 419px) {
.kt-hero {
height: calc(100vw * 804 / 420);
}
.kt-hero__scale-wrap {
transform: scale(calc(100vw / 420px));
}
}
/* === SCROLL ANIMATIONS === */
@keyframes kt-fadeInUp {
from { opacity: 0; transform: translateY(50px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes kt-fadeInDown {
from { opacity: 0; transform: translateY(-40px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes kt-slideLeft {
from { opacity: 0; transform: translateX(-80px); }
to { opacity: 1; transform: translateX(0); }
}
@keyframes kt-slideRight {
from { opacity: 0; transform: translateX(80px); }
to { opacity: 1; transform: translateX(0); }
}
@keyframes kt-zoomIn {
from { opacity: 0; transform: scale(0.5); }
to { opacity: 1; transform: scale(1); }
}
@keyframes kt-flipUp {
from { opacity: 0; transform: perspective(700px) rotateX(-12deg) translateY(30px); }
to { opacity: 1; transform: perspective(700px) rotateX(0) translateY(0); }
}
@keyframes kt-blurIn {
from { opacity: 0; filter: blur(15px); transform: scale(0.92); }
to { opacity: 1; filter: blur(0); transform: scale(1); }
}
.kani-fadeInUp { animation: kt-fadeInUp 1.1s cubic-bezier(0.22, 1, 0.36, 1) both; }
.kani-fadeInDown { animation: kt-fadeInDown 0.9s cubic-bezier(0.22, 1, 0.36, 1) both; }
.kani-slideLeft { animation: kt-slideLeft 1.0s cubic-bezier(0.22, 1, 0.36, 1) both; }
.kani-slideRight { animation: kt-slideRight 1.0s cubic-bezier(0.22, 1, 0.36, 1) both; }
.kani-zoomIn { animation: kt-zoomIn 0.9s cubic-bezier(0.22, 1, 0.36, 1) both; }
.kani-flipUp { animation: kt-flipUp 1.2s cubic-bezier(0.22, 1, 0.36, 1) both; }
.kani-blurIn { animation: kt-blurIn 1.2s cubic-bezier(0.22, 1, 0.36, 1) both; }
.kani-hidden { opacity: 0; }