/* 
 sm: 540px,
 md: 720px,
 lg: 960px,
 xl: 1140px,
 xxl: 1320px
*/
h1 {
  line-height: 1.1;
  letter-spacing: 0.5px;
  font-size: 4rem;
  font-weight: 600;
}

h2 {
  margin-bottom: 0.5rem;
  font-weight: 500;
  font-size: 2rem;
  letter-spacing: -1px;
  line-height: 1.2;
}

a {
  color: var(--bs-link-color);
  text-decoration: none;
}

p {
  font-size: 1.1rem;
  line-height: 1.5;
}

img {
  border-radius: 5px;
}

label {
  font-size: 0.9rem;
}

ion-icon {
  font-size: 64px;
}

/* Scroll offset */
#services {
  scroll-margin-top: 10rem;
}

#howItWorks {
  scroll-margin-top: 10rem;
}

#aboutUs {
  scroll-margin-top: 10rem;
}

#ourVision {
  scroll-margin-top: 10rem;
}

#cta {
  scroll-margin-top: 10rem;
}

.wwd-icons {
  width: 32px;
  height: 32px;
  stroke: var(--bs-primary);
  margin-bottom: 1rem;
}

.navbar {
  transition: all 0.5s ease-in-out;
  /* 
  .btn-outline-light:hover {
  	color: var(--bs-dark);
  } */
  /* .navbar-toggler {
  	border: solid var(--bs-light) 1px;
  } */
}

.navbar-brand {
  font-size: 1.25rem;
  font-weight: 600;
}

.header h1 {
  margin-bottom: 1.5rem !important;
}
.header ul p {
  font-size: 1rem !important;
}
.header .hero {
  padding-top: 3rem;
  margin-bottom: 0;
}
@media (min-width: 992px) {
  .header .hero {
    padding: 10rem 0;
  }
}

.nav-link {
  font-size: 1rem;
}

.navbar-sticky {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  opacity: 0.9;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  z-index: 999;
  transition: all 0.1s ease-in-out;
}

.header {
  width: 100%;
  background: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.3)), url("/assets/images/annie-spratt-hCb3lIB8L8E-unsplash.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

/* .icons i {
	min-width: 50px;
	min-height: 50px;
	text-align: center;
}
 */
.check-mark {
  width: 24px;
  height: 24px;
  stroke: var(--bs-primary);
}

.check-mark-white {
  width: 24px;
  height: 24px;
  stroke: rgba(255, 255, 255, 0.3);
}

.ourVision .img-container {
  position: relative;
}

.ourVision__text {
  text-align: center;
}

.ourVision .img-container::after {
  content: "";
  left: -20px;
  top: -20px;
  width: 50%;
  height: 100%;
  background-color: var(--bs-secondary);
  position: absolute;
  z-index: -1;
  border-radius: 5px;
}

.whoWeAre .container {
  position: relative;
}

.whoWeAre .container::after {
  content: "";
  top: -20px;
  left: 0%;
  width: 70%;
  height: 110%;
  background-color: var(--bs-secondary);
  position: absolute;
  z-index: -1;
  border-radius: 5px;
}

.aboutUs .img-container {
  position: relative;
}

.aboutUs .img-container::after {
  content: "";
  right: -20px;
  bottom: 0%;
  top: 20px;
  width: 50%;
  height: 100%;
  background-color: var(--bs-secondary);
  position: absolute;
  z-index: -1;
  border-radius: 5px;
}

.custom-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.8)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E") !important;
}

.navbar {
  background: transparent !important;
}

.bg-primary {
  background-color: var(--bs-primary) !important;
}

.navbar-toggler {
  color: var(--bs-light);
}

.letter-spacing-1 {
  letter-spacing: 1px;
}

.letter-spacing-n1 {
  letter-spacing: -1px;
}

.wwd-card {
  transition: all 0.3s ease-in-out;
}

/* HOW IT WORKS */
.step {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: column;
  gap: 3rem;
}

.step-item {
  /* margin-bottom: 2rem; */
}

.step-item:nth-child(even) {
  margin-left: 25%;
}

.step-item:nth-child(odd) {
  margin-right: 25%;
}

.step-item:last-child .step-icon::after {
  display: none;
  margin-bottom: 0;
}

.step-item-container {
  display: flex;
  flex-shrink: 0;
  gap: 18px;
  background-color: var(--bs-secondary);
  border-radius: 5px;
  padding: 3rem;
  align-items: baseline;
  justify-content: start;
}

.step .active .step-icon {
  background-color: var(--bs-primary);
  color: var(--bs-light);
}

.step .active .step-title {
  color: var(--bs-primary);
}

.step-icon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background-color: var(--bs-primary);
  display: flex;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  color: var(--bs-light);
}

/* .step-icon::after {
	content: "";
	position: absolute;
	border-left: 2px solid var(--bs-gray-400);
	height: calc(100% - 4rem);
	top: 4rem;
	left: 1.5rem;
} */
.step-title {
  font-weight: 400;
  font-size: 1rem;
}

.list-item {
  gap: 8px;
}

.link {
  text-decoration: underline;
}

.skill {
  border: var(--bs-border-color) solid 1px;
  border-radius: var(--bs-border-radius);
  padding: 1rem;
  height: 100%;
}

.hero .card {
  padding: 1rem;
  max-width: 350px;
}
.hero .card-body {
  padding: 0;
}

.nav-link:hover,
.nav-link:active {
  background-color: var(--bs-light) !important;
  color: var(--bs-primary) !important;
}

.aboutUs {
  text-align: left;
}

/* Form Process */
.green-check {
  stroke: #2BB868 !important;
  width: 3rem;
  height: 3rem;
}

