@font-face {
    font-family: Inter Regular;
    src: url('../assets/fonts/Inter/Inter-Regular.ttf');
}

@font-face {
    font-family: Lexend Lightt;
    src: url('../assets/fonts/Lexend/Lexend-Light.ttf');
}

@font-face {
    font-family: Lexend Regular;
    src: url('../assets/fonts/Lexend/Lexend-Regular.ttf');
}

   body {
      font-family: 'Lexend', sans-serif;
      background-color: #0d0d0d;
      color: #f5f5f5;
    }
html, body {
  overflow-x: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

body {
  height: 100vh !important;
}
    .bg-image-left {
      background-image: url('assets/img/background.jpg');
      background-size: cover;
      background-position: center;
      position: relative;
    }

    .bg-overlay {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      background-color: rgba(0, 0, 0, 0.7);
    }

    .bg-image-left h1,
    .bg-image-left p {
      position: relative;
      z-index: 1;
    }

    .custom-card {
      background-color: #1f1f1f;
      border-radius: 1px;
      transition: transform 0.3s, box-shadow 0.3s;
    }

    .custom-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
    }

    .logos {
      max-width: 150px;
      margin: 20px auto;
      filter: brightness(0) invert(1);
    }

    .btn-primary {
      background-color: #ff6b00;
      border: none;
      padding: 10px 24px;
      font-weight: 600;
      border-radius: 1px;
      transition: background-color 0.3s;
    }

    .btn-primary:hover {
      background-color: #e65a00;
    }

    .card-title {
      font-size: 24px;
      margin-top: 10px;
      font-weight: 600;
    }

    .card-text {
      font-size: 16px;
      color: #ccc;
    }

    footer {
      color: #7f7f7f;
      font-size: 14px;
      padding: 15px;
      text-align: center;
    }

    #meteoro img {
      width: 20px;
      margin-left: 5px;
      transform: rotate(45deg);
    }
@media only screen and (max-width: 500px) {
    .col-md-12 {
        margin-bottom: 2rem !important;
        margin-top: 27rem;

        && h1 {
            font-size: 23px !important;
            margin-bottom: 0;

            && span {
                font-size: 26px !important;
            }
        }
    }

    .col-md-6 {
        && .logos {
            width: 13rem;
            padding: 25px 0px 10px;
        }

        && .card-title {
            font-size: 25px !important;
        }

        && .card-text {
            font-size: 15px !important;
        }

        && .btt-primary {
            padding: 5px 10px;
            font-size: 15px;
        }
    }

    .c2 {
        margin-top: 2rem !important;
        margin-bottom: 3rem;
    }

    footer {
        display: none;
    }

}