#login-section {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   min-height: 78vh;
   padding: clamp(32px, 6vw, 72px) 5%;
   background:
      linear-gradient(180deg, rgba(0, 71, 255, 0.08), rgba(0, 71, 255, 0)),
      var(--bg);

   form {
      background-color: var(--secondary-bg);
      display: flex;
      flex-direction: column;
      gap: 14px;
      padding: clamp(24px, 4vw, 34px);
      border: 1px solid rgba(0, 44, 153, 0.12);
      border-radius: 8px;
      box-shadow: 0 22px 54px rgba(0, 44, 153, 0.14);
      width: 100%;
      max-width: 420px;

      input {
         min-height: 46px;
         padding: 12px 14px;
         border: 1px solid rgba(0, 44, 153, 0.14);
         border-radius: 8px;
         background-color: var(--bg);
         font-size: 15px;
         transition: all 0.3s ease;

         &:focus {
            border-color: var(--primary-color);
            outline: none;
            box-shadow: 0 0 6px rgba(0, 71, 255, 0.3);
         }
      }

      button {
         min-height: 46px;
         padding: 12px;
         background: var(--primary-color);
         color: var(--text-light);
         border: none;
         border-radius: 8px;
         font-size: 16px;
         font-weight: 800;
         cursor: pointer;
         transition: background 0.3s ease, transform 0.2s ease;

         &:hover {
            background: var(--dark-color);
            transform: translateY(-2px);
         }
      }
   }
}