.exclamation-icon {
  stroke: #fbbf24 !important;
  width: 3rem;
  height: 3rem;
}

.error-page__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 60vh;
  gap: 1rem;
}

.error-page__code {
  font-size: clamp(6rem, 20vw, 12rem);
  font-weight: 600;
  color: #1e40af;
  line-height: 1;
  margin-bottom: 0;
}

.error-page__header {
  margin-bottom: 2rem;
}

.error-page__title {
  font-size: 2rem;
  margin-bottom: 0;
}

.error-page__sub {
  max-width: 45ch;
  text-align: center;
}

.error-page__actions {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  flex-wrap: wrap;
  justify-content: center;
}

.company__logo {
  width: 100px;
}

.company__logo img {
  display: block;
  width: 100%;
  height: 100%;
}

.error__logo {
  width: 48px;
}

.error__logo img {
  display: block;
  width: 100%;
  height: 100%;
}

.error-page__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}

.error_page__company {
  font-size: 2.5rem;
  margin-bottom: 0;
}

@media (max-width: 576px) {
  h1 {
    font-size: 3rem;
  }
  section {
    margin-bottom: 2rem;
  }
  footer {
    padding: 2rem 0;
  }
  .navbar-toggler {
    padding: 0;
  }
  .sm-icons {
    margin-left: 0;
  }
  .step {
    gap: 1rem;
  }
  .hero .card {
    padding: 1.3rem;
    max-width: 450px;
  }
  .header .hero {
    padding-bottom: 3rem;
  }
  .aboutUs h2,
  .ourVision h2 {
    text-align: center;
  }
  .step-item:nth-child(even) {
    justify-content: center !important;
  }
  .step-item:nth-child(odd) {
    justify-content: center !important;
  }
  .step-item-container {
    padding: 1rem;
    width: 100%;
  }
  .step-item {
    max-width: 90%;
  }
  .step-item:nth-child(even) {
    margin-left: 10%;
  }
  .step-item:nth-child(odd) {
    margin-right: 10%;
  }
  .cta .text-container {
    max-width: 100%;
    margin: 0 auto;
  }
  .cta {
    padding: 3rem 0rem;
  }
  .title_text__container {
    text-align: center;
    padding: 2rem 0;
  }
}
@media (min-width: 576px) {
  header,
  section {
    margin-bottom: 2rem;
  }
  footer {
    padding: 2rem 0;
  }
  .header .hero {
    padding-bottom: 3rem;
  }
  .hero .card {
    padding: 1.3rem;
    max-width: 450px;
  }
  .nav-link:hover,
  .nav-link:active {
    background-color: var(--bs-light) !important;
    color: var(--bs-primary) !important;
  }
  .aboutUs h2,
  .ourVision h2 {
    text-align: center;
  }
  .step-icon {
    width: 1.5rem;
    height: 1.5rem;
  }
  .list-item {
    gap: 18px;
  }
  .step-item-container {
    padding: 1rem;
    width: 100%;
  }
  .step-item {
    max-width: 70%;
  }
  .step-item:nth-child(even) {
    margin-left: 30%;
  }
  .step-item:nth-child(odd) {
    margin-right: 30%;
  }
  .cta .text-container {
    max-width: 100%;
    margin: 0 auto;
  }
  .title_text__container {
    text-align: center;
    padding: 2rem 0;
  }
}
@media (min-width: 720px) {
  .navbar-brand {
    font-size: 2rem;
  }
  .nav-link {
    font-size: 1.25rem;
  }
  header,
  section {
    margin-bottom: 3rem;
  }
  footer {
    padding: 2rem 0;
  }
  .step-icon {
    width: 2rem;
    height: 2rem;
  }
  .list-item {
    gap: 18px;
  }
  .step-item-container {
    padding: 1rem;
    flex-shrink: 1;
    flex-basis: 40%;
  }
  .hero .card {
    padding: 2rem;
    max-width: 450px;
  }
  .cta {
    padding: 2rem 5rem;
  }
  .title_text__container {
    padding: 2rem;
  }
}
@media (min-width: 960px) {
  header,
  section {
    margin-bottom: 7rem;
  }
  footer {
    padding: 2rem 0;
  }
  .gen_page_heading {
    margin-top: 5rem;
    min-height: 80vh;
  }
  .hero {
    /* padding: 10rem 0; */
  }
  .hero .card {
    padding: 2rem;
    max-width: 450px;
  }
  .aboutUs h2,
  .ourVision h2 {
    text-align: left !important;
  }
  .ourVision p {
    text-align: start;
  }
  .list-item {
    gap: 18px;
  }
  .step-item {
    max-width: 50%;
  }
  .step-item:nth-child(even) {
    margin-left: 50%;
  }
  .step-item:nth-child(odd) {
    margin-right: 50%;
  }
  .cta {
    padding: 7rem 7rem;
  }
  .cta .text-container {
    max-width: 80%;
    margin: 0 auto;
  }
  .title_text__container {
    text-align: left;
  }
}
@media (min-width: 1140px) {
  .step-item {
    max-width: 30%;
  }
  .step-item:nth-child(even) {
    margin-left: 50%;
    margin-right: 20%;
  }
  .step-item:nth-child(odd) {
    margin-right: 50%;
    margin-left: 20%;
  }
  .cta .text-container {
    max-width: 60%;
    margin: 0 auto;
  }
}
.social_icon {
  width: 16px;
  height: 16px;
  color: var(--bs-primary);
}

.social_icon_white {
  color: var(--bs-light);
}

.page_not_found_title {
  font-size: 10rem;
  font-weight: 300;
}

.footer_copy_right_text_container {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.footer-text {
  font-size: 1rem;
  max-width: 35ch;
}