.text-stocky {
      color: rgb(7, 135, 255);
    }

    .bg-stocky {
      background-color: rgb(7, 135, 255);
    }

    .bg-stocky-light {
      background-color: rgba(7, 135, 255, 0.1);
    }

    .text-stocky-light {
      color: rgba(255, 255, 255, 0.9);
    }

    .border-stocky {
      border-color: rgba(7, 135, 255, 0.3);
    }

    .btn-stocky {
      background-color: rgb(7, 135, 255);
      color: white;
    }

    .btn-stocky:hover {
      background-color: rgb(6, 121, 230);
      color: white;
    }

    .btn-outline-stocky {
      border-color: rgb(7, 135, 255);
      color: rgb(7, 135, 255);
    }

    .btn-outline-stocky:hover {
      background-color: rgba(7, 135, 255, 0.05);
      color: rgb(7, 135, 255);
    }

    .hero-pattern {
      background-color: #f8f9fa;
      background-image: radial-gradient(rgba(7, 135, 255, 0.2) 0.5px, transparent 0.5px);
      background-size: 15px 15px;
    }

    .section-pattern {
      background-color: rgba(7, 135, 255, 0.05);
      background-image: linear-gradient(rgba(255, 255, 255, 0.8) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.8) 1px, transparent 1px);
      background-size: 20px 20px;
    }

    .custom-shadow {
      box-shadow: 0 10px 25px -5px rgba(7, 135, 255, 0.1), 0 10px 10px -5px rgba(7, 135, 255, 0.04);
    }

    .feature-icon {
      width: 48px;
      height: 48px;
      padding: 10px;
      border-radius: 8px;
      background-color: rgba(7, 135, 255, 0.1);
      color: rgb(7, 135, 255);
      display: flex;
      align-items: center;
    }

    .benefit-icon {
      width: 3rem;
      height: 3rem;
      background-color: rgba(7, 135, 255, 0.1);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      color: rgb(7, 135, 255);
      margin-bottom: 1.25rem;
    }

    .animate-fade-in {
      animation: fadeIn 1s ease-in-out;
    }

    .iconos {
      font-size: 30px;
    }

    @keyframes fadeIn {
      from {
        opacity: 0;
        transform: translateY(20px);
      }

      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    .slant-bottom {
      position: relative;
    }

    .slant-bottom::after {
      content: '';
      position: absolute;
      left: 0;
      right: 0;
      bottom: -50px;
      height: 100px;
      background-color: white;
      transform: skewY(3deg);
      z-index: 0;
    }

    .text-secondary-stocky {
      color: #ffc107;
    }

    .bg-secondary-stocky {
      background-color: #ffc107;
    }

    .border-secondary-stocky {
      border-color: #ffc107;
    }

    .resaltar {
      color: #ffc107;
      font-style: italic;

      font-weight: bold;
    }

    .rotable {
      transform: rotate(180deg) !important;
      display: inline-block !important;
      font-size: 18px;
      color: rgb(7, 135, 255);
      ;
    }

    .iconoBeneficios {
      font-size: 25px;
    }

    .imgfondo {
      background-image: url(img/fondoLanding1.jpg);
    }

    .fondoDashboard {
      background-color: rgba(7, 135, 255, 0.05);
      ;
    }

    label {
      color: #000000 !important;
    }

    .modal-header h5 {
      color: #000000 !important
    }

    input:focus {
      border-color: #ffc107 !important;
      box-shadow: 0 0 5px rgb(255, 226, 141) !important;
    }

    .formularioLanding .modal-footer {
      border-color: #ffc107 !important;
      box-shadow: 0 0 5px rgb(255, 226, 141) !important;
    }

    .formularioLanding .modal-header {
      border-color: rgb(255, 208, 67) !important;
      box-shadow: 0 0 5px rgb(255, 226, 141) !important;
    }

    .icono-enviar-fill {
      display: none;

    }

    .icono-enviar-container:hover .icono-enviar {
      display: none;
    }

    .icono-enviar-container:hover .icono-enviar-fill {
      display: inline-block;
    }

    .icono-enviar-container:hover {
      transform: scale(1.05) !important;
    }
    
    li a:hover{
      color: rgb(7, 135, 255)!important;
    }