body {
  color: white;
  background-color: #090A58;
}

.hero {
  position: relative;
  height: 1024px;
  overflow: hidden;
  background-color: black;
}

.hero-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: right center;
  background-repeat: no-repeat;
  transition: z-index 1s ease-in-out;
  z-index: 0;
}
@media (max-width: 1100px) {
  .hero-bg {
    right: -10%;
  }
}
@media (max-width: 900px) {
  .hero-bg {
    right: -15%;
  }
}
@media (max-width: 767px) {
  .hero-bg {
    right: -20%;
  }
}
@media (max-width: 576px) {
  .hero-bg {
    right: -35%;
  }
}

.hero-text {
  margin-bottom: 20%;
  margin-left: 15%;
  text-shadow: 0 2px 4px rgba(0,0,0,0.5);
  z-index: 3;
}
.hero-text-1 {
  font-size: 120px;
  font-weight: 700;
}
.hero-text-2 {
  font-size: 100px;
  font-weight: 400;
}

@media (max-width: 767px) {
  .hero-text {
    margin-bottom: 35%;
    margin-left: 10%;
  }
  .hero-text-1 {
    font-size: 80px;
  }
  .hero-text-2 {
    font-size: 60px;
  }
}

@media (max-width: 375px) {
  .hero-text-1 {
    font-size: 60px;
  }
  .hero-text-2 {
    font-size: 40px;
  }
}

.section-text {
  text-shadow: 0 2px 4px rgba(0,0,0,0.5);
  z-index: 3;
}
.section-text-1 {
  font-size: 120px;
  font-weight: 700;
}
.section-text-2 {
  font-size: 100px;
  font-weight: 400;
}

@media (max-width: 900px) {
  .section-text-1 {
    font-size: 110px;
  }
  .section-text-2 {
    font-size: 95px;
  }
}

@media (max-width: 767px) {
  .section-text-1 {
    font-size: 100px;
  }
  .section-text-2 {
    font-size: 90px;
  }
}

@media (max-width: 576px) {
  .section-text-1 {
    font-size: 75px;
  }
  .section-text-2 {
    font-size: 65px;
  }
}

@media (max-width: 420px) {
  .section-text-1 {
    font-size: 60px;
  }
  .section-text-2 {
    font-size: 50px;
  }
}

@media (max-width: 375px) {
  .section-text-1 {
    font-size: clamp(20px, 15vw, 60px);
  }
  .section-text-2 {
    font-size: clamp(10px, 15vw, 50px);
  }
}

.section2 {
  position: relative;
  background: linear-gradient(180deg, #8727B5 0%, #090A58 4.33%, #4F167F 97.12%, #8727B5 100%);
  background-color: white;
  background-size: cover;
  height: 1150px;
  overflow: hidden;
}
.section2-svg {
  position: absolute;
  width: 900px;
  padding-left: 100px;
  padding-top: 80px;
  padding-bottom: 80px;
  overflow: hidden;
}
.section2-text {
  position: absolute;
  top: 25%;
  right: 10%;
  text-shadow: 0 2px 4px rgba(0,0,0,0.5);
  z-index: 3;
}
@media (max-width: 1350px) {
  .section2-text {
    top: 50%;
    left: 5%;
  }
}
@media (max-width: 1100px) {
  .section2 {
    height: 1200px;
  }
  .section2-svg {
    top: -2%;
    left: -5%;
    width: 1000px;
  }
  .section2-text {
    top: 60%;
    left: 5%;
  }
}
@media (max-width: 900px) {
  .section2-svg {
    left: -15%;
  }
  .section2-text {
    top: 55%;
  }
}
@media (max-width: 767px) {
  .section2-svg {
    left: -35%;
  }
}
@media (max-width: 576px) {
  .section2 {
    height: 1100px;
  }
  .section2-svg {
    left: -35%;
    width: 650px;
  }
  .section2-text {
    top: 65%;
  }
}
.section3 {
  position: relative;
  background-image: url("../img/AProgrammerTG.png");
  background-size: cover;
  background-position: center center;
  height: 1024px;
}
.section3-text {
  padding-left: 5%;
  padding-bottom: 5%;
  text-shadow: 0 2px 4px rgba(0,0,0,0.5);
  z-index: 3;
}
@media (max-width: 767px) {
  .section3 {
    height: 800px;
  }
}

.section4 {
  position: relative;
  background: linear-gradient(180deg, #8727B5 0%, #4F1685 3.37%, #42A7E6 100%);
  background-size: cover;
  height: 1024px;
  gap: 5rem;
}
.section5 {
  position: relative;
  background: linear-gradient(180deg, #42A7E6 0%, #14295F 100%);
  background-size: cover;
  height: 1024px;
  gap: 5rem;
}
.phone-image {
  height: 75%;
}
@media (max-width: 1450px) {
  .section4 {
    gap: 2rem;
  }
  .section5 {
    gap: 2rem;
  }
  .phone-image {
    height: 65%;
  }
}
@media (max-width: 1100px) {
  .section4 {
    gap: 0;
  }
  .section5 {
    gap: 0;
  }
  .phone-image {
    height: 65%;
  }
}

.section6 {
  position: relative;
  background-image: url("../img/Chill.png");
  background-size: cover;
  background-position: center center;
  height: 1024px;
}
.section6-text {
  padding-top: 3%;
  padding-right: 8%;
  text-shadow: 0 2px 4px rgba(0,0,0,0.5);
  z-index: 3;
}
@media (max-width: 767px) {
  .section6 {
    height: 700px;
  }
}

.section7 {
  position: relative;
  background: linear-gradient(180deg, #461C89 0%, #123E8D 5.77%, #08225C 100%);
  background-size: cover;
  height: 1024px;
  gap: 5rem;
}
.section8 {
  position: relative;
  background-image: url("../img/Work.png");
  background-size: cover;
  background-position: center center;
  height: 1024px;
}
.section8-text {
  padding-top: 3%;
  padding-left: 3%;
  text-shadow: 0 2px 4px rgba(0,0,0,0.5);
  z-index: 3;
}
@media (max-width: 767px) {
  .section8 {
    height: 800px;
  }
}

header {
  background: linear-gradient(0deg, #8727B5 0%, #090A58 20%, #090A58 80%, #8727B5 100%);
  padding: 32px;
  gap: 0px 24px;
  height: 135px;
}
@media (max-width: 767px) {
  header {
    height: 200px;
    gap: 15px;
  }
}

.logo {
  width: 331px;
}
@media (max-width: 375px) {
  .logo {
    width: 250px;
  }
}

footer {
  background: linear-gradient(180deg, #8727B5 0%, #131C76 24.04%, #131C76 75%, #8727B5 100%);
  height: 133px;
}

.copyright-text {
  padding-left: 30px;
  margin-bottom: 0px;
}
.footer-links {
  padding-right: 30px;
}