@import url('//fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,200..800&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

body {
  font-family: 'Poppins', sans-serif;
  background: #fff;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.6;
  color: #081240;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Bricolage Grotesque', sans-serif;
  color: #102379;
  font-weight: 800;
}

/* header area  */
.header-area {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 999;
}
.header-inner {
  background: #070f35;
  text-align: center;
  padding: 22px 0;
  border-radius: 0 0 40px 40px;
  position: relative;
  z-index: 1;
}

.header-inner:before {
  position: absolute;
  left: -17px;
  top: -18px;
  height: 100%;
  width: 30px;
  content: '';
  background: #070f35;
  transform: rotate(-37deg);
  z-index: -1;
}

.header-inner:after {
  position: absolute;
  right: -17px;
  top: -18px;
  height: 100%;
  width: 30px;
  content: '';
  background: #070f35;
  transform: rotate(37deg);
  z-index: -1;
}

/* banner area  */
.banner-area {
  padding: 270px 0 415px;
  text-align: center;
  background: #dbeeff;
  position: relative;
  z-index: 1;
}

.banner-area h1 {
  font-size: 96px;
  max-width: 900px;
  line-height: 1;
  margin: 0 auto 70px;
}

.banner-area h1 span {
  color: #284fff;
}

.banner-area p {
  font-size: 22px;
  max-width: 465px;
  margin: 0 auto 30px;
}

input {
  border: 1px solid #c9e1f8;
  background: #fff;
  padding: 0 24px;
  line-height: 68px;
  border-radius: 1000px;
  color: #907d9d;
  width: 100%;
  box-shadow: 0 27px 40px hsl(0deg 0% 100% / 40%);
}

input::placeholder {
  color: #907d9d;
}

input:focus {
  outline: none;
  box-shadow: none;
}

.section-title {
  font-size: 56px;
}

.section-title span {
  color: #284fff;
}

.primary-btn {
  background: #9b67c6;
  border: none;
  padding: 23px 40px;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
  border-radius: 1000px;
  white-space: nowrap;
  box-shadow: 0 27px 40px hsl(273deg 45% 59% / 40%);
  display: inline-block;
  text-decoration: none;
}

.newsletter {
  width: 650px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 0 auto;
}

.banner-area .face {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: -1;
}

.banner-area .face .eyes {
  width: 260px;
  background: #cfe2f7;
  position: absolute;
  top: 29%;
  left: 15%;
  border-radius: 50%;
  aspect-ratio: 1;
  z-index: -1;
}

.banner-area .face .eyes:after {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  content: '';
  background: #dbeeff;
  z-index: 1;
  border-radius: 50%;
  animation: eyes 1s linear infinite;
}

@keyframes eyes {
  0% {
    transform: scale(0);
  }
  50% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}

.banner-shape1,
.banner-shape2,
.banner-shape3 {
  position: absolute;
  transition: transform 0.3s ease; /* Smooth transition */
  z-index: -1;
}

.banner-shape1 {
  top: 4%;
  right: 18%;
}

.banner-shape2 {
  left: 3%;
  top: 30%;
}

.banner-shape3 {
  bottom: 3%;
  right: 5%;
}

.rounded-logo {
  position: absolute;
  left: 3%;
  bottom: 3%;
}

.rounded-logo .small-face {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.circle-logo {
  animation: rotate 10s linear infinite;
}

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.banner-area .finter {
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  z-index: -1;
}

/* start service area css  */
.service-description {
  height: 100%;
  display: flex;
  justify-content: flex-end;
  flex-direction: column;
  padding-left: 40px;
}

.service-area .section-title {
  max-width: 400px;
}

.service-description p {
  font-size: 20px;
}

.service-area {
  padding: 140px 0;
  position: relative;
  z-index: 1;
}

.service-area .dot-shape,
.service-area .star1-shape,
.service-area .star2-shape {
  position: absolute;
}

.service-area .dot-shape {
  left: 54%;
  bottom: 97%;
}

.service-area .star1-shape {
  right: 37%;
  z-index: 1;
  top: 13%;
}

.service-area .star2-shape {
  right: 20%;
  top: -40px;
}

/* start why choose  */
.why-choose-area {
  padding-bottom: 140px;
}
.single-choose-item {
  background: #f2fcfc;
  padding: 40px;
  border-radius: 32px;
  height: 100%;
}

.single-choose-item .choose-icon {
  margin-bottom: 40px;
}

.single-choose-item:hover .choose-icon {
  animation: rotateX 1.5s linear infinite;
}

@keyframes rotateX {
  0% {
    transform: rotateY(0deg);
  }
  100% {
    transform: rotateY(360deg);
  }
}

.why-choose-area .section-title {
  margin-bottom: 40px;
}

.single-choose-item.box-2 {
  background: #f8f4fb;
}

.single-choose-item.box-2 h3 {
  color: #8a4fba;
}

.single-choose-item.box-3 {
  background: #f7fbf4;
}

.single-choose-item.box-3 h3 {
  color: #5a8f32;
}

/* start timer area css  */

.timer-area .section-title {
  max-width: 640px;
  margin: 0 auto 40px;
}

.timer-wrap {
  display: flex;
  gap: 25px;
  align-items: center;
  justify-content: space-between;
}

.count-down-item span {
  font-family: 'Geist', sans-serif;
  font-size: 80px;
  background: #f3f3f3;
  font-weight: 500;
  padding: 20px 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 32px;
  height: 200px;
  width: 130px;
}

.timer-wrap .separetor {
  font-size: 80px;
  margin-top: -50px;
}

.count-down-item {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-bottom: 20px;
}

.timer-item {
  text-align: center;
}
.timer-item .label {
  font-size: 16px;
  text-transform: uppercase;
}

/* cta area css  */
.cta-video video {
  width: 100%;
  height: 350px;
  object-fit: cover;
  border-radius: 32px;
}

.single-cta-item {
  background: #9b67c6;
  height: 100%;
  border-radius: 32px;
  padding: 60px 30px;
  text-align: center;
  position: relative;
  z-index: 1;
}

.single-cta-item h4 {
  font-size: 24px;
  font-weight: 400;
  font-family: 'Poppins';
  color: #fff;
  line-height: 1.5;
  margin-bottom: 30px;
}

.single-cta-item .primary-btn {
  background: #fff;
  color: #000000;
}

.single-cta-item .line-shape {
  position: absolute;
  bottom: 0;
  right: 0;
  border-radius: 0 0 32px 0;
  width: 100%;
  z-index: -1;
}

.single-cta-item .capsule {
  position: absolute;
  top: -15px;
  right: -15px;
}

.cta-area {
  padding: 55px 0 140px;
}

/* start career area css  */
.career-content .newsletter {
  width: 100%;
  margin-bottom: 15px;
}

.career-content .notice {
  font-size: 12px;
}

.career-thumb img {
  width: 100%;
}

.career-thumb {
  margin-right: 120px;
  position: relative;
  z-index: 1;
}

.career-content p {
  font-size: 20px;
  color: #081240;
  margin-bottom: 40px;
}

.career-thumb .drs-star {
  width: auto;
  position: absolute;
  right: -28px;
  top: 14%;
  animation: rotate 2s linear infinite;
}

/* footer area css  */
.footer-area {
  background: #070f35;
  padding: 100px 0;
}

.contact-info .email p {
  color: #848ebd;
  font-size: 20px;
  margin-bottom: 5px;
}

.contact-info .email a {
  color: #00cacd;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-size: 42px;
  font-weight: 700;
  text-decoration: none;
}

.contact-info .email {
  margin-bottom: 55px;
}

.contact-info .social p {
  color: #848ebd;
  font-size: 20px;
  margin-bottom: 15px;
}

.contact-info .social ul {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
  gap: 25px;
}

.contact-info .social a {
  font-size: 18px;
  color: hsl(0deg 0% 100% / 50%);
}

.contact-info .copyright {
  color: #848ebd;
  margin-bottom: 0;
}

.contact-info .social {
  margin-bottom: 55px;
}

.career-content .newsletter {
  justify-content: start;
}