
    body {
      background-image: url('../img/banner_3.jpg');
      background-size: cover;
      background-repeat: no-repeat;
      background-position: center center;
      background-attachment: fixed;
      font-family: 'Segoe UI', sans-serif;
      min-height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 40px 20px;
      margin: 0;
    }

    .menu-container {
      max-width: 1000px;
      width: 100%;
      padding: 40px;
      background: transparent;
    }

    .app-card {
      background-color: transparent;
      border: 2px solid #2d2d2d;
      border-radius: 12px;
      padding: 3px;
      height: 100px;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: 0.3s ease;
      box-shadow: 0 0 0 0 #2d2d2d; /* default no extra border */
    }

    .app-card:hover {
      box-shadow: 0 0 0 5px #2d2d2d; /* simulate thicker border */
      transform: translateY(-3px);
    }

    .inner-card {
      background-color: #232323;
      color: white;
      border-radius: 8px;
      padding: 12px 10px;
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: 0.3s ease;
    }

    .inner-card:hover {
      background-color: #2d2d2d;
    }

   .app-title {
    font-size: 2.1rem;
    font-weight: 600;
    word-break: break-word;
    text-align: center;
}
    @media (max-width: 576px) {
      .app-card {
        height: 120px;
      }
    }
