:root {
  --clr-blue: #101f32;
  --clr-yellow: #fbb315;
  --clr-white: #fff;
  --clr-grey: #EFEFEE;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: "Ubuntu", sans-serif;
  margin: 0;
}
body h1 {
  font-size: clamp(3rem, 2vw + 1rem, 5rem);
}
body .blue-txt {
  color: var(--clr-blue);
}
body .flex {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
body .container {
  padding: 2rem;
}
body .hero {
  height: 70dvh;
  position: relative;
  display: flex;
  align-items: flex-start;
  background: var(--clr-blue);
  z-index: -1;
}
body .hero video {
  position: absolute;
  top: 10rem;
}
body .hero .hero-txt {
  z-index: 10;
  text-align: center;
  color: var(--clr-white);
  margin: 0 auto;
}
body .hero .hero-txt h3 {
  margin-top: -2rem;
}
body video {
  max-width: 100vw;
  height: 90%;
  z-index: -1;
}
body main.branding-hero {
  position: relative;
  display: flex;
  align-items: center;
  height: 100dvh;
}
body main.branding-hero img {
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  height: 100dvh;
  max-width: 100vw;
  right: 0;
  top: 0;
  z-index: -2;
}
body main.branding-hero h1 {
  color: var(--clr-yellow);
  max-width: 25ch;
}
@media (max-width: 767px) {
  body main.branding-hero .bgHero {
    position: absolute;
    left: 0;
    top: 0;
    height: 100dvh;
    width: 100%;
    background: var(--clr-blue);
    z-index: -1;
    opacity: 20%;
  }
}
body main.drive-hero {
  text-align: center;
  color: var(--clr-blue);
}
body main.drive-hero .container {
  display: flex;
  flex-direction: column;
  align-items: center;
}
body main.drive-hero h1 {
  color: var(--clr-yellow);
  padding: 0;
  margin: 0;
}
body main.drive-hero .btn {
  text-decoration: none;
  color: var(--clr-white);
  background: var(--clr-blue);
  padding: 1rem 2rem;
  border-radius: 30px;
  max-width: 350px;
}
body main.drive-hero img {
  max-width: 100vw;
}
body .cta {
  display: flex;
  flex-wrap: wrap;
  margin-block: 2rem;
}
body .cta h2 {
  color: var(--clr-blue);
}
body .cta .btn {
  text-decoration: none;
  background: var(--clr-yellow);
  color: var(--clr-white);
  padding: 0.5rem 2rem;
  border-radius: 30px;
}
body .cta .small {
  color: var(--clr-blue);
}
body .cta img {
  max-width: 95vw;
  margin: 0 auto;
  border-radius: 20px;
}
body .short-desc {
  padding: 2rem;
  max-width: 40ch;
  margin: 0 auto;
  font-size: clamp(1rem, 2vw + 1rem, 2rem);
}
body .short-desc em {
  text-decoration: underline;
  color: var(--clr-yellow);
}
body .features {
  display: flex;
  flex-wrap: wrap;
  padding: 3rem;
  gap: 1.5rem;
  align-items: flex-start;
  justify-content: space-around;
}
body .features .feature {
  max-width: 375px;
}
body .features .package {
  max-width: 40ch;
}
body .track {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 2rem;
}
body .track .feature {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
@media (max-width: 767px) {
  body .features {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  body .track {
    flex-direction: column;
    align-items: center;
  }
}
body .what-we-do {
  padding: min(5em, 10%);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
}
body .what-we-do .before {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
body .what-we-do .one, body .what-we-do .two, body .what-we-do .three, body .what-we-do .four, body .what-we-do .five {
  position: relative;
}
body .what-we-do .one::after {
  content: "01";
}
body .what-we-do .two::after {
  content: "02";
}
body .what-we-do .three::after {
  content: "03";
}
body .what-we-do .four::after {
  content: "04";
}
body .what-we-do .five::after {
  content: "05";
}
body .what-we-do .one::after, body .what-we-do .two::after, body .what-we-do .three::after, body .what-we-do .four::after, body .what-we-do .five::after {
  position: absolute;
  top: 20px;
  z-index: -1;
  color: var(--clr-grey);
  font-size: 2rem;
}
body .what-we-do .bullet {
  display: flex;
  align-items: center;
  gap: 1rem;
}
body .what-we-do .bullet::before {
  content: "";
  height: 8px;
  width: 8px;
  background: var(--clr-yellow);
  border-radius: 50%;
}
body .what-we-do .before::before {
  content: "";
  background: var(--clr-yellow);
  height: 5px;
  width: 20px;
}
body .yellow-bg {
  background-color: var(--clr-yellow);
  padding: min(5em, 10%);
  text-align: center;
  color: var(--clr-blue);
}
body .yellow-bg h1 {
  margin-bottom: -10px;
}
body .yellow-bg p {
  margin-bottom: 3rem;
}
body .yellow-bg a {
  background: var(--clr-white);
  padding: 1rem;
  text-decoration: none;
  color: var(--clr-blue);
  border-radius: 30px;
  font-weight: bold;
}
body .contact {
  padding: min(5em, 10%);
  gap: 2rem;
  align-items: flex-start;
}
body .contact .form {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
body .contact .form input, body .contact .form textarea {
  margin-block: 0.5rem;
  min-width: 250px;
  max-width: 350px;
  padding: 0.5rem;
}
body .contact .form .contact-btn {
  border: solid var(--clr-blue) 2px;
  border-radius: 30px;
  background: var(--clr-blue);
  color: var(--clr-white);
  padding: 0.5rem 1rem;
}
body .trust {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
body .trust .title {
  max-width: 30ch;
}
body .tracking {
  display: flex;
  flex-direction: column;
  align-items: center;
}
body .tracking .top {
  display: flex;
  flex-direction: row;
  align-items: center;
}
body .tracking .top img {
  margin: 0 auto;
  max-width: 100%;
  height: 500px;
}
body .tracking p {
  max-width: 40ch;
}
@media (max-width: 767px) {
  body .tracking .top {
    flex-direction: column;
    max-width: 90vw;
  }
  body .tracking .top p {
    text-align: center;
  }
  body .tracking .top img {
    -o-object-fit: cover;
       object-fit: cover;
  }
}

.top {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  margin-block: 2rem;
  width: -moz-max-content;
  width: max-content;
}

footer {
  background: var(--clr-yellow);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 2rem;
  gap: 0.5rem;
}
footer img {
  -o-object-fit: contain;
     object-fit: contain;
}
footer .column {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
footer .column a {
  text-decoration: none;
  background: none;
  color: #FFF;
  font-weight: 300;
}
footer .column a:hover, footer .column a:active {
  text-decoration: underline;
  color: var(--clr-blue);
}

@media screen and (min-width: 600px) {
  main.hero {
    height: 100dvh;
  }
  main.hero .hero-txt {
    margin: 0 auto;
  }
  main.hero video {
    top: 3rem;
    width: 100%;
  }
  .contact {
    justify-content: space-evenly;
  }
  .contact .contact-intro {
    max-width: 30ch;
  }
  .contact input, .contact textarea {
    margin: 0 1rem;
  }
  section.trust {
    flex-direction: row;
    flex-wrap: wrap;
    text-align: left;
    justify-content: space-evenly;
  }
  footer {
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-around;
    padding-inline: 5rem;
    text-align: left;
  }
}/*# sourceMappingURL=landing.css.map */