.footer{
      background-color: #1d1e27;
    }

    .footer-container {
      padding: 40px 20px;
      color: #ffffff;
      font-family: Arial, sans-serif;
      container-type: inline-size;
      container-name: footer-container;
    }

    .footer-grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: 30px;
    }

    .footer-column p {
      margin: 8px 0;
      font-size: 16px;
      font-weight: bold;
      color: #ffffff;
    }

    .footer-column a {
      display: block;
      margin: 6px 0;
      font-size: 14px;
      color: #ccc;
      text-decoration: none;
    }

    .footer-column a:hover {
      span {
        text-decoration: underline;
      }
    }

    .social-icons {
      display: flex;
      gap: 15px;
      order: 3;
    }

    .social-icons a {
      color: #ccc;
      font-size: 25px;
      transition: color 0.3s ease;
    }

    .social-icons a:hover {
      color: #00bfff;
    }

    @container footer-container (min-width: 653px) {
      .footer-grid {
        grid-template-columns: repeat(4, 1fr);
      }
    }

    @media (min-width: 653px) {
      .footer-grid {
        grid-template-columns: repeat(4, 1fr);
      }
    }


    .footer-bottom-section{
      border-top: 1px solid #9194ac;
      color: #ccc;
      padding-left: 20px;
      padding-right: 40px;
    }

    .footer-bottom-container {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 1.5rem 0;
        display: flex;
        flex-direction: row;
        gap: 1.5rem;
    }

    .logo-and-copyright-bottom{
      display: flex;
      order: 1;
    }

    .copyright-container.ud-text-sm {
    padding: 11px 0 0;
    font-size: 14px;
  }


    .app-link{
      order: 2;
      
    }

    .app-link a{
    color: #ccc;
    }

    .app-link a:hover{
    text-decoration: underline;
    }

    @media (max-width: 652px){

      .footer-bottom-container{
        flex-direction: column;
        align-items: start;
      }

      .logo-and-copyright-bottom{
        order: 3;
      }
      .app-link{
        order: 2;
      }
      .social-icons{
        order: 1;
      }
    }