* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  overflow-x: hidden;
  user-select: none;
}

body {
  overflow-x: hidden;
  max-width: 1920px;
  background-color: #ffffff;
}

header {
  width: 100vw;
  gap: 7.5rem;
  background-color: #fff;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  z-index: 1000;
}

header img {
  width: 270px;
  height: 65px;
}

.navbar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3rem;
}

.navbar ul {
  display: flex;
  align-items: center;
  justify-content: center;
  /* padding-top: 20px; */
  gap: 2rem;
}

.navbar li {
  list-style: none;
}

.navbar a {
  font-family: "Be Vietnam Pro", sans-serif;
  text-decoration: none;
  color: #1c1c27;
}

.navbar .navbar-toggler {
  display: none;
}

.navbar ul button {
  width: 150px;
  height: 40px;
  border-radius: 50px;
  background-color: #000080;
  border: none;
  color: #ffff;
  letter-spacing: 1px;
}

/* ================= main-hero styele here ================= */

.hero {
  background: url(./img/work_bg.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  object-fit: contain;
  /* width: 1920px;
    height: 744px; */
  width: 100vw;
  height: 644px;
  position: relative;
}

.hero_text {
  /* border: 1px solid white; */
  width: 800px;
  height: 400px;
  position: absolute;
  left: 27rem;
  top: 10rem;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  gap: 1rem;
}

.hero_text h1 {
  color: #fff;
  font-size: 5.5rem;
  font-family: "Be Vietnam Pro", sans-serif;
  font-weight: 900;
}

/* .hero_text h3 {
    color: #fff;
    font-size: 3rem;
    font-family: 'Be Vietnam Pro', sans-serif;
    font-weight: 500;
} */

.hero_text p {
  color: #fff;
  font-size: 16px;
  font-family: "Be Vietnam Pro", sans-serif;
  font-weight: 300;
}
/* ================= sec2 styele here ================= */
.sec2 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 5rem 0rem;
}
.main_sec {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 60vw;
  gap: 2rem;
}
.v_box {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  /* display: grid;
  grid-template-columns: repeat(2, 1fr); */
}
.v_box video {
  width: 100%;
  aspect-ratio: 3/2;
  /* height: 450px; */
}
/* <------------------------------footer style start here------------------------------------> */

footer {
  background-color: #1c1c27;
  width: 100vw;
  height: 500px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 3rem;
}

.fmain {
  width: 75vw;
  height: 360px;
  /* background-color: #fff; */
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 4rem;
  border-bottom: 1px solid #3b3b45;
}

.f_box {
  width: 270px;
  display: flex;
  align-items: flex-start;
  justify-content: start;
  flex-direction: column;
  gap: 2rem;
}

.f_box p {
  color: #86868f;
  font-size: 13px;
  font-family: "Be Vietnam Pro", sans-serif !important;
}

.f_box button {
  background-color: #2567eb;
  border: #2567eb;
  border-radius: 30px;
  padding: 10px 15px;
}

.f_box a {
  text-decoration: none;
  color: whitesmoke;
}

.s_box {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  gap: 2rem;
}

.s_box h2 {
  font-size: 30px;
  font-family: "Be Vietnam Pro", sans-serif !important;
  color: white;
}

.s_box ul {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  gap: 1rem;
}

.s_box ul li {
  list-style: none;
}

.s_box ul li a {
  font-family: "Be Vietnam Pro", sans-serif !important;
  text-decoration: none;
  color: #86868f;
  font-size: 17px;
}

.t_box {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  gap: 2rem;
}

.t_box h2 {
  font-size: 30px;
  font-family: "Be Vietnam Pro", sans-serif !important;
  color: white;
}

.t_box ul {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  gap: 0.8rem;
}

.t_box li {
  list-style: none;
}

.t_box ul li a {
  text-decoration: none;
  color: #86868f;
  font-size: 17px;
}

.t_box ul li a {
  font-family: "Be Vietnam Pro", sans-serif !important;
  text-decoration: none;
  color: #86868f;
}
.fo_box {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
.fo1_box,
.fo2_box {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  gap: 2rem;
}

.fo1_box h2,
.fo2_box h2 {
  font-size: 30px;
  font-family: "Be Vietnam Pro", sans-serif !important;
  color: white;
}
.cnt_no,
.email {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 1rem;
}
.cnt_no a,
.email a {
  text-decoration: none;
  font-size: 17px;
  color: #86868f;
  font-family: "Be Vietnam Pro", sans-serif !important;
}
.cnt_no h4,
.email h4 {
  font-size: 17px;
  color: #86868f;
  font-family: "Be Vietnam Pro", sans-serif !important;
}
.s_links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem;
}
.last_box p {
  font-size: 17px;
  color: #86868f;
  font-family: "Be Vietnam Pro", sans-serif !important;
}