 html {
      scroll-behavior: smooth;
    }
.navbar-brand{width: 100%; max-width: 320px;}
.text-mobil{ color:#1A1E3E!important}
.text-red{ color:#E11024}
.bg-yellow{ background-color:#FAE209!important}
.bg-yellow:hover{ background-color:#FAB209!important}
.bg-red{ background-color:#E11024!important}
.bg-red:hover{ background-color:#C20719!important}
.bg-footer{ background-color:#181915}
.bg-input{ background-color:#ffffff20!important}

.nav-link:focus, .nav-link:hover {
    color: #ffffff90!important;
}
@media (max-width: 767px) {
.navbar-brand{max-width: 230px!important;}
}

@media (max-width: 1200px) {
.form-col-bg{ background-color:#1A1E3E!important}
}

.masked-element {
  --fade-start: 85%;       /* cambia este valor para mover el inicio del fade */
  --fade-end: 95%;

  /* máscara (fade) - para navegadores con soporte */
  mask-image: linear-gradient(to bottom, black var(--fade-start), transparent var(--fade-end));
  -webkit-mask-image: linear-gradient(to bottom, black var(--fade-start), transparent var(--fade-end));
}

[data-bs-theme=dark] .navbar:not([data-bs-theme=light]) {
    --si-navbar-stuck-bg: #13162E!important;
}



    <!-- Page loading styles -->
    <style>
      .page-loading {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        -webkit-transition: all .4s .2s ease-in-out;
        transition: all .4s .2s ease-in-out;
        background-color: #fff;
        opacity: 0;
        visibility: hidden;
        z-index: 9999;
      }
      [data-bs-theme="dark"] .page-loading {
        background-color: #0b0f19;
      }
      .page-loading.active {
        opacity: 1;
        visibility: visible;
      }
      .page-loading-inner {
        position: absolute;
        top: 50%;
        left: 0;
        width: 100%;
        text-align: center;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        -webkit-transition: opacity .2s ease-in-out;
        transition: opacity .2s ease-in-out;
        opacity: 0;
      }
      .page-loading.active > .page-loading-inner {
        opacity: 1;
      }
      .page-loading-inner > span {
        display: block;
        font-size: 1rem;
        font-weight: normal;
        color: #9397ad;
      }
      [data-bs-theme="dark"] .page-loading-inner > span {
        color: #fff;
        opacity: .6;
      }
      .page-spinner {
        display: inline-block;
        width: 2.75rem;
        height: 2.75rem;
        margin-bottom: .75rem;
        vertical-align: text-bottom;
        border: .15em solid #b4b7c9;
        border-right-color: transparent;
        border-radius: 50%;
        -webkit-animation: spinner .75s linear infinite;
        animation: spinner .75s linear infinite;
      }
      [data-bs-theme="dark"] .page-spinner {
        border-color: rgba(255,255,255,.4);
        border-right-color: transparent;
      }
      @-webkit-keyframes spinner {
        100% {
          -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
        }
      }
      @keyframes spinner {
        100% {
          -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
        }
      }
    </style>